<!--
 * @Author: ysh
 * @Date: 2024-05-10 15:50:41
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2024-10-08 15:58:46
-->
<template>
  <div>
    <h2 style="text-align:center;">项目直接生产成本预算表</h2>
    <el-descriptions :column="3" border class="descriptions">
      <el-descriptions-item label="项目编号">
        {{ projectForm.projectNumber }}
      </el-descriptions-item>
      <el-descriptions-item label="项目名称">
        {{ projectForm.projectName }}
      </el-descriptions-item>
      <el-descriptions-item label="项目负责人">
        {{ getUserName(projectForm.projectLeader) }}
      </el-descriptions-item>
      <el-descriptions-item label="承担部门">
        {{ getDeptNames(projectForm.undertakingDept) }}
      </el-descriptions-item>
      <el-descriptions-item label="项目备注" :span="3">
        {{ projectForm.remark }}
      </el-descriptions-item>
      <el-descriptions-item label="直接成本" :span="3">
        <div>
          <table border="1" style="width: 100%;">
            <tr style="background-color:#f8f8f9">
              <td style="width: 250px">工作简述</td>
              <td style="width: 200px">工作内容</td>
              <td style="width: 80px">数量</td>
              <td style="width: 80px">单价</td>
              <td style="width: 100px">单位</td>
              <td style="width: 70px">系数</td>
              <td style="width: 100px">金额</td>
              <td style="width: 250px;">备注</td>
            </tr>
            <tr v-for="work in budgetForm.contentList">
              <td>{{ work.content }}</td>
              <td>{{ work.workItem }}</td>
              <td>{{ work.workload }}</td>
              <td>{{ work.price }}</td>
              <td>{{ work.unit }}</td>
              <td>{{ work.coefficient }}</td>
              <td>{{ work.settle }}</td>
              <td>{{ work.remark ? work.remark : '' }}</td>
            </tr>
            <tr>
              <td :colspan="6" class="head">直接成本合计</td>
              <td :colspan="1" class="head">{{ budgetForm.settleExpense }}</td>
              <td></td>
            </tr>
          </table>
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="间接成本" :span="3">
        <div>
          <table border="1" style="width: 100%;">
            <tr v-if="userLen != 1" style="background-color:#f8f8f9">
              <td :rowspan="userLen" style="background-color:#f8f8f9">人员</td>
              <td colspan="4">姓名</td>
              <!-- <td>基本工资</td> -->
              <!-- <td>岗位工资</td> -->
              <!-- <td>人员成本（天）</td> -->
              <td>预算天数</td>
              <td></td>
              <td>金额</td>
              <td>备注</td>
            </tr>
            <tr v-for="user in budgetForm.chooseUser" :key="'user' + user.userId">
              <td colspan="4">{{ user.nickName }}</td>
              <!-- <td>1780</td> -->
              <!-- <td>{{ user.salary.salary }}</td> -->
              <!-- <td>{{ parseFloat((user.salary.salary + 1780) / 21.75).toFixed(2) }}</td> -->
              <!-- <td>{{ user.inOutPrice }}</td> -->
              <td>{{ user.days }}</td>
              <td></td>
              <td>{{ user.staffCost }}</td>
              <td></td>
            </tr>
            <tr v-if="carLen != 1" style="background-color:#f8f8f9">
              <td :rowspan="carLen" style="background-color:#f8f8f9">车辆</td>
              <td>车牌号</td>
              <td>油耗（元/km）</td>
              <td>总里程</td>
              <td>折旧成本（天）</td>
              <td>预算天数</td>
              <td>过路费</td>
              <td>金额</td>
              <td>备注</td>
            </tr>
            <tr v-for="car in budgetForm.chooseCar" :key="'car' + car.carId">
              <td>{{ car.licensePlate }}</td>
              <td>{{ car.mileage }}</td>
              <td>{{ car.distance }}</td>
              <td>{{ car.dayCost }}</td>
              <td>{{ car.days }}</td>
              <td>{{ car.toll }}</td>
              <td>{{ car.expense }}</td>
              <td>{{ car.remark }}</td>
            </tr>
            <tr v-if="deviceLen != 1" style="background-color:#f8f8f9">
              <td :rowspan="deviceLen" style="background-color:#f8f8f9">设备</td>
              <td>设备名称</td>
              <td>规格型号</td>
              <td>品牌</td>
              <td>折旧成本（天）</td>
              <td>预算天数</td>
              <td></td>
              <td>金额</td>
              <td>备注</td>
            </tr>
            <tr v-for="device in budgetForm.chooseDevice" :key="'device' + device.deviceId">
              <td>{{ device.name }}</td>
              <td>{{ device.series }}</td>
              <td>{{ device.brand }}</td>
              <td>{{ device.dayCost }}</td>
              <td>{{ device.days }}</td>
              <td></td>
              <td>{{ device.depreciation }}</td>
              <td></td>
            </tr>
            <tr>
              <td :colspan="7" class="head">间接成本合计</td>
              <td :colspan="1" class="head">{{ budgetForm.fixCost }}</td>
              <td></td>
            </tr>
          </table>
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="外协费用" :span="1">
        <div class="text-center">
          {{ budgetForm.outExpense }}
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="备注" :span="2">
        {{ budgetForm.outRemark }}
      </el-descriptions-item>
      <el-descriptions-item label="车船租赁" :span="1">
        <div class="text-center">
          {{ budgetForm.rentExpense }}
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="备注" :span="2">
        {{ budgetForm.rentRemark }}
      </el-descriptions-item>
      <el-descriptions-item label="其他费用" :span="1">
        <div class="text-center">
          {{ budgetForm.otherExpense }}
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="备注" :span="2">
        {{ budgetForm.otherRemark }}
      </el-descriptions-item>
      <el-descriptions-item label="税费成本" :span="1">
        <div class="text-center">
          {{ budgetForm.taxExpense }}
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="备注" :span="2">
        {{ budgetForm.taxRemark }}
      </el-descriptions-item>
      <el-descriptions-item label="经营管理费用" :span="1">
        <div class="text-center">
          {{ budgetForm.businessExpense }}
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="备注" :span="2">
        {{ budgetForm.businessRemark }}
      </el-descriptions-item>
      <el-descriptions-item label="预算成本合计" :span="3">
        <div class="text-center head">¥ {{ costSum }}</div>
      </el-descriptions-item>
      <el-descriptions-item label="合同总价约" :span="2" v-if="budgetForm.contract">
        {{ budgetForm.contract ? budgetForm.contract.amount : '' }}
      </el-descriptions-item>
      <el-descriptions-item label="利润" :span="1" v-if="budgetForm.contract">
        {{ profit }}
      </el-descriptions-item>
    </el-descriptions>
  </div>
</template>

<script>
export default {
  props: {
    budgetForm: {
      type: Object,
      require: true
    },
    projectForm: {
      type: Object,
      require: true
    }
  },
  data() {
    return {
      userLen: 0,
      carLen: 0,
      deviceLen: 0,
      workLen: 1,
      costSum: 0,
      inOutPrice: '',
      profit: ''
    }
  },
  created() {
    this.userLen = this.budgetForm.chooseUser.length + 1;
    this.carLen = this.budgetForm.chooseCar.length + 1;
    this.deviceLen = this.budgetForm.chooseDevice.length + 1;
    this.workLen = this.budgetForm.contentList.length;
    this.costSum = (Number(this.budgetForm.directExpense) + Number(this.budgetForm.fixCost)).toFixed(2);
    if (this.budgetForm.contract) {
      this.profit = (Number(this.budgetForm.contract.amount) - Number(this.costSum)).toFixed(2)
    }
    this.$emit('getTotal', this.costSum);
  },
}
</script>

<style lang="scss" scoped>
table {
  text-align: center;
  border-collapse: collapse;
  margin: 0 auto;

  /*设置背景颜色*/
  /* background-color: #bfa; */
  td {
    padding: 5px;
  }
}

.head {
  // background-color: var(--current-color);
  // opacity: 0.5;
  // color: #fff;
  font-weight: bold;
}

::v-deep .el-descriptions-item__label.is-bordered-label {
  color: #5a5757;
  background: rgba($color: #a9adb3, $alpha: 0.1);
  width: 120px;
  text-align: center;
  min-width: 120px;
}

::v-deep .el-descriptions .is-bordered .el-descriptions-item__cell {
  border: 1px solid #cdd0d3;
}
</style>