[update] 添加企标制修订流程

2023-10-19 18:18:51 +08:00
parent 9a3adf5b07
commit fd7a57f281
13 changed files with 1141 additions and 4 deletions
@@ -0,0 +1,452 @@
+<template>
+  <internal-detail-page :title="pageTitle" :content-padding="0">
+    <!--  标题右侧tab  -->
+    <template v-slot:titleRightCustom>
+      <div class="table-operator-tab">
+        <!--  基础信息  -->
+        <a class="switch-item" :class="switchValue === 'base' ? 'table-operator-tab-active' : ''"
+           @click="switchChange('base')">{{ $t('basicInformation') }}
+        </a>
+        <!--  人员信息  -->
+        <a class="switch-item" :class="switchValue === 'user' ? 'table-operator-tab-active' : ''"
+           @click="switchChange('user')">{{ $t('personalInformation') }}
+        </a>
+      </div>
+    </template>
+    <!--  基础信息  -->
+    <div v-if="switchValue === 'base'" class="detail-page-scroll-content">
+      <!--  流程信息  -->
+      <div class="process-part-title">{{ $t('processInformation') }}</div>
+      <a-form :form="processInfoForm">
+        <a-row>
+          <a-col :span="12">
+            <!--  流程名称  -->
+            <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('processName')">
+              <a-input :placeholder="$t('pleaseEnter') + $t('processName')"
+                       @change="event => event.target.value = event.target.value.trim()"
+                       disabled
+                       :maxLength="50"
+                       v-decorator="['processName', validatorRules.processName]" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="12">
+            <!--  截止日期  -->
+            <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :label="$t('expirationDate')">
+              <a-date-picker :placeholder="$t('pleaseSelect') + $t('expirationDate')"
+                             style="width: 100%"
+                             :disabled="disabled"
+                             value-format="YYYY-MM-DD"
+                             v-decorator="['expirationDate']" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="24">
+            <!--  流程说明  -->
+            <a-form-item :labelCol="longLabelCol" :wrapperCol="longWrapperCol" :label="$t('processExplain')">
+              <a-textarea :placeholder="$t('pleaseEnter') + $t('processExplain')"
+                          :maxLength="500"
+                          :rows="4"
+                          :disabled="disabled"
+                          v-decorator="['processExplain']" />
+            </a-form-item>
+          </a-col>
+        </a-row>
+      </a-form>
+
+      <!--  业务基本信息  -->
+      <div class="process-part-title">{{ $t('basicServiceInformation') }}</div>
+      <!--  节点1、主起草人起草分发  -->
+      <main-drafter-sent-base-info v-if="currentNode === 1" :flowInitType="flowInitType" ref="baseInfoRef"></main-drafter-sent-base-info>
+      <!--  节点2、其他起草人上传企标  -->
+      <!--  节点3、主起草人汇总上传会议纪要  -->
+      <!--  节点4、标准化审核 -->
+      <!--  节点5、评分人打分  -->
+      <!--  节点6、标准化确认是否开启征求意见  -->
+      <!--  节点7、部所联络人下发  -->
+      <!--  节点8、征求意见对象填写意见  -->
+      <!--  节点9、部所联络人汇总数据  -->
+      <!--  节点10、部所联络人主管级领导审批  -->
+      <!--  节点11、主起草人汇总  -->
+      <!--  节点12、主起草人上传会议纪要  -->
+      <!--  节点13、其他起草人校对  -->
+      <!--  节点14、主管级领导审批  -->
+      <!--  节点15、标准化审批  -->
+      <!--  节点16、相关部门领导会签  -->
+      <!--  节点17、总工程师审批  -->
+      <!--  节点18、主起草人发布  -->
+
+      <!--  流程审批信息  -->
+      <div class="process-part-title">{{ $t('processApprovalInformation') }}</div>
+      <a-form :form="approvalInfoForm">
+        <!--备注-->
+        <a-form-item :labelCol="longLabelCol" :wrapperCol="longWrapperCol" :label="$t('remarks')">
+          <a-textarea :placeholder="$t('pleaseEnter') + $t('remarks')"
+                      :maxLength="500"
+                      :rows="4"
+                      v-decorator="['remarks', validatorRules.remarks]" />
+        </a-form-item>
+        <!--附件-->
+        <a-form-item :labelCol="longLabelCol" :wrapperCol="longWrapperCol" :label="$t('businessSupport.questionAnswer.attach')">
+          <j-upload v-decorator="['file']" return-id />
+        </a-form-item>
+      </a-form>
+    </div>
+
+    <!--  人员信息  -->
+    <div v-if="switchValue === 'user'" class="detail-page-scroll-content p-0">
+      <process-detail-list :url="url">
+        <personnel-info slot="personnelInfo" :data="personnelInfoData" :currentNode="currentNode"></personnel-info>
+      </process-detail-list>
+    </div>
+
+    <!--  操作按钮  -->
+    <div class="detail-page-bottom-operate-box" v-if="!onlyLook">
+      <!--  发起节点  -->
+      <template v-if="currentNode === 1">
+        <!--  保存  -->
+        <a-button type="primary" ghost :loading="loading" @click="handleSave"><i class="iconfont icon-save"></i> {{ $t('preservation') }}</a-button>
+        <!--  提交  -->
+        <a-button type="primary" :loading="loading" @click="handleStart" icon="upload">{{ $t('submit') }}</a-button>
+      </template>
+      <!--  各部所联络人填写/下发任务  -->
+      <template v-else-if="[2, 3, 5, 6, 7, 8, 9, 11, 12].includes(currentNode)">
+        <!--  转办  -->
+        <a-button type="primary" ghost :loading="loading" @click="handleTurnTo" icon="arrow-up">{{ $t('turnTo') }}</a-button>
+        <!--  保存  -->
+        <a-button type="primary" ghost :loading="loading" @click="handleSave"><i class="iconfont icon-save"></i> {{ $t('preservation') }}</a-button>
+        <!--  提交  -->
+        <a-button type="primary" :loading="loading" @click="handleSubmit" icon="upload">{{ $t('submit') }}</a-button>
+      </template>
+      <template v-else-if="currentNode === 18">
+        <!--  提交  -->
+        <a-button type="primary" :loading="loading" @click="handleSubmit" icon="upload">{{ $t('submit') }}</a-button>
+      </template>
+      <template v-else>
+        <!--  转办  -->
+        <a-button type="primary" ghost :loading="loading" @click="handleTurnTo" icon="arrow-up">{{ $t('turnTo') }}</a-button>
+        <!--  保存  -->
+        <a-button type="primary" ghost :loading="loading" @click="handleSave"><i class="iconfont icon-save"></i> {{ $t('preservation') }}</a-button>
+        <!--  同意  -->
+        <a-button type="primary" :loading="loading" @click="handleAgree" icon="check-circle">{{ $t('agree') }}</a-button>
+        <!--  驳回  -->
+        <a-button type="primary" :loading="loading" @click="handleReject" icon="close-circle">{{ $t('reject') }}</a-button>
+      </template>
+    </div>
+
+    <!--  选人弹框  -->
+    <user-select-modal ref="userSelectModal" type="radio" @change="userSelectModalChange"></user-select-modal>
+  </internal-detail-page>
+</template>
+
+<script>
+import InternalDetailPage from '@/components/InternalDetailPage'
+import UserSelectModal from '@/components/selection/UserSelectModal'
+import ProcessDetailList from '@/components/ProcessDetailList'
+import PersonnelInfo from '@/components/PersonnelInfo'
+import MainDrafterSentBaseInfo from './modules/MainDrafterSentBaseInfo'
+
+const personData = [
+  {
+    id: 1,
+    nodeName: '主起草人起草分发',
+    nodeRoleName: '主起草人',
+    canChoose: false
+  },
+  {
+    id: 2,
+    nodeName: '其他起草人上传企标',
+    nodeRoleName: '其他起草人',
+    canChoose: false
+  },
+  {
+    id: 3,
+    nodeName: '主起草人汇总上传会议纪要',
+    nodeRoleName: '主起草人',
+    canChoose: false
+  },
+  {
+    id: 4,
+    nodeName: '标准化审批',
+    nodeRoleName: '标准化',
+    canChoose: true,
+    chooseType: 'radio',
+    fieldName: ''
+  },
+  {
+    id: 5,
+    nodeName: '评分人打分',
+    nodeRoleName: '评分人',
+    canChoose: false
+  },
+  {
+    id: 6,
+    nodeName: '标准化确认是否开启征求意见',
+    nodeRoleName: '标准化',
+    canChoose: false
+  },
+  {
+    id: 7,
+    nodeName: '部所联络人下发',
+    nodeRoleName: '部所联络人',
+    canChoose: false
+  },
+  {
+    id: 8,
+    nodeName: '征求意见对象填写意见',
+    nodeRoleName: '征求意见对象',
+    canChoose: true,
+    chooseType: 'checkbox',
+    fieldName: ''
+  },
+  {
+    id: 9,
+    nodeName: '部所联络人汇总数据',
+    nodeRoleName: '部所联络人',
+    canChoose: false
+  },
+  {
+    id: 10,
+    nodeName: '部所联络人主管级领导审批',
+    nodeRoleName: '部所联络人主管级领导',
+    canChoose: false
+  },
+  {
+    id: 11,
+    nodeName: '主起草人汇总',
+    nodeRoleName: '主起草人',
+    canChoose: false
+  },
+  {
+    id: 12,
+    nodeName: '主起草人上传会议纪要',
+    nodeRoleName: '主起草人',
+    canChoose: false
+  },
+  {
+    id: 13,
+    nodeName: '其他起草人校对',
+    nodeRoleName: '其他起草人',
+    canChoose: false
+  },
+  {
+    id: 14,
+    nodeName: '主管级领导审批',
+    nodeRoleName: '主管级领导',
+    canChoose: false
+  },
+  {
+    id: 15,
+    nodeName: '标准化审批',
+    nodeRoleName: '标准化审批人',
+    canChoose: false
+  },
+  {
+    id: 16,
+    nodeName: '相关部门领导会签',
+    nodeRoleName: '相关部门领导',
+    canChoose: false
+  },
+  {
+    id: 17,
+    nodeName: '总工程师审批',
+    nodeRoleName: '总工程师',
+    canChoose: false
+  },
+  {
+    id: 18,
+    nodeName: '主起草人发布',
+    nodeRoleName: '主起草人',
+    canChoose: false
+  }
+]
+
+export default {
+  name: 'EnterpriseStandardRevisionFlow',
+  components: {
+    MainDrafterSentBaseInfo,
+    InternalDetailPage,
+    UserSelectModal,
+    ProcessDetailList,
+    PersonnelInfo
+  },
+  computed: {
+    pageTitle () {
+      return this.$t('flowCenter') + this.$route.meta.title
+    }
+  },
+  mounted () {
+    if (this.currentNode === 1) {
+      this.personnelInfoData = personData
+    } else {
+      this.personnelInfoData = personData.map(item => {
+        return { ...item, canChoose: false, fieldName: undefined }
+      })
+    }
+    // 如果是查看进入的，不可编辑，不可操作
+    if (this.$route.query.onlyLook) {
+      this.onlyLook = this.$route.query.onlyLook
+      this.disabled = this.$route.query.onlyLook
+    }
+  },
+  data () {
+    return {
+      loading: false,
+      switchValue: 'base',
+      processInfoForm: this.$form.createForm(this),
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 4 }
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 20 }
+      },
+      longLabelCol: {
+        xs: { span: 24 },
+        sm: { span: 2 }
+      },
+      longWrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 22 }
+      },
+      disabled: false,
+      onlyLook: false,
+      validatorRules: {
+        // 流程名称
+        processName: {
+          rules: [
+            {
+              required: true,
+              message: this.$t('pleaseEnter') + this.$t('processName')
+            }
+          ],
+          validateTrigger: 'blur'
+        },
+        // 备注
+        remarks: {
+          rules: [
+            {
+              required: false,
+              message: this.$t('pleaseEnter') + this.$t('remarks')
+            }
+          ],
+          validateTrigger: 'blur'
+        }
+      },
+      currentNode: 1,
+      approvalInfoForm: this.$form.createForm(this), // 审批信息表单
+      personnelInfoData: [], // 人员信息数据
+      url: {
+        list: '' // 人员信息右侧表的分页查询接口
+      },
+      flowInitType: 'newProcess' // 流程发起类型，是自动发起（auto）的还是从新建流程发起的(newProcess)
+    }
+  },
+  methods: {
+    switchChange (value) {
+      this.switchValue = value
+    },
+    // 保存
+    handleSave () {
+      // 有任意一项填了即可
+      // 流程信息表单
+      const processInfoForm = this.processInfoForm.getFieldsValue()
+      // 流程审批信息
+      const approvalInfoForm = this.approvalInfoForm.getFieldsValue()
+      // 人员信息的数据, 处理成对象
+      const personnelInfo = this.$refs.personnelInfo.stepsData
+      const personnelObj = {}
+      for (const item of personnelInfo) {
+        if (item.fieldName) {
+          personnelObj[item.fieldName] = item.user
+        }
+      }
+      // 需要传给后端的
+      // 业务基本信息
+      if (this.$refs.basicInfoFormRef) {
+
+      } else {
+        // 需要外层信息至少填了一项
+        const param = { ...processInfoForm, ...approvalInfoForm, ...personnelObj }
+        const flag = Object.values(param).some(v => !!v || v === 0)
+        if (!flag) {
+          // 提示至少填写一项
+          this.$message.warning(this.$t('pleaseFillInAtLeastOneItem'))
+          return
+        }
+      }
+      // 保存到草稿
+      // enterprisePlanApprovalSave(arr).then(res => {
+      //   if (res.success) {
+      //     this.$message.success(res.message)
+      //   } else {
+      //     this.$message.warning(res.message)
+      //   }
+      // })
+    },
+    // 节点一时候的提交，发起变更
+    handleStart () {
+      if (this.loading) return
+      // 人员信息的数据, 处理成对象
+      const personnelInfo = this.$refs.personnelInfo.stepsData
+      const personnelObj = {}
+      for (const item of personnelInfo) {
+        if (item.fieldName) {
+          personnelObj[item.fieldName] = item.user
+        }
+      }
+      // 校验是否填了所有能填的人员信息
+      if (!Object.values(personnelObj).every(v => !!v)) {
+        this.$message.warning(this.$t('pleaseEnterPersonnelInfo'))
+        return
+      }
+      this.processInfoForm.validateFields((err, values) => {
+        this.approvalInfoForm.validateFields((approvalErr, approvalValues) => {
+
+        })
+      })
+    },
+    // 转办
+    handleTurnTo () {
+      if (this.loading) return
+      // 点击显示选人组件
+      this.$refs.userSelectModal.open()
+    },
+    // 转办选完人的回调
+    userSelectModalChange (userIds) {
+      this.approvalInfoForm.validateFields((err, values) => {
+        if (!err) {
+          this.loading = true
+          const param = Object.assign({}, values)
+          param.userId = userIds
+          param.taskId = this.$route.query.taskId
+          // enterprisePlanApprovalTurnTo(param).then(res => {
+          //   if (res.success) {
+          //     this.$message.success(res.message)
+          //   } else {
+          //     this.$message.warning(res.message)
+          //   }
+          // }).finally(() => {
+          //   this.loading = false
+          // })
+        }
+      })
+    },
+    // 提交
+    handleSubmit () {
+
+    },
+    // 同意
+    handleAgree () {
+
+    },
+    // 驳回
+    handleReject () {
+
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+@import '~@assets/less/common.less';
+</style>