From 256aa680b2a413bb3e38bb13665523011283ca5d Mon Sep 17 00:00:00 2001
From: loveflow <5269966+loveflow@user.noreply.gitee.com>
Date: Fri, 1 Mar 2024 23:19:30 +0800
Subject: [PATCH] update

---
 src/assets/images/topic/flow.png              | Bin 0 -> 13954 bytes
 src/loveflow/components/echart/bar/five.vue   | 215 ++++++++++++
 .../components/echart/pie/dpieOne.vue         | 326 ++++++++++++++++++
 src/loveflow/components/echart/pie/five.vue   |   6 +-
 src/loveflow/components/echart/pie/four.vue   |   6 +-
 src/loveflow/components/echart/pie/six.vue    |  13 +-
 src/loveflow/components/menu/head.vue         |   4 +-
 .../enterpriseTopic/components/topicMain.vue  |   4 +-
 .../enterpriseTopic/personSafety/index.vue    |  11 +-
 .../enterpriseTopic/personSafety/screen.vue   |  92 ++++-
 10 files changed, 648 insertions(+), 29 deletions(-)
 create mode 100644 src/assets/images/topic/flow.png
 create mode 100644 src/loveflow/components/echart/bar/five.vue
 create mode 100644 src/loveflow/components/echart/pie/dpieOne.vue

diff --git a/src/assets/images/topic/flow.png b/src/assets/images/topic/flow.png
new file mode 100644
index 0000000000000000000000000000000000000000..7c71c019867db58b9def97b297e8e6804630ae03
GIT binary patch
literal 13954
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
B{}TWJ

literal 0
HcmV?d00001

diff --git a/src/loveflow/components/echart/bar/five.vue b/src/loveflow/components/echart/bar/five.vue
new file mode 100644
index 0000000..4ac7220
--- /dev/null
+++ b/src/loveflow/components/echart/bar/five.vue
@@ -0,0 +1,215 @@
+<template>
+  <div style="height: 100%; width: 100%">
+    <g-chart :echartdata="option"></g-chart>
+  </div>
+</template>
+<script>
+export default {
+  props: {
+    chartObj: {
+      type: Object,
+      default: () => {
+        return {};
+      },
+    },
+  },
+  data() {
+    return {
+      option: {},
+    };
+  },
+  mounted() {
+    this.setOption();
+  },
+  methods: {
+    setOption() {
+      let dataList = this.chartObj.data;
+      let maxArr = [];
+      let maxValue = 0;
+      let xData = [];
+      let yData = [];
+      let total = 0;
+
+      dataList.forEach((item) => {
+        xData.push(item.name);
+        yData.push(item.value);
+        if (maxValue < item.value) {
+          maxValue = item.value;
+        }
+      });
+      dataList.forEach((item) => {
+        maxArr.push(maxValue);
+        total = total + item.value;
+      });
+      if (!total) {
+        total = 1;
+      }
+
+      this.option = {
+        grid: {
+          left: "14",
+          top: "5%", // 设置条形图的边距
+          right: "0",
+          bottom: "0",
+        },
+        xAxis: {
+          show: false,
+        },
+        yAxis: [
+          {
+            type: "category",
+            inverse: true,
+            data: xData,
+            axisLine: {
+              show: false,
+            },
+            axisTick: {
+              show: false,
+            },
+            axisLabel: {
+              show: true,
+              textStyle: {
+                verticalAlign: "bottom",
+                color: "#299CD4",
+                fontSize: 14,
+                fontFamily: "Microsoft YaHei",
+                align: "left",
+                padding: [0, 0, 5, 7],
+                rich: {
+                  index: {
+                    padding: [2, 1, 0, 1],
+                    width: 20,
+                    height: 20,
+                    backgroundColor: "rgba(255,255,255,0.1)",
+                    borderRadius: 4,
+                    align: "center",
+                    color: "#FFDE9C",
+                  },
+                  name: {
+                    padding: [4, 16, 0, 4],
+                    color: "#ffffff",
+                    fontSize: 14,
+                  },
+                  value: {
+                    padding: [4, 0, 0, 4],
+                    color: "#9CE0FF",
+                    fontSize: 16,
+                  },
+                  rate: {
+                    align: "right",
+                    color: "rgba(255,255,255,0.9)",
+                    fontSize: 12,
+                  },
+                },
+              },
+              formatter: (name, index) => {
+                const _index = index + 1;
+                if (dataList.length) {
+                  const item = dataList.filter((item) => item.name == name)[0];
+                  return `{index|${_index}} {name|${name}}{value| ${item.value.toLocaleString()}人}`;
+                }
+              },
+            },
+            offset: 0,
+          },
+        ],
+        series: [
+          {
+            // 内
+            type: "bar",
+            barWidth: 6,
+            itemStyle: {
+              color: (params) => {
+                var color = {
+                  type: "linear",
+                  x: 0,
+                  y: 0,
+                  x2: 1,
+                  y2: 0,
+                  colorStops: [
+                    {
+                      offset: 0,
+                      color: this.chartObj.color[0], // 0% 处的颜色
+                    },
+                    {
+                      offset: 1,
+                      color: this.chartObj.color[1], // 100% 处的颜色
+                    },
+                  ],
+                };
+                return color;
+              },
+            },
+            label: {
+              show: false,
+            },
+            data: dataList,
+            z: 2,
+            animationEasing: "elasticOut",
+          },
+          {
+            // 外边框
+            type: "pictorialBar",
+            symbol: "rect",
+            symbolBoundingData: maxValue,
+            barWidth: 1,
+            itemStyle: {
+              barBorderRadius: 10,
+              normal: {
+                color: "none",
+              },
+            },
+            label: {
+              padding: [-20, 0, 0, -30],
+              formatter: (params) => {
+                var text = `{a|${((params.data * 100) / total).toFixed(0)}%}`; // `{{f|(params.data / total) * 100 + %}`;
+                return text;
+              },
+
+              rich: {
+                a: {
+                  color: "#9CE0FF",
+                  fontSize: 16,
+                  align: "right",
+                },
+              },
+              position: "right",
+              distance: 1, // 向右偏移位置
+              show: true,
+            },
+            data: yData,
+            z: 0,
+            animationEasing: "elasticOut",
+          },
+          {
+            name: "外框",
+            type: "pictorialBar",
+            symbol: "rect",
+            symbolBoundingData: maxValue,
+            barGap: "-100%", // 设置外框粗细
+            data: maxArr,
+            barWidth: 6,
+            itemStyle: {
+              color: "rgba(255,255,255,0.06)", // 填充色
+              label: {
+                // 标签显示位置
+                show: false,
+              },
+            },
+            z: 0,
+          },
+        ],
+      };
+    },
+  },
+  watch: {
+    chartObj: {
+      handler(newval) {
+        this.setOption();
+      },
+      deep: true,
+      // immediate: true,
+    },
+  },
+};
+</script>
diff --git a/src/loveflow/components/echart/pie/dpieOne.vue b/src/loveflow/components/echart/pie/dpieOne.vue
new file mode 100644
index 0000000..c4dbca3
--- /dev/null
+++ b/src/loveflow/components/echart/pie/dpieOne.vue
@@ -0,0 +1,326 @@
+<template>
+  <div class="dpiePanel">
+    <div class="dpieLegend">
+      <div class="dpieRow" v-for="item in data" :key="item.name">
+        <div
+          class="dpieIcon"
+          :style="{ backgroundColor: item.itemStyle.color }"
+        ></div>
+        <div class="dpieName">{{ item.name }}</div>
+        <div class="dpieValue">{{ item.value }}</div>
+      </div>
+    </div>
+    <div style="flex: 1">
+      <div class="dpiebg">
+        <div ref="dpieWrapRef" class="dpieWrap"></div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import * as echarts from "echarts";
+import "echarts-gl";
+export default {
+  data() {
+    return {
+      data: [
+        {
+          name: "已被核查人数",
+          value: 34567,
+          itemStyle: {
+            color: "#378DFF",
+          },
+        },
+        {
+          name: "未被核查人数",
+          value: 21456,
+          itemStyle: {
+            color: "#E15A4E",
+          },
+        },
+      ],
+      total: 1,
+    };
+  },
+  mounted() {
+    this.total = 1;
+    for (let i = 0; i < this.data.length; i++) {
+      this.total += this.data[i].value;
+    }
+
+    this.echartsPie();
+  },
+  methods: {
+    echartsPie() {
+      let optionsData = this.data;
+      let hoveredIndex = "";
+      let chartDom = this.$refs["dpieWrapRef"];
+      let myChart = echarts.init(chartDom);
+      const getPie3D = (pieData, internalDiameterRatio) => {
+        //internalDiameterRatio:透明的空心占比
+        let series = [];
+        let sumValue = 0;
+        let startValue = 0;
+        let endValue = 0;
+        let k = 1 / 5;
+        pieData.sort((a, b) => {
+          return b.value - a.value;
+        });
+        // 为每一个饼图数据，生成一个 series-surface 配置
+        for (let i = 0; i < pieData.length; i++) {
+          sumValue += pieData[i].value;
+          let seriesItem = {
+            name:
+              typeof pieData[i].name === "undefined"
+                ? `series${i}`
+                : pieData[i].name,
+            type: "surface",
+            parametric: true,
+            wireframe: {
+              show: false,
+            },
+            pieData: pieData[i],
+            pieStatus: {
+              selected: false,
+              hovered: false,
+              k: k,
+            },
+            radius: "90%",
+            center: ["50%", "50%"],
+          };
+
+          if (typeof pieData[i].itemStyle != "undefined") {
+            let itemStyle = {};
+            typeof pieData[i].itemStyle.color != "undefined"
+              ? (itemStyle.color = pieData[i].itemStyle.color)
+              : null;
+            typeof pieData[i].itemStyle.opacity != "undefined"
+              ? (itemStyle.opacity = pieData[i].itemStyle.opacity)
+              : null;
+            seriesItem.itemStyle = itemStyle;
+          }
+          series.push(seriesItem);
+        }
+
+        // 使用上一次遍历时，计算出的数据和 sumValue，调用 getParametricEquation 函数，
+        // 向每个 series-surface 传入不同的参数方程 series-surface.parametricEquation，也就是实现每一个扇形。
+        for (let i = 0; i < series.length; i++) {
+          endValue = startValue + series[i].pieData.value;
+          series[i].pieData.startRatio = startValue / sumValue;
+          series[i].pieData.endRatio = endValue / sumValue;
+          series[i].parametricEquation = getParametricEquation(
+            series[i].pieData.startRatio,
+            series[i].pieData.endRatio,
+            false,
+            false,
+            k,
+            series[i].pieData.value
+          );
+          startValue = endValue;
+        }
+        let boxHeight = getHeight3D(series, 6); //通过传参设定3d饼/环的高度，26代表26px
+        // 准备待返回的配置项，把准备好的 legendData、series 传入。
+        let option = {
+          // backgroundColor: "#fff",
+          tooltip: {
+            show: false,
+          },
+          legend: {
+            show: false,
+          },
+          xAxis3D: {
+            min: -1,
+            max: 1,
+          },
+          yAxis3D: {
+            min: -1,
+            max: 1,
+          },
+          zAxis3D: {
+            min: -1,
+            max: 1,
+          },
+          grid3D: {
+            show: false,
+            boxHeight: boxHeight, //圆环的高度
+            left: 0,
+            top: -20, //3d饼图的位置
+            viewControl: {
+              //3d效果可以放大、旋转等，请自己去查看官方配置
+              alpha: 24, //角度
+              distance: 120, //调整视角到主体的距离，类似调整zoom
+              rotateSensitivity: 0, //设置为0无法旋转
+              zoomSensitivity: 0, //设置为0无法缩放
+              panSensitivity: 0, //设置为0无法平移
+              autoRotate: false, //自动旋转
+            },
+          },
+          series: series,
+        };
+        return option;
+      };
+
+      //获取3d丙图的最高扇区的高度
+      const getHeight3D = (series, height) => {
+        series.sort((a, b) => {
+          return b.pieData.value - a.pieData.value;
+        });
+        return (height * 50) / series[0].pieData.value;
+      };
+
+      // 生成扇形的曲面参数方程，用于 series-surface.parametricEquation
+      const getParametricEquation = (
+        startRatio,
+        endRatio,
+        isSelected,
+        isHovered,
+        k,
+        h
+      ) => {
+        // 计算
+        let midRatio = (startRatio + endRatio) / 2;
+        let startRadian = startRatio * Math.PI * 2;
+        let endRadian = endRatio * Math.PI * 2;
+        let midRadian = midRatio * Math.PI * 2;
+        // 如果只有一个扇形，则不实现选中效果。
+        if (startRatio === 0 && endRatio === 1) {
+          isSelected = false;
+        }
+        // 通过扇形内径/外径的值，换算出辅助参数 k（默认值 1/3）
+        k = typeof k !== "undefined" ? k : 1 / 3;
+        // 计算选中效果分别在 x 轴、y 轴方向上的位移（未选中，则位移均为 0）
+        let offsetX = isSelected ? Math.cos(midRadian) * 0.1 : 0;
+        let offsetY = isSelected ? Math.sin(midRadian) * 0.1 : 0;
+        // 计算高亮效果的放大比例（未高亮，则比例为 1）
+        let hoverRate = isHovered ? 1.05 : 1;
+        // 返回曲面参数方程
+        return {
+          u: {
+            min: -Math.PI,
+            max: Math.PI * 3,
+            step: Math.PI / 32,
+          },
+          v: {
+            min: 0,
+            max: Math.PI * 2,
+            step: Math.PI / 20,
+          },
+          x: function (u, v) {
+            if (u < startRadian) {
+              return (
+                offsetX +
+                Math.cos(startRadian) * (1 + Math.cos(v) * k) * hoverRate
+              );
+            }
+            if (u > endRadian) {
+              return (
+                offsetX +
+                Math.cos(endRadian) * (1 + Math.cos(v) * k) * hoverRate
+              );
+            }
+            return offsetX + Math.cos(u) * (1 + Math.cos(v) * k) * hoverRate;
+          },
+          y: function (u, v) {
+            if (u < startRadian) {
+              return (
+                offsetY +
+                Math.sin(startRadian) * (1 + Math.cos(v) * k) * hoverRate
+              );
+            }
+            if (u > endRadian) {
+              return (
+                offsetY +
+                Math.sin(endRadian) * (1 + Math.cos(v) * k) * hoverRate
+              );
+            }
+            return offsetY + Math.sin(u) * (1 + Math.cos(v) * k) * hoverRate;
+          },
+          z: function (u, v) {
+            if (u < -Math.PI * 0.5) {
+              return Math.sin(u);
+            }
+            if (u > Math.PI * 2.5) {
+              return Math.sin(u) * h * 0.1;
+            }
+            return Math.sin(v) > 0 ? 1 * h * 0.1 : -1;
+          },
+        };
+      };
+
+      let option = getPie3D(this.data, 0.8);
+      //是否需要label指引线，如果要就添加一个透明的2d饼状图并调整角度使得labelLine和3d的饼状图对齐，并再次setOption
+      option.series.push({
+        // name: "pie3d",
+        type: "pie",
+        label: {
+          show: true,
+          position: "outside",
+          formatter: "{c}%",
+        },
+        // startAngle: -25, //起始角度，支持范围[0, 360]。
+        clockwise: false, //饼图的扇区是否是顺时针排布。上述这两项配置主要是为了对齐3d的样式
+        radius: ["80%", "80%"],
+        center: ["50%", "50%"], //指示线的位置
+        itemStyle: {
+          opacity: 0,
+        },
+      });
+      option && myChart.setOption(option);
+    },
+  },
+  watch: {
+    chartObj: {
+      handler(newval) {
+        this.setOption();
+      },
+      deep: true,
+      // immediate: true,
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.dpiePanel {
+  position: relative;
+  flex: 1;
+  height: 100%;
+  .dpieLegend {
+    position: absolute;
+    right: 40px;
+    top: 28px;
+    .dpieRow {
+      display: flex;
+      align-items: center;
+      margin-bottom: 6px;
+      .dpieIcon {
+        margin-right: 6px;
+        width: 8px;
+        height: 8px;
+        transform: rotate(45deg);
+      }
+      .dpieName {
+        margin-right: 18px;
+        font-size: 12px;
+        color: #d0deee;
+      }
+      .dpieValue {
+        font-size: 16px;
+        color: #ffffff;
+      }
+    }
+  }
+}
+.dpieWrap {
+  width: 240px;
+  height: 120px;
+}
+.dpiebg {
+  margin-top: 10px;
+  width: 240px;
+  height: 120px;
+  background: url("~@/assets/images/screen/dpie.png");
+  background-size: 100% 100%;
+  display: flex;
+  justify-content: flex-start;
+}
+</style>
diff --git a/src/loveflow/components/echart/pie/five.vue b/src/loveflow/components/echart/pie/five.vue
index b080a9f..5275626 100644
--- a/src/loveflow/components/echart/pie/five.vue
+++ b/src/loveflow/components/echart/pie/five.vue
@@ -72,12 +72,12 @@ export default {
         legend: {
           data: legend,
           orient: "vertical",
-          bottom: "6%",
-          left: "20%",
+          bottom: "2%",
+          left: "10%",
           icon: "diamond",
           itemHeight: 8,
           itemWidth: 8,
-          itemGap: 16,
+          itemGap: 8,
           padding: 2,
           //backgroundColor: "rgba(108,128,151,0.2)",
           textStyle: {
diff --git a/src/loveflow/components/echart/pie/four.vue b/src/loveflow/components/echart/pie/four.vue
index 27bdb86..204ca86 100644
--- a/src/loveflow/components/echart/pie/four.vue
+++ b/src/loveflow/components/echart/pie/four.vue
@@ -72,12 +72,12 @@ export default {
         legend: {
           data: legend,
           orient: "vertical",
-          bottom: "6%",
-          left: "20%",
+          bottom: "2%",
+          left: "10%",
           icon: "diamond",
           itemHeight: 8,
           itemWidth: 8,
-          itemGap: 16,
+          itemGap: 8,
           padding: 2,
           //backgroundColor: "rgba(108,128,151,0.2)",
           textStyle: {
diff --git a/src/loveflow/components/echart/pie/six.vue b/src/loveflow/components/echart/pie/six.vue
index bc83ae0..8ec04b7 100644
--- a/src/loveflow/components/echart/pie/six.vue
+++ b/src/loveflow/components/echart/pie/six.vue
@@ -43,8 +43,8 @@ export default {
             color: "#E3FEFF",
           },
           textAlign: "center",
-          left: "45%",
-          bottom: "10",
+          left: "47%",
+          bottom: "20%",
         },
         color: this.chartObj.color,
         graphic: {
@@ -67,7 +67,7 @@ export default {
             // name: '访问来源1',
             type: "pie",
             radius: [30, 40],
-            center: ["50%", "40%"],
+            center: ["center", 80],
             data: [
               {
                 value: 100, //对应显示的部分数据即100%
@@ -80,7 +80,10 @@ export default {
               },
             ],
             label: {
-              show: true,
+              position: "center",
+              formatter: ((100 * point) / total).toFixed(0) + "%",
+              color: this.chartObj.color[0],
+              fontSize: 18,
             },
             labelLine: {
               show: false,
@@ -92,7 +95,7 @@ export default {
             showEmptyCircle: true, //是否在无数据的时候显示一个占位圆。
             radius: [30, 40],
             avoidLabelOverlap: true, // 标签重叠时进行调整
-            center: ["50%", "40%"],
+            center: ["center", 80],
             data: [
               {
                 value: (point / total) * 100,
diff --git a/src/loveflow/components/menu/head.vue b/src/loveflow/components/menu/head.vue
index f65428f..eff1e48 100644
--- a/src/loveflow/components/menu/head.vue
+++ b/src/loveflow/components/menu/head.vue
@@ -168,11 +168,11 @@ export default {
 <style lang="scss" scoped>
 .topHeader {
   .headText {
-    font-size: vh(48);
+    font-size: vw(40);
   }
   .el-menu{
     .el-menu-item{
-      font-size: vh(20);
+      font-size: vw(18);
     }
   }
 }
diff --git a/src/views/enterpriseTopic/components/topicMain.vue b/src/views/enterpriseTopic/components/topicMain.vue
index f959291..d015d5c 100644
--- a/src/views/enterpriseTopic/components/topicMain.vue
+++ b/src/views/enterpriseTopic/components/topicMain.vue
@@ -19,9 +19,7 @@ export default {
   },
   methods: {
     goBack() {
-      this.$router.push({
-        path: "/topic/screen",
-      });
+      this.$emit("gotoPage");
     },
   },
 };
diff --git a/src/views/enterpriseTopic/personSafety/index.vue b/src/views/enterpriseTopic/personSafety/index.vue
index 1119c9b..e9051d6 100644
--- a/src/views/enterpriseTopic/personSafety/index.vue
+++ b/src/views/enterpriseTopic/personSafety/index.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="enterpriseTopicPanel">
     <!-- 人员安全 -->
-    <topicMain>
+    <topicMain @gotoPage="gotoPage()">
       <div class="enterpriseTopic">
         <el-tabs v-model="tabindex" @tab-click="tabChange">
           <el-tab-pane
@@ -60,6 +60,11 @@ export default {
         return "";
       }
     },
+    gotoPage() {
+      this.$router.push({
+        path: "/topic/personSafety/screen",
+      });
+    },
   },
 };
 </script>
@@ -114,8 +119,8 @@ export default {
         border: 1px solid #5b748c;
         .filterBtnWrap {
           padding: 2px;
-          &:last-child{
-            .el-divider{
+          &:last-child {
+            .el-divider {
               display: none;
             }
           }
diff --git a/src/views/enterpriseTopic/personSafety/screen.vue b/src/views/enterpriseTopic/personSafety/screen.vue
index 31094ea..e5dddd0 100644
--- a/src/views/enterpriseTopic/personSafety/screen.vue
+++ b/src/views/enterpriseTopic/personSafety/screen.vue
@@ -3,7 +3,7 @@
     <head-wrap title="人员安全风险评估"></head-wrap>
     <div class="enterpriseTopicBody">
       <div class="screenRow mb18">
-        <div class="screenCol mr18">
+        <div class="screenCol mr18" @click="gotoPage('/topic/personSafety')">
           <div class="screenName">
             <div class="screenIcon"></div>
             <div class="screenNameText">重点岗位异常数</div>
@@ -60,19 +60,34 @@
             <pTotal :info="tmObj.r3"></pTotal>
           </div>
         </div>
-        <div class="screenCol">
+        <div class="screenCol" @click="gotoPage('/topic/personSafety')">
           <div class="screenName">
             <div class="screenIcon"></div>
             <div class="screenNameText">流动人员核查率</div>
           </div>
-          <div class="screenChart"></div>
+          <div class="screenChart">
+            <div class="flowPersonWrap">
+              <div class="topWrap">
+                <dPieOne :chartObj="{}"></dPieOne>
+              </div>
+              <div class="btmWrap">
+                <div class="flowHead">
+                  <div class="flowIcon"></div>
+                  <div class="flowTitle">流动人口核查率低企业</div>
+                </div>
+                <div class="flowBody">
+                  <barFive :chartObj="trbObj"></barFive>
+                </div>
+              </div>
+            </div>
+          </div>
         </div>
       </div>
       <div class="screenRow screenRowBtm">
-        <div class="screenCol">
+        <div class="screenCol" @click="gotoPage('/topic/personSafety')">
           <div class="screenName">
             <div class="screenIcon"></div>
-            <div class="screenNameText">消防安全管理</div>
+            <div class="screenNameText">重点人员分类</div>
           </div>
           <div class="screenChart">
             <div class="safeManagePanel">
@@ -96,9 +111,11 @@ import pCard from "../components/pCard.vue";
 import pTotal from "../components/pTotal.vue";
 import pNum from "../components/num.vue";
 import pieSix from "@/loveflow/components/echart/pie/six.vue";
+import dPieOne from "@/loveflow/components/echart/pie/dpieOne.vue";
+import barFive from "@/loveflow/components/echart/bar/five.vue";
 
 export default {
-  components: { headWrap, pCard, pTotal, pNum, pieSix },
+  components: { headWrap, pCard, pTotal, pNum, pieSix, dPieOne, barFive },
   data() {
     return {
       total: 53981 + "",
@@ -111,21 +128,21 @@ export default {
         color: ["#57F0FF", "#37A1CC", "#08FAC4"],
       },
       tl2Obj: {
-        name: "危险品领用人员",
+        name: "危险品保管人员",
         total: 3400,
         point: 1200,
         icon: require("@/assets/images/topic/pie2b.png"),
-        color: ["#FFF7E3;", "#EB9104", "#FAC608"],
+        color: ["#FFF7E3", "#EB9104", "#FAC608"],
       },
       tl3Obj: {
-        name: "危险品领用人员",
+        name: "危险品使用人员",
         total: 3400,
         point: 1300,
         icon: require("@/assets/images/topic/pie1b.png"),
         color: ["#57F0FF", "#37A1CC", "#08FAC4"],
       },
       tl4Obj: {
-        name: "危险品领用人员",
+        name: "危险品技术资质人员",
         total: 3400,
         point: 900,
         icon: require("@/assets/images/topic/pie4b.png"),
@@ -196,8 +213,27 @@ export default {
           value: 865,
         },
       ],
+      trbObj: {
+        data: [
+          { name: "兴达化工有限公司", value: 1123 },
+          { name: "兴业化工有限公司", value: 808 },
+          { name: "兴盛化工有限公司", value: 703 },
+          { name: "兴辉化工有限公司", value: 613 },
+          { name: "兴胜化工有限公司", value: 933 },
+          { name: "兴飞化工有限公司", value: 573 },
+          { name: "兴圣化工有限公司", value: 763 },
+        ],
+        color: ["#FFDE9C", "#0E9FF7"],
+      },
     };
   },
+  methods: {
+    gotoPage(val) {
+      this.$router.push({
+        path: val,
+      });
+    },
+  },
 };
 </script>
 
@@ -229,6 +265,9 @@ export default {
         background: url("~@/assets/images/topic/scolt.png") no-repeat center
           center;
         background-size: 100% 100%;
+        &:hover {
+          cursor: pointer;
+        }
       }
 
       .screenMCol {
@@ -290,6 +329,39 @@ export default {
               flex: 1;
             }
           }
+          .flowPersonWrap {
+            display: flex;
+            flex-direction: column;
+            flex: 1;
+            .btmWrap {
+              flex: 1;
+              display: flex;
+              flex-direction: column;
+              .flowHead {
+                margin-left: 12px;
+                display: flex;
+                align-items: center;
+                height: vw(36);
+                background: url("~@/assets/images/topic/flow.png") no-repeat
+                  center center;
+                background-size: 100% 100%;
+                .flowIcon {
+                  width: vw(32);
+                  height: vw(38);
+                  background: url("~@/assets/images/topic/fsIcon.png") no-repeat
+                    center center;
+                  background-size: 100% 100%;
+                }
+                .flowTitle {
+                  font-size: vw(14);
+                  color: #d9e7ff;
+                }
+              }
+              .flowBody {
+                flex: 1;
+              }
+            }
+          }
         }
       }
       .screenMCol {