add 未符合项跟踪流程页面

src/views/workCenter/noMatchTrackingProcess/NoMatchTrackingProcess.vue

@@ -55,6 +55,61 @@
         </a-form-item>
       </a-form>
 
+      <!--业务基本信息-->
+      <div class="process-part-title">{{ $t('basicServiceInformation') }}</div>
+      <a-form :form="businessInfoForm" v-if="showSelectStandardForm">
+        <div class="form-flex-box">
+          <!--标准编号/标准名称-->
+          <div class="form-flex-item custom-flex-form-item">
+            <a-form-item :label="$t('projectLibrary.vehicleItemLibrary.standardNumberStandardName')">
+              <a-input :placeholder="$t('pleaseEnter') + $t('projectLibrary.vehicleItemLibrary.standardNumberStandardName')"
+                       @change="event => event.target.value = event.target.value.trim()"
+                       :maxLength="50"
+                       v-decorator="['standardNumberName', validatorRules.standardNumberName]" />
+            </a-form-item>
+          </div>
+          <!--项目名称-->
+          <div class="form-flex-item custom-flex-form-item">
+            <a-form-item :label="$t('projectLibrary.projectName')">
+              <a-input :placeholder="$t('pleaseEnter') + $t('projectLibrary.vehicleItemLibrary.standardNumberStandardName')"
+                       @change="event => event.target.value = event.target.value.trim()"
+                       :maxLength="50"
+                       v-decorator="['projectName']" />
+            </a-form-item>
+          </div>
+          <!--设计工程师-->
+          <div class="form-flex-item custom-flex-form-item">
+            <a-form-item :label="$t('workCenter.standardConsultationProcess.designEngineer')">
+              <user-selection v-decorator="['designEngineer', validatorRules.designEngineer]"
+                              type="checkbox"
+                              :placeholder="$t('pleaseSelect') + $t('workCenter.standardConsultationProcess.designEngineer')" />
+            </a-form-item>
+          </div>
+
+          <!--按条件查询-->
+          <a-button type="primary" class="form-search-btn" @click="selectStandard">{{ $t('workCenter.noMatchTracking.queryByCondition') }}</a-button>
+        </div>
+
+      </a-form>
+
+      <component v-if="tableComponent"
+                 :is="tableComponent"
+                 :columns="columns"
+                 :data-source="dataSource"
+                 :pagination="false"
+                 :scroll="{x: '100%'}"
+                 :extra-form="extraForm"
+                 :all-disabled="expandTableDisabled">
+        <!--跳转标准详情-->
+        <template v-slot:detail="{text, record}">
+          <a-tooltip overlay-class-name="tooltip-style">
+            <template slot="title">{{ text || text === 0 ? text : global.emptyLine }}</template>
+            <div class="table-text can-click-table-text" v-if="text || text === 0" @click="toDetailPage(record)">{{ text }}</div>
+            <div v-else class="table-text">{{ global.emptyLine }}</div>
+          </a-tooltip>
+        </template>
+      </component>
+
       <!--流程审批信息-->
       <div class="process-part-title">{{ $t('processApprovalInformation') }}</div>
       <a-form :form="approvalInfoForm">
@@ -105,6 +160,9 @@
         {{ $t('reject') }}
       </a-button>
     </div>
+
+    <!--按条件查询选择标准弹框-->
+    <no-match-item-select-drawer ref="selectStandardDrawer" @listChange="handleStandardSelected" />
   </internal-detail-page>
 </template>
 
@@ -113,17 +171,14 @@ import PersonnelInfo from '../../../components/PersonnelInfo'
 import InternalDetailPage from '../../../components/InternalDetailPage'
 import ProcessDetailList from '../../../components/ProcessDetailList'
 import { WorkCenterMixin } from '../../../mixins/WorkCenterMixin'
-import { ProcessKey } from '../../../enums/commonEnums'
+import { ProcessKey, NoMatchTrackingNodes } from '../../../enums/commonEnums'
+import UserSelection from '../../../components/selection/UserSelection'
+import NoMatchItemSelectDrawer from './modules/NoMatchItemSelectDrawer'
 
 export default {
   name: 'NoMatchTrackingProcess',
-  components: { ProcessDetailList, InternalDetailPage, PersonnelInfo },
+  components: { ProcessDetailList, InternalDetailPage, PersonnelInfo, UserSelection, NoMatchItemSelectDrawer },
   mixins: [WorkCenterMixin],
-  computed: {
-    pageTitle () {
-      return `${this.$t('flowCenter')}${this.$route.meta.title}`
-    }
-  },
   data () {
     return {
       loading: false,
@@ -135,6 +190,10 @@ export default {
       // 审批信息的表单
       approvalInfoForm: this.$form.createForm(this),
       approvalInfo: {},
+      // 业务基本信息表单（发起时候的查询条件）
+      businessInfoForm: this.$form.createForm(this),
+      businessInfo: {},
+      currentNode: '2',
       labelCol: {
         xs: { span: 24 },
         sm: { span: 4 }
@@ -156,12 +215,210 @@ export default {
         handleText: {
           rules: [{ required: false, message: this.$t('pleaseEnter') + this.$t('remarks') }],
           validateTrigger: 'blur'
+        },
+        // 标准编号/标准名称
+        standardNumberName: {
+          rules: [{ required: true, message: this.$t('pleaseEnter') + this.$t('projectLibrary.vehicleItemLibrary.standardNumberStandardName') }],
+          validateTrigger: 'blur'
+        },
+        // 设计工程师
+        designEngineer: {
+          rules: [{ required: true, message: this.$t('pleaseSelect') + this.$t('workCenter.standardConsultationProcess.designEngineer') }],
+          validateTrigger: 'change'
         }
+      },
+      columns: [
+        // 标准编号
+        {
+          dataIndex: 'standardNumber',
+          title: this.$t('standardNumber'),
+          width: 150,
+          align: 'center',
+          scopedSlots: { customRender: 'detail' }
+        },
+        // 标准名称
+        {
+          dataIndex: 'standardName',
+          title: this.$t('standardName'),
+          width: 150,
+          scopedSlots: { customRender: 'detail' }
+        },
+        // 问题类型
+        {
+          dataIndex: '1',
+          title: this.$t('workCenter.noMatchTracking.problemTypes'),
+          width: 150,
+          align: 'center',
+          scopedSlots: { customRender: 'text' }
+        },
+        // 条款号
+        {
+          dataIndex: 'termNumber',
+          title: this.$t('workCenter.enStandardRevision.clauseNumber'),
+          width: 150,
+          align: 'center',
+          scopedSlots: { customRender: 'text' }
+        },
+        // 条款名称
+        {
+          title: this.$t('workCenter.enStandardRevision.clauseName'),
+          width: 150,
+          dataIndex: 'termName',
+          align: 'center',
+          scopedSlots: { customRender: 'text' }
+        },
+        // 相关项目
+        {
+          title: this.$t('projectLibrary.noncoincidenceItem.relevantProject'),
+          width: 150,
+          dataIndex: '2',
+          align: 'center',
+          scopedSlots: { customRender: 'text' }
+        },
+        // 责任部门
+        {
+          dataIndex: 'departmentId_dictText',
+          title: this.$t('projectLibrary.vehicleItemLibrary.responsibleDepartment'),
+          width: 120,
+          align: 'center',
+          scopedSlots: { customRender: 'text' }
+        },
+        // 设计工程师
+        {
+          dataIndex: 'engineerName',
+          title: this.$t('workCenter.standardConsultationProcess.designEngineer'),
+          width: 120,
+          align: 'center',
+          scopedSlots: { customRender: 'text' }
+        },
+        // 预计整改完成日期
+        {
+          dataIndex: 'expectedTime',
+          title: this.$t('projectLibrary.vehicleItemLibrary.estimatedDateOfCompletionOfRectification'),
+          width: 180,
+          align: 'center',
+          scopedSlots: { customRender: 'text' }
+        }
+      ],
+      dataSource: [{ id: 1, standardNumber: '124' }],
+      // 展开表格的规则
+      extraForm: {
+        rules: {
+          // 依据描述
+          basisDescription: {
+            required: true,
+            message: this.$t('pleaseEnter') + this.$t('projectLibrary.specialProjectLibrary.basisDescription'),
+            trigger: 'blur'
+          },
+          // 佐证材料
+          basisFile: {
+            required: false,
+            message: this.$t('pleaseUpload') + this.$t('projectLibrary.specialProjectLibrary.supportingMaterial'),
+            trigger: 'change'
+          }
+        },
+        formArr: [
+          {
+            fieldShowType: 1,
+            dbFieldTxt: this.$t('projectLibrary.specialProjectLibrary.basisDescription'),
+            dbFieldName: 'basisDescription'
+          },
+          {
+            fieldShowType: 2,
+            dbFieldTxt: this.$t('projectLibrary.specialProjectLibrary.supportingMaterial'),
+            dbFieldName: 'basisFile',
+            fileType: 'pdf,doc,docx,pptx,ppt,jpg,jpeg,png,xls,xlsx,bmp'
+          }
+        ]
       }
     }
   },
+  computed: {
+    pageTitle () {
+      return `${this.$t('flowCenter')}${this.$route.meta.title}`
+    },
+    // 是否展示选择标准的表单
+    showSelectStandardForm () {
+      return this.currentNode === NoMatchTrackingNodes.initial.value
+    },
+    // 表格用哪个组件
+    tableComponent () {
+      if (this.showSelectStandardForm) {
+        return resolve => require(['../../../components/jero/JTable.vue'], resolve)
+      }
+      return resolve => require(['../../../components/JExpandTable.vue'], resolve)
+    },
+    // 展开表格是否禁用，设计工程师上传整改材料节点不禁用
+    expandTableDisabled () {
+      return this.currentNode !== NoMatchTrackingNodes.designEngineer.value
+    }
+  },
   created () {
-    this.getPersonInfoStructure(ProcessKey.NO_MATCH_TRACKING.value)
+    // if (this.$route.query.processInstanceId || this.$route.query.draftId) {
+    //   this.currentNode = this.$route.query.nodeId
+    //   this.initProcessInfo()
+    // } else {
+    //   this.currentNode = NoMatchTrackingNodes.initial.value
+    // }
+    // 如果节点不是固定节点，就默认显示审批节点的信息
+    this.btnList = NoMatchTrackingNodes.propertyOfValue('btn', this.currentNode) || NoMatchTrackingNodes.regulatoryEngineer.btn
+    this.getPersonInfoStructure(ProcessKey.NO_MATCH_TRACKING.value, () => {
+      this.initPersonInfoData(this.current)
+    })
+  },
+  methods: {
+    /**
+     * 获取流程信息
+     */
+    initProcessInfo () {
+
+    },
+    /**
+     * 选择标准
+     */
+    selectStandard () {
+      this.businessInfoForm.validateFields((errors, values) => {
+        if (!errors) {
+          this.$refs.selectStandardDrawer.open(values)
+        }
+      })
+    },
+    handleStandardSelected (list) {
+      this.dataSource = list
+    },
+    /**
+     * 跳转标准详情
+     * @param record
+     */
+    toDetailPage ({ standardId, splitStandardSource }) {
+      let path
+      // 根据来源跳转不同的详情页
+      switch (splitStandardSource) {
+        // 国内
+        case StandardSource.DOMESTIC.value:
+          path = '/standardRegulationLibrary/DomesticStandardDetail'
+          break
+        // 海外
+        case StandardSource.OVERSEAS.value:
+          path = '/standardRegulationLibrary/OverseasStandardDetail'
+          break
+        // 企标
+        case StandardSource.ENTERPRISE.value:
+          path = '/enterpriseStandardLibrary/enterpriseStandardDetail'
+          break
+        default:
+          break
+      }
+      if (!path) {
+        return
+      }
+      const query = {
+        id: standardId
+      }
+      this.$openPageNewSheet({
+        path, query
+      })
+    }
   }
 }
 </script>
@@ -169,4 +426,19 @@ export default {
 <style scoped lang="less">
 @import '~@assets/less/common.less';
 
+.box-title-text .title-text {
+  width: 9rem;
+}
+
+.form-flex-item {
+  width: calc((100% - 105px) / 3);
+}
+
+.form-flex-item:first-child {
+  padding-left: 0;
+}
+
+/deep/ .custom-flex-form-item .ant-form-item .ant-form-item-label {
+  width: 8.5rem;
+}
 </style>