JM-admin/src/view/marketManage/brokerage/index.vue

<script setup>
// 引入依赖
import api from '@/api/market'
import custom from '@/utils/custom'
import {formatDate} from '@/utils/format'
import _ from 'lodash'
import {ref,onMounted } from 'vue'
// 生命周期
onMounted(() => {
  // console.log(brokerageForm.value)
  getBrokerage()
})
// 变量
const brokerageForm = ref({})
const brokerageFormRules = ref({
  exam_assistant: [{ required: true, message: '请输入助教佣金', trigger: 'blur' }],
  exam_manage:[{ required: true, message: '请输入主管佣金', trigger: 'blur'},
  { type: 'number', message: '请输入正确的格式',trigger: 'blur' }],
  exam_teacher:[{ required: true, message: '请输入教师佣金', trigger: 'blur'},
  { type: 'number', message: '请输入正确的格式',trigger: 'blur' }],
  exam_assistant_assistant:[{ required: true, message: '请输入助教推荐助教佣金', trigger: 'blur'},
  { type: 'number', message: '请输入正确的格式' }],
  exam_assistant_teacher:[{ required: true, message: '请输入助教推荐老师佣金', trigger: 'blur'},
  { type: 'number', message: '请输入正确的格式' }],
  reward_first:[{ required: true, message: '请输入测试第一名佣金占比', trigger: 'blur' }],
  // reward_second:[{ required: true, message: '请输入测试第二名佣金占比', trigger: 'blur' }],
  // reward_third:[{ required: true, message: '请输入测试第三名佣金占比', trigger: 'blur' }],
  course_assistant:[{ required: true, message: '请输入助教佣金占比', trigger: 'blur' }],
  course_manage:[{ required: true, message: '请输入主管佣金占比', trigger: 'blur' }],
  course_teacher:[{ required: true, message: '请输入教师佣金占比', trigger: 'blur' }],
  course_assistant_assistant:[{ required: true, message: '请输入助教推荐助教佣金占比', trigger: 'blur' }],
  course_assistant_teacher:[{ required: true, message: '请输入助教推荐老师佣金占比', trigger: 'blur' }],
})
const brokerageFormRef = ref(null)
const std_percent_arr = ['course_assistant','course_manage','course_teacher','course_assistant_assistant','course_assistant_teacher','reward_first']
// 方法
async function getBrokerage() {
  const res = await api.getBrokerage()
  if(res.code === 0) {
    for(let prop in res.data) {
      if(!std_percent_arr.includes(prop)) {
        res.data[prop] = parseFloat((res.data[prop]/100).toFixed(2))
      }
    }
    brokerageForm.value = res.data
  }
}
async function submitForm(formEl) {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) { // 验证通过
      // console.log('submit!')
      saveData()
    } else {
      // console.log('请填写完整信息!', fields)
    }
  })
}
async function saveData() {
  const params = {
    ..._.cloneDeep(brokerageForm.value)
  }
  for(let prop in params) {
    if(!std_percent_arr.includes(prop)) {
      params[prop] = params[prop]*100
    }
  }
  const res = await api.brokerageFunc(params)
  if(res.code === 0) {
    ElMessage({
      type: 'success',
      message: res.msg
    })
    getBrokerage()
  }
}
</script>
<template>
  <div class="brokerage-box gva-table-box">
    <el-form ref="brokerageFormRef" class="form-box" :model="brokerageForm" :rules="brokerageFormRules" label-width="180px" style="width:50%">
      <el-form-item>测试题佣金设置</el-form-item>
      <el-form-item label="助教(元/份)" prop="exam_assistant">
          <el-input type="number" v-model.number="brokerageForm.exam_assistant" placeholder="请输入助教佣金" autocomplete="off" />
      </el-form-item>
      <el-form-item label="主管(元/份)" prop="exam_manage">
          <el-input type="number" v-model.number="brokerageForm.exam_manage" placeholder="请输入主管佣金" autocomplete="off" />
      </el-form-item>
      <el-form-item label="教师(元/份)" prop="exam_teacher">
          <el-input type="number" v-model.number="brokerageForm.exam_teacher" placeholder="请输入教师佣金" autocomplete="off" />
      </el-form-item>
      <el-form-item label="助教推荐助教(元/份)" prop="exam_assistant_assistant">
          <el-input type="number" v-model.number="brokerageForm.exam_assistant_assistant" placeholder="请输入助教推荐助教佣金" autocomplete="off" />
      </el-form-item>
      <el-form-item label="助教推荐老师(元/份)" prop="exam_assistant_teacher">
          <el-input type="number" v-model.number="brokerageForm.exam_assistant_teacher" placeholder="请输入助教推荐老师佣金" autocomplete="off" />
      </el-form-item>
      <el-form-item>邀请人佣金设置</el-form-item>
      <el-form-item label="测试第一名奖金分佣(%)" prop="reward_first">
          <el-input type="number" v-model.number="brokerageForm.reward_first" placeholder="请输入测试第一名奖金分佣佣金" autocomplete="off" />
      </el-form-item>
      <!-- <el-form-item label="测试第二名奖金分佣(%)" prop="reward_second">
          <el-input type="number" v-model.number="brokerageForm.reward_second" placeholder="请输入测试第二名奖金分佣佣金" autocomplete="off" />
      </el-form-item>
      <el-form-item label="测试第三名奖金分佣(%)" prop="reward_third">
          <el-input type="number" v-model.number="brokerageForm.reward_third" placeholder="请输入测试第三名奖金分佣佣金" autocomplete="off" />
      </el-form-item> -->
      <el-form-item>课程佣金设置</el-form-item>
      <el-form-item label="助教(%)" prop="course_assistant">
          <el-input type="number" v-model.number="brokerageForm.course_assistant" placeholder="请输入助教佣金占比" autocomplete="off" />
      </el-form-item>
      <el-form-item label="主管(%)" prop="course_manage">
          <el-input type="number" v-model.number="brokerageForm.course_manage" placeholder="请输入主管佣金占比" autocomplete="off" />
      </el-form-item>
      <el-form-item label="教师(%)" prop="course_teacher">
          <el-input type="number" v-model.number="brokerageForm.course_teacher" placeholder="请输入教师佣金占比" autocomplete="off" />
      </el-form-item>
      <el-form-item label="助教推荐助教(%)" prop="course_assistant_assistant">
          <el-input type="number" v-model.number="brokerageForm.course_assistant_assistant" placeholder="请输入助教推荐助教佣金占比" autocomplete="off" />
      </el-form-item>
      <el-form-item label="助教推荐老师(%)" prop="course_assistant_teacher">
          <el-input type="number" v-model.number="brokerageForm.course_assistant_teacher" placeholder="请输入助教推荐老师佣金占比" autocomplete="off" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm(brokerageFormRef)">保存</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<style lang="scss" scoped>

</style>