qimall/addons/SignIn/backend/views/default/index.php

<?php

use common\helpers\ComponentHelper;

ComponentHelper::loadComponentView('com-rich-text');
?>
<style>
    .el-card__header {
        padding: 8px 20px;
    }

    .el-card__body {
        padding: 15px;
    }
</style>
<div id="app" v-cloak>
    <el-card class="box-card" shadow="never">
        <el-tabs v-model="activeName" @tab-click="handle('switch')">
            <el-tab-pane label="奖励配置" name="reward">
                <el-form v-if="reward" ref="form" :model="form" label-width="120px" size="small" v-loading="loading">
                    <el-card v-if="isShow" class="edit-card" shadow="never">
                        <div slot="header" class="clearfix">
                            <div class="card-title">优惠券奖励</div>
                        </div>
                        <el-row type="flex">
                            <el-form-item label="每日签到赠送" required>
                                <el-select class="width-150" placeholder="请选择优惠券" @change="handle('todayCoupon', $event)" v-model="form.today_coupon_name">
                                    <el-option v-for="items in coupon_list" :label="coupon_list.items" :value="items">
                                    </el-option>
                                </el-select>
                                <el-input class="width-150" min=1 onchange="this.value= this.value.match(/\d+(\.\d{0,2})?/) ? this.value.match(/\d+(\.\d{0,2})?/)[0] : '1'" v-model="form.today_coupon.num" type="number"></el-input> 张
                            </el-form-item>
                        </el-row>
                        <el-button @click="handle('couponAdd')" size="small" type="text">
                            <i class="el-icon-plus" style="font-weight: bolder;margin-left: 5px;"></i>
                            <span style="color: #353535;font-size: 14px">新增优惠券规则</span>
                        </el-button>
                        <div class="rule" shadow="never" v-if="form.coupon && form.coupon.length > 0" v-for="(item, index) in form.coupon" :key="item.id">
                            <el-row type="flex">
                                <el-form-item label="连续签到" required style="margin: 0; padding:0;">
                                    <el-input class="width-150" min=1 onchange="this.value= this.value.match(/\d+(\.\d{0,2})?/) ? this.value.match(/\d+(\.\d{0,2})?/)[0] : '1'" v-model.number="item.day" type="number"></el-input>
                                    天 赠送优惠券
                                    <el-select class="width-150" @change="handle('selectCoupon', $event, index)" placeholder="请选择优惠券" v-model="item.coupon_name">
                                        <el-option v-for="items in coupon_list" :label="coupon_list.items" :value="items">
                                        </el-option>
                                    </el-select>
                                    <el-input class="width-150" min=1 onchange="this.value= this.value.match(/\d+(\.\d{0,2})?/) ? this.value.match(/\d+(\.\d{0,2})?/)[0] : '1'" v-model.number="item.num" type="number"></el-input> 张
                                </el-form-item>
                                <el-button type="text" size="small" style="margin-left:10px;" @click="handle('couponDel', index)">删除规则</el-button>
                            </el-row>
                        </div>
                        <el-row type="flex" required>
                            <el-form-item  style="margin-top: 20px;">
                                <template slot='label'>
                                    <span>是否循环奖励</span>
                                    <el-tooltip effect="dark" content="开启后按照规则设计天数重新计算签到奖励"
                                                placement="top">
                                        <i class="el-icon-info"></i>
                                    </el-tooltip>
                                </template>
                                <el-switch class="width-150" v-model="form.is_coupon_sign_repeat" :active-value="1" :inactive-value="0"></el-switch>
                            </el-form-item>
                        </el-row>
                    </el-card>

                    <el-card class="edit-card" shadow="never">
                        <div slot="header" class="clearfix">
                            <div class="card-title">积分奖励</div>
                        </div>
                        <el-row type="flex">
                            <el-form-item label="每日签到赠送" required>
                                <el-input class="width-150" min=1 onchange="this.value= this.value.match(/\d+(\.\d{0,2})?/) ? this.value.match(/\d+(\.\d{0,2})?/)[0] : '1'" v-model="form.today_score.num" type="number"></el-input>
                                <el-select class="width-150" placeholder="请选择资产类型" @change="handle('todayCoupon', $event)" v-model="form.today_score.give_type">
                                    <el-option v-for="items in give_type" :label="items.title" :value="items.name"></el-option>
                                </el-select>
                            </el-form-item>
                        </el-row>
                        <el-button @click="handle('scoreAdd')" size="small" type="text">
                            <i class="el-icon-plus" style="font-weight: bolder;margin-left: 5px;"></i>
                            <span style="color: #353535;font-size: 14px">新增积分规则</span>
                        </el-button>
                        <div class="rule" shadow="never" v-if="form.score && form.score.length > 0" v-for="(item, index) in form.score" :key="item.id">
                            <el-row type="flex">
                                <el-form-item label="连续签到" required style="margin: 0; padding:0;">
                                    <el-input class="width-150" min=1 onchange="this.value= this.value.match(/\d+(\.\d{0,2})?/) ? this.value.match(/\d+(\.\d{0,2})?/)[0] : '1'" v-model.number="item.day" type="number"></el-input> 天 赠送
                                    <el-input class="width-150" min=1 onchange="this.value= this.value.match(/\d+(\.\d{0,2})?/) ?  this.value.match(/\d+(\.\d{0,2})?/)[0] : '1'" v-model.number="item.num" type="number"></el-input>
                                    <el-select class="width-150" placeholder="请选择资产类型" @change="handle('todayCoupon', $event)" v-model="item.give_type">
                                        <el-option v-for="items in give_type" :label="items.title" :value="items.name"></el-option>
                                    </el-select>
                                </el-form-item>
                                <el-button size="small" type="text" style="margin-left:10px;" @click="handle('scoreDel', index)">删除规则</el-button>
                                </el-col>
                            </el-row>
                        </div>
                        <el-row type="flex" required>
                            <el-form-item style="margin-top: 20px;">
                                <template slot='label'>
                                    <span>是否循环奖励</span>
                                    <el-tooltip effect="dark" content="开启后按照规则设计天数重新计算签到奖励"
                                                placement="top">
                                        <i class="el-icon-info"></i>
                                    </el-tooltip>
                                </template>
                                <el-switch class="width-150" v-model="form.is_score_sign_repeat" :active-value="1" :inactive-value="0"></el-switch>
                            </el-form-item>
                        </el-row>
                    </el-card>
                </el-form>
            </el-tab-pane>
            <el-tab-pane label="规则配置" name="setting">
                <el-card v-if="setting" class="edit-card" shadow="never" v-loading="loading" style="min-width: 1000px;">
                    <div class='form-body' ref="body">
                        <el-form label-position="left" label-width="100px">
                            <!-- <el-form-item label="是否开启">
                                <el-switch v-model="status" :active-value="1" :inactive-value="0"></el-switch>
                            </el-form-item> -->
                            <el-form-item label="签到规则">
                                <com-rich-text style="width: 750px" :simple-attachment="true" v-model="rule"></com-rich-text>
                            </el-form-item>
                        </el-form>
                    </div>
                </el-card>
            </el-tab-pane>
        </el-tabs>
        <el-button class="button-item" :loading="loading" type="primary" size="small" @click="send('submit')">保存</el-button>
    </el-card>
</div>
<script>
    const app = new Vue({
        el: '#app',
        data() {
            return {
                reward: true,
                setting: false,
                loading: false,
                isShow: false,
                rule: '',
                status: 1,
                line: {
                    width: '450px',
                    marginLeft: '-150px'
                },
                form: {
                    //status:1,
                    score: [],
                    coupon: [],
                    today_score: {
                        num: 0,
                        give_type: '',
                    },
                    today_coupon: {
                        coupon_id: 0,
                        num: 0
                    },
                    is_coupon_sign_repeat: 0,
                    is_score_sign_repeat: 0,
                    today_coupon_name: '优惠券'
                },
                coupon_list: {},
                coupon_list_data: {},
                score_temp: {
                    day: 0,
                    num: 0,
                },
                coupon_temp: {
                    day: 0,
                    num: 0,
                    coupon_id: 0,
                },
                activeName: 'reward',
                give_type: [],
            }
        },
        created() {
            this.send('getData');
        },
        methods: {
            handle(type, param1 = null, param2 = null) {
                //切换选项卡
                switch (type) {
                    case 'switch':
                        if (this.activeName == 'reward') {
                            this.send('getData');
                            this.reward = true;
                            this.setting = false;
                        } else {
                            this.send('setting');
                            this.reward = false;
                            this.setting = true;
                        }
                        break;
                        //删除优惠券
                    case 'couponDel':
                        if (this.form.coupon && this.form.coupon.length > param1) {
                            this.form.coupon.splice(param1, 1);
                        }
                        break;
                        //新增优惠券规则
                    case 'couponAdd':
                        this.form.coupon.push(JSON.parse(JSON.stringify(this.coupon_temp)));
                        break;
                        //选择优惠券
                    case 'selectCoupon':
                        let id = 0;
                        for (coupon_id in this.coupon_list) {
                            if (this.coupon_list[coupon_id] == param1) {
                                id = coupon_id;
                            }
                        }
                        if (id != 0) {
                            this.form.coupon[param2]['coupon_id'] = id;
                        }
                        console.log(this.form.coupon);
                        break;
                        //签到每日奖励优惠券
                    case 'todayCoupon':
                        let cid = 0;
                        let ids = getKeys(this.coupon_list, param1);
                        if (ids.length) {
                            this.form.today_coupon_name = param1;
                            this.form.today_coupon.coupon_id = ids[0];
                        }


                        break;
                        //新增积分规则
                    case 'scoreAdd':
                        this.form.score.push(JSON.parse(JSON.stringify(this.score_temp)));
                        break;
                        //删除积分
                    case 'scoreDel':
                        if (this.form.score && this.form.score.length > param1) {
                            this.form.score.splice(param1, 1);
                        }
                        break;
                    default:
                        break;
                }
            },
            send(type) {
                switch (type) {
                    //获取奖励
                    case 'getData':
                        this.reward = true;
                        this.setting = false;
                        this.loading = true;
                        request({
                            params: {
                                r: 'sign-in/default/index',
                                group: this.activeName
                            },
                            method: 'get',
                        }).then(e => {
                            this.loading = false;
                            if (e.data.code == 0) {
                                if (e.data.data.coupon_list) {
                                    for (let i in e.data.data.coupon_list) {
                                        this.coupon_list[e.data.data.coupon_list[i]['id']] = e.data.data.coupon_list[i]['name'];
                                    }
                                }
                                this.isShow = e.data.data.isShow;
                                this.give_type = e.data.data.give_type;
                                this.coupon_list_data = e.data.data.coupon_list;
                                this.form.score = e.data.data.reward_score;
                                this.form.coupon = e.data.data.reward_coupon;
                                this.form.today_score = e.data.data.today_score;
                                this.form.is_coupon_sign_repeat = e.data.data.is_coupon_sign_repeat;
                                this.form.is_score_sign_repeat = e.data.data.is_score_sign_repeat;
                                this.form.today_coupon = e.data.data.today_coupon;
                                if (!this.form.score) {
                                    this.form.score = [];
                                }
                                if (!this.form.coupon) {
                                    this.form.coupon = [];
                                }
                                if (this.form.today_coupon && this.form.today_coupon.coupon_id) {
                                    this.form.today_coupon_name = this.coupon_list[this.form.today_coupon.coupon_id] ? this.coupon_list[this.form.today_coupon.coupon_id] : '请选择优惠券';
                                }
                            }
                        }).catch(e => {
                            this.loading = false;
                            this.$message.error(e.data.msg);
                        })
                        break;
                        //规则
                    case 'setting':
                        this.reward = false;
                        this.setting = true;
                        request({
                            params: {
                                r: 'sign-in/default/index',
                                group: this.activeName
                            },
                            method: 'get',
                        }).then(e => {
                            this.loading = false;
                            if (e.data.code == 0) {
                                this.rule = e.data.data.rule;
                                this.status = e.data.data.status;
                            }
                        }).catch(e => {
                            this.loading = false;
                            this.$message.error(e.data.msg);
                        })
                        break
                    case 'submit':
                        if (this.activeName == 'reward') {
                            if (this.form.coupon && this.form.coupon.length > 0) {
                                for (let i = 0; i < this.form.coupon.length; i++) {
                                    if (this.form.coupon[i]['num'] <= 0) {
                                        this.$message.error('赠送优惠券数量必须大于0');
                                        return false;
                                    }
                                    if (this.form.coupon[i]['coupon_id'] == 0) {
                                        this.$message.error('请选择需要赠送的优惠券');
                                        return false;
                                    }
                                    if (this.coupon_list_data[this.form.coupon[i]['coupon_id']] &&
                                        this.form.coupon[i]['num'] > this.coupon_list_data[this.form.coupon[i]['coupon_id']]['total_count'] &&
                                        this.coupon_list_data[this.form.coupon[i]['coupon_id']]['total_count'] != '-1'
                                    ) {
                                        this.$message.error('优惠券数量不足，剩下' + this.coupon_list_data[this.form.coupon[i]['coupon_id']]['total_count'] + '张');
                                        return false;
                                    }
                                    let couponDay = this.form.coupon[i]['day'] || 1;
                                }
                            }
                            if (this.form.score && this.form.score.length > 0) {
                                for (let i = 0; i < this.form.score.length; i++) {
                                    if (this.form.score[i]['num'] <= 0) {
                                        this.$message.error('赠送积分数量必须大于0');
                                        return false;
                                    }
                                }
                            }
                            // if (this.form.today_coupon.num <= 0 || this.form.today_coupon.coupon_id == 0) {
                            //     this.$message.error('请选择需要赠送的优惠券');
                            //     return false;
                            // }
                            this.loading = true;
                            let data = this.form;
                            data['group'] = 'reward';
                            request({
                                params: {
                                    r: 'sign-in/default/index'
                                },
                                data: this.form,
                                method: 'post',
                            }).then(e => {
                                this.loading = false;
                                this.$message.success(e.data.msg);
                            }).catch(e => {
                                this.loading = false;
                                this.$message.error(e.data.msg);
                            })
                        } else {
                            this.loading = true;
                            request({
                                params: {
                                    r: 'sign-in/default/index'
                                },
                                data: {
                                    rule: this.rule,
                                    status: this.status,
                                    group: "setting"
                                },
                                method: 'post',
                            }).then(e => {
                                this.loading = false;
                                this.$message.success(e.data.msg);
                            }).catch(e => {
                                this.loading = false;
                                this.$message.error(e.data.msg);
                            })
                        }

                        break;
                }
            }
        }
    })
</script>
<style>
    .rule + .rule {
        margin-top: 5px;
    }
</style>