diff --git a/src/api/api.js b/src/api/api.js
index 9dcf31d..ef5d8df 100644
--- a/src/api/api.js
+++ b/src/api/api.js
@@ -118,3 +118,39 @@ export const getCameraHistory = (params) => {
   {params},
    )
 };
+//安全检查统计
+export const getCheckTotalCensus = (params) => {
+  return axios.get('api/ems-third-party-service/project/checkTotalCensus',
+  {params},
+   )
+};
+//检查次数统计
+export const getCheckTimesCensus = (params) => {
+  return axios.get('api/ems-third-party-service/project/checkTimesCensus',
+  {params},
+   )
+};
+//隐患检查统计
+export const getResolveTroubleCensus = (params) => {
+  return axios.get('api/ems-third-party-service/project/resolveTroubleCensus',
+  {params},
+   )
+};
+// //高频问题项
+export const getMostTroubleCensus = (params) => {
+  return axios.get('api/ems-third-party-service/project/mostTroubleCensus',
+  {params},
+   )
+};
+//安全告警统计
+export const getWarnSurveillance = (params) => {
+  return axios.get('api/ems-third-party-service/project/warnSurveillance',
+  {params},
+   )
+};
+//隐患整改记录
+// export const getMostTroubleCensus = (params) => {
+//   return axios.get('api/ems-third-party-service/project/mostTroubleCensus',
+//   {params},
+//    )
+// };
diff --git a/src/components/common/LineChart.vue b/src/components/common/LineChart.vue
index d1dd371..35bef09 100644
--- a/src/components/common/LineChart.vue
+++ b/src/components/common/LineChart.vue
@@ -7,7 +7,7 @@
       width="100%"
       height="100%"
     ></Chart>
-    <div class="lineBox"></div>
+    <!-- <div class="lineBox"></div> -->
   </div>
 </template>
 <script>
@@ -20,10 +20,10 @@ export default {
       default: ''
     },
     // 父组件传递过来的图表数据
-    chartData: {
-      type: Array,
-      required: true
-    },
+    // chartData: {
+    //   type: Array,
+    //   required: true
+    // },
     colorArray: {
       type: Array,
       default: () => {
@@ -52,6 +52,10 @@ export default {
     yAxisPadding: {
       type: Array,
       default: null
+    },
+    checkCountList:{
+      type:Array,
+      default:null
     }
   },
 
@@ -68,9 +72,15 @@ export default {
 
   watch: {
     // 监听父组件中的数据变化，重新触发Echarts
-    chartData: {
+    // chartData: {
+    //   deep: true,
+    //   handler () {
+    //     this.resetOption()
+    //   }
+    // },
+    checkCountList:{
       deep: true,
-      handler () {
+      handler (newVal) {
         this.resetOption()
       }
     }
@@ -99,6 +109,12 @@ export default {
       }
     },
     option () {
+        let dataX = [] //X轴
+        let dataY = [] //Y轴
+        this.checkCountList.forEach((item,index) => {
+          dataX.push(item.time)
+          dataY.push(item.count)
+        });
       const self = this
       return {
         tooltip: {
@@ -145,7 +161,7 @@ export default {
           },
           triggerEvent: true,
           type: 'category',
-          data: this.xAxisData
+          data: dataX
         },
         yAxis: {
           name: '次数',
@@ -183,7 +199,7 @@ export default {
         series: [
           {
             name:'检查次数',
-            data: this.chartData,
+            data: dataY,
             type: 'line',
             color:'#76E679'
           },
diff --git a/src/components/common/RankBarChart.vue b/src/components/common/RankBarChart.vue
index 8a86db3..0ec80a3 100644
--- a/src/components/common/RankBarChart.vue
+++ b/src/components/common/RankBarChart.vue
@@ -11,10 +11,14 @@ const MAX_LABEL = 8
 export default {
   props: {
     // 父组件传递过来的图表数据
-    chartData: {
-      type: Array,
-      required: true
-    },
+    // chartData: {
+    //   type: Array,
+    //   required: true
+    // },
+    highIssues:{
+      type:Array,
+      default:null
+    }
   },
   components: {
     Chart
@@ -45,7 +49,13 @@ export default {
 
   watch: {
     // 监听父组件中的数据变化，重新触发Echarts
-    chartData: {
+    // chartData: {
+    //   deep: true,
+    //   handler() {
+    //     this.resetOption()
+    //   }
+    // },
+    highIssues:{
       deep: true,
       handler() {
         this.resetOption()
@@ -55,6 +65,12 @@ export default {
 
   computed: {
     option() {
+      let dataX= []  //名称
+      let dataY = [] //数量
+      this.highIssues.forEach((item,index) => {
+        dataX.push(item.name)
+        dataY.push(item.count)
+      });
       const self = this
       return {
         tooltip: {
@@ -131,14 +147,13 @@ export default {
               padding: [-20, 0, 14, 0],
             },
           },
-            data:['焊接：','现场作业准备及布置：','保护接地或接零：','建筑用电：','电缆沟挖方：',],
+            data:dataX,
             triggerEvent: true,
-
           }
         ],
         series: [
           {
-            data: this.list,
+            data: dataY,
             type: 'bar',
             barWidth: 16,
             barGap: '-30%',
diff --git a/src/components/common/mdScreenPie.vue b/src/components/common/mdScreenPie.vue
index ae30ecd..e1b1651 100644
--- a/src/components/common/mdScreenPie.vue
+++ b/src/components/common/mdScreenPie.vue
@@ -1,7 +1,7 @@
 <template>
-    <div style="width:100%;height:100%;">
-      <div ref="chart" style="width:100%;height:100%;"></div>
-      <!-- <div class="boxPeople aa">
+  <div style="width: 100%; height: 100%">
+    <div ref="chart" style="width: 100%; height: 100%"></div>
+    <!-- <div class="boxPeople aa">
         <div class="name" style="color: #F2DA8D;">施工工作组</div>
         <div class="nucm" style="color: #F9EBBD;font-weight: bold;font-size: 24px; ">33<span style=" font-size: 14px; color: #F2DA8D;">人</span></div>
       </div>
@@ -17,173 +17,178 @@
         <div class="name" style="color: #53E3FF">项目监理组</div>
         <div class="nucm" style="color: #E3FAFF;font-weight: bold;font-size: 24px; ">33<span style=" font-size: 14px; color: #53E3FF;">人</span></div>
       </div> -->
-    </div>
+  </div>
 </template>
   <script>
-  import { List } from 'echarts/lib/export'
-  import giftImageUrl from '../../assets/pic/circle.png'
-  export default {
-    props: {
-      picIsShow: {
-        type: Boolean,
-        default: true
-      },
-      colorList: {
-        type: Array,
-        default(){
-            return ['#00A572', '#008AA4', '#7968D9', '#C7A73E']
-        } 
-      },
-      projectUser:{
-        type:Array,
-        default: []
-      }
+import { List } from "echarts/lib/export";
+import giftImageUrl from "../../assets/pic/circle.png";
+export default {
+  props: {
+    picIsShow: {
+      type: Boolean,
+      default: true,
     },
+    colorList: {
+      type: Array,
+      default() {
+        return ["#00A572", "#008AA4", "#7968D9", "#C7A73E", "rgb(28,241,235)"];
+      },
+    },
+    projectUser: {
+      type: Array,
+      default: [],
+    },
+  },
 
-    components: {
-    },
+  components: {},
 
-    data() {
-      return {}
-    },
-    mounted() {
-    },
-    watch: {
-      // 监听父组件中的数据变化，重新触发Echarts
-      chartData: {
-        deep: true,
-        handler() {
-          this.resetOption()
-        }
+  data() {
+    return {};
+  },
+  mounted() {},
+  watch: {
+    // 监听父组件中的数据变化，重新触发Echarts
+    chartData: {
+      deep: true,
+      handler() {
+        this.resetOption();
       },
-      projectUser: {
-        deep: true,
-        handler(newVal) {
-          this.initCharts(newVal)
-        }
-      }
     },
-    methods: {
-      initCharts(value) {
-        let myChart = this.$echarts.init(this.$refs.chart)
-        var val1data2 = [{
+    projectUser: {
+      deep: true,
+      handler(newVal) {
+        this.initCharts(newVal);
+      },
+    },
+  },
+  methods: {
+    initCharts(value) {
+      let myChart = this.$echarts.init(this.$refs.chart);
+      var val1data2 = [
+        {
           value: 33,
-          name: '电工',
+          name: "电工",
         },
         {
           value: 13,
-          name: '项目监理组',
+          name: "项目监理组",
         },
         {
           value: 14,
-          name: '土建专工',
+          name: "土建专工",
         },
         {
           value: 43,
-          name: '架子工',
-        }
-        ]
-        val1data2 = Object.keys(value).map((item,index)=>{
-          return {name:value[item].groupName,value:value[item].number}
-        })
-        var arr = ['middleLost', 0.6, val1data2, '今日完成进度']
-        // 绘制图表
-        myChart.setOption({
-          tooltip:{
-          trigger:'item',
-          formatter: '{b}：{c}',
+          name: "架子工",
         },
-          graphic: {
-            elements: [{
-              type: 'image',//需要填充图片,配置image,如果不需要图片可以配置其他的, text, circle, sector, ring, polygon, polyline, rect, line, bezierCurve, arc, group,
-              style: {
-                image: this.picIsShow ? giftImageUrl : '', //这里添加图片地址
-                width: 120,
-                height: 120
-              },
-              left: '161',//
-              top: '97' //配置图片居中
-            }]
-          },
-          series: [
+      ];
+      val1data2 = Object.keys(value).map((item, index) => {
+        return { name: value[item].groupName, value: value[item].number };
+      });
+      var arr = ["middleLost", 0.6, val1data2, "今日完成进度"];
+      // 绘制图表
+      myChart.setOption({
+        backgroundColor: "rgba(255,255,255,0)",
+        tooltip: {
+          trigger: "item",
+          formatter: "{b}：{c}",
+        },
+        graphic: {
+          elements: [
             {
-              type: 'pie',
-              radius: this.picIsShow ? ['53%', '65%'] : ['60%', '60%'],
-              center: ['50%', '157'],
-              color: this.colorList,
-              hoverAnimation: true, /// /设置饼图默认的展开样式
-              label: {
-                show: true,
-                formatter: '{b}：{c}',
-                rich: {
-                  d: {
-                    color: '#fff',
-                    fontSize: 25,
-                    // lineHeight: 24,
-                    height: 24,
-                  },
-                  c: {
-                    color: "red",
-                    fontSize: 25,
-                    // lineHeight: 20,
-                    align: 'left',
-                  }
+              type: "image", //需要填充图片,配置image,如果不需要图片可以配置其他的, text, circle, sector, ring, polygon, polyline, rect, line, bezierCurve, arc, group,
+              style: {
+                image: this.picIsShow ? giftImageUrl : "", //这里添加图片地址
+                width: 120,
+                height: 120,
+              },
+              left: "161", //
+              top: "97", //配置图片居中
+            },
+          ],
+        },
+        series: [
+          {
+            type: "pie",
+            radius: this.picIsShow ? ["53%", "65%"] : ["60%", "60%"],
+            center: ["50%", "157"],
+            color: this.colorList,
+            hoverAnimation: true, /// /设置饼图默认的展开样式
+            label: {
+              show: true,
+              formatter: "{b|{b}}{c|{c}}人",
+              rich: {
+                b: {
+                  fontSize: 15,
+                  lineHeight: 33,
+                },
+                c: {
+                  fontSize: 25,
+                  lineHeight: 22,
+                  align: "center",
+                  opacity: 0.1
                 },
-                position: '',
               },
-              labelLine: {
-                normal: {
-                  show: false
-                }
+              textStyle: {
+                fontSize: 15,
               },
-              itemStyle: { // 此配置
-                normal: {
-                  borderWidth: 2,
-                  borderColor: '#fff'
-                }
+              position: "",
+            },
+            labelLine: {
+              normal: {
+                show: false,
               },
-              data: arr[2]
-            }
-          ]
-        })
-      }
-    }
-  }
-  </script>
+            },
+            // itemStyle: { // 此配置
+            //   normal: {
+            //     borderWidth: 2,
+            //     borderColor: 'rgba(255,255,255,0.7)'
+            //   }
+            // },
+            itemStyle: {
+              borderRadius: 2,
+              borderColor: "rgb(255,255,255)",
+              borderWidth: 2,
+            },
+            data: arr[2],
+          },
+        ],
+      });
+    },
+  },
+};
+</script>
 
   <style scoped lang="scss">
-  .dd{
-    top: 214px;
-    right: 17px;
-  }
-  .cc{
-    top: 214px;
-    left: 34px;
-  }
-  .aa{
-    top: 66px;
-    left: 33px;
-  }
-  .bb{
-    top: 52px;
-    right: 44px;
-  }
+.dd {
+  top: 214px;
+  right: 17px;
+}
+.cc {
+  top: 214px;
+  left: 34px;
+}
+.aa {
+  top: 66px;
+  left: 33px;
+}
+.bb {
+  top: 52px;
+  right: 44px;
+}
 
-  .boxPeople{
-    position: absolute;
-
-    display: flex;
-    align-items: center;
-    .nucm{
-      font-size: 20px;
-      font-weight: 700;
-
-    }
-    .name{
-      font-size: 14px;
-      font-weight: 500;
-
-    }
+.boxPeople {
+  position: absolute;
 
+  display: flex;
+  align-items: center;
+  .nucm {
+    font-size: 20px;
+    font-weight: 700;
   }
-  </style>
+  .name {
+    font-size: 14px;
+    font-weight: 500;
+  }
+}
+</style>
diff --git a/src/components/common/pieChart.vue b/src/components/common/pieChart.vue
index c77da81..ad3e26f 100644
--- a/src/components/common/pieChart.vue
+++ b/src/components/common/pieChart.vue
@@ -105,27 +105,25 @@ export default {
             hoverAnimation: true, /// /设置饼图默认的展开样式
             label: {
               show: true,
-              formatter: '{b}：{c}%',
-              padding:[0,10,0,50],
+              formatter: '{b|{b}}:{c|{c}}%',
+              padding:[0,0,0,0],
               itemStyle: { // 此配置
                 normal: {
                   borderWidth: 2,
                   borderColor: '#52FFC1'
                 }
               },
-              rich: {
-                d: {
-                  color: '#fff',
-                  fontSize: 20,
-                  lineHeight: 24,
-                  height: 24
+             rich: {
+                b: {
+                  fontSize: 15,
+                  lineHeight: 33,
                 },
                 c: {
-                  color: "red",
-                  fontSize: 20,
-                  lineHeight: 20,
-                  align: 'left',
-                }
+                  fontSize: 18,
+                  lineHeight: 22,
+                  align: "center",
+                  opacity: 0.1
+                },
               },
               position: '',
             },
diff --git a/src/components/common/pieChartUnImg.vue b/src/components/common/pieChartUnImg.vue
index c31f3b5..e79ea78 100644
--- a/src/components/common/pieChartUnImg.vue
+++ b/src/components/common/pieChartUnImg.vue
@@ -92,19 +92,17 @@ export default {
                   borderColor: "#52FFC1",
                 },
               },
-              formatter: "{b}{c}%",
-              rich: {
-                d: {
-                  color: "#fff",
-                  fontSize: 20,
-                  lineHeight: 24,
-                  height: 24,
+              formatter: "{b|{b}}{c|{c}}%",
+               rich: {
+                b: {
+                  fontSize: 15,
+                  lineHeight: 33,
                 },
                 c: {
-                  color: "red",
-                  fontSize: 20,
-                  lineHeight: 20,
-                  align: "left",
+                  fontSize: 18,
+                  lineHeight: 22,
+                  align: "center",
+                  opacity: 0.1
                 },
               },
               position: "",
diff --git a/src/components/common/threeBarChart.vue b/src/components/common/threeBarChart.vue
index d71848b..552110e 100644
--- a/src/components/common/threeBarChart.vue
+++ b/src/components/common/threeBarChart.vue
@@ -1,266 +1,354 @@
 <template>
-    <div style="position: relative">
-        <Chart ref="chart" :chartOption="option" :className="className" width="100%" height="100%"
-            ></Chart>
-            <div class="lineBox"></div>
-    </div>
+  <div style="position: relative">
+    <Chart
+      ref="chart"
+      :chartOption="option"
+      :className="className"
+      width="100%"
+      height="100%"
+    ></Chart>
+    <!-- <div class="lineBox"></div> -->
+  </div>
 </template>
 <script>
-import Chart from '../chart.vue'
-const MAX_LABEL = 8
+import Chart from "../chart.vue";
+const MAX_LABEL = 8;
 export default {
-    props: {
-        className: {
-            type: String,
-            default: ''
-        },
-        // 父组件传递过来的图表数据
-        chartData: {
-            type: Array,
-            required: true
-        },
-        chartData2: {
-            type: Array,
-            required: true
-        },
-        chartData3: {
-            type: Array,
-            required: true
-        },
-        colorArray: {
-            type: Array,
-            default: () => {
-                return ['#84F5DE', '#56E8F2', '#4CC5F8']
-            }
-        },
-        yAxisName: {
-            type: String,
-            default: ''
-        },
-        // x轴数据
-        xAxisData: {
-            type: Array,
-            default: () => {
-                return []
-            }
-        },
-        tooltipFormatter: {
-            type: Function | String,
-            default: null
-        },
-        yAxisPosition: {
-            type: String,
-            default: 'left'
-        },
-        yAxisPadding: {
-            type: Array,
-            default: null
-        }
+  props: {
+    className: {
+      type: String,
+      default: "",
     },
-
-    components: {
-        Chart
+    // 父组件传递过来的图表数据
+    chartData: {
+      type: Array,
+      required: true,
     },
-
-    data() {
-        return {
-            tipStyle: { visibility: 'hidden', position: 'absolute', top: 0, left: 0 },
-            tipContent: ''
-        }
+    chartData2: {
+      type: Array,
+      required: true,
     },
-
-    watch: {
-        // 监听父组件中的数据变化，重新触发Echarts
-        chartData: {
-            deep: true,
-            handler() {
-                this.resetOption()
-            }
-        }
+    chartData3: {
+      type: Array,
+      required: true,
     },
+    colorArray: {
+      type: Array,
+      default: () => {
+        return ["#84F5DE", "#56E8F2", "#4CC5F8"];
+      },
+    },
+    yAxisName: {
+      type: String,
+      default: "",
+    },
+    // x轴数据
+    xAxisData: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+    tooltipFormatter: {
+      type: Function | String,
+      default: null,
+    },
+    yAxisPosition: {
+      type: String,
+      default: "left",
+    },
+    yAxisPadding: {
+      type: Array,
+      default: null,
+    },
+    safeList: {
+      type: Array,
+      default: null,
+    },
+  },
 
-    computed: {
-        option() {
-            const self = this
-            return {
-                tooltip: {
-        trigger: "axis",
-        axisPointer: {
+  components: {
+    Chart,
+  },
+
+  data() {
+    return {
+      tipStyle: { visibility: "hidden", position: "absolute", top: 0, left: 0 },
+      tipContent: "",
+    };
+  },
+
+  watch: {
+    // 监听父组件中的数据变化，重新触发Echarts
+    // chartData: {
+    //     deep: true,
+    //     handler() {
+    //         this.resetOption()
+    //     }
+    // },
+    safeList: {
+      deep: true,
+      handler() {
+        this.resetOption();
+      },
+    },
+  },
+
+  computed: {
+    option() {
+      let dataX = [];
+      let equipment = []; //设备告警
+      let fire = []; //消防告警
+      let gas = []; //耗气告警
+      let power = []; // 用电告警
+      let water = []; //给水告警
+      this.safeList.forEach((item, index) => {
+        dataX.push(item.time);
+        equipment.push(item.equipment);
+        fire.push(item.fire);
+        gas.push(item.gas);
+        power.push(item.power);
+        water.push(item.water);
+      });
+      const self = this;
+      return {
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
             type: "shadow",
             label: {
-                show: false
-            }
-        }
-    },
-                title: {
-                    textStyle: {
-                        fontSize: 18,
-                        fontWeight: 'bold',
-                        color: '#1EBBFC'
-                    }
-                },
-                legend: {       //对图形的解释部分
-                    left: '97',
-                    y: 63,
-                    itemHeight: 12,
-                    data: ['人员安全', '环境安全','设备安全'],
-                    textStyle: {
-                        fontSize: 12, //字体大小
-                        color: ['#66D19B','#ECBF00','#00C1F0'], //字体颜色
-                    }
-                },
-                grid: {
-                    left: '26',
-                    right: '26',
-                    bottom: '33',
-                    top:'103',
-                    containLabel: true
-                },
-                xAxis: {
-                    axisLine: {
-                        // x轴线的颜色以及宽度
-                        show: true,
-                        lineStyle: {
-                            color: '#fff',
-                            height: 0
-                        }
-                    },
-                    axisTick: {
-                        show: false
-                    },
-                    axisLabel: {
-                        interval: 0, // 横轴信息全部显示
-                        margin: 6, // 刻度标签与轴线之间的距离
-                        align: 'center',
-                        fontSize: 13, // 横轴字体大小
-                        color: '#bde9e4', // 颜色
-                    },
-                    triggerEvent: true,
-                    type: 'category',
-                    data: this.xAxisData
-                },
-                yAxis: {
-                    name: ['次数'],
-                    type: 'value',
-                    position: this.yAxisPosition || null,
-                    nameTextStyle: {
-                        color: '#64D5CD',
-                        padding: this.yAxisPadding || [0, 28, 2, 0],
-                        fontSize: 12,
-                        opacity: 0.5
-                    },
-                    axisLine: {
-                        show: true,
-                        lineStyle: {
-                            color: 'white'
-                        }
-                    },
-                    splitLine: {
-                        // 分割线配置
-                        show: false,
-                        lineStyle: {
-                            color: '#078DF0',
-                            opacity: 0.3
-                        }
-                    },
-                    axisLabel: {
-                        color: '#bde9e4',
-                        fontSize: 14,
-                        opacity: 0.5
-                    },
-                    axisTick: {
-                        show: false
-                    },
-                },
-                series: [
-                    {
-                        name: '人员安全',
-                        data: this.chartData,
-                        type: 'bar',
-                        barWidth: 12,
-                        itemStyle: {
-                            normal: {
-                                color: {
-                                    type: 'bar',
-                                    colorStops: [{
-                                        offset: 0,
-                                        color: '#6FD8A5' // 0% 处的颜色
-                                    }, {
-                                        offset: 1,
-                                        color: '#3CB06C' // 100% 处的颜色
-                                    }],
-                                    globalCoord: false, // 缺省为 false
-
-                                }
-                            },
-                        },
-                    },
-                    {
-                        name: '环境安全',
-                        data: this.chartData2,
-                        type: 'bar',
-                        barWidth: 12,
-                        itemStyle: {
-                            normal: {
-                                color: {
-                                    type: 'bar',
-                                    colorStops: [{
-                                        offset: 0,
-                                        color: '#EFC500' // 0% 处的颜色
-                                    }, {
-                                        offset: 1,
-                                        color: '#DA9300' // 100% 处的颜色
-                                    }],
-                                    globalCoord: false, // 缺省为 false
-
-                                }
-                            },
-                        },
-                    },
-                    {
-                        name: '设备安全',
-                        data: this.chartData3,
-                        type: 'bar',
-                        barWidth: 12,
-                        itemStyle: {
-                            normal: {
-                                color: {
-                                    type: 'bar',
-                                    colorStops: [{
-                                        offset: 0,
-                                        color: '#00C4F1' // 0% 处的颜色
-                                    }, {
-                                        offset: 1,
-                                        color: '#0091DF' // 100% 处的颜色
-                                    }],
-                                    globalCoord: false, // 缺省为 false
-
-                                }
-                            },
-                        },
-                    }
-                ]
-            }
-        }
-    },
-
-    methods: {
-        resetOption() {
-            this.$refs.chart.setOption(this.option)
+              show: false,
+            },
+          },
         },
+        title: {
+          textStyle: {
+            fontSize: 18,
+            fontWeight: "bold",
+            color: "#1EBBFC",
+          },
+        },
+        legend: {
+          //对图形的解释部分
+          left: "97",
+          y: 63,
+          itemHeight: 12,
+          data: ["用电告警", "消防告警", "给水告警", "设备告警", "耗气告警"],
+          textStyle: {
+            fontSize: 12, //字体大小
+            color: [
+              "#66D19B",
+              "#ECBF00",
+              "#00C1F0",
+              "rgb(236,218,75)",
+              "rgb(190,109,254)",
+            ], //字体颜色
+          },
+        },
+        grid: {
+          left: "26",
+          right: "26",
+          bottom: "33",
+          top: "103",
+          containLabel: true,
+        },
+        xAxis: {
+          axisLine: {
+            // x轴线的颜色以及宽度
+            show: true,
+            lineStyle: {
+              color: "#fff",
+              height: 0,
+            },
+          },
+          axisTick: {
+            show: false,
+          },
+          axisLabel: {
+            interval: 0, // 横轴信息全部显示
+            margin: 10, // 刻度标签与轴线之间的距离
+            align: "center",
+            fontSize: 13, // 横轴字体大小
+            color: "#bde9e4", // 颜色
+          },
+          // triggerEvent: true,
+          type: "category",
+          data: dataX,
+        },
+        yAxis: {
+          name: ["次数"],
+          type: "value",
+          position: this.yAxisPosition || null,
+          nameTextStyle: {
+            color: "#64D5CD",
+            padding: this.yAxisPadding || [0, 28, 2, 0],
+            fontSize: 12,
+            opacity: 0.5,
+          },
+          axisLine: {
+            show: true,
+            lineStyle: {
+              color: "white",
+            },
+          },
+          splitLine: {
+            // 分割线配置
+            show: false,
+            lineStyle: {
+              color: "#078DF0",
+              opacity: 0.3,
+            },
+          },
+          axisLabel: {
+            color: "#bde9e4",
+            fontSize: 14,
+            opacity: 0.5,
+          },
+          axisTick: {
+            show: false,
+          },
+        },
+        series: [
+          {
+            name: "用电告警",
+            data: power,
+            type: "bar",
+            barWidth: 12,
+            itemStyle: {
+              normal: {
+                color: {
+                  type: "bar",
+                  colorStops: [
+                    {
+                      offset: 0,
+                      color: "#6FD8A5", // 0% 处的颜色
+                    },
+                    {
+                      offset: 1,
+                      color: "#3CB06C", // 100% 处的颜色
+                    },
+                  ],
+                  globalCoord: false, // 缺省为 false
+                },
+              },
+            },
+          },
+          {
+            name: "消防告警",
+            data: fire,
+            type: "bar",
+            barWidth: 12,
+            itemStyle: {
+              normal: {
+                color: {
+                  type: "bar",
+                  colorStops: [
+                    {
+                      offset: 0,
+                      color: "#EFC500", // 0% 处的颜色
+                    },
+                    {
+                      offset: 1,
+                      color: "#DA9300", // 100% 处的颜色
+                    },
+                  ],
+                  globalCoord: false, // 缺省为 false
+                },
+              },
+            },
+          },
+          {
+            name: "给水告警",
+            data: water,
+            type: "bar",
+            barWidth: 12,
+            itemStyle: {
+              normal: {
+                color: {
+                  type: "bar",
+                  colorStops: [
+                    {
+                      offset: 0,
+                      color: "#00C4F1", // 0% 处的颜色
+                    },
+                    {
+                      offset: 1,
+                      color: "#0091DF", // 100% 处的颜色
+                    },
+                  ],
+                  globalCoord: false, // 缺省为 false
+                },
+              },
+            },
+          },
+          {
+            name: "设备告警",
+            data: equipment,
+            type: "bar",
+            barWidth: 12,
+            itemStyle: {
+              normal: {
+                color: {
+                  type: "bar",
+                  colorStops: [
+                    {
+                      offset: 0,
+                      color: "rgb(236,218,75)", // 0% 处的颜色
+                    },
+                    {
+                      offset: 1,
+                      color: "rgb(236,218,75)", // 100% 处的颜色
+                    },
+                  ],
+                  globalCoord: false, // 缺省为 false
+                },
+              },
+            },
+          },
+          {
+            name: "耗气告警",
+            data: gas,
+            type: "bar",
+            barWidth: 12,
+            itemStyle: {
+              normal: {
+                color: {
+                  type: "bar",
+                  colorStops: [
+                    {
+                      offset: 0,
+                      color: "rgb(190,109,254)", // 0% 处的颜色
+                    },
+                    {
+                      offset: 1,
+                      color: "rgb(190,109,254)", // 100% 处的颜色
+                    },
+                  ],
+                  globalCoord: false, // 缺省为 false
+                },
+              },
+            },
+          },
+        ],
+      };
+    },
+  },
 
-    }
-}
+  methods: {
+    resetOption() {
+      this.$refs.chart.setOption(this.option);
+    },
+  },
+};
 </script>
 
 <style scoped>
-
-.lineBox{
-    height: 14px;
-    position: absolute;
-    top: 89px;
-    left: 50px;
-    border-left: 1px solid #fff;
+.lineBox {
+  height: 14px;
+  position: absolute;
+  top: 89px;
+  left: 50px;
+  border-left: 1px solid #fff;
 }
 </style>
 
diff --git a/src/utils/mqttConfig.js b/src/utils/mqttConfig.js
index f7ffab1..9145f35 100644
--- a/src/utils/mqttConfig.js
+++ b/src/utils/mqttConfig.js
@@ -40,7 +40,11 @@ class mqttHandle {
         //配置链接
         const { host, port, endpoint, ...options } = this.connect;
         console.log("this.connect.host",this.connect.host)
+<<<<<<< HEAD
         const connectUrl = 'ws://175.27.191.156:10083/mqtt';
+=======
+        const connectUrl = 'ws://175.27.191.156:10083/mgtt';
+>>>>>>> 006ce36a7cef616fdc714ec5799317b9668c98bb
         // const connectUrl = `ws://${this.connect.host}:${this.connect.port}`;
         // if (!client.connected) {
         //     client.on('connect', function () {
diff --git a/src/views/managementComponents.vue b/src/views/managementComponents.vue
index 5f0bb4d..6e87fea 100644
--- a/src/views/managementComponents.vue
+++ b/src/views/managementComponents.vue
@@ -1,7 +1,7 @@
 <template>
-    <!-- <Resize> -->
-        <div >
-            <!-- <div class="bgPicture" :style="{ height: vdaH }">
+  <!-- <Resize> -->
+  <div>
+    <!-- <div class="bgPicture" :style="{ height: vdaH }">
                 <div class="title"></div>
                 <div class="titTop">
                     <div class="titLeft">
@@ -17,133 +17,200 @@
                     </div>
                 </div>
             </div> -->
-            <div @click="disBox" class="screenBox"
-                :style="{ 'background-image': !boxNone ? `url(${require(`../assets/pic/exitFull.png`)}` : `url(${require(`../assets/pic/fullScreen.png`)}` ,right: boxNone ? '483px' : '10px'}">
-            </div>
-            <!-- 左侧模块1 -->
-            <div class="leftOneBox" :style="{ left: boxNone ? '27px' : '-444px' }">
-                <div class="titName">
-                    <span></span>
-                    <span>安全检查统计</span>
-                    <span></span>
-                </div>
-                <div class="concet">
-                    <div class="ftahBox">
-                        <span class="iconBox1"></span>
-                        <span>检查项</span>
-                        <span style="color:#1cd1ff">100</span>
-                        <span>项</span>
-                    </div>
-                    <div class="ftahBox" style="margin-left: 25px;">
-                        <span class="iconBox2"></span>
-                        <span>问题项</span>
-                        <span style="color:#ffb54f">50</span>
-                        <span>项</span>
-                    </div>
-                    <div class="ftahBox" style="margin-left: 17px;">
-                        <span class="iconBox3"></span>
-                        <span>已处理</span>
-                        <span style="color:#00d896">13</span>
-                        <span>项</span>
-                    </div>
-                    <div class="ftahBox" style="margin-left: 4px;">
-                        <span class="iconBox4"></span>
-                        <span>待处理</span>
-                        <span style="color:#ecda4b">32</span>
-                        <span>项</span>
-                    </div>
-                </div>
-            </div>
-            <!-- 左侧模块2 -->
-            <div class="leftTwoBox" :style="{ left: boxNone ? '27px' : '-444px'}">
-                <div class="titName">
-                    <span></span>
-                    <span>检查次数统计</span>
-                    <span></span>
-                </div>
-                <div class="seleChange">
-                    <div :class="[timeType === 1 ? 'timeBoxType2' : 'timeBoxType1']" @click="chooseType(1)">年</div>
-                    <div :class="[timeType === 2 ? 'timeBoxType2' : 'timeBoxType1']" @click="chooseType(2)">月</div>
-                    <div :class="[timeType === 3 ? 'timeBoxType2' : 'timeBoxType1']" @click="chooseType(3)">日</div>
-                </div>
-                <div class="pie2Box">
-                    <lineChart ref="lineRef" style="width: 100%; height: 100%" grid-bottom="1%"
-                        :color-array="['#021C9F', '#01B1FF']" :chart-data="qyList"
-                        :x-axis-data="qyList.map(item => item.name)" />
-                </div>
-            </div>
-            <!-- 左侧模块3 -->
-            <div class="leftThreeBox" :style="{ left: boxNone ? '27px' : '-444px' }">
-                <div class="titName">
-                    <span></span>
-                    <span>安全告警</span>
-                    <span></span>
-                </div>
-                <div class="seleChange">
-                    <div :class="[time2Type === 1 ? 'timeBoxType2' : 'timeBoxType1']" @click="choose2Type(1)">年</div>
-                    <div :class="[time2Type === 2 ? 'timeBoxType2' : 'timeBoxType1']" @click="choose2Type(2)">月</div>
-                    <div :class="[time2Type === 3 ? 'timeBoxType2' : 'timeBoxType1']" @click="choose2Type(3)">日</div>
-                </div>2
-                <div class="pieBox">
-                    <threeBarChart style="width: 100%; height: 100%" grid-bottom="1%" :color-array="['#021C9F', '#01B1FF']"
-                        :chart-data3="aq3List" :chart-data2="aq2List" :chart-data="aqList"
-                        :x-axis-data="aqList.map(item => item.name)" />
+    <div
+      @click="disBox"
+      class="screenBox"
+      :style="{
+        'background-image': !boxNone
+          ? `url(${require(`../assets/pic/exitFull.png`)}`
+          : `url(${require(`../assets/pic/fullScreen.png`)}`,
+        right: boxNone ? '483px' : '10px',
+      }"
+    ></div>
+    <!-- 左侧模块1 -->
+    <div class="leftOneBox" :style="{ left: boxNone ? '27px' : '-444px' }">
+      <div class="titName">
+        <span></span>
+        <span>安全检查统计</span>
+        <span></span>
+      </div>
+      <div class="concet">
+        <div class="ftahBox">
+          <span class="iconBox1"></span>
+          <div class="ftahBox1">
+            <div>检查项</div>
+            <div style="color: #1cd1ff">{{ checkNum }}</div>
+            <div>项</div>
+          </div>
+        </div>
+        <div class="ftahBox" style="margin-left: 25px">
+          <span class="iconBox2"></span>
+          <div class="ftahBox1">
+            <div>问题项</div>
+            <div style="color: #ffb54f">{{ questionNum }}</div>
+            <div>项</div>
+          </div>
+        </div>
+        <div class="ftahBox" style="margin-left: 17px">
+          <span class="iconBox3"></span>
 
-                </div>
-            </div>
-             <!-- 右侧模块1 -->
-        <div class="rightOneBox" :style="{ right: boxNone ? '27px' : '-444px' }">
-            <div class="titName">
-                <span></span>
-                <span>隐患检查统计</span>
-                <span></span>
-            </div>
-            <div class="concet" style="left: 48px;">
-                <div class="ftahBox">
-                    <span class="iconBox1"></span>
-                    <span>整改项</span>
-                    <span style="color:#1cd1ff">100</span>
-                    <span>项</span>
-                </div>
-                <div class="ftahBox" style="margin-left: 53px;">
-                    <span class="iconBox2"></span>
-                    <span>已处理 </span>
-                    <span style="color:#00D896">35</span>
-                    <span>项</span>
-                </div>
-                <div class="ftahBox" style="margin-left: 43px;">
-                    <span class="iconBox3"></span>
-                    <span>待处理</span>
-                    <span style="color:#FDE54A">15</span>
-                    <span>项</span>
-                </div>
-
-            </div>
+          <div class="ftahBox1">
+            <div>已处理</div>
+            <div style="color: #00d896">{{ resolvedNum }}</div>
+            <div>项</div>
+          </div>
         </div>
-        <!-- 右侧模块2 -->
-        <div class="rightTwoBox" :style="{ right: boxNone ? '27px' : '-444px' }">
-            <div class="titName">
-                <span></span>
-                <span>高频问题项</span>
-                <span></span>
-            </div>
-            <div class="pie3Box">
-                <RankBarChart style="width: 100%; height: 100%" :color-array="['#021C9F', '#01B1FF']" />
-            </div>
+        <div class="ftahBox" style="margin-left: 4px">
+          <span class="iconBox4"></span>
+          <div class="ftahBox1">
+            <div>待处理</div>
+            <div style="color: #ecda4b">{{ unresolvedNum }}</div>
+            <div>项</div>
+          </div>
         </div>
-        <!-- 右侧模块3 -->
-        <div class="rightThreeBox" :style="{ right: boxNone ? '27px' : '-444px' }">
-            <div class="titName">
-                <span></span>
-                <span @click="gantDialog">隐患整改记录</span>
-                <span></span>
-            </div>
-            <div class="yhBox">
-                <swiper></swiper>
-            </div>
+      </div>
+    </div>
+    <!-- 左侧模块2 -->
+    <div class="leftTwoBox" :style="{ left: boxNone ? '27px' : '-444px' }">
+      <div class="titName">
+        <span></span>
+        <span>检查次数统计</span>
+        <span></span>
+      </div>
+      <div class="seleChange">
+        <div
+          :class="[timeType === 1 ? 'timeBoxType2' : 'timeBoxType1']"
+          @click="chooseType(0)"
+        >
+          年
         </div>
-        <!-- 右侧菜单 -->
-        <!-- <div class="container" :style="{ right: !type ? '-13px' : '0' }">
+        <div
+          :class="[timeType === 2 ? 'timeBoxType2' : 'timeBoxType1']"
+          @click="chooseType(1)"
+        >
+          月
+        </div>
+        <div
+          :class="[timeType === 3 ? 'timeBoxType2' : 'timeBoxType1']"
+          @click="chooseType(2)"
+        >
+          日
+        </div>
+      </div>
+      <div class="pie2Box">
+        <lineChart
+          ref="lineRef"
+          style="width: 100%; height: 100%"
+          grid-bottom="1%"
+          :color-array="['#021C9F', '#01B1FF']"
+          :chart-data="qyList"
+          :x-axis-data="qyList.map((item) => item.name)"
+          :checkCountList="checkCountList"
+        />
+      </div>
+    </div>
+    <!-- 左侧模块3 -->
+    <div class="leftThreeBox" :style="{ left: boxNone ? '27px' : '-444px' }">
+      <div class="titName">
+        <span></span>
+        <span>安全告警</span>
+        <span></span>
+      </div>
+      <div class="seleChange">
+        <div
+          :class="[time2Type === 1 ? 'timeBoxType2' : 'timeBoxType1']"
+          @click="choose2Type(0)"
+        >
+          年
+        </div>
+        <div
+          :class="[time2Type === 2 ? 'timeBoxType2' : 'timeBoxType1']"
+          @click="choose2Type(1)"
+        >
+          月
+        </div>
+        <div
+          :class="[time2Type === 3 ? 'timeBoxType2' : 'timeBoxType1']"
+          @click="choose2Type(2)"
+        >
+          日
+        </div>
+      </div>
+      <div class="pieBox">
+        <threeBarChart
+          style="width: 100%; height: 100%"
+          grid-bottom="1%"
+          :color-array="['#021C9F', '#01B1FF']"
+          :chart-data3="aq3List"
+          :chart-data2="aq2List"
+          :chart-data="aqList"
+          :x-axis-data="aqList.map((item) => item.name)"
+          :safeList="safeList"
+        />
+      </div>
+    </div>
+    <!-- 右侧模块1 -->
+    <div class="rightOneBox" :style="{ right: boxNone ? '27px' : '-444px' }">
+      <div class="titName">
+        <span></span>
+        <span>隐患检查统计</span>
+        <span></span>
+      </div>
+      <div class="concet" style="left: 48px">
+        <div class="ftahBox">
+          <span class="iconBox1"></span>
+          <div class="ftahBox1">
+            <div>整改项</div>
+            <div style="color: #1cd1ff">{{ total }}</div>
+            <div>项</div>
+          </div>
+        </div>
+        <div class="ftahBox" style="margin-left: 53px">
+          <span class="iconBox2"></span>
+          <div class="ftahBox1">
+            <div>已处理</div>
+            <div style="color: #00d896">{{ resolve }}</div>
+            <div>项</div>
+          </div>
+        </div>
+        <div class="ftahBox" style="margin-left: 43px">
+          <span class="iconBox3"></span>
+          <div class="ftahBox1">
+            <div>待处理</div>
+            <div style="color: #fde54a">{{ unresolve }}</div>
+            <div>项</div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- 右侧模块2 -->
+    <div class="rightTwoBox" :style="{ right: boxNone ? '27px' : '-444px' }">
+      <div class="titName">
+        <span></span>
+        <span>高频问题项</span>
+        <span></span>
+      </div>
+      <div class="pie3Box">
+        <RankBarChart
+          style="width: 100%; height: 100%"
+          :color-array="['#021C9F', '#01B1FF']"
+          :highIssues="highIssues"
+        />
+      </div>
+    </div>
+    <!-- 右侧模块3 -->
+    <div class="rightThreeBox" :style="{ right: boxNone ? '27px' : '-444px' }">
+      <div class="titName">
+        <span></span>
+        <span @click="gantDialog">隐患整改记录</span>
+        <span></span>
+      </div>
+      <div class="yhBox">
+        <swiper></swiper>
+      </div>
+    </div>
+    <!-- 右侧菜单 -->
+    <!-- <div class="container" :style="{ right: !type ? '-13px' : '0' }">
             <div class="box" id="box" :style="{ width: !type ? '267px' : '0' }">
                 <div v-if="!type" :class="[menuType === 1 ? 'childBoxChoose' : 'childBox']" @click="childBoxClick(1)">
                     <span class="icon1"></span>
@@ -170,9 +237,9 @@
             </div>
             <div class="closeBtn" :style="{ display: type ? 'none' : 'block' }" @click="switchDiv()"></div>
         </div> -->
-        </div>
-       
-    <!-- </Resize> -->
+  </div>
+
+  <!-- </Resize> -->
 </template>
 
 <script>
@@ -180,1094 +247,1183 @@ import threeBarChart from "@/components/common/threeBarChart";
 import lineChart from "@/components/common/lineChart";
 import pieChart from "@/components/common/pieChart";
 import pieDateChart from "@/components/common/pieDateChart";
-import Resize from '../utils/Resize.vue'
-import tabGtt from '@/components/common/tableGantt'
-import RankBarChart from '@/components/common/RankBarChart'
-import swiper from './swiper.vue'
+import Resize from "../utils/Resize.vue";
+import tabGtt from "@/components/common/tableGantt";
+import RankBarChart from "@/components/common/RankBarChart";
+import swiper from "./swiper.vue";
+import {
+  getCheckTotalCensus,
+  getCheckTimesCensus,
+  getResolveTroubleCensus,
+  getWarnSurveillance,
+  getMostTroubleCensus
+} from "../api/api";
 export default {
-    name: "report",
-    components: {
-        pieChart,
-        lineChart,
-        pieDateChart,
-        Resize,
-        threeBarChart,
-        RankBarChart,
-        tabGtt,
-        swiper
+  name: "report",
+  components: {
+    pieChart,
+    lineChart,
+    pieDateChart,
+    Resize,
+    threeBarChart,
+    RankBarChart,
+    tabGtt,
+    swiper,
+  },
+  data() {
+    return {
+        highIssues:[], //高频问题项
+      safeList:[], //安全告警
+      resolve:0,//已处理
+      total: 0, //整改项
+      unresolve:0, //待处理
+      checkCountList: [], //检查次数统计
+      checkNum: 0, //检查项
+      questionNum: 0, //问题项
+      resolvedNum: 0, //已处理
+      unresolvedNum: 0, //待处理
+      dialogShow: false,
+      timeType: 1,
+      time2Type: 1,
+      colorList: ["#00A572", "#007EC1", "#DA9300", "#878787"],
+      iconPicList: [
+        {
+          icon: "wendu",
+          name: "温度",
+          val: "19.8",
+          tem: "℃",
+        },
+        {
+          icon: "shidu",
+          name: "湿度",
+          val: "19.8",
+          tem: "%",
+        },
+        {
+          icon: "yangqi",
+          name: "氧气值",
+          val: "19.8",
+          tem: "%VOL",
+        },
+        {
+          icon: "co2",
+          name: "二氧化碳",
+          val: "19.8",
+          tem: "%VOL",
+        },
+        {
+          icon: "ch4",
+          name: "甲烷",
+          val: "19.8",
+          tem: "ppm",
+        },
+        {
+          icon: "h2s",
+          name: "硫化氢",
+          val: "19.8",
+          tem: "ppm",
+        },
+      ],
+      tableData: [
+        {
+          entName: "我打打死",
+        },
+        {
+          entName: "我打打死",
+        },
+        {
+          entName: "我打打死",
+        },
+        {
+          entName: "我打打死",
+        },
+        {
+          entName: "我打打死",
+        },
+        {
+          entName: "我打打死",
+        },
+        {
+          entName: "我打打死",
+        },
+        {
+          entName: "我打打死",
+        },
+      ],
+      aq3List: [
+        {
+          name: "2月",
+          value: 1,
+        },
+        {
+          name: "3月",
+          value: 2,
+        },
+        {
+          name: "4月",
+          value: 13,
+        },
+        {
+          name: "5月",
+          value: 24,
+        },
+        {
+          name: "6月",
+          value: 24,
+        },
+        {
+          name: "7月",
+          value: 31,
+        },
+      ],
+      aq2List: [
+        {
+          name: "2月",
+          value: 10,
+        },
+        {
+          name: "3月",
+          value: 6,
+        },
+        {
+          name: "4月",
+          value: 3,
+        },
+        {
+          name: "5月",
+          value: 14,
+        },
+        {
+          name: "6月",
+          value: 4,
+        },
+        {
+          name: "7月",
+          value: 3,
+        },
+      ],
+      aqList: [
+        {
+          name: "2月",
+          value: 12,
+          value2: 10,
+        },
+        {
+          name: "3月",
+          value: 13,
+          value2: 6,
+        },
+        {
+          name: "4月",
+          value: 12,
+          value2: 3,
+        },
+        {
+          name: "5月",
+          value: 10,
+          value2: 14,
+        },
+        {
+          name: "6月",
+          value: 7,
+          value2: 4,
+        },
+        {
+          name: "7月",
+          value: 11,
+          value2: 3,
+        },
+      ],
+      qyList: [
+        {
+          name: "1月",
+          value: 12,
+        },
+        {
+          name: "2月",
+          value: 112,
+        },
+        {
+          name: "3月",
+          value: 132,
+        },
+        {
+          name: "4月",
+          value: 12,
+        },
+        {
+          name: "5月",
+          value: 132,
+        },
+        {
+          name: "6月",
+          value: 132,
+        },
+        {
+          name: "7月",
+          value: 132,
+        },
+        {
+          name: "8月",
+          value: 32,
+        },
+        {
+          name: "9月",
+          value: 22,
+        },
+        {
+          name: "10月",
+          value: 152,
+        },
+        {
+          name: "11月",
+          value: 132,
+        },
+        {
+          name: "12月",
+          value: 132,
+        },
+      ],
+      xArry: [],
+      chartData: [],
+      peopleList: [
+        {
+          name: "姓名",
+          value: "：王刚",
+        },
+        {
+          name: "岗位",
+          value: "：项目经理",
+        },
+        {
+          name: "体温",
+          value: "：36.5℃",
+        },
+        {
+          name: "入场时间",
+          value: "：2022-11-26",
+        },
+        {
+          name: "考勤类型",
+          value: "：进场",
+        },
+        {
+          name: "打卡设备",
+          value: "：1号打卡机",
+        },
+      ],
+      vdaH: 0,
+      type: false,
+      menuType: 4,
+      numberList: [5, 5],
+      boxNone: true,
+    };
+  },
+  created() {
+    let h = document.documentElement.clientHeight || document.body.clientHeight;
+    this.vdaH = h - 0 + "px";
+  },
+  methods: {
+    //获取数据
+    getData() {
+      let projectId = sessionStorage.getItem("projectId");
+      //获取安全检查统计
+      getCheckTotalCensus({
+        projectId: projectId,
+      }).then((res) => {
+        this.checkNum = res.data.data.checkNum; //检查项
+        this.questionNum = res.data.data.questionNum; //问题项
+        this.resolvedNum = res.data.data.resolvedNum; //已处理
+        this.unresolvedNum = res.data.data.unresolvedNum; //待处理
+      });
+      //隐患检查统计
+      getResolveTroubleCensus({
+        projectId: projectId,
+      }).then((res) => {
+        this.resolve = res.data.data.resolve;
+        this.total = res.data.data.total;
+        this.unresolve = res.data.data.unresolve;
+      });
+      //高频问题项
+      getMostTroubleCensus({
+          projectId: projectId,
+      }).then((res)=>{
+          this.highIssues = res.data.data
+      }).catch((err)=>{
+          console.log(err);
+      })
     },
-    data() {
-        return {
-            dialogShow: false,
-            timeType: 1,
-            time2Type: 1,
-            colorList: ['#00A572', '#007EC1', '#DA9300', '#878787'],
-            iconPicList: [
-                {
-                    icon: "wendu",
-                    name: "温度",
-                    val: "19.8",
-                    tem: "℃"
-                },
-                {
-                    icon: "shidu",
-                    name: "湿度",
-                    val: "19.8",
-                    tem: "%"
-                },
-                {
-                    icon: "yangqi",
-                    name: "氧气值",
-                    val: "19.8",
-                    tem: "%VOL"
-                },
-                {
-                    icon: "co2",
-                    name: "二氧化碳",
-                    val: "19.8",
-                    tem: "%VOL"
-                },
-                {
-                    icon: "ch4",
-                    name: "甲烷",
-                    val: "19.8",
-                    tem: "ppm"
-                },
-                {
-                    icon: "h2s",
-                    name: "硫化氢",
-                    val: "19.8",
-                    tem: "ppm"
-                }
-            ],
-            tableData: [
-                {
-                    entName: "我打打死"
-                },
-                {
-                    entName: "我打打死"
-                },
-                {
-                    entName: "我打打死"
-                },
-                {
-                    entName: "我打打死"
-                },
-                {
-                    entName: "我打打死"
-                },
-                {
-                    entName: "我打打死"
-                },
-                {
-                    entName: "我打打死"
-                },
-                {
-                    entName: "我打打死"
-                }
-            ],
-            aq3List: [
-                {
-                    name: "2月",
-                    value: 1
-                },
-                {
-                    name: "3月",
-                    value: 2
-                },
-                {
-                    name: "4月",
-                    value: 13
-                },
-                {
-                    name: "5月",
-                    value: 24
-                },
-                {
-                    name: "6月",
-                    value: 24
-                },
-                {
-                    name: "7月",
-                    value: 31
-                },
-            ],
-            aq2List: [
-                {
-                    name: "2月",
-                    value: 10
-                },
-                {
-                    name: "3月",
-                    value: 6
-                },
-                {
-                    name: "4月",
-                    value: 3
-                },
-                {
-                    name: "5月",
-                    value: 14
-                },
-                {
-                    name: "6月",
-                    value: 4
-                },
-                {
-                    name: "7月",
-                    value: 3
-                },
-            ],
-            aqList: [
-                {
-                    name: "2月",
-                    value: 12,
-                    value2: 10
-                },
-                {
-                    name: "3月",
-                    value: 13,
-                    value2: 6
-                },
-                {
-                    name: "4月",
-                    value: 12,
-                    value2: 3
-                },
-                {
-                    name: "5月",
-                    value: 10,
-                    value2: 14
-                },
-                {
-                    name: "6月",
-                    value: 7,
-                    value2: 4
-                },
-                {
-                    name: "7月",
-                    value: 11,
-                    value2: 3
-                },
-            ],
-            qyList: [
-                {
-                    name: "1月",
-                    value: 12
-                },
-                {
-                    name: "2月",
-                    value: 112
-                },
-                {
-                    name: "3月",
-                    value: 132
-                },
-                {
-                    name: "4月",
-                    value: 12
-                },
-                {
-                    name: "5月",
-                    value: 132
-                },
-                {
-                    name: "6月",
-                    value: 132
-                },
-                {
-                    name: "7月",
-                    value: 132
-                }, {
-                    name: "8月",
-                    value: 32
-                }, {
-                    name: "9月",
-                    value: 22
-                }, {
-                    name: "10月",
-                    value: 152
-                }, {
-                    name: "11月",
-                    value: 132
-                }, {
-                    name: "12月",
-                    value: 132
-                }
-            ],
-            xArry: [],
-            chartData: [],
-            peopleList: [
-                {
-                    name: "姓名",
-                    value: "：王刚"
-                },
-                {
-                    name: "岗位",
-                    value: "：项目经理"
-                },
-                {
-                    name: "体温",
-                    value: "：36.5℃"
-                },
-                {
-                    name: "入场时间",
-                    value: "：2022-11-26"
-                },
-                {
-                    name: "考勤类型",
-                    value: "：进场"
-                },
-                {
-                    name: "打卡设备",
-                    value: "：1号打卡机"
-                },
-            ],
-            vdaH: 0,
-            type: false,
-            menuType: 4,
-            numberList: [5, 5],
-            boxNone: true
-        };
+    disBox() {
+      this.boxNone = !this.boxNone;
+      this.$refs.screenBox.style.animationPlayState = "running";
     },
-    created() {
-        let h = document.documentElement.clientHeight || document.body.clientHeight;
-        this.vdaH = h - 0 + "px";
-    },
-    methods: {
-        disBox() {
-            this.boxNone = !this.boxNone
-            if(this.boxNone == true){
-        
-          window.parent.closeBig();
-      }else if(this.boxNone == false){
-          window.parent.openBig();
+    goBack(val) {
+      if (val === 1) {
+        this.$router.push("/");
+      } else {
+        this.$router.go(0);
       }
-            this.$refs.screenBox.style.animationPlayState='running'
-        },
-        goBack(val) {
-            if (val === 1) {
-                this.$router.push('/')
-            } else {
-                this.$router.go(0)
-            }
-        },
-        chooseType(val) {
-            this.timeType = val
-            this.$refs.lineRef.resetOption()
-        },
-
-        choose2Type(val) {
-            this.time2Type = val
-            this.$refs.lineRef.resetOption()
-        },
-        //查看甘特图
-        gantDialog() {
-            this.dialogShow = true
-
-        },
-        tableRowClassName({ row, rowIndex }) {
-            if (rowIndex === 1) {
-                return "warning-row";
-            } else if (rowIndex === 3) {
-                return "success-row";
-            }
-            return "";
-        },
-        // 菜单点击
-        childBoxClick(val) {
-            this.menuType = val;
-            if (val === 3) {
-                this.$router.push('/progress')
-            } else if (val === 2) {
-                this.$router.push('/videoSurveillance')
-            } else if (val === 1) {
-                this.$router.push('/personnel')
-            }
-        },
-        switchDiv() {
-            if (this.type) {
-                this.type = false;
-                this.$refs.switchBtn.style.display = "none";
-
-            } else {
-                this.type = true;
-                setTimeout(() => {
-                    // 俩秒之后让模块消失
-                    this.$refs.switchBtn.style.display = "block";
-                }, 800)
-            }
-        }
     },
-    mounted() {
-        this.switchDiv();
-        window.onresize = () => {
-            return (() => {
-                let h = document.documentElement.clientHeight || document.body.clientHeight;
-                this.vdaH = h - 0 + "px";
-            })()
-        }
+    chooseType(val) {
+      this.timeType = val + 1;
+      //检查次数统计
+      getCheckTimesCensus({
+        projectId: sessionStorage.getItem("projectId"),
+        type: val,
+      }).then((res) => {
+        this.checkCountList = res.data.data;
+        this.$refs.lineRef.resetOption();
+      });
+    },
 
-    }
+    choose2Type(val) {
+      this.time2Type = val + 1;
+      getWarnSurveillance({
+          projectId: sessionStorage.getItem("projectId"),
+         type: val,
+      }).then((res)=>{
+        //  this.$refs.lineRef.resetOption();
+         this.safeList = res.data.data
+      })
+    },
+    //查看甘特图
+    gantDialog() {
+      this.dialogShow = true;
+    },
+    tableRowClassName({ row, rowIndex }) {
+      if (rowIndex === 1) {
+        return "warning-row";
+      } else if (rowIndex === 3) {
+        return "success-row";
+      }
+      return "";
+    },
+    // 菜单点击
+    childBoxClick(val) {
+      this.menuType = val;
+      if (val === 3) {
+        this.$router.push("/progress");
+      } else if (val === 2) {
+        this.$router.push("/videoSurveillance");
+      } else if (val === 1) {
+        this.$router.push("/personnel");
+      }
+    },
+    switchDiv() {
+      if (this.type) {
+        this.type = false;
+        this.$refs.switchBtn.style.display = "none";
+      } else {
+        this.type = true;
+        setTimeout(() => {
+          // 俩秒之后让模块消失
+          this.$refs.switchBtn.style.display = "block";
+        }, 800);
+      }
+    },
+  },
+  mounted() {
+    //获取数据
+    this.getData();
+    //获取年的检查次数
+    this.chooseType(0);
+    //默认获取年的安全告警统计
+    this.choose2Type(0);
+    this.switchDiv();
+    window.onresize = () => {
+      return (() => {
+        let h =
+          document.documentElement.clientHeight || document.body.clientHeight;
+        this.vdaH = h - 0 + "px";
+      })();
+    };
+  },
 };
 </script>
 
 <style scoped lang="less">
 .fathe {
-    width: 100%;
-    height: 144px;
+  width: 100%;
+  height: 144px;
 }
 
 .yhBox {
-    width: 100%;
-    height: 60%;
-    position: absolute;
-    top: 83px;
+  width: 100%;
+  height: 60%;
+  position: absolute;
+  top: 83px;
 
-    @media only screen and (max-height: 1000px) {
-        top: 60px;
-    }
+  @media only screen and (max-height: 1000px) {
+    top: 60px;
+  }
 }
 
 .timeBoxType1 {
-    background: url("~@/assets/pic/tap1.png") no-repeat;
-    background-size: 100% 100%;
+  background: url("~@/assets/pic/tap1.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .timeBoxType2 {
-    background: url("~@/assets/pic/tap2.png") no-repeat;
-    background-size: 100% 100%;
+  background: url("~@/assets/pic/tap2.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .seleChange {
-    width: 130px;
-    height: 22px;
-    position: absolute;
-    right: 27px;
-    top: 63px;
-    display: flex;
-    justify-content: space-around;
-    z-index: 1;
-
-    div {
-        margin-right: 5px;
-        cursor: pointer;
-        width: 43px;
-        height: 21px;
-        font-size: 12px;
-        font-family: SourceHanSansCN-Regular, SourceHanSansCN;
-        font-weight: 400;
-        color: #FFFFFF;
-        text-align: center;
-        line-height: 21px;
-    }
+  width: 130px;
+  height: 22px;
+  position: absolute;
+  right: 27px;
+  top: 63px;
+  display: flex;
+  justify-content: space-around;
+  z-index: 1;
 
+  div {
+    margin-right: 5px;
+    cursor: pointer;
+    width: 43px;
+    height: 21px;
+    font-size: 12px;
+    font-family: SourceHanSansCN-Regular, SourceHanSansCN;
+    font-weight: 400;
+    color: #ffffff;
+    text-align: center;
+    line-height: 21px;
+  }
 }
 
 .tabGtBox {
-    position: absolute;
-    top: 50px;
-    width: 660px;
-    padding: 0 40px;
+  position: absolute;
+  top: 50px;
+  width: 660px;
+  padding: 0 40px;
 }
 
 .gttBox {
-    width: 739px;
-    height: 628px;
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    background: url("~@/assets/pic/boxDialog.png") no-repeat;
-    background-size: 100% 100%;
-    transform: translate(-50%, -50%);
+  width: 739px;
+  height: 628px;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  background: url("~@/assets/pic/boxDialog.png") no-repeat;
+  background-size: 100% 100%;
+  transform: translate(-50%, -50%);
 
-    .closeIcon {
-        width: 33px;
-        height: 33px;
-        color: #0dffff;
-        float: right;
-        font-size: 50px;
-        cursor: pointer;
-        margin-right: 10px;
-    }
+  .closeIcon {
+    width: 33px;
+    height: 33px;
+    color: #0dffff;
+    float: right;
+    font-size: 50px;
+    cursor: pointer;
+    margin-right: 10px;
+  }
 }
 
 .tableBox {
-    width: 90%;
-    height: 75%;
-    bottom: 15px;
-    position: absolute;
-    left: 50%;
-    transform: translateX(-50%);
+  width: 90%;
+  height: 75%;
+  bottom: 15px;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
 }
 .dh1 {
-    animation: mytest 0.5s linear;
-    animation-fill-mode: forwards;
+  animation: mytest 0.5s linear;
+  animation-fill-mode: forwards;
 }
 
 @keyframes mytest {
-    100% {
-        right: 10px;
-    }
-    90% {
-        right: 120px;
-    }
+  100% {
+    right: 10px;
+  }
+  90% {
+    right: 120px;
+  }
 
-    80% {
-        right: 160px;
-    }
+  80% {
+    right: 160px;
+  }
 
-    70% {
-        right: 200px;
-    }
+  70% {
+    right: 200px;
+  }
 
-    60% {
-        right: 240px;
-    }
+  60% {
+    right: 240px;
+  }
 
-    50% {
-        right: 300px;
-    }
+  50% {
+    right: 300px;
+  }
 
-    40% {
-        right: 340px;
-    }
+  40% {
+    right: 340px;
+  }
 
-    30% {
-        right: 380px;
-    }
+  30% {
+    right: 380px;
+  }
 
-    20% {
-        right: 420px;
-    }
+  20% {
+    right: 420px;
+  }
 
-    10% {
-        right: 460px;
-    }
-    1% {
-        right: 480px;
-    }
+  10% {
+    right: 460px;
+  }
+  1% {
+    right: 480px;
+  }
 }
 
 @keyframes myt2est {
-    1% {
-        right: 10px;
-    }
+  1% {
+    right: 10px;
+  }
 
-    10% {
-        right: 120px;
-    }
+  10% {
+    right: 120px;
+  }
 
-    20% {
-        right: 160px;
-    }
+  20% {
+    right: 160px;
+  }
 
-    30% {
-        right: 200px;
-    }
+  30% {
+    right: 200px;
+  }
 
-    40% {
-        right: 240px;
-    }
+  40% {
+    right: 240px;
+  }
 
-    50% {
-        right: 300px;
-    }
+  50% {
+    right: 300px;
+  }
 
-    60% {
-        right: 340px;
-    }
+  60% {
+    right: 340px;
+  }
 
-    70% {
-        right: 380px;
-    }
+  70% {
+    right: 380px;
+  }
 
-    80% {
-        right: 420px;
-    }
+  80% {
+    right: 420px;
+  }
 
-    90% {
-        right: 460px;
-    }
+  90% {
+    right: 460px;
+  }
 
-    100% {
-        right: 480px;
-    }
+  100% {
+    right: 480px;
+  }
 }
 
 .dh2 {
-    animation-fill-mode: forwards;
-     animation: myt2est 0.5s linear;
-
+  animation-fill-mode: forwards;
+  animation: myt2est 0.5s linear;
 }
 
 .screenBox {
-    width: 46px;
-    height: 46px;
-    background: url("~@/assets/pic/fullScreen.png") no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    bottom: 34px;
-    right: 480px;
-    overflow-x: hidden;
-    transition: right 0.8s, height 1s;
-    overflow-y: hidden; //重点
-    cursor: pointer;
-    @media only screen and (max-height: 1000px) {
-        bottom: 157px;
-    }
+  width: 46px;
+  height: 46px;
+  background: url("~@/assets/pic/fullScreen.png") no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  bottom: 34px;
+  right: 480px;
+  overflow-x: hidden;
+  transition: right 0.8s, height 1s;
+  overflow-y: hidden; //重点
+  cursor: pointer;
+  @media only screen and (max-height: 1000px) {
+    bottom: 157px;
+  }
 }
 
 .nameMessage {
-    font-size: 14px;
-    font-family: SourceHanSansCN-Medium, SourceHanSansCN;
-    font-weight: 500;
-    margin-top: 10px;
-    margin-left: 18px;
-    span:nth-child(1) {
-        display: inline-block;
-        width: 56px;
-        text-align-last: justify;
-    }
+  font-size: 14px;
+  font-family: SourceHanSansCN-Medium, SourceHanSansCN;
+  font-weight: 500;
+  margin-top: 10px;
+  margin-left: 18px;
+  span:nth-child(1) {
+    display: inline-block;
+    width: 56px;
+    text-align-last: justify;
+  }
 }
 
 .meeting {
-    width: 76px;
-    height: 29px;
-    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFEAAAAdCAYAAADSFYAhAAAAAXNSR0IArs4c6QAABD9JREFUaEPtWk9oHFUY/35vD+bktbvjxZsoSot/sKJoqbaltaUgUkQQK4KIqOwkama3PeRgs9mS3Q0ILeTgwYMHgxfbHurBQynUQ715KIKK2OyaQEuEEtumeZ9kZ97szpt9+95uEjPE5hLmve/7fjO/9/u+982bRT4o7gHEI9T9x4zENcCJa9uF8tf99Lgqjs0uo/irLHlxZOkr7AiKe8Hi0X68CJLRtGj/V1c2LtV86NXtl4xni5NVfBb0x0Klfh5e4L/CwGNJ5UVKXI1GcxENShEyIkFGdiKXVCqicd1ejau4Mcua0nW7jOKD8H2zUru2RuJ+AI+vRylmJbkpbr1K3SL8e60bt87S7OwK8uPFg0LknrCllNO8jCQmck7mG270n+LztWal/t3aMyBfLr4Kxs72Aw1awG0s2IqnSlvTBmOLb5vfRHzB9O18pf5LmzZv3D8CYJftfu7Pdxhg4tvNX6/XaW6unXrwTvhHSdKTvUlS1cpEoW2pTf42P31fzxo+/6RSuU1i4bPiayREgkSRrvR9hahTYnIXhj5RamUk6/j3iL9cmGr8FlehfGnsdQF+Wmvk+mevLjBXYZmiDrhotIX4LOjv1mR9iojitg75sn9MMJ65X/PcGFiVfGmh2jjXbY0dZf8NwXg2qcRIWnFeuQGkrNzaxI5brOjs4t9ZXandPP3F9QSJXvmTN4l4dy+apJThO3RUswTCS8nJF5R4XAsSZ6myj2qigNDecHovUtbwQVhsVWqf63eLQqn4Fkg8N6TW/lduUsoLf1VnLqRIzJf8t0F4PiHP6GKwo5uN41MdIWUNX66IkwvT04spEr2S/w4xXtg4CrZnJAb/3qo0UqncrnZeyX+XGS8mHn3QlsORN+fWO4v4jK9b1drFXo+KQlB8DxAvhZMqgVKHsMlD2jiSnnAGsw6y5qAOf/UEzhY+M/E/t+VHSzMzSwYS/fdB2BPuwppJzKlh3KRAWxxTsbP5KTxbsbTFGRAfzD/PV3uncpjOgf8BBPaGvYtjXupmw6bfRr15bDq+ODM/Nf2DUTNe4H9IwMtD0rf93ZhWaOTW8ebE7LKRxEJp9GMQ7dv+bAz3hEx8pVVpTPbzRiHwfSLsTxq5ft3TvgqSq59+S8PGGdbPHR9Mk81q7XJfEvOBPwbgQLeRdY8dblGNe7oeLjP4TMvNkT+P0cTc3b4keoH/KQEH+/OiFGZaeX08RYuhtXFdjS3CZ7rYnKpXbXcJrzw6TkSH1gzZsDvHytB205iZyM9kl+pMtNOduEvMGn6Ox1qnGletJBaC0RKIDtsM+84P22KsC7TLeTPwQTebDzx4lCYmrI0fHhr3T5LAkbBNjNKm8+LSFkm6nUtuIIKS6Ww6Fozjd6pjIn6m8MHftCr1uss6oxCMPUU5fjhM5/D8ECI679N/qaA+J5vGTYiO9lnCv7vMP95oNOZdSPwXtf3hFdhdhzQAAAAASUVORK5CYII=) no-repeat;
-    background-size: 100% 100%;
-    text-align: center;
-    line-height: 29px;
-    position: absolute;
-    top: 305px;
-    left: 29px;
-    font-size: 14px;
-    font-family: SourceHanSansCN-Medium, SourceHanSansCN;
-    font-weight: 500;
-    color: #FFFFFF;
-    padding-right: 6px;
+  width: 76px;
+  height: 29px;
+  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFEAAAAdCAYAAADSFYAhAAAAAXNSR0IArs4c6QAABD9JREFUaEPtWk9oHFUY/35vD+bktbvjxZsoSot/sKJoqbaltaUgUkQQK4KIqOwkama3PeRgs9mS3Q0ILeTgwYMHgxfbHurBQynUQ715KIKK2OyaQEuEEtumeZ9kZ97szpt9+95uEjPE5hLmve/7fjO/9/u+982bRT4o7gHEI9T9x4zENcCJa9uF8tf99Lgqjs0uo/irLHlxZOkr7AiKe8Hi0X68CJLRtGj/V1c2LtV86NXtl4xni5NVfBb0x0Klfh5e4L/CwGNJ5UVKXI1GcxENShEyIkFGdiKXVCqicd1ejau4Mcua0nW7jOKD8H2zUru2RuJ+AI+vRylmJbkpbr1K3SL8e60bt87S7OwK8uPFg0LknrCllNO8jCQmck7mG270n+LztWal/t3aMyBfLr4Kxs72Aw1awG0s2IqnSlvTBmOLb5vfRHzB9O18pf5LmzZv3D8CYJftfu7Pdxhg4tvNX6/XaW6unXrwTvhHSdKTvUlS1cpEoW2pTf42P31fzxo+/6RSuU1i4bPiayREgkSRrvR9hahTYnIXhj5RamUk6/j3iL9cmGr8FlehfGnsdQF+Wmvk+mevLjBXYZmiDrhotIX4LOjv1mR9iojitg75sn9MMJ65X/PcGFiVfGmh2jjXbY0dZf8NwXg2qcRIWnFeuQGkrNzaxI5brOjs4t9ZXandPP3F9QSJXvmTN4l4dy+apJThO3RUswTCS8nJF5R4XAsSZ6myj2qigNDecHovUtbwQVhsVWqf63eLQqn4Fkg8N6TW/lduUsoLf1VnLqRIzJf8t0F4PiHP6GKwo5uN41MdIWUNX66IkwvT04spEr2S/w4xXtg4CrZnJAb/3qo0UqncrnZeyX+XGS8mHn3QlsORN+fWO4v4jK9b1drFXo+KQlB8DxAvhZMqgVKHsMlD2jiSnnAGsw6y5qAOf/UEzhY+M/E/t+VHSzMzSwYS/fdB2BPuwppJzKlh3KRAWxxTsbP5KTxbsbTFGRAfzD/PV3uncpjOgf8BBPaGvYtjXupmw6bfRr15bDq+ODM/Nf2DUTNe4H9IwMtD0rf93ZhWaOTW8ebE7LKRxEJp9GMQ7dv+bAz3hEx8pVVpTPbzRiHwfSLsTxq5ft3TvgqSq59+S8PGGdbPHR9Mk81q7XJfEvOBPwbgQLeRdY8dblGNe7oeLjP4TMvNkT+P0cTc3b4keoH/KQEH+/OiFGZaeX08RYuhtXFdjS3CZ7rYnKpXbXcJrzw6TkSH1gzZsDvHytB205iZyM9kl+pMtNOduEvMGn6Ox1qnGletJBaC0RKIDtsM+84P22KsC7TLeTPwQTebDzx4lCYmrI0fHhr3T5LAkbBNjNKm8+LSFkm6nUtuIIKS6Ww6Fozjd6pjIn6m8MHftCr1uss6oxCMPUU5fjhM5/D8ECI679N/qaA+J5vGTYiO9lnCv7vMP95oNOZdSPwXtf3hFdhdhzQAAAAASUVORK5CYII=)
+    no-repeat;
+  background-size: 100% 100%;
+  text-align: center;
+  line-height: 29px;
+  position: absolute;
+  top: 305px;
+  left: 29px;
+  font-size: 14px;
+  font-family: SourceHanSansCN-Medium, SourceHanSansCN;
+  font-weight: 500;
+  color: #ffffff;
+  padding-right: 6px;
 }
 
 .mettiogBox {
-    text-align: center;
-    line-height: 29px;
-    position: absolute;
-    top: 345px;
-    font-size: 14px;
-    font-family: SourceHanSansCN-Medium, SourceHanSansCN;
-    font-weight: 500;
-    color: #FFFFFF;
-    padding: 0 22px 0 33px;
-    height: 260px;
+  text-align: center;
+  line-height: 29px;
+  position: absolute;
+  top: 345px;
+  font-size: 14px;
+  font-family: SourceHanSansCN-Medium, SourceHanSansCN;
+  font-weight: 500;
+  color: #ffffff;
+  padding: 0 22px 0 33px;
+  height: 260px;
 }
 
 .lookFor {
-    width: 57px;
-    height: 24px;
-    background: url("~@/assets/pic/view.png") no-repeat;
-    background-size: 100% 100%;
-    float: right;
-    margin-top: 20px;
+  width: 57px;
+  height: 24px;
+  background: url("~@/assets/pic/view.png") no-repeat;
+  background-size: 100% 100%;
+  float: right;
+  margin-top: 20px;
 }
 
 .videoBox {
-    width: 100%;
-    height: 239px;
-    position: absolute;
-    top: 21px;
-    left: 50%;
-    transform: translateX(-50%);
+  width: 100%;
+  height: 239px;
+  position: absolute;
+  top: 21px;
+  left: 50%;
+  transform: translateX(-50%);
 }
 
 .fxBox {
-    width: 385px;
-    height: 208px;
-    background: rgba(0, 38, 36, 0.2);
-    position: absolute;
-    bottom: 18px;
-    box-shadow: inset 0px 0px 25px 0px rgba(255, 255, 255, 0.2);
-    border: 1px solid #007b7b52;
-    left: 50%;
-    transform: translateX(-50%);
+  width: 385px;
+  height: 208px;
+  background: rgba(0, 38, 36, 0.2);
+  position: absolute;
+  bottom: 18px;
+  box-shadow: inset 0px 0px 25px 0px rgba(255, 255, 255, 0.2);
+  border: 1px solid #007b7b52;
+  left: 50%;
+  transform: translateX(-50%);
 }
 
 .fxBoxChild {
-    font-weight: 500;
-    font-family: SourceHanSansCN-Medium, SourceHanSansCN;
-    font-size: 14px;
-    display: flex;
-    flex-wrap: wrap;
-    margin: 10px auto 0;
-    width: 90%;
-    border-bottom: 1px solid rgba(96, 213, 205, 0.4);
-    ;
+  font-weight: 500;
+  font-family: SourceHanSansCN-Medium, SourceHanSansCN;
+  font-size: 14px;
+  display: flex;
+  flex-wrap: wrap;
+  margin: 10px auto 0;
+  width: 90%;
+  border-bottom: 1px solid rgba(96, 213, 205, 0.4);
 }
 
 .pie3Box {
-    width: 100%;
-    height: 90%;
-    position: absolute;
-    bottom: 0;
-
+  width: 100%;
+  height: 90%;
+  position: absolute;
+  bottom: 0;
 }
 
 .pie2Box {
-    width: 100%;
-    height: 90%;
-    position: absolute;
-    bottom: 0;
+  width: 100%;
+  height: 90%;
+  position: absolute;
+  bottom: 0;
 
-    @media only screen and (max-height: 1000px) {
-        top: 50px
-    }
+  @media only screen and (max-height: 1000px) {
+    top: 50px;
+  }
 }
 
 .pieBox {
-    width: 100%;
-    height: 90%;
-    position: absolute;
-    bottom: 0;
+  width: 100%;
+  height: 90%;
+  position: absolute;
+  bottom: 0;
 
-    @media only screen and (max-height: 1000px) {
-        height: 262px;
-        top: 38px
-    }
+  @media only screen and (max-height: 1000px) {
+    height: 262px;
+    top: 38px;
+  }
 }
 
 .kqjk {
-    width: 100%;
-    height: 170px;
-    position: absolute;
-    top: 48px;
-    display: flex;
+  width: 100%;
+  height: 170px;
+  position: absolute;
+  top: 48px;
+  display: flex;
 
-    .oneKqjk {
-        width: 135px;
-        height: 140px;
-        padding: 5px;
-        border: 1px solid #00EBEB;
-        margin-top: 52px;
-        margin-left: 13px;
-        margin-right: 14px;
+  .oneKqjk {
+    width: 135px;
+    height: 140px;
+    padding: 5px;
+    border: 1px solid #00ebeb;
+    margin-top: 52px;
+    margin-left: 13px;
+    margin-right: 14px;
 
-        img {
-            width: 100%;
-            height: 100%;
-        }
+    img {
+      width: 100%;
+      height: 100%;
     }
+  }
 
-    .twoKqjk {
-        width: 226px;
-        height: 180px;
-        margin-top: 36px;
-        background: rgba(0, 84, 79, 0.3);
-    }
+  .twoKqjk {
+    width: 226px;
+    height: 180px;
+    margin-top: 36px;
+    background: rgba(0, 84, 79, 0.3);
+  }
 }
 
 .concet {
-    position: absolute;
-    top: 58px;
-    left: 23px;
-    display: flex;
+  position: absolute;
+  top: 58px;
+  left: 23px;
+  display: flex;
 }
 
 .ftahBox {
-    text-align: center;
-    padding-top: 27px;
-    width: 89px;
+  text-align: center;
+  padding-top: 27px;
+  width: 89px;
 
-    @media only screen and (max-height: 1000px) {
-        padding-top: 7px;
-    }
+  @media only screen and (max-height: 1000px) {
+    padding-top: 7px;
+  }
 
-    .iconBox1 {
-        background: url("~@/assets/pic/check.png") no-repeat;
-    }
+  .iconBox1 {
+    background: url("~@/assets/pic/check.png") no-repeat;
+  }
 
-    .iconBox2 {
-        background: url("~@/assets/pic/question.png") no-repeat;
-    }
+  .iconBox2 {
+    background: url("~@/assets/pic/question.png") no-repeat;
+  }
 
-    .iconBox3 {
-        background: url("~@/assets/pic/deal.png") no-repeat;
-    }
+  .iconBox3 {
+    background: url("~@/assets/pic/deal.png") no-repeat;
+  }
 
-    .iconBox4 {
-        background: url("~@/assets/pic/todo.png") no-repeat;
-    }
+  .iconBox4 {
+    background: url("~@/assets/pic/todo.png") no-repeat;
+  }
 
-    span:nth-child(1) {
-        display: inline-block;
-        width: 34px;
-        height: 37px;
-        background-size: 100% 100%;
-    }
-
-    span:nth-child(2) {
-        display: inline-block;
-        font-size: 18px;
-        font-family: SourceHanSansCN-Medium, SourceHanSansCN;
-        font-weight: 500;
-        color: #E2E2E2;
-        margin-top: 8px;
-    }
-
-    span:nth-child(3) {
-        display: inline-block;
-        font-size: 30px;
-        font-weight: 500;
-        margin-top: 5px;
-    }
-
-    span:nth-child(4) {
-        font-size: 17px;
-        font-family: SourceHanSansCN-Medium, SourceHanSansCN;
-        color: #fff;
-    }
-}
-
-.bgPicture {
-    width: 100%;
-    background: url("~@/assets/pic/BG.jpg") no-repeat;
+  span:nth-child(1) {
+    display: inline-block;
+    width: 34px;
+    height: 37px;
     background-size: 100% 100%;
+  }
+
+  span:nth-child(2) {
+    display: inline-block;
+    font-size: 18px;
+    font-family: SourceHanSansCN-Medium, SourceHanSansCN;
+    font-weight: 500;
+    color: #e2e2e2;
+    margin-top: 8px;
+  }
+
+  span:nth-child(3) {
+    display: inline-block;
+    font-size: 30px;
+    font-weight: 500;
+    margin-top: 5px;
+  }
+
+  span:nth-child(4) {
+    font-size: 17px;
+    font-family: SourceHanSansCN-Medium, SourceHanSansCN;
+    color: #fff;
+  }
+}
+.ftahBox1 {
+  // text-align: center;
+  padding-top: 27px;
+  width: 89px;
+  height: 100px;
+  display: flex;
+  flex-direction: column;
+  @media only screen and (max-height: 1000px) {
+    padding-top: 7px;
+  }
+  div:nth-child(1) {
+    display: inline-block;
+    font-size: 18px;
+    font-family: SourceHanSansCN-Medium, SourceHanSansCN;
+    font-weight: 500;
+    color: #e2e2e2;
+    margin-top: 8px;
+  }
+
+  div:nth-child(2) {
+    display: inline-block;
+    font-size: 30px;
+    font-weight: 500;
+    margin-top: 5px;
+  }
+
+  div:nth-child(3) {
+    font-size: 17px;
+    font-family: SourceHanSansCN-Medium, SourceHanSansCN;
+    color: #fff;
+  }
+}
+.bgPicture {
+  width: 100%;
+  background: url("~@/assets/pic/BG.jpg") no-repeat;
+  background-size: 100% 100%;
 }
 
 .title {
-    width: 100%;
-    height: 168px;
-    background: url("~@/assets/pic/title1.png") no-repeat;
-    background-size: 100% 100%;
+  width: 100%;
+  height: 168px;
+  background: url("~@/assets/pic/title1.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .titTop {
-    width: 100%;
-    position: absolute;
-    top: 9px;
-    left: 9px;
-    display: flex;
-    justify-content: space-between;
+  width: 100%;
+  position: absolute;
+  top: 9px;
+  left: 9px;
+  display: flex;
+  justify-content: space-between;
 
-    .titLeft {
-        width: 138px;
-        height: 40px;
-        background: #025A5F;
-        line-height: 40px;
-        text-align: center;
-
-        span:nth-child(1),
-        span:nth-child(2) {
-            font-size: 14px;
-            color: #3CFFF9;
-            letter-spacing: 1px;
-            font-weight: 400;
-            cursor: pointer;
-        }
-
-        span:nth-child(3) {
-            font-size: 14px;
-            color: #fff;
-            letter-spacing: 1px;
-            font-weight: bold;
-            cursor: pointer;
-        }
-    }
-
-    .titRight {
-        padding-top: 11px;
-        padding-right: 25px;
-        font-size: 14px;
-        font-weight: 400;
-        color: #D1FFFE;
-
-        span:nth-child(2) {
-            display: inline-block;
-            position: absolute;
-            right: 80px;
-            width: 17.5px;
-            height: 18px;
-            background: url("~@/assets/pic/sun.png") no-repeat;
-            background-size: 100% 100%;
-        }
-    }
-
-}
-
-.titName {
-    width: 100%;
-    height: 30px;
-    position: absolute;
-    top: 15px;
-
-    span:nth-child(1) {
-        display: inline-block;
-        width: 18px;
-        height: 18px;
-        background: url("~@/assets/pic/titleMark.png") no-repeat;
-        background-size: 100% 100%;
-        margin-left: 16px;
-        margin-right: 8px;
-    }
+  .titLeft {
+    width: 138px;
+    height: 40px;
+    background: #025a5f;
+    line-height: 40px;
+    text-align: center;
 
+    span:nth-child(1),
     span:nth-child(2) {
-        display: inline-block;
-        font-size: 22px;
-        font-family: ht2;
-        font-weight: bold;
-        color: #86eee7;
-        margin-right: 7px;
+      font-size: 14px;
+      color: #3cfff9;
+      letter-spacing: 1px;
+      font-weight: 400;
+      cursor: pointer;
     }
 
     span:nth-child(3) {
-        display: inline-block;
-        width: 248px;
-        height: 12px;
-        background: url("~@/assets/pic/4words.png") no-repeat;
-        background-size: 100% 100%;
+      font-size: 14px;
+      color: #fff;
+      letter-spacing: 1px;
+      font-weight: bold;
+      cursor: pointer;
     }
+  }
+
+  .titRight {
+    padding-top: 11px;
+    padding-right: 25px;
+    font-size: 14px;
+    font-weight: 400;
+    color: #d1fffe;
+
+    span:nth-child(2) {
+      display: inline-block;
+      position: absolute;
+      right: 80px;
+      width: 17.5px;
+      height: 18px;
+      background: url("~@/assets/pic/sun.png") no-repeat;
+      background-size: 100% 100%;
+    }
+  }
+}
+
+.titName {
+  width: 100%;
+  height: 30px;
+  position: absolute;
+  top: 15px;
+
+  span:nth-child(1) {
+    display: inline-block;
+    width: 18px;
+    height: 18px;
+    background: url("~@/assets/pic/titleMark.png") no-repeat;
+    background-size: 100% 100%;
+    margin-left: 16px;
+    margin-right: 8px;
+  }
+
+  span:nth-child(2) {
+    display: inline-block;
+    font-size: 22px;
+    font-family: ht2;
+    font-weight: bold;
+    color: #86eee7;
+    margin-right: 7px;
+  }
+
+  span:nth-child(3) {
+    display: inline-block;
+    width: 248px;
+    height: 12px;
+    background: url("~@/assets/pic/4words.png") no-repeat;
+    background-size: 100% 100%;
+  }
 }
 
 .leftOneBox {
-    width: 444px;
-    height: 242px;
-    background: url("~@/assets/pic/boxOneCz.png") no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    overflow-x: hidden;
-    transition: left 0.8s, height 1s;
-    overflow-y: hidden; //重点
-    top: 96px;
-    left: 27px;
-    @media only screen and (max-height: 1000px) {
-        top: 76px;
-        height: 222px;
-    }
+  width: 444px;
+  height: 242px;
+  background: url("~@/assets/pic/boxOneCz.png") no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  overflow-x: hidden;
+  transition: left 0.8s, height 1s;
+  overflow-y: hidden; //重点
+  top: 96px;
+  left: 27px;
+  @media only screen and (max-height: 1000px) {
+    top: 76px;
+    height: 222px;
+  }
 }
 .rightTwoBox {
-    width: 444px;
-    height: 362px;
-    background: url("~@/assets/pic/second.png") no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    overflow-x: hidden;
-    transition: right 0.8s, height 1s;
-    overflow-y: hidden; //重点
-    top: 360px;
-    right: 27px;
-    @media only screen and (max-height: 1000px) {
-        top: 317px;
-        height: 342px;
-    }
+  width: 444px;
+  height: 362px;
+  background: url("~@/assets/pic/second.png") no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  overflow-x: hidden;
+  transition: right 0.8s, height 1s;
+  overflow-y: hidden; //重点
+  top: 360px;
+  right: 27px;
+  @media only screen and (max-height: 1000px) {
+    top: 317px;
+    height: 342px;
+  }
 }
 
 .leftTwoBox {
-    width: 444px;
-    height: 322px;
-    background: url("~@/assets/pic/second.png") no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    overflow-x: hidden;
-    transition: left 0.8s, height 1s;
-    overflow-y: hidden; //重点
-    top: 361px;
-    left: 27px;
+  width: 444px;
+  height: 322px;
+  background: url("~@/assets/pic/second.png") no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  overflow-x: hidden;
+  transition: left 0.8s, height 1s;
+  overflow-y: hidden; //重点
+  top: 361px;
+  left: 27px;
 
-    @media only screen and (max-height: 1000px) {
-        height: 302px;
-        top: 317px;
-    }
+  @media only screen and (max-height: 1000px) {
+    height: 302px;
+    top: 317px;
+  }
 }
 
 .leftThreeBox {
-    width: 444px;
-    height: 342px;
-    background: url("~@/assets/pic/second.png") no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    top: 707px;
-    left: 27px;
-    overflow-x: hidden;
-    transition: left 0.8s, height 1s;
-    overflow-y: hidden; //重点
+  width: 444px;
+  height: 342px;
+  background: url("~@/assets/pic/second.png") no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  top: 707px;
+  left: 27px;
+  overflow-x: hidden;
+  transition: left 0.8s, height 1s;
+  overflow-y: hidden; //重点
 
-    @media only screen and (max-height: 1000px) {
-        height: 279px;
-        top: 638px;
-    }
+  @media only screen and (max-height: 1000px) {
+    height: 279px;
+    top: 638px;
+  }
 }
 
 .rightOneBox {
-    overflow-x: hidden;
-    transition: right 0.8s, height 1s;
-    overflow-y: hidden; //重点
-    width: 444px;
-    height: 240px;
-    background: url("~@/assets/pic/boxOneCz.png") no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    top: 96px;
-    right: 27px;
+  overflow-x: hidden;
+  transition: right 0.8s, height 1s;
+  overflow-y: hidden; //重点
+  width: 444px;
+  height: 240px;
+  background: url("~@/assets/pic/boxOneCz.png") no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  top: 96px;
+  right: 27px;
 
-    @media only screen and (max-height: 1000px) {
-        top: 76px;
-        height: 222px;
-    }
+  @media only screen and (max-height: 1000px) {
+    top: 76px;
+    height: 222px;
+  }
 }
 
 .securityCheck {
-    width: 100%;
-    height: 80%;
-    position: absolute;
-    bottom: 0;
+  width: 100%;
+  height: 80%;
+  position: absolute;
+  bottom: 0;
 }
 
 .rightThreeBox {
-    width: 442px;
-    height: 300px;
-    background: url("~@/assets/pic/boxOneCz.png") no-repeat;
-    background-size: 100% 100%;
-    position: absolute;
-    top: 746px;
-    overflow-x: hidden;
-    transition: right 0.8s, height 1s;
-    overflow-y: hidden; //重点
-    right: 27px;
+  width: 442px;
+  height: 300px;
+  background: url("~@/assets/pic/boxOneCz.png") no-repeat;
+  background-size: 100% 100%;
+  position: absolute;
+  top: 746px;
+  overflow-x: hidden;
+  transition: right 0.8s, height 1s;
+  overflow-y: hidden; //重点
+  right: 27px;
 
-    @media only screen and (max-height: 1000px) {
-        top: 678px;
-        height: 240px;
-    }
+  @media only screen and (max-height: 1000px) {
+    top: 678px;
+    height: 240px;
+  }
 }
 
 .container {
-    display: flex;
-    position: absolute;
-    top: 50%;
-    transform: translateY(-50%);
-    right: 0;
+  display: flex;
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  right: 0;
 }
 
 .box {
-    height: 784px;
-    overflow-x: hidden;
-    transition: width 0.8s, height 1s;
-    overflow-y: hidden; //重点
-    background: url("~@/assets/pic/closeMenu.png") no-repeat;
-    background-size: 100% 100%;
-    flex-direction: column;
+  height: 784px;
+  overflow-x: hidden;
+  transition: width 0.8s, height 1s;
+  overflow-y: hidden; //重点
+  background: url("~@/assets/pic/closeMenu.png") no-repeat;
+  background-size: 100% 100%;
+  flex-direction: column;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  .childBoxChoose {
+    cursor: pointer;
+    width: 166px;
+    height: 54px;
+    margin-bottom: 45px;
     display: flex;
     align-items: center;
     justify-content: center;
+    background: url("~@/assets/pic/btn1.png") no-repeat;
+    background-size: 100% 100%;
+    font-size: 19px;
+    font-family: SourceHanSansCN-Bold, SourceHanSansCN;
+    font-weight: bold;
+    color: #ffffff;
+    margin-left: 20px;
 
-    .childBoxChoose {
-        cursor: pointer;
-        width: 166px;
-        height: 54px;
-        margin-bottom: 45px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        background: url("~@/assets/pic/btn1.png") no-repeat;
-        background-size: 100% 100%;
-        font-size: 19px;
-        font-family: SourceHanSansCN-Bold, SourceHanSansCN;
-        font-weight: bold;
-        color: #ffffff;
-        margin-left: 20px;
-
-        span:nth-child(1) {
-            display: inline-block;
-            width: 20px;
-            height: 20px;
-            margin-right: 8px;
-        }
-
-        span:nth-child(3) {
-            display: inline-block;
-            width: 10px;
-            height: 17px;
-            margin-left: 10px;
-            background: url("~@/assets/pic/enter1.png") no-repeat;
-            background-size: 100% 100%;
-        }
+    span:nth-child(1) {
+      display: inline-block;
+      width: 20px;
+      height: 20px;
+      margin-right: 8px;
     }
 
-    .childBox:hover {
-        background: url("~@/assets/pic/btn1.png") no-repeat;
+    span:nth-child(3) {
+      display: inline-block;
+      width: 10px;
+      height: 17px;
+      margin-left: 10px;
+      background: url("~@/assets/pic/enter1.png") no-repeat;
+      background-size: 100% 100%;
+    }
+  }
+
+  .childBox:hover {
+    background: url("~@/assets/pic/btn1.png") no-repeat;
+  }
+
+  .childBox {
+    cursor: pointer;
+    width: 166px;
+    height: 54px;
+    margin-bottom: 45px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: url("~@/assets/pic/btn2.png") no-repeat;
+    background-size: 100% 100%;
+    font-size: 19px;
+    font-family: SourceHanSansCN-Bold, SourceHanSansCN;
+    font-weight: bold;
+    color: #ffffff;
+    margin-left: 20px;
+
+    span:nth-child(1) {
+      display: inline-block;
+      width: 20px;
+      height: 20px;
+      margin-right: 8px;
     }
 
-    .childBox {
-        cursor: pointer;
-        width: 166px;
-        height: 54px;
-        margin-bottom: 45px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        background: url("~@/assets/pic/btn2.png") no-repeat;
-        background-size: 100% 100%;
-        font-size: 19px;
-        font-family: SourceHanSansCN-Bold, SourceHanSansCN;
-        font-weight: bold;
-        color: #ffffff;
-        margin-left: 20px;
-
-        span:nth-child(1) {
-            display: inline-block;
-            width: 20px;
-            height: 20px;
-            margin-right: 8px;
-        }
-
-        span:nth-child(3) {
-            display: inline-block;
-            width: 10px;
-            height: 17px;
-            margin-left: 10px;
-            background: url("~@/assets/pic/enter2.png") no-repeat;
-            background-size: 100% 100%;
-        }
+    span:nth-child(3) {
+      display: inline-block;
+      width: 10px;
+      height: 17px;
+      margin-left: 10px;
+      background: url("~@/assets/pic/enter2.png") no-repeat;
+      background-size: 100% 100%;
     }
+  }
 }
 
 .icon1 {
-    background: url("~@/assets/pic/shipinjiankong.png") no-repeat;
-    background-size: 100% 100%;
+  background: url("~@/assets/pic/shipinjiankong.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .icon2 {
-    background: url("~@/assets/pic/renyuanguanli.png") no-repeat;
-    background-size: 100% 100%;
+  background: url("~@/assets/pic/renyuanguanli.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .icon3 {
-    background: url("~@/assets/pic/jinduguanli.png") no-repeat;
-    background-size: 100% 100%;
+  background: url("~@/assets/pic/jinduguanli.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .icon4 {
-    background: url("~@/assets/pic/anquanguanli.png") no-repeat;
-    background-size: 100% 100%;
+  background: url("~@/assets/pic/anquanguanli.png") no-repeat;
+  background-size: 100% 100%;
 }
 
 .closeBtn {
-    position: relative;
-    top: 343px;
-    height: 53px;
-    width: 14px;
-    cursor: pointer;
-    left: -265px;
+  position: relative;
+  top: 343px;
+  height: 53px;
+  width: 14px;
+  cursor: pointer;
+  left: -265px;
 }
 
 .switchBtn {
-    position: absolute;
-    transform: rotateY(358deg);
-    left: -14px;
-    top: 44%;
-    height: 53px;
-    width: 14px;
-    background: url("~@/assets/pic/openMenu.png") no-repeat;
-    background-size: 100% 100%;
-    cursor: pointer;
-    display: none;
+  position: absolute;
+  transform: rotateY(358deg);
+  left: -14px;
+  top: 44%;
+  height: 53px;
+  width: 14px;
+  background: url("~@/assets/pic/openMenu.png") no-repeat;
+  background-size: 100% 100%;
+  cursor: pointer;
+  display: none;
 }
 </style>
diff --git a/src/views/swiper.vue b/src/views/swiper.vue
index 24b6306..13abacf 100644
--- a/src/views/swiper.vue
+++ b/src/views/swiper.vue
@@ -71,6 +71,9 @@
 </template>
 
 <script>
+import {
+  getMostTroubleCensus
+} from "../api/api";
 export default {
   components: {},
   props: {},
@@ -114,7 +117,15 @@ export default {
     },
   },
   methods: {
-
+    getData(){
+      getMostTroubleCensus({
+        projectId: sessionStorage.getItem("projectId"),
+        // size:10,
+        // current:1
+      }).then((res) => {
+        console.log(res.data,'==================');
+      });
+    },
     changePage(index) {
       if (index == 1) {
         this.$refs.carousel.prev()
@@ -145,16 +156,18 @@ export default {
     //定时器
     this.setTimer();
   },
-  mounted() { },
+  mounted() {
+    this.getData()
+   },
 };
 </script>
 
 <style scoped lang="less">
-
+@marginLeft:50px;
 .home {
   display: flex;
   align-items: center;
-  margin-left: 49px;
+  margin-left: @marginLeft;
   .boxChild {
     display: flex;
 
@@ -247,11 +260,16 @@ export default {
   //     }
   //   }
   // }
+
 }
 </style>
 <style>
 .el-carousel__arrow--left,
 .el-carousel__arrow--right {
   display: none;
+}
+ .el-carousel__container {
+    position: relative;
+    height: 180px !important;
 }
 </style>