对接项目库详情的项目状态

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

@@ -1816,4 +1816,10 @@ module.exports = {
   selectTime:'Select Time',
   designCompliance:'Design Compliance',
   verifyCompliance:'Verify Compliance',
+  stateExport:'State Export',
+  completeVehicle:'Complete Vehicle',
+  components:'Components',
+  componentReportNotSubmitted:'Component report not submitted',
+  componentReportSubmitted:'Component report submitted',
+  componentReportHasBeenStored:'Component report has been stored',
 }

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

@@ -1918,4 +1918,10 @@ module.exports = {
   selectTime:'选择时间',
   designCompliance:'设计符合性',
   verifyCompliance:'验证符合性',
+  stateExport:'状态导出',
+  completeVehicle:'整车',
+  components:'零部件',
+  componentReportNotSubmitted:'部件报告未提交',
+  componentReportSubmitted:'部件报告已提交',
+  componentReportHasBeenStored:'部件报告已入库',
 }

jero-web/src/views/projectManagement/components/ProjectDetails.vue

@@ -42,14 +42,19 @@
       </div>
       <div class="text-field">
         <span class="text-field-left" style="float: left;margin-top: 3px" :title="$t('ListOfRelevantPersonnel')">{{$t('ListOfRelevantPersonnel')}}</span>
-        <span class="text-field-right"
+        <span class="text-field-right text-field-right-color"
         >
-          <a-button type="primary" v-has="'projectRelatedPersonnel:page'"
+          <span v-has="'projectRelatedPersonnel:page'"
-                    :title="$t('ListOfRelevantPersonnel')"
+                @click="ListOfRelevantPersonnelClick">
-                    class="button-text"
+             <a-icon type="eye" />
-                    @click="ListOfRelevantPersonnelClick">
+             {{$t('ListOfRelevantPersonnel')}}
-                  {{$t('ListOfRelevantPersonnel')}}
+          </span>
-          </a-button>
+<!--          <a-button type="primary" v-has="'projectRelatedPersonnel:page'"-->
+<!--                    :title="$t('ListOfRelevantPersonnel')"-->
+<!--                    class="button-text"-->
+<!--                   >-->
+<!--                  {{$t('ListOfRelevantPersonnel')}}-->
+<!--          </a-button>-->
         </span>
       </div>
     </div>
@@ -85,13 +90,13 @@
               @click="urlClick(queryForm.attestationPlan)"
         >{{queryForm.attestationPlan}}</span>
       </div>
-            <div class="text-field">
+      <div class="text-field">
-              <span class="text-field-left" :title="$t('configurationInformation')">{{$t('configurationInformation')}}</span>
+        <span class="text-field-left" :title="$t('configurationInformation')">{{$t('configurationInformation')}}</span>
-              <span class="text-field-right text-field-right-color"
+        <span class="text-field-right text-field-right-color"
-                    :title="queryForm.ipdInfo"
+              :title="queryForm.ipdInfo"
-                    @click="urlClick(queryForm.ipdInfo)"
+              @click="urlClick(queryForm.ipdInfo)"
-              >{{queryForm.ipdInfo}}</span>
+        >{{queryForm.ipdInfo}}</span>
-            </div>
+      </div>
     </div>
     <div class="content-text">
       <div class="text-field-content">
@@ -127,8 +132,22 @@
       </div>
       <div class="process-content-right-xian"></div>
     </div>
-
+    <div class="box-text">
-    <projectStatus />
+      <div class="header-text">
+        {{$t('projectStatus')}}
+      </div>
+      <div class="header-tight">
+        <a-button class="box-button"
+                  style="line-height: 32px"
+                  @click="settingClick">{{$t('stateExport')}}
+        </a-button>
+        <a-button class="box-button"
+                  style="line-height: 32px"
+                  @click="settingClick">{{$t('versionStatistics')}}
+        </a-button>
+      </div>
+    </div>
+    <projectStatus/>
 
     <listOfRelevantPersonnel ref="listOfRelevantPersonnelRef"/>
     <addModel :url="url" ref="addModelRef" @addModelList="addModelList"/>
@@ -156,8 +175,8 @@
     data() {
       return {
         queryForm: {},
-        cut:'',
+        cut: '',
-        administrators:false,
+        administrators: false,
         activeKey: this.$t('CurrentStatusOfTheProject'),
         url: {
           queryById: 'project/projectLibraryBase/queryById',
@@ -190,9 +209,9 @@
           if (res.success) {
             this.cut = res.cut
             this.queryForm = res.result[0] || {}
-            if(this.cut == 'en'){
+            if (this.cut == 'en') {
               this.queryForm.brandText = this.queryForm.brandTextEn
-            }else{
+            } else {
               this.queryForm.brandText = this.queryForm.brandText
             }
           } else {
@@ -247,7 +266,7 @@
 
   .header-text {
     font-size: 16px;
-    font-weight: 400;
+    font-weight: bold;
     color: #000F16;
   }
 
@@ -391,11 +410,18 @@
   .box-text {
     display: flex;
     justify-content: space-between;
-    height: 80px;
+    height: 72px;
     line-height: 80px;
   }
 
+  .header-tight {
+    line-height: 90px;
+  }
+
   .button-text {
     padding: 0 13px;
   }
+  .box-button{
+    margin-left: 12px;
+  }
 </style>

jero-web/src/views/projectManagement/components/certificationActivity.vue

@@ -10,6 +10,17 @@
     </div>
     <div class="box-content">
       <div class="box-content-bottom">
+        <div class="box-content-text">
+          <div class="box-content-text-text" @click="boxContentClick(0)">
+            {{$t('whole')}}
+          </div>
+          <div class="box-content-text-text" @click="boxContentClick(1)">
+            {{$t('completeVehicle')}}
+          </div>
+          <div class="box-content-text-text" @click="boxContentClick(2)">
+            {{$t('components')}}
+          </div>
+        </div>
         <div id="main-bottom"></div>
       </div>
     </div>
@@ -38,11 +49,19 @@
       return {
         url: {
           getProjectDetailsStatistics: '/project/projectLibraryBase/getProjectDetailsStatistics'
-        }
+        },
+        certificationProgressMap:{},
       }
     },
     mounted() {
-      this.mainRightEcharts()
+      let boxContentTextColor = document.getElementsByClassName('box-content-text-color')
+      if (boxContentTextColor && boxContentTextColor.length > 0) {
+        boxContentTextColor[0].classList.remove('box-content-text-color')
+      }
+      let boxContentTextText = document.getElementsByClassName('box-content-text-text')
+      if (boxContentTextText && boxContentTextText.length > 0) {
+        boxContentTextText[0].classList.add('box-content-text-color')
+      }
       this.mainBottomEcharts()
       this.getData()
     },
@@ -57,122 +76,155 @@
         getAction(this.url.getProjectDetailsStatistics, { id: id }).then((res) => {
           if (res.success) {
             if (res.result) {
-              let listingToConfirmMap = res.result.listingToConfirmMap ? res.result.listingToConfirmMap.listingToConfirmMapList : []
+              let rzTaskToConfirmMapList = res.result.rzTaskToConfirmMap ? res.result.rzTaskToConfirmMap.rzTaskToConfirmMapList : []
-              let taskToConfirmMap = res.result.taskToConfirmMap ? res.result.taskToConfirmMap.taskToConfirmMapList : []
+              let prehomoMapList = res.result.prehomoMap ? res.result.prehomoMap.prehomoMapList : []
-              let designComplianceMap = res.result.designComplianceMap ? res.result.designComplianceMap.designComplianceMapList : []
+              this.certificationProgressMap = res.result.certificationProgressMap
-              let prehomoMap = res.result.prehomoMap ? res.result.prehomoMap.prehomoMapList : []
+              let allMapList = res.result.certificationProgressMap ? res.result.certificationProgressMap.allMapList : []
-              let verifyComplianceMap = res.result.verifyComplianceMap ? res.result.verifyComplianceMap.verifyComplianceMapList : []
+              this.dataEcharts(rzTaskToConfirmMapList)
-              this.dataEcharts(listingToConfirmMap, 1)
+              this.mainRightEcharts(prehomoMapList)
-              this.dataEcharts(taskToConfirmMap, 2)
+              this.mainBottomEcharts(allMapList)
-              this.dataEchartsOne(designComplianceMap, 1)
-              this.dataEchartsOne(prehomoMap, 2)
-              this.dataEchartsOne(verifyComplianceMap, 3)
             }
           }
         })
       },
-      dataEcharts(val, num) {
+      dataEcharts(dataSource) {
         let data = []
         let color = []
-        if (val && val.length > 0) {
+        if (dataSource && dataSource.length > 0) {
-          val.forEach((res) => {
+          this.dataSource = [{}]
-            if (res.inventoryAffirmStatus == 'Not started' || res.taskAffirmStatus == 'Not started') {
+          dataSource.forEach(res => {
+            if (res.taskAffirmStatus == 'Not started') {
               data.push({
-                value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
+                value: res.taskAffirmStatusCount,
                 name: this.$t('notLaunch'),
-                status: res.inventoryAffirmStatus || res.taskAffirmStatus
+                color: '#00B3BE'
-              })
-              color.push('#707486')
-            } else if (res.inventoryAffirmStatus == 'List to confirm' || res.taskAffirmStatus == 'List to confirm') {
-              data.push({
-                value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
-                name: this.$t('toBeConfirmed'),
-                status: res.inventoryAffirmStatus || res.taskAffirmStatus
               })
               color.push('#00B3BE')
-            } else if (res.inventoryAffirmStatus == 'Accepted' || res.taskAffirmStatus == 'Accepted') {
+            } else if (res.taskAffirmStatus == 'List to confirm') {
               data.push({
-                value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
+                value: res.taskAffirmStatusCount,
-                name: this.$t('accept'),
+                name: this.$t('listToConfirm'),
-                status: res.inventoryAffirmStatus || res.taskAffirmStatus
+                color: '#FDA71C'
               })
-              color.push('#26BD4B')
+              color.push('#FDA71C')
-            } else if (res.inventoryAffirmStatus == 'Rejected' || res.taskAffirmStatus == 'Rejected') {
+            } else if (res.taskAffirmStatus == 'Accepted') {
               data.push({
-                value: res.inventoryAffirmStatusCount || res.taskAffirmStatusCount,
+                value: res.taskAffirmStatusCount,
+                name: this.$t('accept'),
+                color: '#26BC4B'
+              })
+              color.push('#26BC4B')
+            } else if (res.taskAffirmStatus == 'Rejected') {
+              data.push({
+                value: res.taskAffirmStatusCount,
                 name: this.$t('refuse'),
-                status: res.inventoryAffirmStatus || res.taskAffirmStatus
+                color: '#E83030'
               })
               color.push('#E83030')
             }
           })
         }
-        if (num == 1) {
+        this.getEcharts('main-left', this.$t('regulatoryTaskConfirmation'), color, data)
-          this.mainLeftEcharts(data, color)
-        } else {
-          this.mainRightEcharts(data, color)
-        }
       },
-      dataEchartsOne(val, num) {
+      mainRightEcharts(dataSource){
         let data = []
         let color = []
-        if (val && val.length > 0) {
+        if (dataSource && dataSource.length > 0) {
-          val.forEach((res) => {
+          this.dataSource = [{}]
-              if (res.designFlowTaskStatus == 'No rating' || res.prehomoFlowTaskStatus == 'No rating' || res.verifyFlowTaskStatus == 'No rating') {
+          dataSource.forEach(res => {
-                data.push({
+            if (res.taskAffirmStatus == 'Not started') {
-                  value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
+              data.push({
-                  name: this.$t('toBeConfirmed'),
+                value: res.taskAffirmStatusCount,
-                  status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
+                name: this.$t('notLaunch'),
-                })
+                color: '#00B3BE'
-                color.push('#00B3BE')
+              })
-              } else if (res.designFlowTaskStatus == 'Compliance' || res.prehomoFlowTaskStatus == 'Compliance' || res.verifyFlowTaskStatus == 'Compliance') {
+              color.push('#00B3BE')
-                data.push({
+            } else if (res.taskAffirmStatus == 'List to confirm') {
-                  value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
+              data.push({
-                  name: this.$t('accord'),
+                value: res.taskAffirmStatusCount,
-                  status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
+                name: this.$t('listToConfirm'),
-                })
+                color: '#FDA71C'
-                color.push('#26BD4B')
+              })
-              } else if (res.designFlowTaskStatus == 'Non-Compliance' || res.prehomoFlowTaskStatus == 'Non-Compliance' || res.verifyFlowTaskStatus == 'Non-Compliance') {
+              color.push('#FDA71C')
-                data.push({
+            } else if (res.taskAffirmStatus == 'Review and pass') {
-                  value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
+              data.push({
-                  name: this.$t('nonConformity'),
+                value: res.taskAffirmStatusCount,
-                  status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
+                name: this.$t('reviewAndPass'),
-                })
+                color: '#26BC4B'
-                color.push('#E83030')
+              })
-              } else if (res.designFlowTaskStatus == 'To be tracked' || res.prehomoFlowTaskStatus == 'To be tracked' || res.verifyFlowTaskStatus == 'To be tracked') {
+              color.push('#26BC4B')
-                data.push({
+            } else if (res.taskAffirmStatus == 'Review and return') {
-                  value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
+              data.push({
-                  name: this.$t('Tracked'),
+                value: res.taskAffirmStatusCount,
-                  status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
+                name: this.$t('reviewAndReturn'),
-                })
+                color: '#E83030'
-                color.push('#FDA71C')
+              })
-              } else if (res.designFlowTaskStatus == 'NA' || res.prehomoFlowTaskStatus == 'NA' || res.verifyFlowTaskStatus == 'NA') {
+              color.push('#E83030')
-                data.push({
-                  value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
-                  name: this.$t('notInvolved'),
-                  status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
-                })
-                color.push('#707486')
-              } else if (res.designFlowTaskStatus == 'Termination of task' || res.prehomoFlowTaskStatus == 'Termination of task' || res.verifyFlowTaskStatus == 'Termination of task') {
-                data.push({
-                  value: res.designFlowTaskStatusCount || res.prehomoFlowTaskStatusCount || res.verifyFlowTaskStatusCount,
-                  name: this.$t('taskTermination'),
-                  status: res.designFlowTaskStatus || res.prehomoFlowTaskStatus || res.verifyFlowTaskStatus
-                })
-                color.push('#E83030')
-              }
             }
-          )
+          })
-        }
-        if (num == 1) {
-          this.mainLeftContentEcharts(data, color)
-        } else if (num == 2) {
-          this.mainRightContentEcharts(data, color)
-        } else if (num == 3) {
-          this.mainBottomEcharts(data, color)
         }
+        this.getEcharts('main-right', this.$t('preHomoFlow'), color, data)
       },
-      getEcharts(chart, title, color, data, num) {
+      mainBottomEcharts(dataSource){
+        let data = []
+        let color = []
+        if (dataSource && dataSource.length > 0) {
+          dataSource.forEach(res => {
+            if (res.certificationProgress == 'Not start') {
+              data.push({
+                value: res.certificationProgressCount,
+                name: this.$t('Notatthe'),
+                color: '#00B3BE'
+              })
+              color.push('#00B3BE')
+            } else if (res.certificationProgress == 'In progress') {
+              data.push({
+                value: res.certificationProgressCount,
+                name: this.$t('inProgress'),
+                color: '#FDA71C'
+              })
+              color.push('#FDA71C')
+            } else if (res.certificationProgress == 'Test passed') {
+              data.push({
+                value: res.certificationProgressCount,
+                name: this.$t('experimentPassed'),
+                color: '#26BC4B'
+              })
+              color.push('#26BC4B')
+            } else if (res.certificationProgress == 'Test failed') {
+              data.push({
+                value: res.certificationProgressCount,
+                name: this.$t('experimentFailed'),
+                color: '#E83030'
+              })
+              color.push('#E83030')
+            }else if (res.certificationProgress == 'Component report not submitted') {
+              data.push({
+                value: res.certificationProgressCount,
+                name: this.$t('componentReportNotSubmitted'),
+                color: '#FDA71C'
+              })
+              color.push('#FDA71C')
+            }else if (res.certificationProgress == 'Component report submitted') {
+              data.push({
+                value: res.certificationProgressCount,
+                name: this.$t('componentReportSubmitted'),
+                color: '#6FD682'
+              })
+              color.push('#6FD682')
+            }else if (res.certificationProgress == 'Component report has been stored') {
+              data.push({
+                value: res.certificationProgressCount,
+                name: this.$t('componentReportHasBeenStored'),
+                color: '#26BC4B'
+              })
+              color.push('#26BC4B')
+            }
+          })
+        }
+        this.getEcharts('main-bottom', this.$t('CertificationProgress'), color, data)
+      },
+      getEcharts(chart, title, color, data) {
         var myChart = echarts.init(document.getElementById(chart))
         myChart.setOption({
           title: {
@@ -207,44 +259,50 @@
             }
           ]
         })
-        myChart.on('click', (params) => {
+        // myChart.on('click', (params) => {
-          let query = {
+        //   let query = {
-            title: params.seriesName,
+        //     title: params.seriesName,
-            projectLibraryId: this.$route.query.id
+        //     projectLibraryId: this.$route.query.id
-          }
+        //   }
-          if (num === 1) {
+        //   if (num === 1) {
-            query.operatorType = 'queryListingToConfirmStatistics'
+        //     query.operatorType = 'queryListingToConfirmStatistics'
-            query.inventoryAffirmStatus = params.data.status
+        //     query.inventoryAffirmStatus = params.data.status
-          } else if (num === 2) {
+        //   } else if (num === 2) {
-            query.operatorType = 'queryTaskToConfirmStatistics'
+        //     query.operatorType = 'queryTaskToConfirmStatistics'
-            query.taskAffirmStatus = params.data.status
+        //     query.taskAffirmStatus = params.data.status
-          } else if (num === 3) {
+        //   } else if (num === 3) {
-            query.operatorType = 'queryDesignStatistics'
+        //     query.operatorType = 'queryDesignStatistics'
-            query.designFlowTaskStatus = params.data.status
+        //     query.designFlowTaskStatus = params.data.status
-          } else if (num === 4) {
+        //   } else if (num === 4) {
-            query.operatorType = 'queryPrehomoStatistics'
+        //     query.operatorType = 'queryPrehomoStatistics'
-            query.prehomoFlowTaskStatus = params.data.status
+        //     query.prehomoFlowTaskStatus = params.data.status
-          } else if (num === 5) {
+        //   } else if (num === 5) {
-            query.operatorType = 'queryVerifyStatistics'
+        //     query.operatorType = 'queryVerifyStatistics'
-            query.verifyFlowTaskStatus = params.data.status
+        //     query.verifyFlowTaskStatus = params.data.status
-          }
+        //   }
-          this.$refs.responsibilityListRef.getData(query)
+        //   this.$refs.responsibilityListRef.getData(query)
-        })
+        // })
-      }
-      ,
-      mainLeftEcharts(data, color) {
-        this.getEcharts('main-left', this.$t('certificationTaskConfirmation'), color, data, 1)
-      }
-      ,
-      mainRightEcharts(data, color) {
-        this.getEcharts('main-right', this.$t('preHomoFlow'), color, data, 2)
-      }
-      ,
-      mainBottomEcharts(data, color) {
-        this.getEcharts('main-bottom', this.$t('CertificationProgress'), color, data, 5)
       },
+
       responsibility(item) {
         this.$emit('currentStatus', item)
+      },
+      boxContentClick(num) {
+        let boxContentTextColor = document.getElementsByClassName('box-content-text-color')
+        if (boxContentTextColor && boxContentTextColor.length > 0) {
+          boxContentTextColor[0].classList.remove('box-content-text-color')
+        }
+        let boxContentTextText = document.getElementsByClassName('box-content-text-text')
+        if (boxContentTextText && boxContentTextText.length > 0) {
+          boxContentTextText[num].classList.add('box-content-text-color')
+        }
+        if (num == 0){
+          this.mainBottomEcharts( this.certificationProgressMap.allMapList || [])
+        }else if(num == 1){
+          this.mainBottomEcharts( this.certificationProgressMap.carMapList || [])
+        }else if(num == 2){
+          this.mainBottomEcharts( this.certificationProgressMap.partMapList || [])
+        }
       }
     }
   }
@@ -263,6 +321,7 @@
       border: 2px #eff1f3 solid;
       border-radius: 6px;
       margin-top: 4px;
+
       #main-left {
         width: 100%;
         height: 100%;
@@ -277,6 +336,7 @@
       border: 2px #eff1f3 solid;
       border-radius: 6px;
       margin-top: 4px;
+
       #main-right {
         width: 100%;
         height: 100%;
@@ -284,11 +344,49 @@
         box-sizing: border-box;
       }
     }
-    .box-content-bottom{
+
+    .box-content-bottom {
       width: 100%;
       height: 346px;
       border: 2px #eff1f3 solid;
+      position: relative;
       border-radius: 6px;
+
+      .box-content-text {
+        height: 30px;
+        background: #F5F6F7;
+        border-radius: 4px;
+        position: absolute;
+        right: 24px;
+        top: 20px;
+        display: flex;
+        z-index: 100;
+        justify-content: space-between;
+        padding: 0 2px 0 2px;
+
+        .box-content-text-text {
+          display: inline-block;
+          font-size: 12px;
+          color: #6F7385;
+          line-height: 30px;
+          margin-right: 10px;
+          cursor: pointer;
+          margin-left: 10px;
+        }
+
+        .box-content-text-color {
+          box-shadow: 0px 1px 2px rgba(0, 0, 60, 0.01), 0px 2px 4px rgba(0, 22, 60, 0.02), 0px 4px 6px rgba(0, 22, 60, 0.0229458);
+          border-radius: 4px;
+          padding: 4px 6px;
+          background: #FFFFFF;
+          border: 1px solid #E6E7EC;
+          color: #01A0AC;
+          line-height: normal;
+          margin-right: 0;
+          margin-left: 0;
+        }
+      }
+
       #main-bottom {
         width: 100%;
         height: 100%;
@@ -297,4 +395,5 @@
       }
     }
   }
+
 </style>

jero-web/src/views/projectManagement/components/certificationList/index.vue

@@ -560,9 +560,9 @@
           'In progress': 'TrackedColor',
           'NA': 'notInvolvedColor',
           'Not start': 'submittedColor',
-          '25181c5a4c044001b4beca539c77a5c8': 'accordColor',
+          'Component report submitted': 'componentColor',
-          '0a384b5475554ae8886b950730a3bff7': 'accordColor',
+          'Component report has been stored': 'accordColor',
-          '7cba3c71fd24421eade54c685e3b4444': 'TrackedColor'
+          'Component report not submitted': 'TrackedColor'
         },
         fieldList: [
           {
@@ -2499,7 +2499,10 @@
     background: #dbf6e2;
     color: #26BD4B;
   }
-
+  .componentColor{
+    background: #EDFCEF;
+    color: #6FD682;
+  }
   .nonConformityColor {
     background: #f3dddd;
     color: #E83030;

jero-web/src/views/projectManagement/components/nonConformance.vue

@@ -73,18 +73,18 @@
         </span>
       </a-table>
     </div>
-    <div class="page" v-if="dataSource.length > 0">
+<!--    <div class="page" v-if="dataSource.length > 0">-->
-      <a-pagination
+<!--      <a-pagination-->
-        :show-total="total => $t('total')+` ${total} `+$t('strip')"
+<!--        :show-total="total => $t('total')+` ${total} `+$t('strip')"-->
-        show-quick-jumper
+<!--        show-quick-jumper-->
-        show-size-changer
+<!--        show-size-changer-->
-        :page-size.sync="pageSize"
+<!--        :page-size.sync="pageSize"-->
-        :total="total"
+<!--        :total="total"-->
-        :current="pageNo"
+<!--        :current="pageNo"-->
-        @change="pageOnChange"
+<!--        @change="pageOnChange"-->
-        @showSizeChange="SizeChange"
+<!--        @showSizeChange="SizeChange"-->
-      />
+<!--      />-->
-    </div>
+<!--    </div>-->
   </a-card>
 </template>
 
@@ -124,7 +124,7 @@
           {
             title: this.$t('ProcessType'),
             align: 'left',
-            dataIndex: 'flowType',
+            dataIndex: 'flowTypeName',
             scopedSlots: { customRender: 'ProcessType' },
             ellipsis: true,
             sorter:true,
@@ -133,7 +133,7 @@
           {
             title: this.$t('areaOfResponsibility'),
             align: 'left',
-            dataIndex: 'dutyTerritory',
+            dataIndex: 'dutyTerritory_dictText',
             ellipsis: true,
             sorter:true,
             width: 100
@@ -141,7 +141,7 @@
           {
             title: this.$t('problemType'),
             align: 'left',
-            dataIndex: 'problemType',
+            dataIndex: 'flowStatusName',
             ellipsis: true,
             sorter:true,
             width: 150
@@ -149,7 +149,7 @@
           {
             title: this.$t('Sponsor'),
             align: 'left',
-            dataIndex: 'initiator',
+            dataIndex: 'regulationOwnerIdName',
             ellipsis: true,
             sorter:true,
             width: 100
@@ -157,7 +157,7 @@
           {
             title: this.$t('personLiable'),
             align: 'left',
-            dataIndex: 'duty',
+            dataIndex: 'dutyIdName',
             ellipsis: true,
             sorter:true,
             width: 100
@@ -167,7 +167,7 @@
         pageSize: 10,
         pageNo: 1,
         url: {
-          page: '/project/ncrTrackController/queryPageInfo',
+          page: '/project/projectLawsInventoryEO/queryNotComplianList',
           exportData: '/project/ncrTrackController/exportDataInfo'
         }
       }
@@ -242,8 +242,8 @@
       },
       getList() {
         let query = {
-          pageNo: this.pageNo,
+          // pageNo: this.pageNo,
-          pageSize: this.pageSize,
+          // pageSize: this.pageSize,
           projectLibraryId: this.$route.query.id,
           orderBy: this.orderBy,
           orderByField: this.orderByField,
@@ -252,8 +252,8 @@
         this.loading = true
         getAction(this.url.page, query).then((res) => {
           if (res.success) {
-            this.dataSource = res.result.records || []
+            this.dataSource = res.result || []
-            this.total = res.result.total
+            // this.total = res.result.total
             this.loading = false
           } else {
             this.dataSource = []

jero-web/src/views/projectManagement/components/parameterCollectionProgress.vue

@@ -4,19 +4,29 @@
       <a-form layout="inline">
         <a-row :gutter="24">
           <a-col :md="6" :sm="10">
-            <a-form-item :label="$t('Collectlist')">
+            <div class="box-title-text">
-              <a-select  v-model="queryParam.ctype"  @change="getonChange" style='width: 183px' :getPopupContainer="triggerNode => triggerNode.parentNode" :popper-append-to-body="false">
+              <div class="title-text" :title="$t('Collectlist')">
-                <a-select-option v-for="d in options" :key="d.value" :value="d.value" >
+                <span>{{ $t('Collectlist') }}</span>
+              </div>
+              <a-select v-model="queryParam.ctype"
+                        class="box-input"
+                        @change="getonChange"
+                        :getPopupContainer="triggerNode => triggerNode.parentNode" :popper-append-to-body="false">
+                <a-select-option v-for="d in options" :key="d.value" :value="d.value">
                   <span style="display: inline-block;width: 80%" :title=" d.label">
                            {{ d.label }}
                      </span>
                 </a-select-option>
               </a-select>
-            </a-form-item>
+            </div>
           </a-col>
-          <a-col :md="6" :sm="14">
+          <a-col :md="6" :sm="10">
-            <a-form-model-item :label="$t('Statisticalmodels')" prop="value" style='width: 388px' class="process-form-item">
+            <div class="box-title-text">
-              <a-radio-group v-model="queryParam.value" @change="onChange" style='width: 253px'>
+              <div class="title-text" :title="$t('Statisticalmodels')">
+                <span>{{ $t('Statisticalmodels') }}</span>
+              </div>
+              <a-radio-group  class="box-input"
+                              v-model="queryParam.value" @change="onChange">
                 <a-radio :value="1">
                   {{$t('Thepercentage')}}
                 </a-radio>
@@ -24,9 +34,8 @@
                   {{$t('Quantity')}}
                 </a-radio>
               </a-radio-group>
-            </a-form-model-item>
+            </div>
           </a-col>
-
         </a-row>
       </a-form>
     </div>
@@ -44,7 +53,7 @@
   import * as echarts from 'echarts'
   import { getAction, postAction, deleteAction, downloadFile } from '@/api/manage'
   import responsibilityList from './responsibilityList'
-  import "echarts/lib/component/dataZoom"
+  import 'echarts/lib/component/dataZoom'
 
   export default {
     name: 'DeliverableStatusEchart',
@@ -59,28 +68,28 @@
     },
     data() {
       return {
-        queryParam:{
+        queryParam: {
-          value:1,
+          value: 1,
-          ctype:''
+          ctype: ''
         },
-        options:[],
+        options: [],
-        collecting:[],
+        collecting: [],
-        notStart:[],
+        notStart: [],
-        submit:[],
+        submit: [],
-        syncReport:[],
+        syncReport: [],
-        collectingdata:[],
+        collectingdata: [],
-        notStartdata:[],
+        notStartdata: [],
-        submitdata:[],
+        submitdata: [],
-        syncReportdata:[],
+        syncReportdata: [],
-        dutyTerritory:[],
+        dutyTerritory: [],
-        collectingpercentage:[],
+        collectingpercentage: [],
-        collectingquantity:[],
+        collectingquantity: [],
-        notStartpercentage:[],
+        notStartpercentage: [],
-        notStartquantity:[],
+        notStartquantity: [],
-        submitpercentage:[],
+        submitpercentage: [],
-        submitquantity:[],
+        submitquantity: [],
-        syncReportpercentage:[],
+        syncReportpercentage: [],
-        syncReportquantity:[],
+        syncReportquantity: [],
         url: {
           getProjectDetailsStatistics: '/project/projectLibraryBase/getProjectDetailsStatisticsCollectManifestData'
         }
@@ -97,18 +106,18 @@
           if (res.success) {
             if (res.result) {
               this.collecting = res.result.collecting ? res.result.collecting : []
-              this.notStart = res.result.notStart ? res.result.notStart: []
+              this.notStart = res.result.notStart ? res.result.notStart : []
               this.submit = res.result.submit ? res.result.submit : []
               this.syncReport = res.result.syncReport ? res.result.syncReport : []
               this.dutyTerritory = res.result.dutyTerritory ? res.result.dutyTerritory : []
-                this.getEcharts()
+              this.getEcharts()
 
             }
 
           }
         })
       },
-      getoptions(){
+      getoptions() {
         let id = ''
         if (this.idList && this.idList.length > 0) {
           id = this.idList.join(',')
@@ -116,7 +125,7 @@
           id = this.$route.query.parentId ? this.$route.query.parentId : this.$route.query.id
           // id = this.$route.query.id
         }
-        getAction('project/projectLibraryBase/getProjectDetailsStatisticsCollectManifestLabel', {id:id}).then((res) => {
+        getAction('project/projectLibraryBase/getProjectDetailsStatisticsCollectManifestLabel', { id: id }).then((res) => {
           if (res.success) {
             this.options = res.result
             this.queryParam.ctype = this.options[0].value
@@ -125,7 +134,7 @@
           }
         })
       },
-      getonChange(value){
+      getonChange(value) {
         this.collectingpercentage = []
         this.collectingquantity = []
         this.notStartpercentage = []
@@ -136,7 +145,7 @@
         this.syncReportquantity = []
         this.getData(value)
       },
-      onChange(value){
+      onChange(value) {
         this.collectingpercentage = []
         this.collectingquantity = []
         this.notStartpercentage = []
@@ -149,53 +158,53 @@
 
       },
       getEcharts(chart, title, color, data, num) {
-        this.collecting.forEach((item,index) => {
+        this.collecting.forEach((item, index) => {
           this.collectingpercentage.push(item.percentage)
           this.collectingquantity.push(item.quantity)
         })
-        this.notStart.forEach((item,index) => {
+        this.notStart.forEach((item, index) => {
           this.notStartpercentage.push(item.percentage)
           this.notStartquantity.push(item.quantity)
         })
-        this.submit.forEach((item,index) => {
+        this.submit.forEach((item, index) => {
           this.submitpercentage.push(item.percentage)
           this.submitquantity.push(item.quantity)
         })
-        this.syncReport.forEach((item,index) => {
+        this.syncReport.forEach((item, index) => {
           this.syncReportpercentage.push(item.percentage)
           this.syncReportquantity.push(item.quantity)
         })
-        if(this.queryParam.value == 1){
+        if (this.queryParam.value == 1) {
           this.collectingdata = this.collectingpercentage
           this.notStartdata = this.notStartpercentage
           this.submitdata = this.submitpercentage
           this.syncReportdata = this.syncReportpercentage
-        }else if(this.queryParam.value == 2){
+        } else if (this.queryParam.value == 2) {
           this.collectingdata = this.collectingquantity
           this.notStartdata = this.notStartquantity
           this.submitdata = this.submitquantity
           this.syncReportdata = this.syncReportquantity
         }
-        var chartDom = document.getElementById('main-left');
+        var chartDom = document.getElementById('main-left')
-        var myChart = echarts.init(chartDom);
+        var myChart = echarts.init(chartDom)
-        var option;
+        var option
-        var option1;
+        var option1
 
-        let xAxisData = [];
+        let xAxisData = []
         // let data1 = [];
         // let data2 = [];
         // let data3 = [];
         // let data4 = [];
         xAxisData = this.dutyTerritory
-          // data1.push(+(Math.random() * 2).toFixed(2));
+        // data1.push(+(Math.random() * 2).toFixed(2));
-          // data2.push(+(Math.random() * 100).toFixed(2));
+        // data2.push(+(Math.random() * 100).toFixed(2));
-          // data3.push(+(Math.random() + 0.3).toFixed(2));
+        // data3.push(+(Math.random() + 0.3).toFixed(2));
-          // data4.push(+Math.random().toFixed(2));
+        // data4.push(+Math.random().toFixed(2));
 
-        let yAxis=[];
+        let yAxis = []
-        let tooltip= {};
+        let tooltip = {}
         let _this = this
-        if(this.queryParam.value === 1){
+        if (this.queryParam.value === 1) {
           yAxis = [
             {
               type: 'value',
@@ -203,15 +212,15 @@
                 show: true,
                 interval: 'auto',
                 formatter: '{value} %'
-              },
+              }
-            },
+            }
           ]
-        }else{
+        } else {
-          yAxis=[
+          yAxis = [
             {
-              type: 'value',
+              type: 'value'
-            },
+            }
-          ];
+          ]
         }
         option = {
           legend: {
@@ -227,21 +236,21 @@
             // }
           },
           tooltip: {
-            trigger:'axis',
+            trigger: 'axis',
             // axisPointer: { // 坐标轴指示器，坐标轴触发有效
             //   type: 'line'// 默认为直线，可选为：'line' | 'shadow'
             // },
-            formatter: function (params) {
+            formatter: function(params) {
-              var html = params[0].name + "<br>";
+              var html = params[0].name + '<br>'
               for (var i = 0; i < params.length; i++) {
-                html += params[i].marker + params[i].seriesName + ":" + params[i].value;
+                html += params[i].marker + params[i].seriesName + ':' + params[i].value
                 if (_this.queryParam.value == 1) {
-                  html += "%" + "<br>";
+                  html += '%' + '<br>'
-                }else{
+                } else {
-                  html +="<br>";
+                  html += '<br>'
                 }
               }
-              return html;
+              return html
 
             }
           },
@@ -250,11 +259,11 @@
             // name: 'X Axis',
             axisLabel: {
               interval: 0,
-              rotate:25,
+              rotate: 25
               // formatter: function(value) {
               //   return value.split("").join("\n");
               // }
-            },
+            }
             //   axisLine: { onZero: true },
             // splitLine: { show: false },
             // splitArea: { show: false }
@@ -272,7 +281,7 @@
               barWidth: 40,
               barGap: '-100%',
               itemStyle: {
-                  color: "#707486",
+                color: '#00B3BE'
               },
               data: this.notStartdata
             },
@@ -283,7 +292,7 @@
               barWidth: 40,
               barGap: '-100%',
               itemStyle: {
-                  color: "#00B3BE",
+                color: '#FDA71C'
               },
               data: this.collectingdata
             },
@@ -294,7 +303,7 @@
               barWidth: 40,
               barGap: '-100%',
               itemStyle: {
-                  color: "#26BD4B",
+                color: '#26BD4B'
               },
               data: this.submitdata
             },
@@ -305,13 +314,12 @@
               barWidth: 40,
               barGap: '-100%',
               itemStyle: {
-                  color: "#E83030",
+                color: '#2F8DF3'
               },
               data: this.syncReportdata
             }
           ],
-          dataZoom:[
+          dataZoom: [
-
             {
               type: 'slider',//给x轴设置滚动条
               show: true, //flase直接隐藏图形
@@ -322,14 +330,13 @@
               startValue: 0,//滚动条的起始位置
               endValue: 9 //滚动条的截止位置（按比例分割你的柱状图x轴长度）
             }
-
+          ]
-          ],
+        }
-        };
+        option && myChart.setOption(option, true)
-          option && myChart.setOption(option, true);
 
       },
       mainLeftEcharts(data, color) {
-          this.getEcharts('main-left', this.$t('Parametercollection'), color, data, 1)
+        this.getEcharts('main-left', this.$t('Parametercollection'), color, data, 1)
       },
       responsibility(item) {
         this.$emit('currentStatus', item)
@@ -371,6 +378,7 @@
         box-sizing: border-box;
       }
     }
+
     .box-input {
       display: inline-block;
       width: calc(70% - 100px);
@@ -398,4 +406,32 @@
       }
     }
   }
+
+  .box-title-text {
+    line-height: 1.4;
+    display: flex;
+    align-items: center;
+    margin-bottom: 16px;
+  }
+
+  .title-text {
+    color: #000F16;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    margin-top: 3px;
+    text-align: left;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .box-input {
+    display: inline-block;
+    width: calc(100% - 126px);
+    height: 38px;
+    margin-top: 2px;
+    line-height: 38px;
+  }
 </style>

jero-web/src/views/projectManagement/components/projectStatus.vue

@@ -1,17 +1,17 @@
 <template>
   <a-card :bordered="false">
-    <div class="table-operator" style="margin-bottom: 10px">
+<!--    <div class="table-operator" style="margin-bottom: 10px">-->
-      <div @click="versionStatisticsClick"
+<!--      <div @click="versionStatisticsClick"-->
-           v-if="!this.$route.query.parentId && $t('Parametercollection')!= activeKey"
+<!--           v-if="!this.$route.query.parentId && $t('Parametercollection')!= activeKey"-->
-           class="operator-text">
+<!--           class="operator-text">-->
-        <a-icon type="plus"/>
+<!--        <a-icon type="plus"/>-->
-        {{$t('versionStatistics')}}
+<!--        {{$t('versionStatistics')}}-->
-      </div>
+<!--      </div>-->
-      <div v-else
+<!--      <div v-else-->
-           class="operator-text">
+<!--           class="operator-text">-->
-      </div>
+<!--      </div>-->
-    </div>
+<!--    </div>-->
-    <a-tabs v-model="activeKey" class="ant-tabs">
+    <a-tabs type="card" v-model="activeKey" class="ant-tabs">
       <a-tab-pane :key="$t('regulatoryComplianceManagement')" :tab="$t('regulatoryComplianceManagement')">
         <regulatoryCompliance @currentStatus="currentStatus"
                                           :idList="idList"
@@ -86,6 +86,6 @@
 <style scoped>
   @import '~@assets/less/common.less';
   ::v-deep .ant-card-body{
-    padding: 24px 0 ;
+    padding: 0 0 24px 0 ;
   }
 </style>

jero-web/src/views/projectManagement/projectStatusBoard/index.vue

@@ -99,6 +99,7 @@
             <div class="box-top-content-right-bottom">
               <div class="process-content" v-for="(item,index) in timeData" :key="index">
                 <div class="process-content-right-xian"></div>
+                <div class="process-content-right-xian-color"></div>
                 <div class="process-content-right-xian-one"></div>
                 <div class="process-content-content" :style="val.left"
                      v-for="(val,indexOne) in item.data[0]" :key="indexOne">
@@ -625,7 +626,7 @@
 
   .box-top-content {
     width: 100%;
-    height: 500px;
+    height: calc(100vh - 264px);
     margin-bottom: 20px;
     padding: 0 0 20px 10px;
     box-sizing: border-box;
@@ -733,7 +734,7 @@
     /*overflow:hidden;*/
 
     .process-content-content {
-      background: #fff;
+      background: transparent;
       z-index: 98;
       /*padding: 0 6px;*/
       position: absolute;
@@ -789,7 +790,7 @@
     }
 
     .process-content-contentOne {
-      background: #fff;
+      background: transparent;
       z-index: 98;
       /*padding: 0 6px;*/
       position: absolute;
@@ -847,15 +848,22 @@
     .process-content-right-xian {
       height: 1px;
       width: 100%;
-      background: #E6E6E9;
+      background: #00B3BE;
       position: absolute;
       top: 48px;
     }
-
+    .process-content-right-xian-color{
+      height: 28px;
+      width: 100%;
+      position: absolute;
+      top: 48px;
+      background: linear-gradient(90deg, rgba(0, 179, 190, 0.12) 0%, rgba(4, 11, 41, 0.02) 100%);
+      transform: matrix(-1, 0, 0, 1, 0, 0);
+    }
     .process-content-right-xian-one {
       height: 1px;
       width: 100%;
-      background: #E6E6E9;
+      background: #00B3BE;
       position: absolute;
       top: 74px;
     }