boss/pages/main/index/wage_settlement.vue

<template>
  <div v-if="detail" id="wage-settlement">
    <h3>工资结算</h3>
    <h4>
      【
      <a :href="orderHref">{{detail.job.title_count}}</a>
      】{{detail.time.month}}工资账单
    </h4>
    <section class="container">
      <span class="title">每月薪资：</span>
      ￥{{salary.job_salary}}/月
    </section>
    <section class="container">
      <span class="title">工作周期：</span>
      {{detail.time.start_time | dateFormat}} 至 {{detail.time.end_time | dateFormat}} ({{detail.days}}天)
    </section>
    <section class="container">
      <span class="title">托管金额：</span>
      ￥{{detail.company.company_pay}}
    </section>
    <section v-if="detail.normal_days > 0" class="container">
      <span class="title">正式工资：</span>
      ￥{{salary.normal_salary}}({{detail.normal_days}}天)
    </section>
    <section v-if="detail.probation_days > 0" class="container">
      <span class="title">试用工资：</span>
      ￥{{salary.probation_salary}}({{detail.probation_days}}天，按月工资{{rate.probation_rate}}%结算)
    </section>
    <section class="container">
      <span class="title">结算比例：</span>
      <el-input type="number" v-model="detail.work_hour.work_rate"></el-input>
      % (工作工时：{{detail.work_hour.worked_hours}}/{{detail.work_hour.should_work_hours}})
    </section>
    <section class="container">
      <span class="title">扣减工资：</span>
      <el-input type="number" v-model="salary.deduction_fee"></el-input>元
    </section>
    <section class="container salary-container">
      <span class="title">本月工资：</span>
      <section>
        <div class="salary-result">￥{{baseSalary}}</div>
        <div
          class="salary-calc"
        >=({{salary.normal_salary}}+{{salary.probation_salary}})*{{detail.work_hour.work_rate}}%-{{salary.deduction_fee}}</div>
      </section>
    </section>
    <section class="container">
      <span class="title">平台服务费：</span>
      <el-input type="number" v-model="rate.origin_person_service_fee_rate"></el-input>
      VIP会员减免{{rate.person_service_fee_rate_reduce}}% ￥{{vipMinus}} (开发者服务费率{{devServiceRate}}%)
    </section>
    <section class="container">
      <span class="title">应缴税费：</span>
      <el-checkbox type="checkbox" v-model="payable"></el-checkbox>
      ￥{{shouldRate}} (开发者税率{{devRate}}%)
    </section>
    <section class="container salary-container">
      <span class="title">实际工资：</span>
      <section>
        <div class="salary-result">￥{{personPrice}}</div>
        <div class="salary-calc">
          <span>=(({{salary.normal_salary}}+{{salary.probation_salary}})*{{detail.work_hour.work_rate}}%-{{salary.deduction_fee * 1}})*(1-{{rate.person_service_fee_rate}}%)</span>
          <span v-if="payable">*(1-{{rate.person_tax_rate}}%-{{rate.person_tax_service_fee_rate}}%)</span>
        </div>
      </section>
    </section>
    <!-- 本月结束合作，下月未托管费用 -->
    <section v-if="detail.can_use_deposit" class="container">
      <el-checkbox v-model="is_use_deposit" style="margin: 0 4px 0 0;"></el-checkbox>
      使用押金结算(￥{{detail.company.company_left_deposit}})(企业方费用：￥{{companyPrice}})
    </section>
    <section class="container">
      <span class="title">退还金额：</span>
      <el-input type="text" :value="returnMoney"></el-input>
      =(({{salary.normal_salary}}+{{salary.probation_salary}})-{{baseSalary}})*(1+{{rate.company_service_fee_rate}}%)
      <span
        v-if="payable"
      >*(1+{{detail.is_invoice ? rate.company_tax_rate : 0}}%)</span>元
    </section>
    <section class="container">
      <span class="title">备注说明：</span>
      <el-input v-model="detail.remark"></el-input>
    </section>
    <el-button v-show="detail.status == 2 || detail.status == 3" @click="jobPeriodSettle('save')">保存</el-button>
    <section v-if="detail.can_send_salary" class="container" style="margin-top: 20px;">
      <el-button
        type="primary"
        v-show="detail.status == 3"
        @click="jobPeriodSettle('confirm')"
      >确定支付工资</el-button>
    </section>
  </div>
</template>

<script>
// 现在环境是线上还是测试, 默认线上
let env = ''

export default {
  data() {
    return {
      job_id: '',
      period_id: '',
      payable: false,
      is_use_deposit: false,
      detail: null,
    }
  },
  computed: {
    /**
     * 详情链接地址
     */
    orderHref() {
      let detail = this.detail
        , hrefFix = `/rooter/cloudjobitem/${detail.job_id}`
      if(env === 'test') hrefFix = `https://dev.test.proginn.com${hrefFix}`
      else hrefFix = `https://www.proginn.com${hrefFix}`
      return hrefFix
    },
    /**
     * 开发者服务费率
     */
    devServiceRate() {
      let rate = this.rate
      let result = Number(rate.origin_person_service_fee_rate) - Number(rate.person_service_fee_rate_reduce)
      return result < 0 ? 0 : result
    },
    /**
     * 开发者税率
     */
    devRate() {
      let rate = this.rate
      return Number(rate.person_tax_rate) + Number(rate.person_tax_service_fee_rate)
    },
    /**
     * 薪资
     */
    salary() {
      return this.detail.salary
    },
    /**
     * 会员减免
     */
    vipMinus() {
      let salary = this.salary
      let rate = this.rate
      return this.keepDecimal(((salary.normal_salary * 1 + salary.probation_salary * 1) * (this.detail.work_hour.work_rate / 100) - salary.deduction_fee * 1) * ((rate.origin_person_service_fee_rate - rate.person_service_fee_rate_reduce) / 100))
    },
    /**
     * 税率
     */
    rate() {
      return this.detail.rate
    },
    /**
     * 应缴税费
     */
    shouldRate() {
      let rate = this.rate
      return this.keepDecimal(Number(this.baseSalary) * (1 - Number(rate.origin_person_service_fee_rate) / 100 + Number(rate.person_service_fee_rate_reduce) / 100) * this.devRate / 100)
    },
    /**
     * 本月工资
     */
    baseSalary() {
      let salary = this.salary
      return this.keepDecimal((Number(salary.normal_salary) + Number(salary.probation_salary)) * Number(this.detail.work_hour.work_rate) / 100 - Number(salary.deduction_fee))
    },
    /**
     * 退还金额
     */
    returnMoney() {
      if(this.is_use_deposit) return 0

      let salary = this.salary
      let isPay = Number(this.detail.company.company_pay) > 0 ? 1 : 0
      let hasTax = this.payable ? (1 + Number(this.detail.rate.company_tax_rate) / 100) : 1
      return this.keepDecimal((Number(salary.normal_salary) + Number(salary.probation_salary) - Number(this.baseSalary)) * (1 + Number(this.detail.rate.company_service_fee_rate) / 100) * hasTax) * isPay
    },
    /**
     * 实际工资
     */
    personPrice() {
      let salary = this.salary
      let rate = this.detail.rate
      let work_hour = this.detail.work_hour
      let isPayable = this.payable ? (1 - rate.person_tax_rate / 100 - rate.person_tax_service_fee_rate / 100) : 1
      let personPrice = (((salary.normal_salary - 0) + (salary.probation_salary - 0)) * work_hour.work_rate / 100 - Number(salary.deduction_fee)) * (1 - rate.person_service_fee_rate / 100) * isPayable

      return this.keepDecimal(personPrice)
    },
    /**
     * 企业方费用
     */
    companyPrice() {
      let salary = this.salary
      let rate = this.detail.rate
      let work_hour = this.detail.work_hour
      let isPayable = this.payable ? (1 + rate.company_tax_rate / 100) : 1
      let companyPrice = (((salary.normal_salary - 0) + (salary.probation_salary - 0)) * work_hour.work_rate / 100 - Number(salary.deduction_fee)) * (1 + rate.company_service_fee_rate / 100) * isPayable
      return this.keepDecimal(companyPrice)
    },
  },
  filters: {
    /**
     * 格式化日期
     */
    dateFormat(val) {
      return new Date(Number(val) * 1000).toLocaleDateString()
    }
  },
  mounted() {
    this.job_id = this.$route.query.job_id
    this.period_id = this.$route.query.period_id
    this.getData()
  },
  methods: {
    /**
     * 有效数字控制
     */
    keepDecimal(num) {
      return num.toFixed(2)
    },
    /**
     * 点击保存或支付
     */
    jobPeriodSettle(action) {
      let res = this.$post('/api/admin/job/job_period_settle', {
        // 云端工作周期id(int)
        period_id: this.period_id,
        // 云端工作id（int）
        job_id: this.job_id,
        // 操作名称 save-保存结算信息 confirm-确认支付工资
        action,
        // 结算比例（百分比）
        work_rate: this.detail.work_hour.work_rate,
        // 扣减工资（数值，两位小数）
        deduction_fee: this.salary.deduction_fee,
        // 是否要发票（0-不需要  1-需要）
        is_invoice: this.payable ? 1 : 0,
        // 退还金额（数值，两位小数）
        return_money: this.returnMoney,
        // 结算工资时的备注（可选）
        remark: this.detail.remark,
        // 结算时是否使用押金
        is_use_deposit: this.is_use_deposit ? 1 : 0,
        person_service_fee_rate: this.detail.rate.origin_person_service_fee_rate,
      })
      // console.log(res)
      if(!res) return
      this.$message({
        message: '成功',
        type: 'success'
      })
      setTimeout(() => {
        location.reload()
      }, 1000)
    },
    /**
     * 获取数据
     */
    async getData(i) {
      let res = await this.$post('/api/admin/job/get_job_period_detail', {
        job_id: this.job_id,
        period_id: this.period_id,
        is_cal_workrate: 1
      })
      if(!res.data) return
      let data = res.data
      env = data.current_env
      this.detail = data
      this.payable = data.is_invoice === '1'
      this.is_use_deposit = data.can_use_deposit === '1'
    },
  }
}
</script>

<style scoped>
#wage-settlement {
  padding: 20px;
}
.container {
  display: flex;
  align-items: center;
  height: 44px;
}
.salary-container {
  height: 80px;
  background: #f0f0f0;
}
.salary-result {
  font-size: 28px;
  font-weight: 800;
}
.salary-calc {
  color: #666;
  margin-left: 40px;
}
.title {
  width: 92px;
}
.el-input {
  width: 180px;
}
</style>