各跳转逻辑初步完善

pages/realName/index/components/bar-charts-model.vue

@@ -1,6 +1,6 @@
 <template>
   <view class="charts-container">
-    <qiun-data-charts type="column" :opts="opts" :chartData="chartData" />
+    <qiun-data-charts type="column" :opts="opts" :chartData="chartData" @getIndex="handleChartClick" />
   </view>
 </template>
 
@@ -150,7 +150,7 @@ export default {
             categories: ['基建线路', '基建变电', '生产线路', '生成变电', '配网', '其他'],
             series: [
               {
-                name: '目标值',
+                name: '',
                 data: [constructionLine, infrastructureSubstation, productionLine, productionSubstation, network, other]
               }
             ]
@@ -158,6 +158,13 @@ export default {
           this.chartData = JSON.parse(JSON.stringify(data))
         }, 500)
       })
+    },
+    handleChartClick(index) {
+      // console.log('index', index)
+      const currentIndex = index.currentIndex.index // 获取当前点击的图表索引
+      const currenName = this.chartData.categories[currentIndex]
+      console.log('currenName选中的工程类型', currenName)
+      uni.navigateTo({ url: `/pages/realName/index/pages/project?xxx=${currenName}` })
     }
   }
 }

pages/realName/index/components/pie-charts-model-ring-two.vue

@@ -1,6 +1,6 @@
 <template>
   <view class="charts-container">
-    <qiun-data-charts type="ring" :opts="opts" :chartData="chartData" />
+    <qiun-data-charts type="ring" :opts="opts" :chartData="chartData" @getIndex="handleChartClick" />
   </view>
 </template>
 
@@ -145,6 +145,13 @@ export default {
           this.chartData = JSON.parse(JSON.stringify(data))
         }, 500)
       })
+    },
+    handleChartClick(index) {
+      const { currentIndex } = index // 获取当前点击的图表索引
+      const chartsData = this.chartData.series[0].data
+      const currenRows = chartsData[currentIndex]
+      console.log('currenRows选中的工种类型', currenRows.name)
+      uni.navigateTo({ url: `/pages/realName/index/pages/personList?xxx=${currenRows.name}` })
     }
   }
 }

pages/realName/index/components/pie-charts-model-ring.vue

@@ -1,6 +1,6 @@
 <template>
   <view class="charts-container">
-    <qiun-data-charts type="ring" :opts="opts" :chartData="chartData" />
+    <qiun-data-charts type="ring" :opts="opts" :chartData="chartData" @getIndex="handleChartClick" />
   </view>
 </template>
 
@@ -145,6 +145,13 @@ export default {
           this.chartData = JSON.parse(JSON.stringify(data))
         }, 500)
       })
+    },
+    handleChartClick(index) {
+      const { currentIndex } = index // 获取当前点击的图表索引
+      const chartsData = this.chartData.series[0].data
+      const currenRows = chartsData[currentIndex]
+      console.log('currenRows选中的人员类型(这个应该时年龄范围)', currenRows.name)
+      uni.navigateTo({ url: `/pages/realName/index/pages/personList?xxx=${currenRows.name}` })
     }
   }
 }

pages/realName/index/components/pie-charts-model.vue

@@ -80,9 +80,6 @@ export default {
             labelBgOpacity: 0.7,
             labelFontColor: '#666666'
           }
-        },
-        onClick: e => {
-          console.log('eeeee图表点击了---', e)
         }
       }
     }
@@ -137,8 +134,12 @@ export default {
         }, 500)
       })
     },
-    handleChartClick() {
+    handleChartClick(index) {
-      console.log('图表点击-------')
+      const { currentIndex } = index // 获取当前点击的图表索引
+      const chartsData = this.chartData.series[0].data
+      const currenRows = chartsData[currentIndex]
+      console.log('currenRows选中的工程类型', currenRows.name)
+      uni.navigateTo({ url: `/pages/realName/index/pages/project?xxx=${currenRows.name}` })
     }
   }
 }

pages/realName/index/index.vue

@@ -127,7 +127,7 @@
       <view class="check-work-attendance common-style">
         <h3>人员考勤率</h3>
         <view class="check-work-attendance-container">
-          <view v-for="item in progressList" :key="item.progress_title">
+          <view v-for="item in progressList" :key="item.progress_title" @tap="onJumpPersonList(item.progress_title)">
             <view class="top-title">
               <text>{{ item.progress_title }}</text>
               <text :style="{ color: item.textColor }">{{ item.progress_proportion }}%</text>
@@ -146,7 +146,7 @@
       <view class="project-container common-style">
         <h3>工程概况</h3>
         <view class="project-content">
-          <view v-for="item in projectList" :key="item.project_title">
+          <view v-for="item in projectList" :key="item.project_title" @tap="onJumpProjectList(item.project_title)">
             <view class="top-title">
               <text>{{ item.project_title }}</text>
               <text>{{ item.project_num }}</text>
@@ -172,17 +172,17 @@
       <view class="person-container common-style">
         <h3>在场人员概况</h3>
         <view class="person-content">
-          <view>
+          <view @tap="onJumpColorLight(1)">
             <image class="person-img" src="../../../static/images/img-phase-two/index_green_light.png" mode=""></image>
             <text class="text-strong">{{ ((greenNum / colorAmount) * 100).toFixed(2) }}%</text>
             <text>{{ greenNum }}</text>
           </view>
-          <view>
+          <view @tap="onJumpColorLight(2)">
             <image class="person-img" src="../../../static/images/img-phase-two/index_yellow_light.png" mode=""></image>
             <text class="text-strong">{{ ((yellowNum / colorAmount) * 100).toFixed(2) }}%</text>
             <text>{{ yellowNum }}</text>
           </view>
-          <view>
+          <view @tap="onJumpColorLight(3)">
             <image class="person-img" src="../../../static/images/img-phase-two/index_red_light.png" mode=""></image>
             <text class="text-strong">{{ ((redNum / colorAmount) * 100).toFixed(2) }}%</text>
             <text>{{ redNum }}</text>
@@ -196,10 +196,18 @@
               <view>男({{ maleNum }})</view>
             </view>
 
-            <view class="gender-img" style="margin-left: 30rpx; background-color: #67cde6"></view>
+            <view
+              @tap="onJumpColorLight(4)"
+              class="gender-img"
+              style="margin-left: 30rpx; background-color: #67cde6"
+            ></view>
           </view>
           <view class="girl-right">
-            <view class="gender-img" style="margin-right: 30rpx; background-color: #fc8483"></view>
+            <view
+              @tap="onJumpColorLight(5)"
+              class="gender-img"
+              style="margin-right: 30rpx; background-color: #fc8483"
+            ></view>
             <view>
               <view>{{ ((femaleNum / sexAmount) * 100).toFixed(2) }}%</view>
               <view>女({{ femaleNum }})</view>
@@ -210,7 +218,7 @@
         <h5>固定、临时人员</h5>
 
         <view class="person-num">
-          <view style="color: #04cdfa">
+          <view style="color: #04cdfa" @tap="onJumpColorLight(6)">
             <image
               style="width: 60rpx; height: 60rpx; margin-left: 10rpx"
               src="../../../static/images/img-phase-two/index_img_person.png"
@@ -218,7 +226,7 @@
             ></image>
             {{ formalPersonNum }}
           </view>
-          <view style="color: #fd8d01">
+          <view style="color: #fd8d01" @tap="onJumpColorLight(7)">
             <image
               style="width: 60rpx; height: 60rpx; margin-right: 10rpx"
               src="../../../static/images/img-phase-two/index_img_person.png"
@@ -254,17 +262,35 @@
       </view>
     </scroll-view>
 
-	
-	
     <!-- 选择工程弹窗 -->
     <u-popup :show="showPopup" mode="center" @close="closePopup">
-		<view style="width:500rpx;height: auto%;position: relative;background-color: #fff;">
+      <view style="width: 500rpx; height: auto%; position: relative; background-color: #fff">
-			<view style="width: 100%;height: 70rpx;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;background-color: #fff;"> 
+        <view
-				<view style="width: 50%;height: 70rpx;line-height: 70rpx;font-weight: bold;margin-left: 40rpx;">选择工程</view>
+          style="
-				<u-icon style="width: 10%;" name="close" color="#000" size="24" @click="closePopup"></u-icon>
+            width: 100%;
+            height: 70rpx;
+            margin: 0 auto;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            background-color: #fff;
+          "
+        >
+          <view style="width: 50%; height: 70rpx; line-height: 70rpx; font-weight: bold; margin-left: 40rpx">
+            选择工程
+          </view>
+          <u-icon style="width: 10%" name="close" color="#000" size="24" @click="closePopup"></u-icon>
+        </view>
+        <scroll-view style="width: 100%; height: 50vh; background-color: #fff" scroll-y="true">
+          <view
+            v-for="(item, index) in proList"
+            :key="index"
+            style="padding: 20rpx"
+            v-if="item.isActive == 1"
+            @click="chosenPro(item)"
+          >
+            {{ item.abbreviation }}
           </view>
-			<scroll-view style="width: 100%;height: 50vh;background-color: #fff;" scroll-y="true">
-				<view v-for="(item,index) in proList" :key="index" style="padding: 20rpx;" v-if="item.isActive==1" @click="chosenPro(item)">{{item.abbreviation}}</view>
         </scroll-view>
       </view>
     </u-popup>
@@ -427,7 +453,9 @@ export default {
 
       maleNum: 0,
       femaleNum: 0,
-      sexAmount: 0
+      sexAmount: 0,
+
+      colorAmount: 0
 
       // planProNum: 0,
       // redPersonNum: 0,
@@ -444,12 +472,14 @@ export default {
     console.log('?? ~ mounted ~ mounted-index:')
     this.getLogin()
     this.getHomePageListData()
-	if(this.type.indexOf("4")>-1){//监督端
+    if (this.type.indexOf('4') > -1) {
+      //监督端
       this.getPro()
     }
   },
   onShow() {
-	if(this.type.indexOf("4")>-1){ //监督端
+    if (this.type.indexOf('4') > -1) {
+      //监督端
       let hasChosenPro = uni.getStorageSync('hasChosenPro')
       if (!hasChosenPro) {
         this.showPopup = true
@@ -513,9 +543,9 @@ export default {
         },
         success: res => {
           console.log(res)
-			res = res.data;
+          res = res.data
           if (res.code == 200) {
-				this.proList = res.data;
+            this.proList = res.data
           }
         },
         fail: err => {
@@ -526,8 +556,8 @@ export default {
     //展示工程选择弹窗
     leftClick() {
       console.log('返回')
-		if(this.type.indexOf("4")>-1){
+      if (this.type.indexOf('4') > -1) {
-		   this.showPopup=true;
+        this.showPopup = true
       }
     },
     //选择工程
@@ -535,11 +565,11 @@ export default {
       let obj = uni.getStorageSync('realNameUser')
       obj.proId = item.id
       uni.setStorageSync('realNameUser', obj)
-		uni.setStorageSync('hasChosenPro', "1")
+      uni.setStorageSync('hasChosenPro', '1')
-		this.showPopup=false;
+      this.showPopup = false
     },
     closePopup() {
-		this.showPopup=false;
+      this.showPopup = false
     },
     openFaceScan() {
       face.open(['a', 'c'], function (e) {
@@ -658,9 +688,89 @@ export default {
       if (item.data_title == '在场人数') {
         uni.navigateTo({ url: '/pages/realName/index/pages/personList' })
       }
+    },
+    /* 人员考勤等跳转 */
+    onJumpPersonList(title) {
+      let params = ''
+      // 跳转人员列表
+      switch (title) {
+        case '在场考勤率':
+          params = '在场考勤率'
+          break
+        case '作业考勤率':
+          params = '作业考勤率'
+          break
+        case '在场人员（固定）':
+          params = '在场人员（固定）'
+          break
+        case '在场人员（临时）':
+          params = '在场人员（临时）'
+          break
+        case '考勤率（固定人员）':
+          params = '考勤率（固定人员）'
+          break
+        case '考勤率（临时人员）':
+          params = '考勤率（临时人员）'
+          break
+      }
 
+      console.log('params路由参数考勤固定等··', params)
+      uni.navigateTo({ url: `/pages/realName/index/pages/personList?xxx=${params}` })
     },
+    /* 工程概况跳转 */
+    onJumpProjectList(title) {
+      let params = ''
+      // 跳转人员列表
+      switch (title) {
+        case '在建':
+          params = '在建'
+          break
+        case '筹建':
+          params = '筹建'
+          break
+        case '停工':
+          params = '停工'
+          break
+        case '完工':
+          params = '完工'
+          break
+      }
+
+      console.log('params路由参数工程概况', params)
+      uni.navigateTo({ url: `/pages/realName/index/pages/project?xxx=${params}` })
     },
+    /* 在场人员概况跳转人员信息 */
+    onJumpColorLight(type) {
+      let params = ''
+      // 跳转人员列表
+      switch (type) {
+        case 1:
+          params = '绿灯'
+          break
+        case 2:
+          params = '黄灯'
+          break
+        case 3:
+          params = '红灯'
+          break
+        case 4:
+          params = '男性'
+          break
+        case 5:
+          params = '女性'
+          break
+        case 6:
+          params = '固定人员'
+          break
+        case 7:
+          params = '临时人员'
+          break
+      }
+
+      console.log('params路由参数红黄灯以及性别··和固定、临时', params)
+      uni.navigateTo({ url: `/pages/realName/index/pages/personList?xxx=${params}` })
+    }
+  }
 }
 </script>