待办中心-项目法规任务-办理抽屉

jero-web/src/common/lang/en-us.js

@@ -1499,6 +1499,7 @@ module.exports = {
   fillincontent:'Fill in content',
   upgradepacketprotectionmeasures:'Upgrade packet protection measures',
   controlsystem:'This section describes how to identify and save the software upgrade version (set) of the electronic control system',
+  controlsystem:'This section describes how to identify and save the software upgrade version (set) of the electronic control system',
   vehicledynamictype:'Vehicle dynamic type',
   upgradetargetmodel:'Upgrade target model',
   thetargetvehicleofthisupgrade:'The target vehicle of this upgrade',
@@ -1511,5 +1512,9 @@ module.exports = {
   dateofproduction:'Date of production',
   VINcodelist:'VIN code list',
   VINcodeupload:'VIN code upload',
-
+  Tasknode:'Task Node',
+  Taskresponsibilityrecognition:'Task responsibility recognition',
+  uploadattachment:'Upload attachment',
+  Processhistory:'Process history',
+  resultofhandling:'Result of handling'
 }

jero-web/src/common/lang/zh-cn.js

@@ -1613,4 +1613,9 @@ module.exports = {
   dateofproduction:'生产日期',
   VINcodelist:'VIN码清单',
   VINcodeupload:'VIN码上传',
+  Tasknode:'任务节点',
+  Taskresponsibilityrecognition:'任务责任确认',
+  uploadattachment:'上传附件',
+  Processhistory:'流程历史',
+  resultofhandling:'处理结果'
 }

jero-web/src/views/toDoCenter/projectRegulationTasks/components/dealtWith.vue

@@ -10,6 +10,7 @@
       rowKey="id"
       :data-source="dataSource"
       :columns="columns"
+      :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
     >
       <!--         -->
       <span slot="endTime" slot-scope="text,record">
@@ -44,6 +45,174 @@
         @showSizeChange="SizeChange"
       />
     </div>
+    <a-drawer
+      :title="title"
+      :maskClosable="false"
+      :width="948"
+      placement="right"
+      :closable="true"
+      @close="handleCancel"
+      :visible="visible"
+      style="height: 100%;overflow: auto;padding-bottom: 53px;">
+      <div style="margin-bottom: 40px">
+        <div class="header-text">
+          {{$t('basicInformation')}}
+        </div>
+        <div class="content-text">
+          <div class="text-field">
+            <span class="text-field-left" :title="$t('entryName')">{{$t('entryName')}}</span>
+            <span class="text-field-right "
+                  :title="$t('entryName')"
+            >{{$t('entryName')}}</span>
+          </div>
+          <div class="text-field">
+            <span class="text-field-left" :title="$t('regulationNo')">{{$t('regulationNo')}}</span>
+            <span class="text-field-right "
+                  :title="$t('regulationNo')"
+            >{{$t('regulationNo')}}</span>
+          </div>
+          <div class="text-field">
+            <span class="text-field-left" :title="$t('title')">{{$t('title')}}</span>
+            <span class="text-field-right "
+                  :title="$t('title')"
+            >{{$t('title')}}</span>
+          </div>
+          <div class="text-field">
+            <span class="text-field-left" :title="$t('subtitle')">{{$t('subtitle')}}</span>
+            <span class="text-field-right "
+                  :title="$t('subtitle')"
+            >{{$t('subtitle')}}</span>
+          </div>
+          <div class="text-field">
+            <span class="text-field-left" :title="$t('applicableSupplement')">{{$t('applicableSupplement')}}</span>
+            <span class="text-field-right "
+                  :title="$t('applicableSupplement')"
+            >{{$t('applicableSupplement')}}</span>
+          </div>
+      </div>
+      </div>
+      <div style="margin-bottom: 40px">
+        <div class="header-text">
+          {{$t('TaskRequirements')}}
+        </div>
+        <div class="content-text">
+          <div class="text-field">
+            <span class="text-field-left" :title="$t('Sponsor')">{{$t('Sponsor')}}</span>
+            <span class="text-field-right "
+                  :title="$t('Sponsor')"
+            >{{$t('Sponsor')}}</span>
+          </div>
+          <div class="text-field">
+            <span class="text-field-left" :title="$t('personLiable')">{{$t('personLiable')}}</span>
+            <span class="text-field-right "
+                  :title="$t('personLiable')"
+            >{{$t('personLiable')}}</span>
+          </div>
+          <div class="text-field">
+            <span class="text-field-left" :title="$t('closingDate')">{{$t('closingDate')}}</span>
+            <span class="text-field-right "
+                  :title="$t('closingDate')"
+            >{{$t('closingDate')}}</span>
+          </div>
+          <div class="text-field">
+            <span class="text-field-left" :title="$t('typeOfDeliverables')">{{$t('typeOfDeliverables')}}</span>
+            <span class="text-field-right "
+                  :title="$t('typeOfDeliverables')"
+            >{{$t('typeOfDeliverables')}}</span>
+          </div>
+          <div class="text-field">
+            <span class="text-field-left" :title="$t('deliverableTemplate')">{{$t('deliverableTemplate')}}</span>
+            <span class="text-field-right text-field-right-url"
+                  :title="$t('deliverableTemplate')"
+            >{{$t('deliverableTemplate')}}</span>
+          </div>
+          <div class="text-field"  style="width: 100%">
+            <span class="text-field-left" :title="$t('descriptionDeliverables')">{{$t('descriptionDeliverables')}}</span>
+            <span class="text-field-right "
+                  :title="$t('descriptionDeliverables')"
+            >{{$t('descriptionDeliverables')}}</span>
+          </div>
+        </div>
+      </div>
+      <div style="margin-bottom: 40px">
+        <div class="header-text">
+          {{$t('personLiableConfirm')}}
+        </div>
+        <div class="box-title-text">
+          <div class="title-text">
+            <span class="Required">*</span>
+            <span class="title-text-text" :title="$t('reviewResults')">{{$t('reviewResults')}}</span>
+          </div>
+          <a-form-model-item class="itemModel">
+            <a-radio-group>
+              <a-radio value="Compliance">
+                {{$t('accord')}}
+              </a-radio>
+              <a-radio value="Non-Compliance">
+                {{$t('nonConformity')}}
+              </a-radio>
+              <a-radio value="To be tracked">
+                {{$t('Tracked')}}
+              </a-radio>
+              <a-radio value="NA">
+                {{$t('notInvolved')}}
+              </a-radio>
+              <a-radio>
+                {{$t('turnToDo')}}
+              </a-radio>
+            </a-radio-group>
+          </a-form-model-item>
+        </div>
+        <div class="box-title-text">
+          <div class="title-text">
+            <span class="Required">*</span>
+            <span class="title-text-text" :title="$t('feedbackMessage')">{{$t('feedbackMessage')}}</span>
+          </div>
+          <a-form-model-item class="itemModel">
+            <a-textarea :placeholder="$t('pleaseEnter')+$t('feedbackMessage')" />
+          </a-form-model-item>
+        </div>
+        <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">
+            <a-button type="primary" class="button-text">{{$t('uploadattachment')}}</a-button>
+          </a-form-model-item>
+        </div>
+      </div>
+      <div style="margin-bottom: 40px">
+        <div class="header-text">
+          {{$t('circulationHistory')}}
+        </div>
+        <div class="process-content">
+          <div style="display: flex;justify-content: space-between">
+            <div class="process-content-content">
+              <img src="../../../../assets/wancheng.png" class="process-content-left" alt="">
+              <img src="../../../../assets/shijian.png" class="process-content-left" alt="">
+              <img src="../../../../assets/xian.png" class="process-content-left" alt="">
+              <div class="process-content-right">
+                <div class="process-content-right-top"></div>
+              </div>
+            </div>
+          </div>
+          <div class="process-content-right-xian"></div>
+        </div>
+        <a-table
+          :pagination="false"
+          :scroll="{x: '100%'}"
+          rowKey="id"
+          :columns="Historycolumns"
+        >
+
+        </a-table>
+      </div>
+      <div class="drawer-bootom-button">
+        <a-button style="margin-right: .8rem" @click="handleCancel">{{$t('cancel')}}</a-button>
+        <a-button style="margin-right: .8rem" type="danger">{{$t('sendBack')}}</a-button>
+        <a-button type="primary">{{$t('adopt')}}</a-button>
+      </div>
+    </a-drawer>
   </div>
 </template>
 
@@ -53,9 +222,11 @@
 
   export default {
     name: 'dealtWith',
-    mixins:[ResizeHeader, ResizeColumnProvide],
+    mixins:[ResizeHeader, ResizeColumnProvide,],
     data() {
       return {
+        visible: false,
+        title:'',
         dataSource: [],
         loading: false,
         columns: [
@@ -82,6 +253,20 @@
             ellipsis: true,
             width: 170
           },
+          {
+            title: this.$t('Tasknode'),
+            align: 'left',
+            dataIndex: '',
+            ellipsis: true,
+            width: 170
+          },
+          {
+            title: this.$t('typeOfDeliverables'),
+            align: 'left',
+            dataIndex: '',
+            ellipsis: true,
+            width: 170
+          },
           {
             title: this.$t('Sponsor'),
             align: 'left',
@@ -97,14 +282,14 @@
             width: 170,
             scopedSlots: { customRender: 'endTime' }
           },
-          {
+          // {
-            title: this.$t('taskStatus'),
+          //   title: this.$t('taskStatus'),
-            align: 'left',
+          //   align: 'left',
-            dataIndex: 'statusShow',
+          //   dataIndex: 'statusShow',
-            ellipsis: true,
+          //   ellipsis: true,
-            width: 170,
+          //   width: 170,
-            scopedSlots: { customRender: 'taskStatus' }
+          //   scopedSlots: { customRender: 'taskStatus' }
-          },
+          // },
           {
             title: this.$t('operation'),
             align: 'left',
@@ -113,6 +298,43 @@
             scopedSlots: { customRender: 'operation' }
           }
         ],
+        Historycolumns: [
+          {
+            title: this.$t('Operator'),
+            align: 'left',
+            dataIndex: '',
+            ellipsis: true,
+            width: 170
+          },
+          {
+            title: this.$t('Tasknode'),
+            align: 'left',
+            dataIndex: '',
+            ellipsis: true,
+            width: 170
+          },
+          {
+            title: this.$t('OperationTime'),
+            align: 'left',
+            dataIndex: '',
+            ellipsis: true,
+            width: 170
+          },
+          {
+            title: this.$t('resultofhandling'),
+            align: 'left',
+            dataIndex: '',
+            ellipsis: true,
+            width: 170
+          },
+          {
+            title: this.$t('OperationContent'),
+            align: 'left',
+            dataIndex: '',
+            ellipsis: true,
+            width: 210
+          },
+        ],
         selectedRowKeys: [],
         pageSize: 10,
         pageNo: 1,
@@ -120,7 +342,8 @@
         url: {
           list: '/todoCenter/projectProcess/todoTaskList'
         },
-        queryParam: {}
+        queryParam: {},
+        regulatoryCertificationTaskPlanList: []
       }
     },
     mounted() {
@@ -130,6 +353,10 @@
       this.getList()
     },
     methods: {
+      onSelectChange(value) {
+        this.selectedRowKeys = value
+        console.log(this.selectedRowKeys)
+      },
       RelatedItemsClick(item) {
         let newUrl = this.$router.resolve({
           path: '/ProjectDetails',
@@ -223,11 +450,13 @@
             primaryKeyId: row.primaryKeyId,
             PersonChargeFeedback: row.personChargeFeedback
           }
-          let newUrl = this.$router.resolve({
+          // let newUrl = this.$router.resolve({
-            path: '/taskListProcess',
+          //   path: '/taskListProcess',
-            query: query
+          //   query: query
-          })
+          // })
-          window.open(newUrl.href, '_blank')
+          // window.open(newUrl.href, '_blank')
+          this.visible = true
+          this.title = this.$t('designComplianceReview')
         } else if (row.flowType == '3') {
           row.taskId = row.taskId + ''
           if (row.taskId.length > 30) {
@@ -291,11 +520,13 @@
             primaryKeyId: row.primaryKeyId,
             PersonChargeFeedback: row.personChargeFeedback
           }
-          let newUrl = this.$router.resolve({
+          // let newUrl = this.$router.resolve({
-            path: '/taskListProcess',
+          //   path: '/taskListProcess',
-            query: query
+          //   query: query
-          })
+          // })
-          window.open(newUrl.href, '_blank')
+          // window.open(newUrl.href, '_blank')
+          this.visible = true
+          this.title = this.$t('verificationComplianceReview')
         }
       },
       searchQuery(value) {
@@ -344,12 +575,15 @@
             this.loading = false
           }
         })
+      },
+      handleCancel() {
+        this.visible = false
       }
     }
   }
 </script>
 
-<style scoped>
+<style lang="less" scoped>
   @import '~@assets/less/common.less';
   .page {
     text-align: right;
@@ -359,4 +593,189 @@
   .activeRed {
     color: red;
   }
+
+  .header-text {
+    /*font-size: 16px;*/
+    font-size: 14px;
+    font-weight: bold;
+    /*margin-left: 15px;*/
+    /*border-bottom: 1px #d9d9d9 dashed;*/
+    /*height: 30px;*/
+    height: 24px;
+    /*margin-bottom: 30px;*/
+    margin-bottom: 20px;
+  }
+
+  .text-field-left {
+    width: 124px;
+    display: inline-block;
+    font-size: 14px;
+    font-weight: 400;
+    color: #6F7385;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    margin-right: 24px;
+  }
+
+  .content-text {
+    width: 100%;
+    display: flex;
+    flex-wrap: wrap;
+
+  .text-field {
+    width: 50%;
+    margin-bottom: 8px;
+
+  .text-field-left {
+    width: 124px;
+    display: inline-block;
+    font-size: 14px;
+    font-weight: 400;
+    color: #6F7385;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    margin-right: 24px;
+  }
+
+  .text-field-right {
+    width: calc(100% - 200px);
+    display: inline-block;
+    font-size: 14px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+    word-break: break-word;
+    color: #040B29;
+    font-weight: 400;
+  }
+
+  .text-field-right-url {
+    color: #00B3BE !important;
+    cursor: pointer;
+  }
+  }
+  }
+
+  .itemModel {
+    width: 100%;
+    display: inline-block;
+    margin-top: 2px;
+    margin-bottom: 12px;
+  }
+
+  .box-title-text {
+    line-height: 1.4;
+    display: flex;
+    /*align-items: center;*/
+  }
+
+  .title-text {
+    width: 88px;
+    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;
+  }
+
+  .Required {
+    color: red;
+    margin-right: 4px;
+  }
+
+  .title-text-text {
+    margin-top: 9px;
+  }
+
+  .box-input {
+    display: inline-block;
+    height: 38px;
+    width: 100%;
+  }
+
+  .button-text {
+    height: 38px;
+    width: calc(100% - 250px);
+    line-height: 38px;
+    background: #fff;
+    border: 1px #00B3BE solid;
+    color: #00B3BE;
+  }
+
+  .process-content {
+    margin-top: 4px;
+    position: relative;
+    margin-bottom: 20px;
+
+    .process-content-content {
+      background: #fff;
+      z-index: 1000;
+      padding: 0 20px;
+
+      .process-content-left {
+        float: left;
+      }
+
+      .process-content-right {
+        float: left;
+        margin-left: 7px;
+
+        .process-content-right-top {
+          font-size: 14px;
+          font-weight: 400;
+          color: #040B29;
+          max-width: 155px;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          overflow: hidden;
+        }
+
+        .process-content-right-button {
+          max-width: 155px;
+          font-size: 12px;
+          font-weight: 400;
+          color: #6F7385;
+          margin-top: -4px;
+        }
+      }
+    }
+
+
+    .process-content-content:first-child {
+      padding: 0 20px 0 0;
+    }
+
+    .process-content-content:last-child {
+      padding: 0 0 0 20px;
+    }
+
+    .process-content-right-xian {
+      height: 2px;
+      width: calc(100% - 27px);
+      background: #E6E6E9;
+      position: absolute;
+      top: 16px;
+    }
+  }
+
+  .drawer-bootom-button {
+    position: absolute;
+    bottom: 0;
+    z-index: 100;
+    width: 100%;
+    border-top: 1px solid #e8e8e8;
+    padding: 10px 16px;
+    text-align: right;
+    left: 0;
+    background: #fff;
+    border-radius: 0 0 2px 2px;
+  }
 </style>

jero-web/src/views/toDoCenter/projectRegulationTasks/index.vue

@@ -76,11 +76,17 @@
         </a-row>
       </a-form>
     </div>
-    <div class="table-operator" style="margin-bottom: 8px">
+    <div class="table-operator" style="margin-bottom: 8px"
-      <div @click="taskConfirmationHandlingClick"
+         v-if="tabActive == $t('toDoProcess')">
+      <div @click=""
            class="operator-text">
         <a-icon type="form"/>
-        {{$t('taskConfirmationHandling')}}
+        {{$t('Taskresponsibilityrecognition')}}
+      </div>
+      <div @click=""
+           class="operator-text">
+        <a-icon type="form"/>
+        {{$t('complianceConfirmation')}}
       </div>
     </div>
     <a-tabs v-model="tabActive" @change="callback">
@@ -189,11 +195,11 @@
           this.$refs.SentListRef.searchReset()
         }
       },
-      taskConfirmationHandlingClick() {
+      // taskConfirmationHandlingClick() {
-        this.$router.push({
+      //   this.$router.push({
-          path: '/toDoTaskConfirmation'
+      //     path: '/toDoTaskConfirmation'
-        })
+      //   })
-      }
+      // }
     }
   }
 </script>