qimall/addons/ServeBonus/backend/views/setting/index.php

<?php
/**
 * @link:http://www.gdqijianshi.com/
 * @copyright: Copyright (c) 2020 广东七件事集团
 * Created by PhpStorm
 * Author: lun
 * Date: 2021-10-23
 * Time: 16:11
 */
?>
<div id="app" v-cloak>
    <el-card class="box-card" v-loading="loading" shadow="never" style="border:0;min-width: 1500px;"
             body-style="background-color: #f3f3f3;padding: 10px 0 0;">
        <div slot="header">
            <div>
                <span>基础设置</span>
            </div>
        </div>
        <div class="form_box">
            <el-form :model="ruleForm"   size="small" ref="ruleForm" label-width="150px">
                <el-card shadow="never">
                    <div slot="header">
                        <div>
                            <span>服务商设置</span>
                        </div>
                    </div>
                    <div>
                        <el-row>
                            <el-col :span="16">
                                <el-form-item label="启用服务商提成" >
                                    <div>
                                        <el-switch v-model="ruleForm.is_enable" :active-value="1" :inactive-value="0"></el-switch>
                                    </div>
                                    <div class="tips-text" style="line-height: 24px;">
                                        是否开启服务商提成计算
                                    </div>
                                </el-form-item>
                                <el-form-item label="推广中心显示">
                                    <div>
                                        <el-switch v-model="ruleForm.is_show_at_center" :active-value="1" :inactive-value="0">
                                        </el-switch>
                                    </div>
                                </el-form-item>

                                <el-form-item prop="compute_type" label="佣金计算方式">
                                    <el-col :span="8" style="width:100%;">
                                        <el-radio-group  v-model="ruleForm.compute_type" size="small">
                                            <el-radio :label="0" border>实际支付金额(不含运费)</el-radio>
                                            <el-radio :label="1" border>商品利润</el-radio>
                                            <el-radio :label="2" border>商品售价</el-radio>
                                        </el-radio-group>
                                    </el-col>
                                    <div class="tips-text" style="line-height: 24px;">
                                        商品利润=商品销售价-商品成本价
                                    </div>
                                </el-form-item>

                                <el-form-item prop="settlement_method" label="结算方式">
                                    <el-col :span="8" style="width: 100%;">
                                        <el-radio-group  v-model="ruleForm.settlement_method" size="small">
                                            <el-radio :label="0" border>支付完成发放</el-radio>
                                            <el-radio :label="1" border>订单完成发放</el-radio>
                                        </el-radio-group>
                                    </el-col>
                                    <div class="tips-text" style="line-height: 24px;">
                                        计算方式跟结算方式包含加权分红跟出单奖励
                                    </div>
                                </el-form-item>

                                <el-form-item prop="compute_period" label="结算周期">
                                    <el-col :span="8">
                                        <el-radio-group  v-model="ruleForm.compute_period" size="small">
                                            <el-radio :label="1" border>天</el-radio>
                                            <el-radio :label="2" border>周</el-radio>
                                            <el-radio :label="3" border>月</el-radio>
                                        </el-radio-group>
                                    </el-col>
                                    <div class="tips-text" style="line-height: 24px;">
                                        佣金结算周期选择
                                    </div>
                                </el-form-item>

                                <el-form-item label="团队业绩计算">
                                    <el-col :span="20">
                                        <el-switch v-model="ruleForm.set_team_achievement" :active-value="1" :inactive-value="0"></el-switch>
                                        <div class="tips-text">开启后条件升级“成为服务商后，好友人数____人，下级团队业绩达到____元”此条件才会开始计算好友人数跟团队业绩，否则将不进行计算</div>
                                    </el-col>
                                </el-form-item>

                                <el-form-item prop="is_open_level_limit">
                                    <label slot="label">升级等级限制
                                        <el-tooltip class="item" effect="dark"
                                                    content="开启后等级只能一级一级往上升级"
                                                    placement="top">
                                            <i class="el-icon-info"></i>
                                        </el-tooltip>
                                    </label>
                                    <el-col :span="18">
                                        <el-switch v-model="ruleForm.is_open_level_limit" :active-value="1" :inactive-value="0"></el-switch>
                                    </el-col>
                                </el-form-item>

                                <el-form-item prop="is_cloud_stock_open">
                                    <label slot="label">云库存加权分红
                                        <el-tooltip class="item" effect="dark"
                                                    content="开启时，只有云库存向平台补货才算加权分红金额。"
                                                    placement="top">
                                            <i class="el-icon-info"></i>
                                        </el-tooltip>
                                    </label>
                                    <el-col :span="18">
                                        <el-switch v-model="ruleForm.is_cloud_stock_open" :active-value="1" :inactive-value="0"></el-switch>
                                    </el-col>
                                </el-form-item>
                                <el-form-item prop="achievement_count_method" label="总业绩统计方式">
                                    <el-col :span="8" style="width: 100%;">
                                        <el-radio-group  v-model="ruleForm.achievement_count_method" size="small">
                                            <el-radio :label="0" border>支付完成</el-radio>
                                            <el-radio :label="1" border>订单完成</el-radio>
                                        </el-radio-group>
                                    </el-col>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </div>
                </el-card>
            </el-form>
            <el-button :loading="btnLoading" class="button-item" type="primary" style="margin-top: 24px;"
                       @click="store('ruleForm')" size="small">保存
            </el-button>
        </div>

    </el-card>
</div>
<script>
    const app = new Vue({
        el: '#app',
        data() {
            return {
                loading: false,
                btnLoading: false,
                ruleForm: {
                    is_enable: 0,
                    is_show_at_center: 1,
                    compute_type:0,//佣金计算方式
                    compute_period:1,//结算周期
                    settlement_method:0,//结算方式
                    set_team_achievement:0,//团队业绩计算
                    is_open_level_limit:0,//升级等级限制
                    is_cloud_stock_open:0,
                    achievement_count_method: 0, // 总业绩统计方式
                },
            }
        },
        mounted: function () {
            this.loadData();
        },
        methods: {
            loadData() {
                this.loading = true;
                request({
                    params: {
                        r: 'serve-bonus/setting/index',
                    },
                    method: 'get'
                }).then(e => {
                    this.loading = false;
                    if (e.data.code == 0 && !isEmpty(e.data.data)) {
                        this.ruleForm = e.data.data;
                    }
                }).catch(e => {
                    this.loading = false;
                })
            },
            store(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        this.btnLoading = true;
                        request({
                            params: {
                                r: 'serve-bonus/setting/index',
                            },
                            method: 'post',
                            data: this.ruleForm
                        }).then(e => {
                            this.btnLoading = false;
                            if (e.data.code == 0) {
                                this.$message.success(e.data.msg);
                            } else {
                                this.$message.error(e.data.msg);
                            }
                        }).catch(e => {
                            this.$message.error(e);
                            this.btnLoading = false;
                        })
                    } else {
                        this.btnLoading = false;
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
        }
    });
</script>
<style>
    .form_box {
        background-color: #f3f3f3;
        padding: 0 0 20px;
    }

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

    .el-input-group__append {
        background-color: #fff;
        color: #353535;
    }
</style>