cmc-oa/oa-ui/src/views/flowable/form/projectProcess/technicalTab.vue

<!--
 * @Author: ysh
 * @Date: 2024-04-19 15:32:00
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2024-04-19 17:33:30
-->
<template>
  <div class="app-container">
    <el-empty description="技术方案未编制" v-if="!haveTechnical"></el-empty>
    <div v-if="haveTechnical">
      <h3 class="text-center">{{ form.projectNumber + '-' + form.projectName + ' 技术交底' }}</h3>
      <el-form ref="technicalForm" :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 : planUser }} </span>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="日期：" label-width="120px">
              <span> {{ form.technicalTime ? form.technicalTime : technicalTime }} </span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="技术方案" prop="technicalDocument">
          <el-input v-model="form.technicalDocument" placeholder="请输入技术方案" />
        </el-form-item>
        <el-form-item label="方案说明" prop="designDescription">
          <el-input type="textarea" 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 : designUser }} </span>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="日期：" label-width="120px">
              <span> {{ form.technicalUploadTime ? form.technicalUploadTime : technicalUploadTime }} </span>
            </el-form-item>
          </el-col>
        </el-row>
        <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="technicalPlanner">
              <span class="auditor"> {{ form.planUser ? form.planUser.nickName : planUser }} </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="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 }} </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>
  </div>
</template>

<script>
import technicalForm from "../technicalForm.vue";
import { listUser } from "@/api/system/user";
import {
  listTechnical,
  getTechnical,
  delTechnical,
  addTechnical,
  updateTechnical,
} from "@/api/oa/technical/technical";
export default {
  components: { technicalForm },
  props: {
    taskForm: {
      type: Object,
      require: true,
    },
  },
  computed: {
    projectNumber() {
      return this.$store.state.projectProcess.projectNumber;
    },
    projectName() {
      return this.$store.state.projectProcess.projectName;
    },
  },
  watch:{
    projectNumber(newval){
      this.$set(this.form, "projectNumber", newval);
    },
    projectName(newval){
      this.$set(this.form, "projectName", newval);
    }
  },
  data() {
    return {
      haveTechnical: false,
      form: {},
      rules: {},
      userList: [],
    };
  },
  mounted() {
    this.initForm();
    this.getUserList();
  },
  methods: {
    /** 查询cmc技术交底列表 */
    initForm() {
      getTechnical(this.taskForm.formId).then((res) => {
        console.log(res);
        if (res.data) {
          this.haveTechnical = true;
          this.form = res.data;
          this.$set(this.form, "projectNumber", this.projectNumber);
          this.$set(this.form, "projectName", this.projectName);
        }
      });
    },
    // 查询用户列表
    getUserList() {
      listUser({ pageSize: 9999, pageNum: 1 }).then((res) => {
        this.userList = res.rows;
      });
    },
  },
};
</script>

<style lang="scss" scoped>
::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>