握手流程布局

2022-04-22 15:25:17 +08:00
parent f045b83232
commit 9379c958a7
8 changed files with 557 additions and 17 deletions
@@ -707,5 +707,13 @@ module.exports = {
  enclosure:'enclosure',
  // 认证
  parameterTemplate: 'parameter Template',
-  contentDescription: 'content Description'
+  contentDescription: 'content Description',
+  circulationInformation:'Circulation information',
+  circulationHistory:'circulation History',
+  agree:'agree',
+  disagree:'disagree',
+  feedbackMessage:'Feedback Message',
+  result:'result',
+  opinion:'opinion',
+  operationNode:'operation node',
 }
@@ -712,5 +712,13 @@ module.exports = {
  enclosure:'附件',
  // 认证
  parameterTemplate: '参数模板',
-  contentDescription: '内容说明'
+  contentDescription: '内容说明',
+  circulationInformation:'流转信息',
+  circulationHistory:'流转历史',
+  agree:'同意',
+  disagree:'不同意',
+  feedbackMessage:'反馈意见',
+  result:'结果',
+  opinion:'意见',
+  operationNode:'操作节点',
 }
@@ -0,0 +1,84 @@
+<template>
+  <div class="box">
+    <div class="box-text">
+      <div class="header-text">
+        {{$t('circulationHistory')}}
+      </div>
+    </div>
+    <div style="width: 100%">
+      <a-table
+        ref="table"
+        :loading="loading"
+        :pagination="false"
+        :scroll="{x: true}"
+        :data-source="dataSource"
+        :columns="columns"
+      >
+      </a-table>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'circulationHistory',
+    data() {
+      return {
+        dataSource: [],
+        loading: false,
+        columns: [
+          {
+            title: this.$t('result'),
+            dataIndex: 'result',
+            align: 'center'
+          },
+          {
+            title: this.$t('opinion'),
+            dataIndex: 'opinion',
+            align: 'center'
+          },
+          {
+            title: this.$t('enclosure'),
+            dataIndex: 'enclosure',
+            align: 'center'
+          },
+          {
+            title: this.$t('operationNode'),
+            dataIndex: 'operationNode',
+            align: 'center'
+          },
+          {
+            title: this.$t('Operator'),
+            dataIndex: 'Operator',
+            align: 'center'
+          },
+          {
+            title: this.$t('operationTime'),
+            dataIndex: 'operationTime',
+            align: 'center'
+          }
+        ]
+      }
+    }
+  }
+</script>
+
+<style scoped lang="less">
+  .box {
+    padding: 0 24px 24px 24px;
+    box-sizing: border-box;
+  }
+
+  .box-text {
+    display: flex;
+    justify-content: space-between;
+    height: 60px;
+    line-height: 40px;
+
+    .header-text {
+      font-size: 16px;
+      font-weight: 400;
+      color: #000F16;
+    }
+  }
+</style>
@@ -0,0 +1,183 @@
+<template>
+  <div class="box">
+    <div class="box-text">
+      <div class="header-text">
+        {{$t('circulationInformation')}}
+      </div>
+    </div>
+    <a-form-model :model="formInline" class="formAdd" :rules="rules" ref="ruleForm">
+      <a-row :gutter="24">
+        <a-col :span="24">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="title-text-text" :title="$t('reviewResults')">{{$t('reviewResults')}}</span>
+            </div>
+            <a-form-model-item class="itemModel" prop="standard">
+              <a-radio-group style="margin-top: 2px" class="box-input" v-model="formInline.resource">
+                <a-radio value="1">
+                  {{$t('agree')}}
+                </a-radio>
+                <a-radio value="2">
+                  {{$t('disagree')}}
+                </a-radio>
+                <a-radio value="3">
+                  {{$t('issue')}}
+                </a-radio>
+              </a-radio-group>
+            </a-form-model-item>
+          </div>
+        </a-col>
+      </a-row>
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="title-text-text" :title="$t('feedbackMessage')">{{$t('feedbackMessage')}}</span>
+            </div>
+            <a-form-model-item class="itemModel" prop="standard">
+              <a-textarea placeholder="Basic usage" v-model="formInline.desc" :rows="4" />
+            </a-form-model-item>
+          </div>
+        </a-col>
+      </a-row>
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="title-text-text" :title="$t('enclosure')">{{$t('enclosure')}}</span>
+            </div>
+            <a-form-model-item class="itemModel" prop="enclosure">
+              <a-button type="primary" class="button-text"
+                        @click="clickButtonToUpload('enclosure')">
+                {{ (formInline.enclosure === 'null' || formInline.enclosure === '' ||
+                formInline.enclosure == null) ? $t('clickUpload') : $t('viewUploadedFiles')
+                }}
+              </a-button>
+            </a-form-model-item>
+          </div>
+        </a-col>
+      </a-row>
+    </a-form-model>
+    <uploadFile ref="uploadFile" @uploadSuccess="uploadSuccess"/>
+  </div>
+</template>
+
+<script>
+  import { getAction, postAction } from '@/api/manage'
+  import uploadFile from '@/components/uploadFile/file'
+  export default {
+    name: 'examineInformation',
+    components:{
+      uploadFile
+    },
+    data() {
+      return {
+        formInline: {},
+        rules: {}
+      }
+    },
+    mounted() {
+    },
+    methods:{
+      clickButtonToUpload(item) {
+        this.$refs.uploadFile.perentHandleFunc()
+        this.$refs.uploadFile.visible = true
+        this.uploadName = item
+        getAction('sys/common/getFileInfos', { id: this.formInline[item] }).then((res) => {
+          if (res.success) {
+            this.$refs.uploadFile.perentHandleFunc(res.result)
+          } else {
+            this.$refs.uploadFile.perentHandleFunc()
+          }
+        })
+      },
+      /** 上传文件的回调 */
+      uploadSuccess(data) {
+        let attIdList = []
+        if (data && data.length > 0) {
+          data.map(item => {
+            attIdList.push(item.id || data.name)
+          })
+        }
+        /** 赋值给当前对应的表单文件 */
+        this.formInline[this.uploadName] = attIdList.join(',')
+        this.formInline = { ...this.formInline }
+      },
+    },
+  }
+</script>
+
+<style scoped lang="less">
+  .box {
+    padding: 0 24px 24px 24px;
+    box-sizing: border-box;
+  }
+
+  .box-text {
+    display: flex;
+    justify-content: space-between;
+    height: 60px;
+    line-height: 40px;
+
+    .header-text {
+      font-size: 16px;
+      font-weight: 400;
+      color: #000F16;
+    }
+  }
+
+  .box-title-text {
+    line-height: 1.4;
+    display: flex;
+    /*align-items: center;*/
+  }
+
+  .title-text {
+    width: 57px;
+    text-align: right;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    height: 42px;
+    line-height: 48px;
+    color: #000F16;
+  }
+
+  .box-input {
+    display: inline-block;
+    height: 38px;
+    width: 100%;
+  }
+
+  .itemModel {
+    width: calc(100% - 130px);
+    display: inline-block;
+    margin-top: 2px;
+    margin-bottom: 12px;
+  }
+
+  .Required {
+    color: red;
+    margin-right: 4px;
+  }
+
+  .title-text-text {
+    margin-top: 9px;
+  }
+
+  .formAdd {
+    margin-bottom: 40px;
+  }
+  .button-text {
+    height: 38px;
+    width: calc(100% - 100px);
+    line-height: 38px;
+    background: #fff;
+    border: 1px #00B3BE solid;
+    color: #00B3BE;
+  }
+</style>
@@ -62,6 +62,9 @@
      },
      submit() {
        this.$emit('submit')
+      },
+      backTo() {
+
      }
    }
  }
@@ -72,7 +75,7 @@
    position: fixed;
    top: 0;
    width: 100%;
-
+     z-index: 999;
    .process-header-top {
      height: 56px;
      line-height: 56px;
@@ -125,6 +128,7 @@
        font-size: 20px;
        font-width: 600;
        color: #040B29;
+
        .back-to {
          margin-right: 10px;
        }
@@ -38,7 +38,7 @@
    },
    data() {
      return {
-        queryForm: {}
+        queryForm: {},
      }
    },
    mounted() {
@@ -0,0 +1,239 @@
+<template>
+  <div style="width: 100%;padding: 0 24px 24px 24px">
+    <a-table
+      ref="table"
+      :loading="loading"
+      :pagination="false"
+      :scroll="{x: true}"
+      :data-source="dataSource"
+      :columns="columns"
+    >
+        <span slot="designDeliverableTemplateName" slot-scope="text,record">
+          <span>{{ record.designDeliverableType_dictText }}</span><br v-if="record.designDeliverableType_dictText">
+           <a v-if="record.designDeliverableTemplate && record.designDeliverableTemplate.split(',').length == 1"
+              @click="pdfPreviewClick(record.designDeliverableTemplateName,record.designDeliverableTemplate)">
+             {{ record.designDeliverableTemplateName }}
+           </a>
+           <a v-else-if="record.designDeliverableTemplate && record.designDeliverableTemplate.split(',').length > 1"
+              @click="clickButtonToUpload(record.designDeliverableTemplate)">{{ $t('viewFile') }}</a>
+           <span v-else>--</span>
+        </span>
+      <span slot="prehomoDeliverableTemplateName" slot-scope="text,record">
+           <span>{{ record.prehomoDeliverableType_dictText }}</span><br v-if="record.prehomoDeliverableType_dictText">
+           <a v-if="record.prehomoDeliverableTemplate && record.prehomoDeliverableTemplate.split(',').length == 1"
+              @click="pdfPreviewClick(record.prehomoDeliverableTemplateName,record.prehomoDeliverableTemplate)">
+             {{ record.prehomoDeliverableTemplateName }}
+           </a>
+           <a v-else-if="record.prehomoDeliverableTemplate && record.prehomoDeliverableTemplate.split(',').length > 1"
+              @click="clickButtonToUpload(record.prehomoDeliverableTemplate)">{{ $t('viewFile') }}</a>
+           <span v-else>--</span>
+        </span>
+      <span slot="verifyDeliverableTemplateName" slot-scope="text,record">
+          <span>{{ record.verifyDeliverableType_dictText }}</span><br v-if="record.verifyDeliverableType_dictText">
+           <a v-if="record.verifyDeliverableTemplate && record.verifyDeliverableTemplate.split(',').length == 1"
+              @click="pdfPreviewClick(record.verifyDeliverableTemplateName,record.verifyDeliverableTemplate)">
+             {{ record.verifyDeliverableTemplateName }}
+           </a>
+           <a v-else-if="record.verifyDeliverableTemplate && record.verifyDeliverableTemplate.split(',').length > 1"
+              @click="clickButtonToUpload(record.verifyDeliverableTemplate)">{{ $t('viewFile') }}</a>
+           <span v-else>--</span>
+        </span>
+    </a-table>
+    <a-modal
+      :title="$t('deliverableTemplate')"
+      :width="600"
+      :visible="visibleFile"
+      :maskClosable="false"
+      @ok="visibleFile = false"
+      @cancel="visibleFile = false"
+    >
+      <a-table
+        class="table"
+        :columns="columnsFile"
+        :pagination="false"
+        :scroll="{x:500,y: 400}"
+        :data-source="dataSourceFile"
+        :loading="loading"
+      >
+        <span slot="fileOperation" slot-scope="record">
+          <a class="text" @click="pdfPreview(record)">
+                {{ $t('See') }}
+          </a>
+          <a class="text" @click="download(record)">
+                {{ $t('download') }}
+          </a>
+        </span>
+      </a-table>
+    </a-modal>
+  </div>
+</template>
+
+<script>
+  import { Base64 } from 'js-base64'
+  import { getAction, postAction, downloadFile, deleteAction } from '@/api/manage'
+
+  export default {
+    name: 'standardContentList',
+    data() {
+      return {
+        dataSource: [],
+        columns: [
+          {
+            title: this.$t('confirmationOfDesignConformity'),
+            children: [
+              {
+                title: this.$t('Deliverables'),
+                dataIndex: 'designDeliverableTemplateName',
+                align: 'center',
+                scopedSlots: { customRender: 'designDeliverableTemplateName' }
+              },
+              {
+                title: this.$t('Sponsor'),
+                dataIndex: 'designInitiatorName',
+                align: 'center'
+              },
+              {
+                title: this.$t('personLiable'),
+                dataIndex: 'designDutyName',
+                align: 'center'
+              },
+              {
+                title: this.$t('TaskCutOffTime'),
+                dataIndex: 'designDueDate',
+                align: 'center'
+              }
+            ]
+          },
+          {
+            title: this.$t('PrehomoConfirmation'),
+            children: [
+              {
+                title: this.$t('Deliverables'),
+                dataIndex: 'prehomoDeliverableTemplateName',
+                align: 'center',
+                scopedSlots: { customRender: 'prehomoDeliverableTemplateName' }
+              },
+              {
+                title: this.$t('Sponsor'),
+                dataIndex: 'prehomoInitiatorName',
+                align: 'center'
+              },
+              {
+                title: this.$t('personLiable'),
+                dataIndex: 'prehomoDutyName',
+                align: 'center'
+              },
+              {
+                title: this.$t('TaskCutOffTime'),
+                dataIndex: 'prehomoDueDate',
+                align: 'center'
+              }
+            ]
+          },
+          {
+            title: this.$t('verificationAndConformityconfirmation'),
+            children: [
+              {
+                title: this.$t('Deliverables'),
+                dataIndex: 'verifyDeliverableTemplateName',
+                align: 'center',
+                scopedSlots: { customRender: 'verifyDeliverableTemplateName' }
+              },
+              {
+                title: this.$t('Sponsor'),
+                dataIndex: 'verifyInitiatorName',
+                align: 'center'
+              },
+              {
+                title: this.$t('personLiable'),
+                dataIndex: 'verifyDutyName',
+                align: 'center'
+              },
+              {
+                title: this.$t('TaskCutOffTime'),
+                dataIndex: 'verifyDueDate',
+                align: 'center'
+              }
+            ]
+          }
+        ],
+        loading: false,
+        dataSourceFile: [],
+        visibleFile:false,
+        columnsFile: [
+          {
+            title: this.$t('deliverableTemplate'),
+            dataIndex: 'fileName',
+            align: 'center',
+            width: 260,
+            ellipsis: true
+          },
+          {
+            title: this.$t('operation'),
+            align: 'center',
+            width: 130,
+            scopedSlots: { customRender: 'fileOperation' }
+          }
+        ]
+      }
+    },
+    mounted() {
+    },
+    methods: {
+      pdfPreview(fileQuery) {
+        let fileName = fileQuery.fileName
+        let index1 = fileName.lastIndexOf('.')
+        let index2 = fileName.length
+        let fileSuffix = fileName.substring(index1, index2)
+        if (fileSuffix == '.pdf') {
+          window.open('/pdf/web/viewer.html?file=' + encodeURIComponent('/jero-boot/sys/common/pdf/viewFile?id=' + fileQuery.id))
+        } else if (fileSuffix == '.docx') {
+          let url = window._CONFIG['onlinePreviewDomainURL'] + '?url=' + Base64.encode(this.downLoadFileUrl + '/' + fileQuery.id + fileSuffix)
+          window.open(url, '_blank')
+        } else if (fileSuffix == '.xlsx' || fileSuffix == '.xls') {
+          let url = window._CONFIG['onlinePreviewDomainURL'] + '?url=' + Base64.encode(this.downLoadFileUrl + '/' + fileQuery.id + fileSuffix)
+          window.open(url, '_blank')
+        } else {
+          downloadFile('/sys/common/downLoadFile', fileQuery.fileName, { id: fileQuery.id })
+        }
+      },
+      pdfPreviewClick(name, id) {
+        let fileName = name
+        let index1 = fileName.lastIndexOf('.')
+        let index2 = fileName.length
+        let fileSuffix = fileName.substring(index1, index2)
+        if (fileSuffix == '.pdf') {
+          window.open('/pdf/web/viewer.html?file=' + encodeURIComponent('/jero-boot/sys/common/pdf/viewFile?id=' + id))
+        } else if (fileSuffix == '.docx') {
+          let url = window._CONFIG['onlinePreviewDomainURL'] + '?url=' + Base64.encode(this.downLoadFileUrl + '/' + id + fileSuffix)
+          window.open(url, '_blank')
+        } else if (fileSuffix == '.xlsx' || fileSuffix == '.xls') {
+          let url = window._CONFIG['onlinePreviewDomainURL'] + '?url=' + Base64.encode(this.downLoadFileUrl + '/' + id + fileSuffix)
+          window.open(url, '_blank')
+        } else {
+          downloadFile('/sys/common/downLoadFile', name, { id: id })
+        }
+      },
+      download(item) {
+        downloadFile('/sys/common/downLoadFile', item.fileName, { id: item.id })
+      },
+      clickButtonToUpload(item) {
+        this.loading = true
+        this.visibleFile = true
+        getAction('sys/common/getFileInfos', { id: item }).then((res) => {
+          if (res.success) {
+            this.dataSourceFile = res.result
+            this.loading = false
+          } else {
+            this.dataSourceFile = []
+            this.loading = false
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>
@@ -7,16 +7,21 @@
      @terminationProcess="terminationProcess"
      @submit="submit"
    />
-    <div class="content">
-      <projectInformation
-        :projectInformationList="projectInformationList"
-        :url="url"
-        :projectInformationId="'1517332232949133313'"
-      />
-      <standardContent
-        :standardContentList="standardContentList"
-        :url="url"
-      />
+    <div class="detail-box">
+      <div class="detail-content" style="height: 100%">
+        <projectInformation
+          :projectInformationList="projectInformationList"
+          :url="url"
+          :projectInformationId="'1517332232949133313'"
+        />
+        <standardContent
+          :standardContentList="standardContentList"
+          :url="url"
+        />
+        <standardContentList :url="url"/>
+        <examineInformation :url="url"/>
+        <circulationHistory :url="url"/>
+      </div>
    </div>
  </div>
 </template>
@@ -25,13 +30,19 @@
  import headerProcess from '../../components/headerProcess'
  import projectInformation from '../../components/projectInformation'
  import standardContent from '../../components/standardContent'
+  import standardContentList from '../../components/standardContentList'
+  import examineInformation from '../../components/examineInformation'
+  import circulationHistory from '../../components/circulationHistory'

  export default {
    name: 'handshakeProcess',
    components: {
      headerProcess,
      projectInformation,
-      standardContent
+      standardContent,
+      standardContentList,
+      examineInformation,
+      circulationHistory
    },
    data() {
      return {
@@ -138,7 +149,10 @@
 </script>

 <style scoped>
-  .content {
-    padding-top: 60px;
+  .detail-box {
+    padding: 67px 0 0 0;
+    background: #ffffff;
+    height: 100%;
+    overflow: auto;
  }
 </style>