<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="12">
            <a-form-model-item label="工资月份" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="salaryMonth">
              <a-month-picker v-model="model.salaryMonth" placeholder="请选择工资月份" />
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item style="width: 630px;" label="当月工作总天数" :labelCol="labelCol" :wrapperCol="wrapperCol"
              prop="workingDays" >
              <a-input-number style="width: 180px;" v-model="model.workingDays" :min="0" :max="99" :step="0.5"
                placeholder="请输入当月工作总天数" @blur="working"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="姓名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="userName">
              <a-input v-model="model.userName" placeholder="请输入姓名"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="身份证号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="idCard">
              <a-input v-model="model.idCard" placeholder="请输入身份证号"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="银行卡号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="bankCard">
              <a-input v-model="model.bankCard" placeholder="请输入银行卡号"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="工作职位" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="jobTitle">
              <a-select ref="select" v-model="model.jobTitle" placeholder="请输入工作职位" style="width: 285px"
              @change="handleChange">
                <a-select-option value="officeAdministrative">办公室行政人员</a-select-option>
                <a-select-option value="workshopDirector">车间主任</a-select-option>
                <a-select-option value="workshopGeneralWorker">车间普工</a-select-option>
                <a-select-option value="otherWorker">其他</a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col v-if="model.jobTitle === 'workshopDirector' || model.jobTitle === 'workshopGeneralWorker'" :span="12">
            <a-form-model-item label="工时" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workingHours">
              <a-input v-model="model.workingHours" placeholder="请输入工时" @blur="setWorkingHours"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="基本工资" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="basicSalary">
              <a-input v-model="model.basicSalary" :readOnly="model.jobTitle != 'otherWorker'" placeholder="请输入基本工资" @blur="jbgz" class="input_dis"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">  
            <!-- @blur="autoInput" -->
            <a-form-model-item label="工作天数" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="day">
              <a-input-number style="width: 180px;" id="inputNumber" placeholder="请输入工作天数" 
                v-model="model.day" :step="0.5" :min="0" :max="99" @blur="setDay"/>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="绩效工资" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="meritPay">
              <a-input v-model="model.meritPay" :readOnly="model.jobTitle != 'otherWorker'" placeholder="请输入绩效工资" @blur="jxgz" class="input_dis"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="总工资" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="totalWages">
              <a-input v-model="model.totalWages" :readOnly="model.jobTitle != 'otherWorker'" placeholder="请输入总工资" @blur="zgz" class="input_dis"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="餐费补助" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="mealAllowance">
              <a-input v-model="model.mealAllowance" readOnly placeholder="请输入餐费补助" class="input_dis"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="全勤奖" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="fullAttendanceAward">
              <a-input v-model="model.fullAttendanceAward" placeholder="请输入全勤奖" @blur="qqj"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="社保公司" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="socialCompany">
              <a-input v-model="model.socialCompany" placeholder="请输入社保公司" @blur="sbgs"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="社保个人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="socialPerson">
              <a-input v-model="model.socialPerson" placeholder="请输入社保个人" @blur="sbgr"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="减项" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="deduction">
              <a-input v-model="model.deduction" @blur="deduc" placeholder="请输入减项"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="补项" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="supplementary">
              <a-input v-model="model.supplementary" @blur="mentary" placeholder="请输入补项"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="应发工资" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="salariesPayable">
              <a-input v-model="model.salariesPayable" :readOnly="model.jobTitle != 'otherWorker'" placeholder="请输入应发工资" @blur="setSalariesPayable" class="input_dis"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="个税" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="personalTax">
              <a-input v-model="model.personalTax" readOnly placeholder="请输入个税" class="input_dis"></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="12">
            <a-form-model-item label="实发工资" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="netSalary">
              <a-input v-model="model.netSalary" :readOnly="model.jobTitle != 'otherWorker'" placeholder="请输入实发工资" class="input_dis"></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

import { httpAction, getAction } from '@/api/manage'
import { message } from 'ant-design-vue';
export default {
  name: 'TblSalaryCalculationForm',
  components: {
  },
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false
    }
  },
  data() {
    return {
      model: {
        workingHours: undefined,//工时
        jobTitle: undefined,// 工作职位
        meritPay: 0, // 绩效工资
        totalWages: 0, // 总工资
        mealAllowance: 0, // 餐费补助
        basicSalary: 2000,  // 基本工资
        salariesPayable: 0,
        socialCompany: 990.2, // 社保公司
        socialPerson: 397.89, // 社保个人
        fullAttendanceAward: 200, // 全勤奖
        personalTax: 0,// 个税
        netSalary:0,// 实发工资
      },
      // basicSalary:0,//基本工资
      // meritPay:0,//绩效工资
      // deduction: 0,// 减项
      // laborCost: 0,//工时费
      // supplementary: 0,// 补项
      // day: 0, // 工作天数
      // jobTitle: '',//工作职位
      // workingDays: 0,//当月工作总天数
      // fullAttendanceAward:0,//全勤奖
      // socialcompany: 0,// 社保公司
      // socialperson: 0,// 社保个人
      flg: false,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      confirmLoading: false,
      validatorRules: {
        salaryMonth: [{ required: true, message: '请选择工资月份!' }],
        userName: [{ required: true, message: '请输入姓名!' }],
        idCard: [{ required: true, message: '请输入身份证号!' }],
        bankCard: [{ required: true, message: '请输入银行卡号!' }],
        basicSalary: [{ required: true, message: '请输入基本工资!' }],
        day: [{ required: true, message: '请输入天数!' }],
        workingDays: [{ required: true, message: '请输入当月工作总天数!' }],
        meritPay: [{ required: true, message: '请输入绩效工资!' }],
        jobTitle: [{ required: true, message: '请输入工作职位!' }],
        totalWages: [{ required: true, message: '请输入总工资!' }],
        mealAllowance: [{ required: true, message: '请输入餐费补助!' }],
        fullAttendanceAward: [{ required: true, message: '请输入全勤奖!' }],
        socialCompany: [{ required: true, message: '请输入社保公司!' }],
        socialPerson: [{ required: true, message: '请输入社保个人!' }],
        deduction: [{ required: true, message: '请输入减项!' }],
        supplementary: [{ required: true, message: '请输入补项!' }],
        salariesPayable: [{ required: true, message: '请输入应发工资!' }],
        personalTax: [{ required: true, message: '请输入个税!' }],
        netSalary: [{ required: true, message: '请输入实发工资!' }],
        workingHours: [{ required: true, message: '请输入工时!' }],
      },
      url: {
        add: "/salary/calculation/add",
        edit: "/salary/calculation/edit",
        queryById: "/salary/calculation/queryById"
      }
    }
  },
  computed: {
    formDisabled() {
      return this.disabled
    },
  },
  created() {
    //备份model原始值
    this.modelDefault = JSON.parse(JSON.stringify(this.model));
  },
  methods: {
    // 判断检测
    judgmentDetection() {
      if (this.model.workingDays === undefined) {
        message.warning('当月工作总天数不可为空');
      } else if (this.model.basicSalary === undefined) {
        message.warning('工作职位不可为空');
      } else if (this.model.day === undefined) {
        message.warning('工作天数不可为空');
      } else {
        this.calculatePerformancePay()
      }
    },
    // 计算工资
    calculatePerformancePay() {

      // 绩效工资
      this.getMeritPay()
      // 总工资
      this.gettotalWages()
      // 餐费补助
      this.getMealAllowance()
      // 应发工资 
      this.getSalariesPayable()
      // 个税 
      this.getPersonalTaxAndPay()
      // 实发工资
      this.getNetSalary()
      
    },
    // 绩效工资
    getMeritPay(){
      if (this.model.jobTitle === 'officeAdministrative') {
        // 办公室行政人员
        // let str = Number((3500 / this.model.workingDays) * this.model.day - this.model.basicSalary);
        let str = Number((3500 / 26) * this.model.day - this.model.basicSalary);
        this.model.meritPay = str.toFixed(1);
        // 车间主任
      } else if (this.model.jobTitle === 'workshopDirector') {
        let str = parseFloat(this.laborCost) - parseFloat(this.model.basicSalary);
        this.model.meritPay = str;
        // 车间普工  
      } else if (this.model.jobTitle === 'workshopGeneralWorker') {
        let str = parseFloat(this.laborCost) - parseFloat(this.model.basicSalary);
        this.model.meritPay = str;
      }
    },
    // 总工资
    gettotalWages(){
      let num = parseInt(this.model.basicSalary) + parseFloat(this.model.meritPay);
      this.model.totalWages = num.toFixed(1);
    },
    // 餐费补助
    getMealAllowance(){
      this.model.mealAllowance = 25 * parseInt(this.model.day);
    },
    // 应发工资
    getSalariesPayable(){
      let yfgz = parseFloat(this.model.totalWages) + parseFloat(this.model.mealAllowance) + parseFloat(this.model.fullAttendanceAward) + parseFloat(this.model.supplementary) - parseFloat(this.model.socialPerson) - parseFloat(this.model.deduction);
      this.model.salariesPayable = parseInt(yfgz);
    },
    // 个税
    getPersonalTaxAndPay(){
      var sz = [];
      sz.push(((parseInt(this.model.salariesPayable) - 5000) * 0.03) - 0);
      sz.push((parseInt(this.model.salariesPayable) - 5000) * 0.1 - 210);
      sz.push((parseInt(this.model.salariesPayable) - 5000) * 0.2 - 1410);
      sz.push((parseInt(this.model.salariesPayable) - 5000) * 0.25 - 2660);
      sz.push((parseInt(this.model.salariesPayable) - 5000) * 0.3 - 4410);
      sz.push((parseInt(this.model.salariesPayable) - 5000) * 0.35 - 7160);
      sz.push((parseInt(this.model.salariesPayable) - 5000) * 0.45 - 15160);
      let maxNum = Math.max(...sz);
      if(maxNum < 0){
        maxNum = 0;
      }
      this.model.personalTax = maxNum.toFixed(2);
    },
    // 实发工资
    getNetSalary(){
      let sfgz = parseInt(this.model.salariesPayable) - parseFloat(this.model.personalTax);
      this.model.netSalary = sfgz.toFixed(0);
    },
    // 选择职位
    handleChange(value) {
    // console.log(value)
    // this.model = {
    //       workingHours: undefined,
    //       jobTitle: undefined,
    //       meritPay: 0, // 绩效工资
    //       totalWages: 0, // 总工资
    //       mealAllowance: 0, // 餐费补助
    //       basicSalary: 0,  // 基本工资
    //       salariesPayable: 0,
    //       deduction: 0, // 减项
    //       supplementary: 0, // 补项
    //       socialCompany: 0, // 社保公司
    //       socialPerson: 0, // 社保个人
    //       fullAttendanceAward: 0, // 全勤奖
    //       personalTax: 0,// 个税
    //       netSalary:0,// 实发工资
    //     }
    //     this.model.jobTitle = value
    //     this.flg = false
      // 办公室行政人员
      if (value === 'officeAdministrative') {
        this.model.basicSalary = 3500;
        // 车间主任
      } else if (value === 'workshopDirector') {
        this.model.basicSalary = 3000;
        // 车间普工  
      } else if (value === 'workshopGeneralWorker') {
        this.model.basicSalary = 2000;
      }else if(value === 'otherWorker'){
        this.model.workingHours= undefined,
        this.model.meritPay= 0, // 绩效工资
        this.model.totalWages= 0, // 总工资
        this.model.mealAllowance= 0, // 餐费补助
        this.model.basicSalary= 0,  // 基本工资
        this.model.salariesPayable= 0,
        this.model.deduction= 0, // 减项
        this.model.supplementary= 0, // 补项
        this.model.socialCompany= 0, // 社保公司
        this.model.socialPerson= 0, // 社保个人
        this.model.fullAttendanceAward= 0, // 全勤奖
        this.model.personalTax= 0,// 个税
        this.model.netSalary=0,// 实发工资
        this.flg = false
      }
      console.log(this.model.jobTitle)
      if (this.flg) {
        this.judgmentDetection();
      }
    },
    // 根据工时计算工时费
    setWorkingHours() {
      if(this.model.jobTitle == 'otherWorker'){
        // 餐补
        // this.getMealAllowance()
        // 应发工资 
        this.getSalariesPayable()
        // 个税 
        this.getPersonalTaxAndPay()
        // 实发工资
        this.getNetSalary()
        return
      }
      if(this.model.jobTitle === 'workshopDirector'){
            this.laborCost = (this.model.day > 0 && this.model.workingHours > 0) ? Math.round(this.model.workingHours * 0.5) : this.model.basicSalary
      }else if(this.model.jobTitle === 'workshopGeneralWorker'){
        if(this.model.day == 0 && this.model.workingHours == 0){
          // console.log('111111')
          this.laborCost = this.model.basicSalary
        }else if(this.model.day > 0 && this.model.workingHours > 0){
          // console.log('222222222')
          this.laborCost = this.model.day >= 26 ? (this.model.workingHours * 3.3).toFixed(0) : (this.model.workingHours * 3.2).toFixed(0)
        }
      }
      
      if((this.model.jobTitle === 'workshopDirector' || this.model.jobTitle === 'workshopGeneralWorker') && ((this.model.workingHours == 0 && this.model.day == 0) || (this.model.workingHours > 0 && this.model.day > 0))){
          // console.log('3333333')
          this.flg = true
          this.judgmentDetection()
        }else if(this.model.jobTitle === 'officeAdministrative'){
          // console.log('444444444')
          this.flg = true
          this.judgmentDetection()
        }
    },
    // 工作天数
    setDay(){
      if(this.model.jobTitle == 'otherWorker'){
        if(this.model.day == 0){

        }else {
          // 餐补
          this.getMealAllowance()
          // 应发工资 
          this.getSalariesPayable()
          // 个税 
          this.getPersonalTaxAndPay()
          // 实发工资
          this.getNetSalary()
        }
        
        return
      }
      if(this.model.workingHours > 0){
        if(this.model.jobTitle === 'workshopDirector'){
              this.laborCost = Math.round(this.model.workingHours * 0.5)
        }else if(this.model.jobTitle === 'workshopGeneralWorker'){
            this.laborCost = this.model.day >= 26 ? (this.model.workingHours * 3.3).toFixed(0) : (this.model.workingHours * 3.2).toFixed(0)
        }
      }else if(this.model.workingHours == 0){
        this.laborCost = this.model.basicSalary
      }
      this.flg = true
      this.judgmentDetection()
    },
    add() {
      this.edit(this.modelDefault);
    },
    edit(record) {
      this.model = Object.assign({}, record);
      this.visible = true;
    },
    // 当月工作总天数
    working() {
      // this.workingDays = this.model.workingDays;
      if(this.flg){
      this.judgmentDetection();
      }
    },
    // 基本工资
    jbgz(){
      // this.basicSalary = this.model.basicSalary
      if(this.flg){
      this.judgmentDetection();
      }
    },
    // 绩效工资
    jxgz(){
      // this.meritPay = this.model.meritPay
      if(this.model.jobTitle == 'otherWorker'){
        // 总工资
        this.gettotalWages()
        // 应发工资 
        this.getSalariesPayable()
        // 个税 
        this.getPersonalTaxAndPay()
        // 实发工资
        this.getNetSalary()
        return
      }
      if(this.flg){
        if (this.model.workingDays === undefined) {
          message.warning('当月工作总天数不可为空');
        } else if (this.model.basicSalary === undefined) {
          message.warning('工作职位不可为空');
        } else if (this.model.day === undefined) {
          message.warning('工作天数不可为空');
        } else {
        console.log('绩效')
          this.gettotalWages()
          // 应发工资 
          this.getSalariesPayable()
          // 个税 
          this.getPersonalTaxAndPay()
          // 实发工资
          this.getNetSalary()
        }
      }
    },
    //总工资
    zgz(){
      if(this.model.jobTitle == 'otherWorker'){
        // 应发工资 
        this.getSalariesPayable()
        // 个税 
        this.getPersonalTaxAndPay()
        // 实发工资
        this.getNetSalary()
      }
    },
    //全勤奖
    qqj(){
      // this.fullAttendanceAward = this.model.fullAttendanceAward
      if(this.flg){
      this.judgmentDetection();
      }
    },
    // 社保公司
    sbgs() {
      // this.socialcompany = this.model.socialCompany;
      if(this.flg){
      this.judgmentDetection();
      }
    },
    // 社保个人
    sbgr() {
      // this.socialperson = this.model.socialPerson;
      if(this.flg){
      this.judgmentDetection();
      }
    },
     // 补项
    mentary() {
      // this.supplementary = this.model.supplementary;
      if(this.flg){
      this.judgmentDetection();
      }
    },
    // 减项
    deduc() {
      // this.deduction = this.model.deduction;
      if(this.flg){
      this.judgmentDetection();
      }
    },
    // 应发工资
    setSalariesPayable(){
      // 个税 
      this.getPersonalTaxAndPay()
      // 实发工资
      this.getNetSalary()
    },
    submitForm() {
      const that = this;
      // 触发表单验证
      this.$refs.form.validate(valid => {
        if (valid) {
          that.confirmLoading = true;
          let httpurl = '';
          let method = '';

          if (!this.model.id) {
            httpurl += this.url.add;
            method = 'post';
          } else {
            httpurl += this.url.edit;
            method = 'put';
          }
          httpAction(httpurl, this.model, method).then((res) => {
            if (res.success) {
              that.$message.success(res.message);
              that.$emit('ok');
            } else {
              that.$message.warning(res.message);
            }
          }).finally(() => {
            that.confirmLoading = false;
          })
        }

      })
    },
  }
}
</script>
<style lang="less" scoped>
.input_dis{
  border-color: #91d5ff;background-color: #e6f7ff
}
</style>