From 2b2e218aad8f7fd9763eb4e886e6feb7c6ef68de Mon Sep 17 00:00:00 2001
From: zhangjun1 <zhangjun@bd-apaas.com>
Date: Wed, 12 Aug 2020 17:12:48 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B5=81=E7=A8=8B=E8=AF=A6=E6=83=85=E6=8E=A5?=
 =?UTF-8?q?=E5=8F=A3=E5=AF=B9=E6=8E=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/e-charts/process-top-list.vue  |   8 +-
 .../shop-car-apply/apply_service_state.vue    |   5 +
 src/components/table/table-um.vue             |   6 +-
 .../process-management/designer/detail.vue    | 195 +++++++++++++-----
 .../process-management/monitoring/index.vue   |   2 +-
 5 files changed, 162 insertions(+), 54 deletions(-)

diff --git a/src/components/e-charts/process-top-list.vue b/src/components/e-charts/process-top-list.vue
index c6aff89..2b2c3d7 100644
--- a/src/components/e-charts/process-top-list.vue
+++ b/src/components/e-charts/process-top-list.vue
@@ -20,7 +20,7 @@
           ></el-progress>
           <span
             style="float:right;"
-              v-text="helper.numberFormat(option.request_count, 2) + (option.request_count > 10000 ? '万次' : '次')"
+              v-text="helper.numberFormat(option.request_count, 2) + (option.request_count > 10000 ? '万'+unit : unit)"
             ></span>
         </div>
       </li>
@@ -39,7 +39,11 @@ export default {
     targetValue: {
       type: Number,
       default: () => 0
-    }
+    },
+    unit: {
+      type: String,
+      default: () => '次'
+    },
   },
   data() {
     return {
diff --git a/src/components/shop-car-apply/apply_service_state.vue b/src/components/shop-car-apply/apply_service_state.vue
index 6edcffb..4cd3288 100644
--- a/src/components/shop-car-apply/apply_service_state.vue
+++ b/src/components/shop-car-apply/apply_service_state.vue
@@ -137,6 +137,11 @@ export default {
 };
 </script>
 
+<style>
+.outborder .system .el-input__prefix,.outborder .system .el-input__suffix{
+  left: auto;
+}
+</style>
 <style scoped>
 .outborder {
   border-bottom: 2px solid rgba(244, 247, 252, 1);
diff --git a/src/components/table/table-um.vue b/src/components/table/table-um.vue
index 1282faa..fe639ba 100644
--- a/src/components/table/table-um.vue
+++ b/src/components/table/table-um.vue
@@ -460,7 +460,11 @@ export default {
       });
     },
     gotopage(url,id){
-      this.$router.push(`/fwgl/0/0/servicedetail/${id}`)
+      if(url=='/'){
+        this.$router.push(`/fwgl/0/0/servicedetail/${id}`)
+      }else{
+        this.$router.push(`${url}${id}`)
+      }
     },
     //本地删除
     deleteLocal(val) {
diff --git a/src/pages/workbench/component-center/process-management/designer/detail.vue b/src/pages/workbench/component-center/process-management/designer/detail.vue
index 1b57bed..2923e67 100644
--- a/src/pages/workbench/component-center/process-management/designer/detail.vue
+++ b/src/pages/workbench/component-center/process-management/designer/detail.vue
@@ -9,7 +9,7 @@
             </div>
             <div class="type_box_select">
                 <info-list :list_arr="now_service==0?list_arr:servicead_arr">
-                  <table-um style="width:700px;" v-if="zd_table_arr.length" height='250px' :stripe="true" :headers="header_arr" :datas="zd_table_arr" slot="fw_table"></table-um>
+                  <table-um style="width:700px;" height='250px' :stripe="true" :headers="header_arr" :datas="zd_table_arr" slot="fw_table"></table-um>
                   <div slot="process">流程</div>
                   <div slot="count">
                     <div class="charts">
@@ -18,7 +18,7 @@
                           <img style="width:48px;float:left;margin-top:20px;" src="../../../../../assets/imgs/shop_ic_jierujg.png" alt="">
                           <div style="float:right;">
                             <p>流程实例总数</p>
-                            <p><span>2,980</span><span>万</span></p>
+                            <p><span>{{all_count.total_instances>=10000?all_count.total_instances/10000:all_count.total_instances}}</span><span :style="all_count.total_instances>=10000?'':{opacity:0}">万</span></p>
                           </div>
                         </div>
                       </div>
@@ -27,7 +27,7 @@
                           <img style="width:48px;float:left;margin-top:20px;" src="../../../../../assets/imgs/liucheng_ic_haoshi.png" alt="">
                           <div style="float:right;margin-right:40px;">
                             <p>流程平均耗时</p>
-                            <p style="right:-38px;"><span>35</span><span>min</span></p>
+                            <p style="right:-38px;"><span>{{all_count.avg_time}}</span><span>min</span></p>
                           </div>
                         </div>
                       </div>
@@ -36,7 +36,7 @@
                           <img style="width:48px;float:left;margin-top:20px;" src="../../../../../assets/imgs/liucheng_ic_haoshi.png" alt="">
                           <div style="float:right;">
                             <p>流程超时率</p>
-                            <p><span>5</span><span>%</span></p>
+                            <p><span>{{all_count.timeout_rate}}</span><span>%</span></p>
                           </div>
                         </div>
                       </div>
@@ -64,6 +64,7 @@
                             class="block-radius-content"
                             :options="toplistData"
                             :target-value="toplistTargetValue"
+                            unit="min"
                           ></toplist>
                         </block-radius>
                       </div>
@@ -89,7 +90,7 @@ import infoList from '@/components/infoList'
 import tableUm from '@/components/table/table-um'
 import BlockRadius from "@/components/general/block-radius";
 import lineChart from "@/components/e-charts/line_chart";
-import Toplist from "@/components/e-charts/toplist";
+import Toplist from "@/components/e-charts/process-top-list";
 import BarChart from "@/components/e-charts/bar-chart";
 export default {
   components: {
@@ -117,18 +118,28 @@ export default {
           fixed_url:'/',
           url:''
       },
+      all_count: {
+          "total_instances": 0, //流程实例总数
+          "timeout_rate": 0,//流程超时率
+          "avg_time": 0 // 流程平均耗时
+      },
       toplistData:[],
       toplistTargetValue:0,
-      bar_data_org: {},
+      bar_data_org: {
+        legendData: [],
+        seriesData: [
+          
+        ]
+      },
       state:1,
       now_service:0,
       service_arr:[],
       line_data:{
-        xAxisData: ['01-02','01-03','01-04','01-05','01-06','01-07'],
+        xAxisData: [],
         seriesData: [
           {
             name: "趋势",
-            data: [100,200,500,1000,1800,500]
+            data: []
           }
         ]
       },
@@ -151,12 +162,6 @@ export default {
             type:'solt',
             solt_name:'fw_table'
         },
-        {
-            title:'流程概览：',
-            info:'',
-            type:'solt',
-            solt_name:'process'
-        },
       ],
       servicead_arr:[
         {
@@ -188,37 +193,157 @@ export default {
             align:'center',
         },
       ],
-      zd_table_arr:[]
+      zd_table_arr:[],
+      chart_data:'',
     }
   },
   created(){
     this.get_process_detail()
+    this.get_table_service()
   },
   methods:{
     get_process_detail(){
       this.$http
-            .get('/apaas/serviceapp/v3/workflows/detail?id='+9)
+            .get('/apaas/serviceapp/v3/workflows/briefDetail?id='+this.$route.params.id)
             .then(response => {
                 let data = response.data.data
                 console.log(data);
                 this.state = data.state
                 this.get_header(data)
                 this.getbaseinfo(data)
+                if(this.state!==0){
+                  this.get_all_count()
+                  this.get_process_num()
+                  this.get_node_time()
+                  this.get_node_timeout()
+                }else{
+                  this.list_arr.push(
+                    {
+                        title:'流程概览：',
+                        info:'',
+                        type:'solt',
+                        solt_name:'process'
+                    })
+                }
+                
             })
             .catch(function(response) {
                 
             });
     },
-    changeday(){
-
+    changeday(index){
+      if(index==0){
+        this.deal_charts_data(this.chart_data.day)
+      }else{
+        this.deal_charts_data(this.chart_data.month)
+      }
+    },
+    get_node_time(){
+      this.$http
+            .get('/apaas/serviceapp/v3/workflows/detail/nodeElapsedTimeStat?id='+this.$route.params.id)
+            .then(response => {
+                let data = response.data.data
+                this.toplistData = []
+                var temp = []
+                if(data){
+                  data.forEach(e => {
+                    this.toplistData.push({
+                      service_name:e.node_name,
+                      request_count:e.elapsed_time
+                    })
+                    temp.push(e.elapsed_time)
+                  });
+                  if(Math.max(...temp)>=1){
+                    this.toplistTargetValue = Math.max(...temp)
+                  }else{
+                    this.toplistTargetValue = 1
+                  }
+                }
+            })
+            .catch(function(response) {
+                
+            });
+    },
+    get_node_timeout(){
+      this.$http
+            .get('/apaas/serviceapp/v3/workflows/detail/nodeTimeoutRate?id='+this.$route.params.id)
+            .then(response => {
+                let data = response.data.data
+                if(data){
+                  var tempx = []
+                  var tempy = []
+                  data.forEach(e => {
+                    tempx.push(e.node_name)
+                    tempy.push(e.timeout_rate*100)
+                  });
+                  this.bar_data_org= {
+                    legendData: tempx,
+                    seriesData: tempy
+                  }
+                }
+            })
+            .catch(function(response) {
+                
+            });
+    },
+    get_process_num(){
+      this.$http
+            .get('/apaas/serviceapp/v3/workflows/detail/statInstance?id='+this.$route.params.id)
+            .then(response => {
+                let data = response.data.data
+                if(data){
+                  this.chart_data = data
+                  this.deal_charts_data(this.chart_data.day)
+                }
+            })
+            .catch(function(response) {
+                
+            });
+    },
+    deal_charts_data(arr){
+      var tempx = []
+      var tempy = []
+      arr.forEach(e => {
+        tempx.push(e.date)
+        tempy.push(e.wf_instances)
+      });
+      this.line_data={
+        xAxisData: tempx,
+        seriesData: [
+          {
+            name: "趋势",
+            data: tempy
+          }
+        ]
+      }
+    },
+    get_all_count(){
+      this.$http
+            .get('/apaas/serviceapp/v3/workflows/detail/summary?id='+this.$route.params.id)
+            .then(response => {
+                let data = response.data.data
+                if(data){
+                  this.all_count = data
+                }
+            })
+            .catch(function(response) {
+                
+            });
     },
     get_table_service(){
       this.$http
-            .get('/apaas/serviceapp/v3/workflows/mountServices?id='+9)
+            .get('/apaas/serviceapp/v3/workflows/mountServices?id='+this.$route.params.id)
             .then(response => {
                 let data = response.data.data
+                this.zd_table_arr = []
                 if(data&&data.length){
-                  this.zd_table_arr = data
+                  data.forEach(e => {
+                    this.zd_table_arr.push({
+                      fwmc:e.name,
+                      id:e.service_id,
+                      time:e.service_end_time
+                    })
+                  });
                 }
             })
             .catch(function(response) {
@@ -308,36 +433,6 @@ export default {
       this.$set(this.list_arr[0],'info',data.describe)
       this.$set(this.list_arr[1],'info',data.org_name)
       this.$set(this.list_arr[2],'info',data.create_time.split('+')[0].replace('T',' '))
-      this.zd_table_arr=[
-        {
-          fwmc:'身份验证服务',
-          time:'2020-11-15 15:20:30'
-        },
-        {
-          fwmc:'身份验证服务',
-          time:'2020-11-15 15:20:30'
-        },
-        {
-          fwmc:'身份验证服务',
-          time:'2020-11-15 15:20:30'
-        },
-        {
-          fwmc:'身份验证服务',
-          time:'2020-11-15 15:20:30'
-        },
-        {
-          fwmc:'身份验证服务',
-          time:'2020-11-15 15:20:30'
-        },
-        {
-          fwmc:'身份验证服务',
-          time:'2020-11-15 15:20:30'
-        },
-        {
-          fwmc:'身份验证服务',
-          time:'2020-11-15 15:20:30'
-        },
-      ]
     }
   }
 
diff --git a/src/pages/workbench/component-center/process-management/monitoring/index.vue b/src/pages/workbench/component-center/process-management/monitoring/index.vue
index 2456a81..0a48a1e 100644
--- a/src/pages/workbench/component-center/process-management/monitoring/index.vue
+++ b/src/pages/workbench/component-center/process-management/monitoring/index.vue
@@ -204,7 +204,7 @@ export default {
               align: "left",
               minWidtn:'40%',
               type:'click',
-              url:'/',
+              url:'/progress/designer/detail/',
               id:'id',
             },
             {
-- 
2.26.0