count

src/views/bigScreen/cockpit/businessCockpit/index.vue

 <!--
- * @Description: 管理智能驾驶舱
+ * @Description: 业务智能驾驶舱
  * @Version: 2.0
  * @Autor: pan
  * @Date: 2024-06-05 09:51:26
  * @LastEditors: pan
- * @LastEditTime: 2024-06-11 09:29:35
+ * @LastEditTime: 2024-06-11 16:29:47
 -->
 <template>
   <div class="w-100 h-100 manageCockpit flex">
     <div class="leftTree">
       <div class="treeTitle">组织机构</div>
       <el-tree
-          :highlight-current="true"
-          :data="treeData"
-          :props="treeProps"
-          @node-click="handleNodeClick"
+        :highlight-current="true"
+        :data="treeData"
+        :props="treeProps"
+        @node-click="handleNodeClick"
       ></el-tree>
     </div>
     <div class="flex-1" style="min-width: 0">
       <div class="header__wrap p-16">
-        <div class="header-title m-b-16 align-l font-bold font-18">
-          发展策划部
+        <div class="header-title m-b-16 align-l">
+          <span class="font-18 font-bold">发展策划部</span>
+          <div class="flex m-t-10">
+            <div class="flex m-r-30">
+              <div class="label">支撑业务系统数量:</div>
+              <div class="font-bold font-18">{{ numberSystems }}</div>
+            </div>
+            <div class="flex  m-r-30">
+              <div class="label">涉及业务流程数量:</div>
+              <div class="font-bold font-18">{{ businessProcess }}</div>
+            </div>
+            <div class="flex">
+              <div class="label">涉及业务活动数量:</div>
+              <div class="font-bold font-18">{{ businessActivities }}</div>
+            </div>
+          </div>
         </div>
         <div class="header-choosePrj align-l">
           <el-button class="m-r-20" type="primary" @click="fnChoosePrj()"
-          >选择项目
-          </el-button
-          >
+            >选择项目
+          </el-button>
           <span>您已选择：{{ prjInfo.prjName }}</span>
         </div>
       </div>
 
       <div class="content__wrap flex">
-        <ProjectInfo ref="project" style="width: 30%"/>
+        <ProjectInfo ref="project" style="width: 30%" />
         <ViewInfo
-            style="width: 70%"
-            :prjId="prjInfo.prjId"
-            ref="view"
-            class="flex-1"
+          style="width: 70%"
+          :prjId="prjInfo.prjId"
+          ref="view"
+          class="flex-1"
         />
       </div>
     </div>
 
     <!-- 选择项目组件 -->
     <ChoosePrjDialog
-        @selectData="selectData"
-        :visible.sync="choosePrjVisible"
+      @selectData="selectData"
+      :visible.sync="choosePrjVisible"
     />
   </div>
 </template>
@@ -55,8 +68,8 @@ import ChoosePrjDialog from '@/components/ChoosePrjDialog.vue'
 import ProjectInfo from '../components/ProjectInfo.vue'
 import ViewInfo from '../components/ViewInfo.vue'
 
-import {queryProjectInfoManageTable} from '@/api/index'
-import {getOrgTree} from '@/api/bigScreen'
+import { queryProjectInfoManageTable } from '@/api/index'
+import { getOrgTree, getCountBusiness } from '@/api/bigScreen'
 
 export default {
   name: 'manageCockpit',
@@ -74,12 +87,16 @@ export default {
         children: 'children',
         label: 'name',
       },
+      businessActivities: 0,
+      businessProcess: 0,
+      numberSystems: 0,
     }
   },
 
   created() {
     this.queryProjectInfoManageTable()
     this.getOrgTree()
+    this.getCountBusiness()
   },
   methods: {
     init() {
@@ -115,8 +132,16 @@ export default {
       this.prjInfo = data[0]
       this.init()
     },
-    handleNodeClick() {
-    },
+    handleNodeClick() {},
+    getCountBusiness() {
+      getCountBusiness().then(res => {
+        if(res.code === 200) {
+          this.businessActivities = res.data.businessActivities,
+          this.businessProcess = res.data.businessProcess
+          this.numberSystems = res.data.numberSystems
+        }
+      })
+    }
   },
 }
 </script>
@@ -157,9 +182,9 @@ export default {
     }
 
     /deep/
-    .el-tree--highlight-current
-    .el-tree-node.is-current
-    > .el-tree-node__content {
+      .el-tree--highlight-current
+      .el-tree-node.is-current
+      > .el-tree-node__content {
       background-color: #c0ebe4 !important;
       color: #999999;
 

src/views/bigScreen/cockpit/projectCockpit/index.vue

 <!--
- * @Description: 管理智能驾驶舱
+ * @Description: 项目智能驾驶舱
  * @Version: 2.0
  * @Autor: pan
  * @Date: 2024-06-05 09:51:26
  * @LastEditors: pan
- * @LastEditTime: 2024-06-11 09:29:35
+ * @LastEditTime: 2024-06-11 16:16:47
 -->
 <template>
   <div class="w-100 h-100 manageCockpit flex">