EXEED_manage/src/views/QuestManage/_questRelease/index.vue

<template>
    <div class="main-content">
        <div class="form-area">
            <el-form size="default" :model="form" label-width="120px">
                <el-form-item label="任务标题" style="width: 80%">
                    <el-input placeholder="请输入" v-model="form.task.title" />
                </el-form-item>
                <!-- <el-form-item label="发布对象">
                    <el-radio-group v-model="form.target">
                        <el-radio :label="1">全部</el-radio>
                        <el-radio :label="2">指定经销商</el-radio>
                        <el-radio :label="3">指定级别</el-radio>
                    </el-radio-group>
                </el-form-item> -->
                <el-form-item label="简介" style="width: 80%">
                    <el-input placeholder="请输入" type="textarea" v-model="form.task.subtitle" />
                </el-form-item>
                <el-form-item label="时间" style="width: 80%">
                    <el-date-picker v-model="form.time" type="daterange"></el-date-picker>
                </el-form-item>
                <el-form-item label="标签类别">
                    <el-checkbox-group v-model="form.type">
                        <el-checkbox :label="1">媒体评测</el-checkbox>
                        <el-checkbox :label="2">产品宣传</el-checkbox>
                        <el-checkbox :label="3">用户活动</el-checkbox>
                        <el-checkbox :label="4">趣味互动</el-checkbox>
                    </el-checkbox-group>
                </el-form-item>
                <el-form-item label="选择车系">
                    <div style="width: 80%"><el-checkbox :label="false" @change="selectAll">全选</el-checkbox></div>
                    <div>
                        <el-checkbox-group v-model="form.tagList">
                            <el-checkbox :label="1">车系1</el-checkbox>
                            <el-checkbox :label="2">车系2</el-checkbox>
                            <el-checkbox :label="3">车系3</el-checkbox>
                        </el-checkbox-group>
                    </div>
                </el-form-item>
                <el-form-item label="封面图片">
                    
                </el-form-item>
                <el-form-item label="素材">
                    
                </el-form-item>
                <el-form-item label="教程">
                    
                </el-form-item>
                <el-form-item label="奖励规则">
                    <el-select v-model="form.rewardRuleTemplateId" @change="ruleChange">
                       <el-option label="默认规则" :value="1"></el-option>
                       <el-option label="适用凌云系列奖励" :value="2"></el-option>
                    </el-select>
                    <el-table :data="ruleTable.data" border style="margin-top: 16px">
                        <el-table-column prop="teleport" label="传播值"></el-table-column>
                        <el-table-column prop="point" label="奖励积分"></el-table-column>
                    </el-table>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="confirm">提交</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>

<script>
import {defineComponent, reactive, getCurrentInstance} from 'vue'
export default defineComponent({
    name: 'v-questRelease',
    setup() {
        const activeId = reactive({
            value: 0
        });
        const form = reactive({
            task: {
                title: '',
                subtitle: '',
                start: '',
                end: '',
                coverUrl: '',
                rewardRuleTemplateId: undefined,
            },
            brandList: [],
            tagList: [],
            referenceList: []
        });
        const { proxy } = getCurrentInstance();
        const ruleTable = reactive({
            data: []
        });
        return {
            form,proxy,
            ruleTable,
            activeId
        }
    },
    mounted() {
        this.activeId.value = this.$route.params.id
    },
    methods: {
        selectAll(value) {
            if(value == true) {
                //全选
            } else {
                this.form.series = []
            }
        },
        ruleChange(value) {
            if(value == 1) {
                this.ruleTable.data = [
                    {teleport: '0-1000', point: 200},
                    {teleport: '1000-5000', point: 300},
                ]
            } else {
                this.ruleTable.data = [ ]
            }
        },
        confirm() {
            this.$router.go(-1);
        }
    }
})
</script>

<style lang="less">
.form-area {
    width: 600px
}
</style>