<template>
  <div class="salarySet">
    <!-- <h4>单次课次参考时长：30min</h4> -->
    <div class="tableList">
      <div class="left">
        <el-table :data='teamTable'
                  :header-cell-style="{background:'#EDEEF0',color:'#444'}">
          <el-table-column label="乐团课课酬课时结算">
            <template slot-scope="scope">
              {{ scope.row.courseScheduleType | coursesType }}
            </template>
          </el-table-column>
          <el-table-column label="默认课酬-主教">
            <template slot-scope="scope">
              <el-input :disabled="scope.row.courseScheduleType == 'HIGH'" v-model="scope.row.mainTeacher30MinSalary" placeholder="请输入课酬">
                <template slot="append" v-if="scope.row.courseScheduleType == 'HIGH'">元/45分钟</template>
                <template slot="append" v-else-if="scope.row.courseScheduleType == 'CLASSROOM'">元/40分钟</template>
                <template slot="append" v-else>元/30分钟</template>
              </el-input>
            </template>
          </el-table-column>
          <el-table-column label="默认课酬-助教">
            <template slot-scope="scope">
              <el-input :disabled="scope.row.courseScheduleType == 'HIGH'" v-model="scope.row.assistantTeacher30MinSalary" placeholder="请输入课酬">
                <template slot="append" v-if="scope.row.courseScheduleType == 'HIGH'">元/45分钟</template>
                <template slot="append" v-else-if="scope.row.courseScheduleType == 'CLASSROOM'">元/40分钟</template>
                <template slot="append" v-else>元/30分钟</template>
              </el-input>
            </template>
          </el-table-column>
          <el-table-column label="3.0课酬-主教">
            <template slot-scope="scope">
              <el-input :disabled="scope.row.courseScheduleType == 'CLASSROOM'" v-model="scope.row.mainTeacher90MinSalary" placeholder="请输入课酬">
                <template slot="append" v-if="scope.row.courseScheduleType == 'HIGH'">元/45分钟</template>
                <template slot="append" v-else-if="scope.row.courseScheduleType == 'CLASSROOM'">元/40分钟</template>
                <template slot="append" v-else>元/90分钟</template>
                <!-- <template slot="append">元/{{ (scope.row.courseScheduleType == 'HIGH' || scope.row.courseScheduleType == 'CLASSROOM') ? 45 : 90 }}分钟</template> -->
              </el-input>
            </template>
          </el-table-column>
          <el-table-column label="3.0课酬-助教">
            <template slot-scope="scope">
              <el-input :disabled="scope.row.courseScheduleType == 'CLASSROOM'" v-model="scope.row.assistantTeacher90MinSalary" placeholder="请输入课酬">
                <template slot="append" v-if="scope.row.courseScheduleType == 'HIGH'">元/45分钟</template>
                <template slot="append" v-else-if="scope.row.courseScheduleType == 'CLASSROOM'">元/40分钟</template>
                <template slot="append" v-else>元/90分钟</template>
                <!-- <template slot="append">元/{{ (scope.row.courseScheduleType == 'HIGH' || scope.row.courseScheduleType == 'CLASSROOM') ? 45 : 90 }}分钟</template> -->
              </el-input>
            </template>
          </el-table-column>
        </el-table>

        <el-table :data='vipTable' style="width: 70%; margin-top: 15px;"
                  :header-cell-style="{background:'#EDEEF0',color:'#444'}">
          <el-table-column label="VIP课课酬参考值" prop="vipGroupCategoryName">
          </el-table-column>
          <el-table-column label="线上课">
            <template slot-scope="scope">
              <el-input v-model="scope.row.onlineClassesSalary" placeholder="请输入内容">
                <template slot="append">元/30分钟</template>
              </el-input>
            </template>
          </el-table-column>
          <el-table-column label="线下课">
            <template slot-scope="scope">
              <el-input v-model="scope.row.offlineClassesSalary" placeholder="请输入内容">
                <template slot="append">元/30分钟</template>
              </el-input>
            </template>
          </el-table-column>
        </el-table>

        <div style="padding-top: 10px;">
          <el-button @click="onSave()" type="primary">保存</el-button>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { vipGroupSalaryList, vipGroupSalarySet, teacherSalaryList, teacherSalaryBatchUpset } from '@/api/teacherManager'
import { sysConfigList } from '@/api/generalSettings'
import { vipGroupCategory } from '@/api/vipSeting'
export default {
  props: ['teacherId'],
  data () {
    return {
      // teacherId: this.teacherId ? this.teacherId : this.$route.query.teacherId,
      teamTable: [{
        assistantTeacher30MinSalary: 0,
        assistantTeacher90MinSalary: 0,
        courseScheduleType: "SINGLE",
        mainTeacher30MinSalary: 0,
        mainTeacher90MinSalary: 0,
        userId: this.teacherId,
      },{
        assistantTeacher30MinSalary: 0,
        assistantTeacher90MinSalary: 0,
        courseScheduleType: "MIX",
        mainTeacher30MinSalary: 0,
        mainTeacher90MinSalary: 0,
        userId: this.teacherId
      },{
        assistantTeacher30MinSalary: 0,
        assistantTeacher90MinSalary: 0,
        courseScheduleType: "COMPREHENSIVE",
        mainTeacher30MinSalary: 0,
        mainTeacher90MinSalary: 0,
        userId: this.teacherId
      },{
        assistantTeacher30MinSalary: 0,
        assistantTeacher90MinSalary: 0,
        courseScheduleType: "TRAINING_SINGLE",
        mainTeacher30MinSalary: 0,
        mainTeacher90MinSalary: 0,
        userId: this.teacherId
      },{
        assistantTeacher30MinSalary: 0,
        assistantTeacher90MinSalary: 0,
        courseScheduleType: "TRAINING_MIX",
        mainTeacher30MinSalary: 0,
        mainTeacher90MinSalary: 0,
        userId: this.teacherId
      },{
        assistantTeacher30MinSalary: 0,
        assistantTeacher90MinSalary: 0,
        courseScheduleType: "HIGH",
        mainTeacher30MinSalary: 0,
        mainTeacher90MinSalary: 0,
        userId: this.teacherId
      }, {
        assistantTeacher30MinSalary: 0,
        assistantTeacher90MinSalary: 0,
        courseScheduleType: "CLASSROOM",
        mainTeacher30MinSalary: 0,
        mainTeacher90MinSalary: 0,
        userId: this.teacherId
      }],
      vipTable: [],
      musicGroupTable: [],
      ruleList: [],
      vipList: []
    }
  },
  mounted() {
    this.__init()
  },
  methods: {
    __init() {
      // 获取课程形态 设置vip课酬
      vipGroupCategory({ organId: this.$store.getters.organ }).then(res => {
        if (res.code == 200 && res.data.length > 0) {
          let vipData = []
          res.data.forEach(item => {
            vipData.push({
              offlineClassesSalary: null,
              onlineClassesSalary: null,
              vipGroupCategoryId: item.id,
              vipGroupCategoryName: item.name,
              userId: this.teacherId
            })
          })
          // VIP课列表
          vipGroupSalaryList({
            rows: 9999,
            page: 1,
            search: this.teacherId
          }).then(res => {
            if(res.code == 200) {
              let rows = res.data.rows
              this.vipListCompare(vipData, rows)
            }
          })
        }
      })
      // 乐团
      teacherSalaryList({
        rows: 9999,
        page: 1,
        teacherId: this.teacherId,
        // settlementType: 'FIXED_SALARY'
      }).then(res => {
        if(res.code == 200) {
          // this.teamTable = res.data.rows
          let rows = res.data.rows
          this.teacherSalaryMoney(rows)
        }
      })

    },
    vipListCompare(vipData, rows) { // vip 做对比
      if(!rows) { // 判断是否有数据
        this.vipTable = vipData
        return
      }
      let result = []
      vipData.forEach(item => {
        rows.forEach(c => {
          if(item.vipGroupCategoryId == c.vipGroupCategoryId) {
            item.checked = true
            result.push({
              vipGroupCategoryId: c.vipGroupCategoryId,
              offlineClassesSalary: c.offlineClassesSalary,
              onlineClassesSalary: c.onlineClassesSalary,
              vipGroupCategoryName: c.vipGroupCategoryName,
              userId: c.userId
            })
          }
        })
      })
      if(result.length > 0) {
        vipData.forEach(item => {
          if(!item.checked) {
            result.push(item)
          }
        })
      } else {
        result = vipData
      }
      this.vipTable = result
    },

    teacherSalaryMoney(rows) {
      // 判断是否有数据
      if(!rows || rows.length <= 0) return
      let teamTable = this.teamTable
      let result = []
      teamTable.forEach(item => {
        rows.forEach(c => {
          if(item.courseScheduleType == c.courseScheduleType) {
            item.checked = true
            result.push({
              mainTeacher30MinSalary: c.mainTeacher30MinSalary,
              mainTeacher90MinSalary: c.mainTeacher90MinSalary,
              assistantTeacher30MinSalary: c.assistantTeacher30MinSalary,
              assistantTeacher90MinSalary: c.assistantTeacher90MinSalary,
              courseScheduleType: c.courseScheduleType,
              userId: this.teacherId,
            })
          }
        })
      })
      if(result.length > 0) {
        teamTable.forEach(item => {
          if(!item.checked) {
            result.push(item)
          }
        })
      } else {
        result = teamTable
      }
      this.teamTable = result
    },
    onSave() {
      let teamTable = this.teamTable
      let checkStatus = true
      teamTable.forEach(item => {
        if(item.assistantTeacher30MinSalary < 0 || item.assistantTeacher90MinSalary < 0 
          || item.mainTeacher30MinSalary < 0 || item.mainTeacher90MinSalary < 0) {
          this.$message('输入课酬不能为负数')
          checkStatus = false
        } 
      })
      this.vipTable.forEach(item => {
          if(item.offlineClassesSalary < 0 && item.onlineClassesSalary < 0) {
            this.$message('输入课酬不能为负数')
            checkStatus = false
          }
        })
      // 判断输入的值是否正确
      if(!checkStatus) return false
      teacherSalaryBatchUpset(teamTable).then(res => {
        if(res.code == 200) {
          
          // 判断输入的值是否正确
          // if(!checkStatus) return false
          vipGroupSalarySet(this.vipTable).then(res => {
            if(res.code == 200) {
              this.$message({
                message: '保存成功',
                type: 'success'
              })

              // if(this.$route.query.type == 'create') {
                this.$router.push('/business/teacherList')
              // }
            }
          })
        }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.salarySet {
  h3 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 14px;
    color: #444;
    font-weight: normal;
  }
  .tableList {
    .left, .right {
      float: left;
    }
    .left {
      width: 70%;
      margin-right: 2%;
    }
    .right {
      width: 56%;
      margin-left: 2%;
    }
  }
}

/deep/.el-table__body {
  tr {
    td:nth-child(3) {
      border-right: 1px solid #EBEEF5;
    }
  }
}
/deep/.el-input-group__append {
    background-color: #F5F7FA;
    color: #909399;
    vertical-align: middle;
    display: table-cell;
    position: relative;
    border: 1px solid #DCDFE6;
    border-left: 0;
}
</style>