<!--
 * @Author: ysh
 * @Date: 2024-04-19 15:32:00
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2024-10-23 14:39:45
-->
<template>
  <div class="app-container">
    <el-empty description="技术方案未编制" v-if="!haveTechnicalPlan"></el-empty>
    <div v-if="haveTechnicalPlan">
      <el-button type="success" @click="openPrint = true">打印</el-button>
      <h3 class="text-center"><b>{{ form.projectNumber + '-' + form.projectName + ' 技术方案' }}</b></h3>
      <el-form ref="technicalPlan" :model="form" :rules="rules" label-width="125px" disabled>
        <el-form-item label="项目编号：" prop="projectNumber">
          {{ form.projectNumber }}
        </el-form-item>
        <el-form-item label="项目名称：" prop="projectName">
          {{ form.projectName }}
        </el-form-item>
        <el-form-item label="技术负责人" prop="technicalDirector">
          <el-select v-model="form.technicalDirector" filterable clearable style="width: 220px">
            <el-option v-for="item in userList" :key="item.userId" :label="item.nickName" :value="item.userId"
              v-if="item.nickName != 'admin'">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="技术设计人" prop="technicalDesigner">
          <el-select v-model="form.technicalDesigner" filterable clearable style="width:220px">
            <el-option v-for="item in userList" :key="item.userId" :label="item.nickName" :value="item.userId"
              v-if="item.nickName != 'admin'">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="质量检查员" prop="qualityInspector">
          <el-select v-model="form.qualityInspector" filterable multiple clearable style="width:220px">
            <el-option v-for="item in userList" :key="item.userId" :label="item.nickName" :value="item.userId"
              v-if="item.nickName != 'admin'">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="技术安排意见" prop="planComment">
          <el-input type="textarea" v-model="form.planComment" placeholder="请输入技术安排意见" />
        </el-form-item>
        <el-row>
          <el-col :span="6" :xs="24" :offset="12">
            <el-form-item label="签名" prop="technicalPlanner">
              <span class="auditor"> {{ form.planUser ? form.planUser.nickName : '' }} </span>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="日期：" label-width="120px">
              <span> {{ form.technicalTime ? form.technicalTime : '' }} </span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="技术方案" prop="technicalDocument">
          <div v-if="form.technicalDocument">
            <el-link type="primary" @click="reviewWord(`${baseUrl}${'/profile/upload' + form.technicalDocument}`)">
              {{ getFileName(form.technicalDocument) }}
            </el-link>
            <el-link class="ml20" type="warning" :href="`${baseUrl}${'/profile/upload' + form.technicalDocument}`"
              :underline="false" target="_blank">
              <span class="el-icon-download">下载文件</span>
            </el-link>
          </div>
        </el-form-item>
        <el-form-item label="方案说明" prop="designDescription">
          <el-input type="textarea" :autosize="{ minRows: 4 }" v-model="form.designDescription" placeholder="请输入方案说明" />
        </el-form-item>
        <el-row>
          <el-col :span="6" :xs="24" :offset="12">
            <el-form-item label="签名" prop="designUser">
              <span class="auditor"> {{ form.designUser ? form.designUser.nickName : '' }} </span>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="日期：" label-width="120px">
              <span> {{ form.technicalUploadTime ? form.technicalUploadTime : '' }} </span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="修改技术方案" prop="modifyDocument">
          <div v-if="form.modifyDocument">
            <el-link type="primary" @click="reviewWord(`${baseUrl}${'/profile/upload' + form.modifyDocument}`)">
              {{ getFileName(form.modifyDocument) }}
            </el-link>
            <el-link class="ml20" type="warning" :href="`${baseUrl}${'/profile/upload' + form.modifyDocument}`"
              :underline="false" target="_blank">
              <span class="el-icon-download">下载文件</span>
            </el-link>
          </div>
        </el-form-item>
        <el-form-item label="技术方案审核意见" prop="technicalComment">
          <el-input type="textarea" v-model="form.technicalComment" placeholder="请输入技术方案审核意见" />
        </el-form-item>
        <el-row>
          <el-col :span="6" :xs="24" :offset="12">
            <el-form-item label="签名" prop="technicalAuditor">
              <span class="auditor"> {{ form.auditUser ? form.auditUser.nickName : '' }} </span>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="日期：" label-width="120px">
              <span> {{ form.techApprovalTime }} </span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="修改技术方案" prop="reviseDocument">
          <div v-if="form.reviseDocument">
            <el-link type="primary" @click="reviewWord(`${baseUrl}${'/profile/upload' + form.reviseDocument}`)">
              {{ getFileName(form.reviseDocument) }}
            </el-link>
            <el-link class="ml20" type="warning" :href="`${baseUrl}${'/profile/upload' + form.reviseDocument}`"
              :underline="false" target="_blank">
              <span class="el-icon-download">下载文件</span>
            </el-link>
          </div>
        </el-form-item>
        <el-form-item label="技术质量与安全部审核意见" prop="techDeptComment">
          <el-input type="textarea" v-model="form.techDeptComment" placeholder="请输入技术质量与安全部审核意见" />
        </el-form-item>
        <el-row>
          <el-col :span="6" :xs="24" :offset="12">
            <el-form-item label="签名" prop="technicalAuditor">
              <span class="auditor"> {{ form.techDeptLeader ? form.techDeptLeader.nickName : '' }} </span>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="日期：" label-width="120px">
              <span> {{ form.techDeptTime }} </span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="最终技术方案" prop="finalDocument">
          <div v-if="form.finalDocument">
            <el-link type="primary" @click="reviewWord(`${baseUrl}${'/profile/upload' + form.finalDocument}`)">
              {{ getFileName(form.finalDocument) }}
            </el-link>
            <el-link class="ml20" type="warning" :href="`${baseUrl}${'/profile/upload' + form.finalDocument}`"
              :underline="false" target="_blank">
              <span class="el-icon-download">下载文件</span>
            </el-link>
          </div>
        </el-form-item>
        <el-form-item label="总工程师审核意见" prop="manageComment">
          <el-input type="textarea" v-model="form.manageComment" placeholder="请输入总工审核意见" />
        </el-form-item>
        <el-row>
          <el-col :span="6" :xs="24" :offset="12">
            <el-form-item label="签名" prop="manager">
              <span class="auditor"> {{ form.managerUser ? form.managerUser.nickName : '' }} </span>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="日期：" label-width="120px">
              <span> {{ form.manageApprovalTime }} </span>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <el-dialog title="技术方案表格预览" :visible.sync="openPrint" width="65%" append-to-body>
      <plan-print :form="form" @cancel="openPrint = false"></plan-print>
    </el-dialog>
  </div>
</template>

<script>
import technicalPlan from "../technicalPlan.vue";
import { listUser } from "@/api/system/user";
import { getProject } from "@/api/oa/project/project";
import {
  listTechnicalPlan,
  getTechnicalPlan,
  delTechnicalPlan,
  addTechnicalPlan,
  updateTechnicalPlan,
} from "@/api/oa/technical/technicalPlan";
import PlanPrint from '../components/print/planPrint.vue';
export default {
  components: { technicalPlan, PlanPrint },
  props: {
    taskForm: {
      type: Object,
      require: true,
    },
  },
  computed: {
    projectNumber() {
      return this.$store.state.projectProcess.projectNumber;
    },
    projectName() {
      return this.$store.state.projectProcess.projectName;
    },
  },
  watch: {
    'taskForm.formId'(newval) {
      this.initForm();
      this.getUserList();
    },
    projectNumber(newval) {
      this.$set(this.form, "projectNumber", newval);
    },
    projectName(newval) {
      this.$set(this.form, "projectName", newval);
    }
  },
  data() {
    return {
      baseUrl: process.env.VUE_APP_BASE_API,
      haveTechnicalPlan: false,
      form: {},
      rules: {},
      userList: [],
      openPrint: false,
    };
  },
  mounted() {
    this.initForm();
    this.getUserList();
  },
  methods: {
    /** 查询cmc技术方案列表 */
    initForm() {
      this.loadTechnicalPlanAndProjectData();
    },
    async loadTechnicalPlanAndProjectData() {
      try {
        const technicalPlanRes = await getTechnicalPlan(this.taskForm.formId);
        if (technicalPlanRes.data) {
          this.haveTechnicalPlan = true;
          let qualityInspector = this.processQualityInspector(technicalPlanRes.data)
          technicalPlanRes.data.qualityInspector = qualityInspector
          this.form = technicalPlanRes.data;
          const projectRes = await getProject(this.taskForm.formId);
          if (projectRes.data) {
            this.$set(this.form, "projectNumber", projectRes.data.projectNumber);
            this.$set(this.form, "projectName", projectRes.data.projectName);
            this.$set(this.form, "projectLeader", projectRes.data.projectLeader);
            this.$set(this.form, "undertakingDept", projectRes.data.undertakingDept);
          }
        }
      } catch (error) {
      }
    },
    processQualityInspector(form) {
      if (Array.isArray(form.qualityInspector)) {
        // 如果已经是数组，则不需要进一步处理  
        // 除非你想将数组中的字符串元素转换为整数  
        // 例如：form.qualityInspector = form.qualityInspector.map(inspector => parseInt(inspector, 10));  
      } else if (typeof form.qualityInspector === 'string') {
        // 如果是一个字符串，则按逗号分割并转换为整数数组
        const qualityInspectorArr = form.qualityInspector.split(',').map(inspector => parseInt(inspector, 10));
        return qualityInspectorArr
      } else if (form.qualityInspector === null || form.qualityInspector === undefined || form.qualityInspector === '') {
        // 如果为空、null或undefined，则设置为空数组
        return []
      }
    },
    // 查询用户列表
    getUserList() {
      listUser({ pageSize: 9999, pageNum: 1 }).then((res) => {
        this.userList = res.rows;
      });
    },
    getFileName(name) {
      if (name) {
        let arr = name.split('/')
        return arr[arr.length - 1];
      }
    },
  },
};
</script>

<style lang="scss" scoped>
@import "@/assets/styles/element-reset.scss";

::v-deep .el-input.is-disabled .el-input__inner {
  color: #686a6e;
}

::v-deep .el-textarea.is-disabled .el-textarea__inner,
.el-radio__input.is-disabled+span.el-radio__label {
  color: #686a6e;
}

::v-deep .el-radio__input.is-disabled+span.el-radio__label {
  color: #686a6e;
}
</style>
