admin-view/src/views/marketing/platformCommission/config/index.vue

<template>
  <div class="divBox">
    <el-card class="box-card">
      <el-form ref="formDataRef" v-loading="fullscreenLoading" class="formValidate mt20" :rules="ruleValidate" :model="formData" label-width="160px" @submit.native.prevent>
        <el-form-item label="平台抽成：" prop="is_open">
          <el-radio-group v-model="formData.is_open">
            <el-radio :label="0" class="radio">关闭</el-radio>
            <el-radio :label="1">开启</el-radio>
          </el-radio-group>
          <span class="form-item-tip">平台抽成功能是否开启，关闭后平台抽成功能不在使用！</span>
        </el-form-item>
        <template v-if="formData.is_open == 1">
          <el-divider content-position="left">抽成分佣设置</el-divider>
          <el-form-item label="平台分佣比例(%)：" prop="commission_platform_rate">
            <el-input-number :step="0.01" :min="0" :max="100"  v-model="formData.commission_platform_rate" placeholder="平台分佣比例" />
          </el-form-item>
          <el-form-item label="合伙人分佣比例(%)：" prop="commission_partner_rate">
            <el-input-number :step="0.01" :min="0" :max="100"  v-model="formData.commission_partner_rate" placeholder="合伙人分佣比例" />
          </el-form-item>
          <el-form-item label="合伙人分佣周期：" prop="commission_partner_cycle">
            <el-radio-group v-model="formData.commission_partner_cycle">
              <el-radio :label="0" class="radio">天</el-radio>
              <el-radio :label="1">周</el-radio>
              <el-radio :label="2">月</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="招商员分佣比例(%)：" prop="commission_merchants_rate">
            <el-input-number :step="0.01" :min="0" :max="100"  v-model="formData.commission_merchants_rate" placeholder="招商员分佣比例" />
          </el-form-item>
          <el-form-item label="推广员分佣比例(%)：" prop="commission_promoter_rate">
            <el-input-number :step="0.01" :min="0" :max="100"  v-model="formData.commission_promoter_rate" placeholder="推广员分佣比例" />
          </el-form-item>
          <el-form-item label="积分释放比例(%)：" prop="commission_integral_release_rate">
            <el-input-number :step="0.01" :min="0" :max="100"  v-model="formData.commission_integral_release_rate" placeholder="积分释放比例" />
          </el-form-item>
        </template>
        <!--提交按钮-->
        <el-form-item style="margin-top:30px;" prop="submit_validate">
          <el-button :loading="loading" type="primary" class="submission" size="small" @click="handleSubmit('formDataRef')">提交</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
import { platformCommissionConfig } from '@/api/platformCommission'
export default {
  name: "platformCommissionConfig",
  components: { },
  data() {
    return {
      fullscreenLoading: false,
      loading: false,
      formData: Object.assign({}, {
        is_open: 0,
        commission_platform_rate: 0,
        commission_partner_rate: 0,
        commission_partner_cycle: 0,
        commission_merchants_rate: 0,
        commission_promoter_rate: 0,
        commission_integral_release_rate: 0,
      }),
      ruleValidate: {
        is_open: [{ required: true, message: "请选择是否开启平台抽成功能", trigger: "blur" }],
        commission_platform_rate: [{ required: true, message: "请输入平台分佣比例", trigger: "blur" }],
        commission_partner_rate: [{ required: true, message: "请输入合伙人分佣比例", trigger: "blur" }],
        commission_partner_cycle: [{ required: true, message: "请选择合伙人分佣结算周期", trigger: "blur" }],
        commission_merchants_rate: [{ required: true, message: "请输入招商员分佣比例", trigger: "blur" }],
        commission_promoter_rate: [{ required: true, message: "请输入推广员分佣比例", trigger: "blur" }],
        commission_integral_release_rate: [{ required: true, message: "请输入积分释放比例", trigger: "blur" }],
        submit_validate: [{
          validator: (rule, value, callback) => {
            // 判断：关闭状态-无需判断，开启状态-分红比例是否等于100
            let formData = Object.assign({},this.formData);
            if(formData.is_open == 1){
              let rateCount = (Number(formData.commission_platform_rate) +
                Number(formData.commission_partner_rate) +
                Number(formData.commission_merchants_rate) +
                Number(formData.commission_promoter_rate) +
                Number(formData.commission_integral_release_rate)).toFixed(2);
              if(rateCount != 100) callback(new Error('所有抽成分佣比例之和必须为100%'));
            }
            callback();
          }, trigger: 'blur'
        }]
      },
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {
      this.getInfo();
  },
  methods: {
    // 获取配置信息
    getInfo() {
      this.fullscreenLoading = true
      platformCommissionConfig().then(async res => {
        this.formData = res.data
        this.fullscreenLoading = false
      }).catch(res => {
        this.fullscreenLoading = false
        this.$message.error(res.message)
      })
    },
    // 提交
    handleSubmit(name) {
      this.$refs[name].validate(valid => {
        if (valid) {
          this.fullscreenLoading = true;
          this.loading = true;
          platformCommissionConfig(this.formData).then(async res => {
            this.fullscreenLoading = false
            this.getInfo();
            this.$message.success(res.message)
            this.loading = false
          }).catch(res => {
            this.fullscreenLoading = false
            this.loading = false
            this.$message.error(res.message)
          })
        }
      });
    },


  }
};
</script>
<style scoped lang="scss">
.form-item-tip{
  display: block;
  height: 20px;
  line-height: 20px;
  font-size: 13px;
  color: #b5b5b5;
}
</style>