dy-admin-manager/src/views/teamBuild/teamSeting/components/salarySet.vue

<template>
  <div class='salary-container'>
    <!--   v-if="!hasDate" -->
    <el-form :inline="true"
             :model="searchForm">
      <el-form-item label="课酬结算标准">
        <el-select v-model.trim="searchForm.salary"
                   clearable
                   filterable
                   @change="changeSalary">
          <el-option label="默认课酬"
                     value="TEACHER_DEFAULT"></el-option>
          <el-option label="3.0课酬"
                     value="GRADIENT_SALARY"></el-option>
          <el-option label="课堂课课酬"
                     value="CLASSROOM_SALARY"></el-option>
        </el-select>
      </el-form-item>
    </el-form>
    <div class="tableWrap"
         v-if='searchForm.salary == "TEACHER_DEFAULT" || searchForm.salary =="CLASSROOM_SALARY"'>
      <el-table :data="defaultTableList"
                :header-cell-style="{background:'#EDEEF0',color:'#444'}"
                row-key="id"
                border
                default-expand-all
                :tree-props="{children: 'classGroupTeacherMapperList', hasChildren: 'hasChildren'}">
        <el-table-column label="班级名称"
                         width="180px"
                         prop='name'>
        </el-table-column>
        <el-table-column label="老师名称"
                         width="180px"
                         prop='userName'>
        </el-table-column>
        <el-table-column label="老师类型"
                         width="180px"
                         prop="teacherRole">
          <template slot-scope="scope">
            <div>
              {{ scope.row.teacherRole|workType}}
            </div>
          </template>
        </el-table-column>

        <el-table-column label="金额">

          <template slot-scope="scope">
            <div v-if="scope.row.teacherDefaultMusicGroupSalaryList&&scope.row.teacherDefaultMusicGroupSalaryList[0]&&scope.row.teacherDefaultMusicGroupSalaryList[0]">
              <span>课酬:</span>
              <!-- &&scope.row.teacherDefaultMusicGroupSalaryList[0].mainTeacherSalary &&scope.row.teacherDefaultMusicGroupSalaryList[0].mainTeacherSalary-->
              <el-input style="width: 80px;margin-right:10px"
                        :disabled="true"
                        v-if='scope.row.teacherDefaultMusicGroupSalaryList&&scope.row.teacherDefaultMusicGroupSalaryList[0]&&scope.row.teacherRole =="TEACHING"'
                        v-model.trim="scope.row.teacherDefaultMusicGroupSalaryList[0].assistantTeacher30MinSalary"></el-input>
              <el-input style="width: 80px;margin-right:10px"
                        :disabled="true"
                        v-if='scope.row.teacherDefaultMusicGroupSalaryList&&scope.row.teacherDefaultMusicGroupSalaryList[0]&&scope.row.teacherRole =="BISHOP"'
                        v-model.trim="scope.row.teacherDefaultMusicGroupSalaryList[0].mainTeacher30MinSalary"></el-input>
            </div>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="tableWrap"
         v-if='searchForm.salary == "GRADIENT_SALARY"'>
      <el-table :data="gradientTableList"
                :header-cell-style="{background:'#EDEEF0',color:'#444'}"
                row-key="id"
                border
                default-expand-all
                :tree-props="{children: 'classGroupTeacherMapperList', hasChildren: 'hasChildren'}">
        <el-table-column label="班级名称"
                         width="180px"
                         prop='name'>
        </el-table-column>
        <el-table-column label="老师名称"
                         width="180px"
                         prop='userName'>
        </el-table-column>
        <el-table-column label="老师类型"
                         width="180px"
                         prop="teacherRole">
          <template slot-scope="scope">
            <div>
              {{ scope.row.teacherRole|workType}}
            </div>
          </template>
        </el-table-column>

        <el-table-column label="金额">

          <template slot-scope="scope">
            <div v-if='scope.row.teacherDefaultMusicGroupSalaryList'>
              <div v-for="(item,index) in scope.row.teacherDefaultMusicGroupSalaryList"
                   style="display: table-cell;"
                   :key='item.id'>
                <div v-if="scope.row.teacherRole =='TEACHING'">
                  <span>课酬:</span>
                  <el-input style="width: 80px;margin-right:10px"
                            :disabled="true"
                            v-model.trim="scope.row.teacherDefaultMusicGroupSalaryList[index].assistantTeacher90MinSalary"></el-input>
                </div>
                <!-- 梯度{{index+1}}: -->
                <div v-if="scope.row.teacherRole =='BISHOP'">
                  <span>课酬:</span>
                  <el-input style="width: 80px;margin-right:10px"
                            :disabled="true"
                            v-model.trim="scope.row.teacherDefaultMusicGroupSalaryList[index].mainTeacher90MinSalary"></el-input>
                </div>
              </div>

              <!-- <div v-for="(item,index) in scope.row.teacherDefaultMusicGroupSalaryList"
                   v-if="scope.row.teacherRole =='BISHOP'"
                   style="display: table-cell;"
                   :key='index'>

              </div> -->

              <!-- <el-input v-if='scope.row.teacherDefaultMusicGroupSalaryList&&scope.row.teacherDefaultMusicGroupSalaryList[0]&&scope.row.teacherDefaultMusicGroupSalaryList[0].mainTeacherSalary&&scope.row.teacherRole =="TEACHING"'
                        v-model.trim="scope.row.teacherDefaultMusicGroupSalaryList[0].mainTeacherSalary"></el-input>
              <el-input v-if='scope.row.teacherDefaultMusicGroupSalaryList&&scope.row.teacherDefaultMusicGroupSalaryList[0]&&scope.row.teacherDefaultMusicGroupSalaryList[0].mainTeacherSalary&&scope.row.teacherRole =="BISHOP"'
                        v-model.trim="scope.row.teacherDefaultMusicGroupSalaryList[0].assistantTeacherSalary"></el-input> -->
            </div>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!-- 确认取消 -->
    <div class="btnWrap"
         style="margin-top:40px;">
      <div class="nextBtn"
           @click='gotoNext'>确定</div>
      <!-- <div class="okBtn">返回</div> -->
    </div>
  </div>
</template>
<script>
import { findMusicGroupClassTeacherSalary, setClassGroupTeacherSalary, getTeamDetail } from '@/api/buildTeam'
import { format } from 'path'
export default {
  name: 'salarySet',
  props: {
    teamid: {
      type: String,
      required: true
    },
    isSetSalary: {
      type: Boolean,
      required: true
    }
  },
  data () {
    return {
      searchForm: {
        salary: ''
      },
      defaultTableList: [],
      gradientTableList: [],
      subList: [],
      isok: true,
      hasDate: false,
      Fsearch: null,
      Frules: null,
    }
  },
  created () {
    // 判断是否带缓存参数
    if (this.$route.query.search) {
      this.Fsearch = this.$route.query.search;
    }
    if (this.$route.query.rules) {
      this.Frules = this.$route.query.rules
    }
  },
  mounted () {
    getTeamDetail({ musicGroupId: this.teamid }).then(res => {
      if (res.code == 200) {
        this.searchForm.salary = res.data.settlementType;
        this.changeSalary(this.searchForm.salary);
        if (!res.data.settlementType) {
          this.hasDate = true;
        }
        // if (this.searchForm.salary == 'TEACHER_DEFAULT') {
        //   findMusicGroupClassTeacherSalary({ musicGroupId: this.teamid, type: 'TEACHER_DEFAULT' }).then(res => {
        //     if (res.code == 200) {
        //       this.defaultTableList = res.data;
        //       this.changeSalary(this.searchForm.salary);
        //     }
        //   })
        // } else if (this.searchForm.salary == 'GRADIENT_SALARY') {
        //   findMusicGroupClassTeacherSalary({ musicGroupId: this.teamid, type: 'GRADIENT_SALARY' }).then(res => {
        //     if (res.code == 200) {
        //       this.gradientTableList = res.data;
        //       this.changeSalary(this.searchForm.salary);
        //     }
        //   })
        // } else if (this.searchForm.salary == 'CLASSROOM_SALARY') {
        //   findMusicGroupClassTeacherSalary({ musicGroupId: this.teamid, type: 'CLASSROOM_SALARY' }).then(res => {
        //     if (res.code == 200) {
        //       this.defaultTableList = res.data;
        //       this.changeSalary(this.searchForm.salary);
        //     }
        //   })
        // }
      }
    })
    // 获取乐团收费类型

    // 获取默认老师列表 类型为默认
    // GRADIENT_SALARY

    // 类型为梯度

  }, methods: {
    gotoNext () {
      if (this.isSetSalary) {
        this.$message.error('课酬确认后无法编辑')
        return;
      }
      if (!this.isok) {
        this.$message.error('有老师未设置默认课酬,请设置后再试')
      }
      if (this.searchForm.salary == 'TEACHER_DEFAULT' || this.searchForm.salary == 'CLASSROOM_SALARY') {
        // 组件默认课酬
        for (let i in this.defaultTableList) {
          for (let j in this.defaultTableList[i].classGroupTeacherMapperList) {
            let obj = {}
            obj.musicGroupId = this.teamid;
            obj.classGroupId = this.defaultTableList[i].id;
            obj.userId = this.defaultTableList[i].classGroupTeacherMapperList[j].userId;
            obj.teacherRole = this.defaultTableList[i].classGroupTeacherMapperList[j].teacherRole;
            obj.teacherDefaultMusicGroupSalaryList = this.defaultTableList[i].classGroupTeacherMapperList[j].teacherDefaultMusicGroupSalaryList;
            this.subList.push(obj);
          }
        }

      } else if (this.searchForm.salary == 'GRADIENT_SALARY') {
        // 组件梯度课酬
        for (let i in this.gradientTableList) {
          for (let j in this.gradientTableList[i].classGroupTeacherMapperList) {
            let obj = {}
            obj.musicGroupId = this.teamid;
            obj.classGroupId = this.gradientTableList[i].id;
            obj.userId = this.gradientTableList[i].classGroupTeacherMapperList[j].userId;
            obj.teacherRole = this.gradientTableList[i].classGroupTeacherMapperList[j].teacherRole;
            obj.teacherDefaultMusicGroupSalaryList = this.gradientTableList[i].classGroupTeacherMapperList[j].teacherDefaultMusicGroupSalaryList;
            this.subList.push(obj);
          }
        }
      }
      // let some = {

      //   teacherDefaultMusicGroupSalaryList: this.subList
      // }
      setClassGroupTeacherSalary(this.subList).then(res => {
        if (res.code == 200) {
          this.subList = [];
          this.$message.success('恭喜您设置成功');
          this.$router.push({ path: '/teamList', query: { search: this.Fsearch, rules: this.Frules } })
        }
      }).catch(res => {
        this.$message.error('提交失败')
        this.subList = [];
      })
    },
    changeSalary (val) {
      this.searchForm.salary = val;
      // this.hasDate = false;
      this.getList()
      return
      if (val == 'TEACHER_DEFAULT') {
        for (let i in this.defaultTableList) {
          for (let j in this.defaultTableList[i].classGroupTeacherMapperList) {
            if (this.defaultTableList[i].classGroupTeacherMapperList[j].teacherDefaultMusicGroupSalaryList.length <= 0 || this.defaultTableList[i].classGroupTeacherMapperList[j].teacherDefaultMusicGroupSalaryList) {
              this.$message.error('还有老师课酬未设置')
              this.isok = false;
              return
            }
          }
        }

      } else if (val == 'GRADIENT_SALARY') {
        for (let i in this.gradientTableList) {
          for (let j in this.gradientTableList[i].classGroupTeacherMapperList) {
            if (this.gradientTableList[i].classGroupTeacherMapperList[j].teacherDefaultMusicGroupSalaryList.length <= 0 || this.gradientTableList[i].classGroupTeacherMapperList[j].teacherDefaultMusicGroupSalaryList) {
              this.$message.error('还有老师课酬未确认')
              this.isok = false;
              return
            }
          }
        }
      }
    },
    getList () {
      getTeamDetail({ musicGroupId: this.teamid }).then(res => {
        if (res.code == 200) {

          // this.searchForm.salary = res.data.settlementType;
          if (this.searchForm.salary == 'TEACHER_DEFAULT') {
            findMusicGroupClassTeacherSalary({ musicGroupId: this.teamid, type: 'TEACHER_DEFAULT' }).then(res => {
              if (res.code == 200) {
                this.defaultTableList = res.data;
                // this.changeSalary(this.searchForm.salary);
              }
            })
          } else if (this.searchForm.salary == 'GRADIENT_SALARY') {
            findMusicGroupClassTeacherSalary({ musicGroupId: this.teamid, type: 'GRADIENT_SALARY' }).then(res => {
              if (res.code == 200) {
                this.gradientTableList = res.data;
                // this.changeSalary(this.searchForm.salary);
              }
            })
          } else if (this.searchForm.salary == 'CLASSROOM_SALARY') {
            findMusicGroupClassTeacherSalary({ musicGroupId: this.teamid, type: 'CLASSROOM_SALARY' }).then(res => {
              if (res.code == 200) {
                this.defaultTableList = res.data;
                // this.changeSalary(this.searchForm.salary);
              }
            })
          }
        }
      })
    }
  },
}
</script>
<style lang="scss">
.salary-container {
  padding: 47px 58px;
  background-color: #fff;
  min-height: 75vh;
}
</style>