qimall/addons/BossWeight/backend/views/level/edit.php

<?php
use common\helpers\ComponentHelper;

ComponentHelper::loadComponentView('com-dialog-select');
ComponentHelper::loadComponentView('com-select-cat');
$diyPath = dirname(__DIR__) . '/components';
ComponentHelper::loadComponentView('boss-weight-goods-select', $diyPath);
?>
<div id="app" v-cloak>
    <el-card class="box-card" v-loading="cardLoading" shadow="never" style="border:0;min-width: 1250px;" body-style="background-color: #f3f3f3;padding: 10px 0 0;">
        <div slot="header">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item>
                    <span style="color: #409EFF;cursor: pointer" @click="$navigate({r:'boss-weight/level/index'})">
                        股东等级
                    </span>
                </el-breadcrumb-item>
                <el-breadcrumb-item>编辑股东等级</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="form-body">
            <el-form :model="ruleForm" :rules="rules" size="small" ref="ruleForm" label-width="150px">
                <el-row>
                    <el-col :span="24">
                        <el-form-item label="股东等级权重" prop="level">
                            <el-select style="width: 100%" v-model="ruleForm.level" placeholder="请选择">
                                <el-option v-for="item in weights" :key="item.level" :label="item.name" :value="item.level" :disabled="item.disabled && item.level!=origin_level">
                                </el-option>
                            </el-select>
                        </el-form-item>

                        <el-form-item label="股东等级名称" prop="name">
                            <el-input v-model="ruleForm.name" placeholder="请输入股东等级名称"></el-input>
                        </el-form-item>

                        <el-form-item label="永久分红">
                            <el-input v-model.number="ruleForm.setting.prize" type="number">
                                <template slot="append">%</template>
                            </el-input>
                        </el-form-item>

                        <el-form-item label="开启加权权重" prop="weight_status">
                            <el-switch
                                    v-model="ruleForm.setting.weight_status"
                                    :active-value="1"
                                    :inactive-value="0">
                            </el-switch>
                        </el-form-item>

                        <template v-if="ruleForm.setting.weight_status">
                            <el-form-item prop="weight_config">
                                <div>
                                    直推
                                    <el-input style="width: 150px;" v-model="ruleForm.setting.weight_member_num" type="number">
                                        <template slot="append">会员</template>
                                    </el-input>
                                    各消费任意产品达
                                    <el-input style="width: 150px;" v-model="ruleForm.setting.weight_product_num" type="number">
                                        <template slot="append">件</template>
                                    </el-input>
                                    可获得
                                    <el-input style="width: 200px;" v-model="ruleForm.setting.weight_num" type="number">
                                        <template slot="append">权重数量</template>
                                    </el-input>
                                </div>
                            </el-form-item>
                            <el-form-item prop="weight_config">
                                <div>
                                    直推
                                    <el-input style="width: 150px;" v-model="ruleForm.setting.weight_member_num_second" type="number">
                                        <template slot="append">个</template>
                                    </el-input>
                                    指定会员
                                    <el-select style="width: 150px;" v-model="ruleForm.setting.weight_member_level_second" placeholder="请选择">
                                        <el-option v-for="item in memberLevels" :key="item.level" :label="item.name" :value="item.level">
                                        </el-option>
                                    </el-select>
                                    可获得
                                    <el-input style="width: 200px;" v-model="ruleForm.setting.weight_num_second" type="number">
                                        <template slot="append">权重数量</template>
                                    </el-input>
                                </div>
                            </el-form-item>

                            <el-form-item prop="weight_config">
                                <div>
                                    伞下团队每有一个市场超过
                                    <el-input style="width: 150px;" v-model="ruleForm.setting.weight_member_num_team"  onInput="value=toNumber(value,2)">
                                        <template slot="append">万</template>
                                    </el-input>
                                    业绩, 可获得
                                    <el-input style="width: 200px;" v-model="ruleForm.setting.weight_num_team" type="number">
                                        <template slot="append">权重数量</template>
                                    </el-input>
                                </div>
                            </el-form-item>

                            <el-form-item label="等级比例" prop="weight_level_ratio">
                                <el-input v-model="ruleForm.setting.weight_level_ratio" type="number">
                                    <template slot="append">%</template>
                                </el-input>
                            </el-form-item>

                            <el-form-item label="平台营业额百分比" prop="weight_turnover_ratio">
                                <el-input v-model="ruleForm.setting.weight_turnover_ratio" type="number">
                                    <template slot="append">%</template>
                                </el-input>
                            </el-form-item>

                            <el-form-item label="分红上限金额" prop="weight_max_price">
                                <el-input v-model="ruleForm.setting.weight_max_price" type="number">
                                    <template slot="append">元</template>
                                </el-input>
                            </el-form-item>

                            <el-form-item label="开启权重限制条件" prop="weight_is_limit">
                                <el-switch
                                    v-model="ruleForm.setting.weight_is_limit"
                                    :active-value="1"
                                    :inactive-value="0">
                                </el-switch>
                                <template v-if="ruleForm.setting.weight_is_limit==1">
                                <el-checkbox-group v-model="checked_arr" class="check-group" @change="handleCheckedCitiesChange">
                                    <el-col :span="24">
                                        <el-checkbox :label="ruleForm.setting.checked_weight_values[0].key">
                                            <div style="display: flex;align-items: center">
                                                条件1： 达分红上限金额后，
                                                <el-input style="width:100px;" v-model="ruleForm.setting.checked_weight_values[0].value.val">
                                                    <template slot="append">天</template>
                                                </el-input>
                                                内需要复购指定产品，才能重新获得权重分成，否则权重失效
                                                <boss-weight-goods-select :multiple="true" @selected="goodsSelectBySetting" title="商品选择">
                                                            <el-button style="margin-left: 10px;">选择商品</el-button>
                                                </boss-weight-goods-select>
                                            </div>
                                        </el-checkbox>
                                    </el-col>
                                    <el-col v-if="ruleForm.setting.checked_weight_values[0].value.val1.length > 0">
                                        <el-form-item prop="goods_ids" v-if="ruleForm.upgrade_type_goods==1">
                                    <div style="max-height: 300px;overflow-y: auto">
                                        <el-table :data="goods" :show-header="false" border>
                                            <el-table-column label="">
                                                <template slot-scope="scope">
                                                    <div flex>
                                                        <div style="padding-right: 10px;flex-grow: 0">
                                                            <com-image mode="aspectFill"
                                                                       :src="scope.row.cover_pic"></com-image>
                                                        </div>
                                                        <div style="flex-grow: 1;">
                                                            <com-ellipsis :line="2">{{scope.row.goods_name}}
                                                            </com-ellipsis>
                                                        </div>
                                                        <div style="flex-grow: 0;">
                                                            <el-button @click="deleteGoods(scope.$index)" type="text"
                                                                       circle size="mini">
                                                                <el-tooltip class="item" effect="dark" content="删除"
                                                                            placement="top">
                                                                    <img src="resources/img/mall/del.png" alt="">
                                                                </el-tooltip>
                                                            </el-button>
                                                        </div>
                                                    </div>
                                                </template>
                                            </el-table-column>
                                        </el-table>
                                    </div>
                            </el-form-item>
  <!--                                       <el-form-item prop="goods_warehouse_ids" >
                                        <div style="max-height: 200px;background-color: #eee;" v-for="(item,index) in goods">
                                            <div flex >
                                                <div style="padding-right: 10px;flex-grow: 0">
                                                    <com-image mode="aspectFill" :src=" item.cover_pic"></com-image>
                                                </div>
                                                <div style="flex-grow: 1;">
                                                    <com-ellipsis :line="2">  {{item.goods_name}}
                                                    </com-ellipsis>
                                                </div>
                                            </div>
                                        </div>
                                        </el-form-item> -->
                                    </el-col>

                                    <el-col :span="24">
                                        <el-checkbox :label="ruleForm.setting.checked_weight_values[1].key">
                                            <div style="display: flex;align-items: center">
                                                条件2：直推会员在
                                                <el-input style="width:100px;"  v-model="ruleForm.setting.checked_weight_values[1].value.val">
                                                    <template slot="append">天</template>
                                                </el-input>
                                                内没有进行消费或者推荐人员，权重失效，
                                                没有获得权重的直推会员，再次任意购买
                                                <el-input style="width:100px;"  v-model="ruleForm.setting.checked_weight_values[1].value.val1">
                                                    <template slot="append">单</template>
                                                </el-input>
                                                产品，权重恢复
                                            </div>
                                        </el-checkbox>
                                    </el-col>

                                    <el-col :span="24">
                                        <el-checkbox :label="ruleForm.setting.checked_weight_values[2].key">
                                            <div style="display: flex;align-items: center">
                                                条件3： 成为分红股东，
                                                <el-input style="width:100px;" v-model="ruleForm.setting.checked_weight_values[2].value.val">
                                                    <template slot="append">天</template>
                                                </el-input>
                                                内无法获得权重，取消分红股东身份
                                            </div>
                                        </el-checkbox>
                                    </el-col>
                                </el-checkbox-group>
                            </template>
                            </el-form-item>
                        </template>



                        <el-form-item label="开启额外分红" prop="is_extra">
                            <el-switch
                                    v-model="ruleForm.setting.is_extra"
                                    :active-value="1"
                                    :inactive-value="0">
                            </el-switch>
                        </el-form-item>

                        <el-form-item label="额外分红佣金" prop="extra_prize">
                            <el-input v-model.number="ruleForm.setting.extra_prize" type="number">
                                <template slot="append">%</template>
                            </el-input>
                        </el-form-item>

                        <el-form-item  label="存在额外分红的条件" prop="extra_type">
                            <el-radio-group v-model="ruleForm.setting.extra_type">
                                <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="额外分红开启上限" prop="extra_is_limit">
                            <el-switch
                                    v-model="ruleForm.setting.extra_is_limit"
                                    :active-value="1"
                                    :inactive-value="0">
                            </el-switch>
                        </el-form-item>

                        <el-form-item label="上限金额">
                            <el-input v-model.number="ruleForm.setting.extra_limit_price" type="number">
                                <template slot="append">元</template>
                            </el-input>
                        </el-form-item>

                        <el-form-item label="是否启用自动升级" prop="is_auto_upgrade">
                            <el-switch v-model="ruleForm.is_auto_upgrade" :active-value="1" :inactive-value="0">
                            </el-switch>
                        </el-form-item>

                        <template v-if="ruleForm.is_auto_upgrade == 1">
                            <?php echo $tpl; ?>
                        </template>

                        <el-form-item label="是否启用" prop="status">
                            <el-switch v-model="ruleForm.status" :active-value="1" :inactive-value="0">
                            </el-switch>
                        </el-form-item>

                        <el-form-item v-if="ruleForm.status" :key="1" label="等级说明" prop="explain">
                            <el-input type="textarea" :rows="5" placeholder="请输入等级说明" v-model="ruleForm.explain" maxlength="80" show-word-limit></el-input>
                        </el-form-item>

                        <el-form-item v-if="!ruleForm.status" :key="2" label="等级说明">
                            <el-input type="textarea" :rows="5" placeholder="请输入等级说明" v-model="ruleForm.explain" maxlength="80" show-word-limit></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </div>
        <el-button class="button-item" :loading="btnLoading" type="primary" @click="submitForm('ruleForm')" size="small">保存
        </el-button>
    </el-card>
</div>
<script>
    const app = new Vue({
        el: '#app',
        data() {
            return {
                origin_level:0,
                msg: 1,
                options: [], //会员等级列表
                level: 0,
                form: {
                    type: [],
                },
                showConditionMsg: false,
                dialogFormVisible_edit: false,
                conditionMsg: '',
                weights: [],
                levels: [],
                memberLevels:[],
                ruleForm: {
                    id:'',
                    level: '',	//当前选中等级
                    name: '',
                    status: 0,
                    condition_type: 1,
                    setting: {
                        commission_type: 'commission',
                        from_type: 'boss',
                        prize: 0,
                        extra_prize: 0,
                        is_extra: 0,
                        extra_type: 1,
                        extra_is_limit: 0,
                        extra_limit_price: 0.00,
                        //加权分红
                        weight_status:0,
                        weight_member_num:0,
                        weight_product_num:0,
                        weight_num:0,
                        weight_member_num_second:0,
                        weight_member_level_second:'',
                        weight_num_second:0,
                        weight_member_num_team:0.00,
                        weight_num_team:0,
                        weight_level_ratio:0,
                        weight_turnover_ratio:0,
                        weight_max_price:0,
                        weight_is_limit:0,
                        checked_weight_values: [
                            {
                                key: 0,
                                value: {
                                    val: '',
                                    val1:[],
                                },
                                checked:0
                            },
                            {
                                key: 1,
                                value: {
                                    val: '',
                                    val1: '',
                                },
                                checked:0
                            },
                            {
                                key: 2,
                                value: {
                                    val: '',
                                },
                                checked:0
                            },
                        ],
                    },
                    buy_goods_type: 0,
                    is_auto_upgrade: 0,
                    goods_type: 0,
                    upgrade_type_condition: 0,
                    upgrade_type_goods: 0,
                    rule: '',
                    explain : '',
                    checked_condition_keys: [],	//对应条件的key
                    goods_ids: [],
                    goods_list: [],
                    setting_goods_list:[],
                    checked_condition_values:<?= $key_arr?>,
                },
                checked_arr:[],
                options_list:<?= $source_list ?>,
                checkbox_list: <?= $checkbox_list ?>,
                rules: {
                    level: [{
                        required: true,
                        message: '请选择股东等级',
                        trigger: 'change'
                    }, ],
                    name: [{
                        required: true,
                        message: '请输入股东等级名称',
                        trigger: 'change'
                    }, ],
                    status: [{
                        required: true,
                        message: '请选择股东等级状态',
                        trigger: 'change'
                    }, ],
                    explain: [{
                        required: true,
                        message: '等级说明不能为空',
                        trigger: 'change'
                    }, ],
                },
                btnLoading: false,
                cardLoading: false,
                formLabelWidth: '150px',
                goods:[],
            };
        },
        mounted() {
            if (getQuery('id')) {
                this.loadData();
            }else{
                this.checked_condition_values_fourArr=[
                    {
                        itemName: "默认等级",
                        val: 0
                    }
                ]
                this.loadData();
            }
        },
        methods: {
            close(e) {
                this.visible = false;
            },
            goodsSelect(param) {
                for (let j in param) {
                    let item = param[j];
                    if (this.ruleForm.goods_ids && this.ruleForm.goods_ids.length >= 99) {
                        this.$message.error('指定商品不能大于99个');
                        return;
                    }
                    let flag = true;
                    for (let i in this.ruleForm.goods_ids) {
                        if (this.ruleForm.goods_ids[i] == item.id) {
                            flag = false;
                            break;
                        }
                    }
                    if (flag) {
                        this.ruleForm.goods_ids.push(item.id);
                        this.ruleForm.goods_list.push({
                            id: item.id,
                            name: item.goods_name,
                            cover_pic: item.cover_pic,
                            price: item.price,
                            stock: item.stock,
                        });
                    }
                }
            },

            // 2.1 提交表单编辑
            submitForm(formName) {
                let self = this;
                self.showConditionMsg = false;
                if(self.ruleForm.upgrade_type_goods ==1){
                    if (self.ruleForm.goods_type == 2 && self.ruleForm.goods_list.length == 0) {	//选中的checkBox
                        self.$message.error('请选择升级商品');
                        return;
                    }
                }
                if (self.ruleForm.upgrade_type_condition == 1) {	//选中升级条件
                    if (self.ruleForm.checked_condition_keys.length == 0) {	//选中的checkBox
                        self.$message.error('请完善升级条件');
                        return;
                    }
                    let checked_condition_values = self.ruleForm.checked_condition_values;
                    self.ruleForm.checked_condition_keys.forEach(function(item, index){
                        for(i in self.ruleForm.checked_condition_values[index].value) {
                            if (!self.ruleForm.checked_condition_values[index].value[i]) {
                                self.conditionMsg = '请完善条件：' + (parseInt(index) + 1);
                                return false;
                            }
                        }
                    });
                    if (self.showConditionMsg) {
                        this.$message.error(self.conditionMsg);
                        return
                    }
                    if (this.ruleForm.checked_condition_keys.length > 0) {
                        if (this.ruleForm.condition_type == 0) {
                            this.$message.error('请选择条件升级的方式升级类型');
                            return;
                        }
                    }
                }
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        self.btnLoading = true;
                        request({
                            params: {
                                r: 'boss-weight/level/edit'
                            },
                            method: 'post',
                            data: {
                                form: self.ruleForm,
                            }
                        }).then(e => {
                            self.btnLoading = false;
                            if (e.data.code == 0) {
                                self.$message.success(e.data.msg);
                                navigateTo({
                                    r: 'boss-weight/level/index'
                                })
                            } else {
                                self.$message.error(e.data.msg);
                            }
                        }).catch(e => {
                            self.$message.error(e.data.msg);
                            self.btnLoading = false;
                        });
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            // 获取显示的值
            loadData() {
                this.cardLoading = true;
                request({
                    params: {
                        r: 'boss-weight/level/edit',
                        id: getQuery('id'),
                    },
                    method: 'get'
                }).then(e => {
                    this.cardLoading = false;
                    if (e.data.code == 0) {
                        if (e.data.data.detail) {
                            Object.assign(this.ruleForm, e.data.data.detail)
                            this.origin_level =this.ruleForm.level;
                            console.log(this.ruleForm)
                            if(this.ruleForm.setting.checked_weight_values == ""){
                                this.ruleForm.setting.checked_weight_values =  [
                                    {
                                        key: 0,
                                        value: {
                                            val: '',
                                            val1:[],
                                        },
                                        checked:0
                                    },
                                    {
                                        key: 1,
                                        value: {
                                            val: '',
                                            val1: '',
                                        },
                                        checked:0
                                    },
                                    {
                                        key: 2,
                                        value: {
                                            val: '',
                                        },
                                        checked:0
                                    },
                                ];
                            }
                            if(!this.ruleForm.setting.checked_weight_values[0].value.val1){
                                this.ruleForm.setting.checked_weight_values[0].value.val1 = [];
                            }
                            this.ruleForm.setting.checked_weight_values.map(item=>{
                                if(item.checked == 1){
                                    this.checked_arr.push(item.key);
                                }
                            });


                        }
                        this.weights = e.data.data.weights;
                        this.memberLevels = e.data.data.memberLevels;
                        this.goods = e.data.data.goods;
                    } else {
                        this.$message.error(e.data.msg);
                    }
                }).catch(e => {
                    console.log(e);
                });
            },
            deleteGoods(index) {
                this.ruleForm.goods_list.splice(index, 1);
                this.ruleForm.goods_ids.splice(index, 1);
            },
            setCondition(){
                navigateTo({
                    r: 'boss-weight/level/condition',
                });
            },
            handleCheckedCitiesChange(value){
                let weight = this.ruleForm.setting.checked_weight_values;
                for(let i = 0;i<weight.length;i++){
                    weight[i].checked = 0;
                    for(let j = 0;j<value.length;j++){
                        if(weight[i].key == value[j]){
                            weight[i].checked = 1;
                        }
                    }
                }

                this.ruleForm.setting.checked_weight_values = weight;
                this.checked_arr = value;
            },
            //选择商品
            goodsSelectBySetting(param) {
                if(param.length > 0){
                    this.goods.forEach((v,i) => {
                        param.forEach((value,index) => {
                            if(value.id == v.id){
                                param.splice(index, 1);
                            }
                        });
                    });
                    console.log(param);
                    if (param.length > 0) {
                        param.forEach((value,index) => {
                             this.goods.push(value);
                        });
                    }
                    this.ruleForm.setting.checked_weight_values[0].value.val1 = [];
                    this.goods.forEach((value,index) => {
                        this.ruleForm.setting.checked_weight_values[0].value.val1.push(value.id);
                    });
                }

            },
            //删除商品
            deleteGoods(index) {
                this.goods.splice(index, 1);
                this.ruleForm.setting.checked_weight_values[0].value.val1 = [];
                this.goods.forEach((value,index) => {
                    this.ruleForm.setting.checked_weight_values[0].value.val1.push(value.id);
                });
            },
        }
    });
</script>

<style>
    .form-body {
        padding: 20px;
        background-color: #fff;
        margin-bottom: 20px;
        padding-right: 10%;
        min-width: 900px;
    }

    .form-body .el-form-item {
        padding-right: 15%;
        min-width: 850px;
    }

    .form-button {
        margin: 0;
    }

    .form-button .el-form-item__content {
        margin-left: 0 !important;
    }

    .button-item {
        padding: 9px 25px;
    }

    .check-group {
        font-size: 14px !important;
    }

    .check-group .el-col {
        display: flex;
    }

    .check-group .el-input {
        margin: 0 5px;
    }

    .check-group .el-col .el-checkbox {
        display: flex;
        align-items: center;
    }

    .check-group .el-col .el-input {
        width: 100px;
    }

    .check-group .el-col .el-input .el-input__inner {
        height: 30px;
        width: 100px;
    }

    .el-checkbox-group .el-col {
        margin-bottom: 10px;
    }

    .condition_common {
        display: flex;
        align-items: center;
    }
    .condition_common_five {
        display: flex;
    }

</style>