<!--
 * @Author: ysh
 * @Date: 2024-04-08 13:56:14
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2024-04-17 17:58:35
-->
<template>
  <div>
    <el-skeleton animated :rows="20" v-if="loading" class="app-container" />
    <div class="app-container" v-if="!loading">
      <h2 style="text-align: center">项目运作情况</h2>
      <div class="headers">
        基本作业情况记录
        <div class="line"></div>
      </div>
      <el-form ref="progress" :model="form" :disabled="disabled" label-width="100px">
        <el-row :gutter="20" v-if="!noBudget">
          <el-col :span="11">
            <el-form-item label="使用车辆（车牌号）：" label-width="153px">
              {{ form.licensePlate }}
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="驾驶员：">
              {{ form.driver }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="参与人员：" v-if="!noBudget">
          {{ form.staff }}
        </el-form-item>
        <div v-if="noBudget">
          <el-alert title="项目未做预算表，请先编制预算表" type="warning" effect="dark">
          </el-alert>
        </div>
        <el-row :gutter="20">
          <el-col :span="11">
            <el-form-item label="进场时间：">
              <el-date-picker
                type="date"
                placeholder="选择日期"
                v-model="form.entryTime"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="11">
            <el-form-item label="撤场时间：">
              <el-date-picker
                type="date"
                placeholder="选择日期"
                v-model="form.exitTime"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="项目进度：">
          <table border="1">
            <tr>
              <td style="width: 80px">序号</td>
              <td>截止日期</td>
              <td>累计总进度（%）</td>
              <td style="width: 300px">情况说明</td>
            </tr>
            <tr v-for="(progress, index) in progressList" :key="index">
              <td>
                {{ index + 1 }}
              </td>
              <td>
                <el-date-picker
                  type="date"
                  placeholder="选择日期"
                  v-model="progress.date"
                  value-format="yyyy-MM-dd"
                ></el-date-picker>
              </td>
              <td>
                <el-input-number
                  v-model="progress.percentage"
                  :controls="false"
                  style="width: 120px"
                ></el-input-number
                >%
              </td>
              <td>
                <el-input v-model="progress.situation" type="textarea"></el-input>
              </td>
              <td>
                <el-button
                  type="danger"
                  icon="el-icon-minus"
                  size="mini"
                  circle
                  @click="deleProgressItem(index)"
                ></el-button>
              </td>
            </tr>
          </table>
          <el-button
            icon="el-icon-plus"
            size="mini"
            @click="addProgressList()"
            type="primary"
            plain
          ></el-button>
        </el-form-item>
      </el-form>
      <div class="headers">
        项目借款
        <div class="line"></div>
      </div>

      <div class="headers">
        成果汇交
        <div class="line"></div>
      </div>
      <div class="headers">
        产值结算（内部）
        <div class="line"></div>
      </div>
      <div slot="footer" class="dialog-footer" style="text-align: center">
        <el-button @click="preserve()" :disabled="disabled" type="warning"
          >保 存</el-button
        >
        <el-button type="primary" @click="submitNextFlow()" :disabled="disabled"
          >提交下一个流程</el-button
        >
      </div>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { parseTime } from "@/utils/ruoyi";
import {
  complete,
  rejectTask,
  returnList,
  returnTask,
  getNextFlowNode,
  delegate,
  flowTaskForm,
} from "@/api/flowable/todo";
import {
  getProjectComment,
  addProjectComment,
  updateProjectComment,
} from "@/api/oa/project/projectComment";
import { getUsersDeptLeaderByDept } from "@/api/system/post";
import {
  getProjectProgress,
  addProjectProgress,
  delProjectProgress,
} from "@/api/oa/project/projectProgress";
import { listBudgetCar, getBudgetCar } from "@/api/oa/budget/budgetCar";
import { listBudgetDevice, getBudgetDevice } from "@/api/oa/budget/budgetDevice";
import { listBudgetSettle, getBudgetSettle } from "@/api/oa/budget/budgetSettle";
import { listBudgetStaff, getBudgetStaff } from "@/api/oa/budget/budgetStaff";
import { listBudget } from "@/api/oa/budget/budget";
import { getProject, updateProject } from "@/api/oa/project/project";
import { getCar } from "@/api/oa/car/car";
export default {
  computed: {
    ...mapGetters(["name", "userId"]),
  },
  props: {
    disabled: {
      type: Boolean,
      require: true,
    },
    taskForm: {
      type: Object,
      required: true,
    },
    taskName: {
      type: String,
      required: true,
    },
  },
  data() {
    return {
      loading: true,
      form: {
        licensePlate: "",
        driver: "",
        staff: "",
        entryTime: "",
        exitTime: "",
      },
      rules: {
        manageComment: [{ required: true, message: "请输入审核意见", trigger: "blur" }],
      },
      progressList: [
        {
          date: "",
          percentage: "",
          situation: "",
        },
      ],
      noBudget: true,
      budgetId: "",
    };
  },
  watch: {
    taskName(newval, oldval) {
      if (newval == "项目生产") {
        this.doesItExistBudget(this.taskForm.formId);
      }
    },
  },
  created() {
    if (this.taskName == "项目生产") {
      this.doesItExistBudget(this.taskForm.formId);
      this.initProgress();
    }
  },
  methods: {
    initProgress() {
      getProject(this.taskForm.formId).then(res => {
        if (res.data) {
          this.form.entryTime = res.data.entryTime;
          this.form.exitTime = res.data.exitTime;
        }
      });
      getProjectProgress(this.taskForm.formId).then(res => {
        if (res.data.length != 0) {
          this.progressList = res.data;
        }
      });
    },
    // 查询是否有预算表
    doesItExistBudget(projectId) {
      listBudget({ projectId }).then(res => {
        this.loading = false;
        if (res.total == 0) {
        } else {
          this.noBudget = false;
          this.budgetId = res.rows[0].budgetId;
          getBudgetCar(this.budgetId).then(res => {
            let carArr = [];
            let carDriverList = [];
            for (let i of res.data) {
              carArr.push(i.car.licensePlate);
              getCar(i.carId).then(res => {
                carDriverList.push(res.data.driverUser.nickName);
                this.form.driver = carDriverList.join("、");
              });
            }
            this.form.licensePlate = carArr.join("、");
          });
          getBudgetStaff(this.budgetId).then(res => {
            let userArr = [];
            for (let u of res.data) {
              userArr.push(u.user.nickName);
            }
            this.form.staff = userArr.join("、");
          });
        }
      });
    },
    addProgressList() {
      this.progressList.push({
        date: "",
        percentage: "",
        situation: "",
      });
    },
    deleProgressItem(index) {
      let arr = this.progressList;
      if (arr.length == 1) {
        return;
      }
      if (index >= 0 && index < arr.length) {
        arr.splice(index, 1);
      }
    },
    handleAddProgress(form) {
      addProjectProgress(form);
    },
    // 暂存数据
    preserve() {
      delProjectProgress([this.taskForm.formId]).then(res => {
        for (let progress of this.progressList) {
          progress.projectId = this.taskForm.formId;
          addProjectProgress(progress);
        }
      });
      updateProject({
        projectId: this.taskForm.formId,
        entryTime: this.form.entryTime,
        exitTime: this.form.exitTime,
      }).then(res => {
        this.$message.success("保存成功");
      });
    },
    submitNextFlow() {},
  },
};
</script>

<style lang="scss" scoped>
.auditor {
  font-family: "华文行楷";
  font-size: 20px;
}

table {
  /*边框*/
  /* border: 1px solid black; */
  text-align: center;
  border-collapse: collapse;
  /*设置背景颜色*/
  /* background-color: #bfa; */
}

.headers {
  position: relative;
  font-weight: bold;
  font-size: 18px;
  padding-left: 40px;
  padding-bottom: 40px;

  .line {
    position: absolute;
    left: 22px;
    top: 5px;
    width: 5px;
    height: 14px;
    border-radius: 10px;
    background-color: #2893e5;
  }
}

::v-deep .el-textarea.is-disabled .el-textarea__inner {
  color: #121212 !important;
}
</style>
