金林湾下面-大屏数据对接

public/js/config.js

@@ -21,7 +21,7 @@ var PROJECT = {
 }
 
 
-var PROJECT_TYPE = PROJECT.online_zjsj
+var PROJECT_TYPE = PROJECT.local_test
 
 var headerShow = true; // 是否显示头部
 var tabsShow = true;  // 是否显示tabs

src/assets/js/api/dataBoard.js

@@ -31,6 +31,8 @@ export const selectUfaceDevStatisticsList = data => post('xmgl/ufaceDev/selectUf
 export const selectEnvironmentDevAlaramCountList = data => post('xmgl/environmentDev/selectEnvironmentDevAlaramCountList', data);
 export const selectProjectGetProjectInfoBySn = data => post('xmgl/project/getProjectInfoBySn', data);//获取项目平面图
 
+export const getSelectuFaceDevList = data => get('/xmgl/ufaceDev/count/onoffline', data);//获取项目平面图
+
 
 
 
@@ -67,6 +69,8 @@ export const  selectHiddenDangerSecurityManageStatisticsApi = data => post('xmgl
 // old安全管理
 export const selectRectifiedSecurityManageList2Api  = data => post('xmgl/securityManage/selectRectifiedSecurityManageList', data);
 export const getNewestSecurityManageDataList2Api  = data => post('xmgl/securityManage/getNewestSecurityManageDataList', data);
+export const getHiddenDangerInspectManageDataListApi  = data => post('/xmgl/hiddenDangerInspectRecord/selectHiddenDangerTypeRatio', data);
+export const getHiddenDangerStateTrendListApi  = data => post('/xmgl/hiddenDangerInspectRecord/selectHiddenDangerStateTrend', data);
 
 
 

src/assets/js/http.js

@@ -44,7 +44,7 @@ if (process.env.NODE_ENV == 'development') {
   // axios.defaults.baseURL ='http://124.71.67.160:8088/' //中建四局线上
   // axios.defaults.baseURL ='http://182.90.224.147:100/' //演示平台/
   // axios.defaults.baseURL = 'http://192.168.34.125:6023/' //杨意本地 http/1.1
-  // axios.defaults.baseURL ='http://47.97.202.104:6023/' //金林湾线上
+  axios.defaults.baseURL ='http://47.97.202.104:6023/' //金林湾线上
   // axios.defaults.baseURL = 'http://192.168.34.231:6023/'; //杨思瑞本地
   // axios.defaults.baseURL = 'http://47.97.202.104:6023/';
   // axios.defaults.baseURL = 'http://139.9.66.234:8/';
@@ -75,10 +75,10 @@ if (process.env.NODE_ENV == 'development') {
   // axios.defaults.baseURL = 'http://182.90.224.147:18170' //瑞士恒通线上
   // axios.defaults.baseURL = 'http://58.250.210.9:9090' //深汕线上
   // axios.defaults.baseURL = 'http://192.168.34.221:8088' //郭圣雄本地
-  axios.defaults.baseURL = 'http://192.168.34.221:8188' //郭圣雄本地
+  // axios.defaults.baseURL = 'http://192.168.34.221:8188' //郭圣雄本地
   // axios.defaults.baseURL = 'http://192.168.34.221:8210' //郭圣雄本地
-  // axios.defaults.baseURL = 'http://192.168.34.221:8199' //郭圣雄本地
+  // axios.defaults.baseURL = 'http://192.168.34.221:12346' //郭圣雄本地
-  // axios.defaults.baseURL = 'http://192.169.34.133:8070' //彭洁本地
+  // axios.defaults.baseURL = 'http://192.168.34.122:8070' //彭洁本地
 
 } else if (process.env.NODE_ENV == 'debug') {
   axios.defaults.baseURL = 'https://www.ceshi.com'

src/views/projectAdmin/jlw/components/progress.vue

@@ -140,10 +140,10 @@ export default {
       margin-left: -47%;
     }
     .line {
-      top: 60%;
+      top: 50%;
       position: absolute;
-      margin-left: 200px;
+      margin-left: 145px;
-      color: gray;
+      color: #465161;
     }
   }
 }

src/views/projectAdmin/jlw/digitalSite/rightTop.vue

@@ -1,8 +1,8 @@
 <template>
   <Card :title="title">
     <DeviceCard
-      :leftCount="{ value: 22, label: '在线设备', img: 'online' }"
+      :leftCount="{ value: offlineNum, label: '在线设备', img: 'online' }"
-      :rightCount="{ value: 65, label: '离线设备', img: 'warring2' }"
+      :rightCount="{ value: onlineNum, label: '离线设备', img: 'warring2' }"
     >
       <div class="list">
         <div class="list-head">
@@ -11,12 +11,19 @@
           <div class="outer">出场人数</div>
         </div>
         <div class="listBox">
-          <div class="list-item" :class="item.deviceState ==1 ? 'offline' : 'online'" v-for="(item,index) in ufaceList.devList" :key="index">
+          <div
-          <div class="status">{{item.deviceState ==1 ? '在线' :'离线'}}</div>
+            class="list-item"
-          <div class="label">{{item.devName}}</div>
+            :class="item.deviceState == 1 ? 'offline' : 'online'"
-          <div class="enter">{{item.isEnter}}</div>
+            v-for="(item, index) in ufaceList.devList"
-          <div class="outer">{{item.outTotalNum}}</div>
+            :key="index"
-        </div>
+          >
+            <div class="status">
+              {{ item.deviceState == 1 ? '在线' : '离线' }}
+            </div>
+            <div class="label">{{ item.devName }}</div>
+            <div class="enter">{{ item.isEnter }}</div>
+            <div class="outer">{{ item.outTotalNum }}</div>
+          </div>
         </div>
       </div>
     </DeviceCard>
@@ -24,6 +31,7 @@
 </template>
 
 <script>
+import { getSelectuFaceDevList } from '@/assets/js/api/dataBoard'
 import Card from '../components/Card.vue'
 import DeviceCard from './components/DeviceCard.vue'
 export default {
@@ -33,16 +41,37 @@ export default {
       type: String,
       default: ''
     },
-    ufaceList:{
+    ufaceList: {
       type: Object,
       default: []
     }
   },
   data() {
-    return {}
+    return {
+      offlineNum: 0,
+      onlineNum: 0
+    }
   },
-  mounted(){
+  mounted() {
+    this.getData()
     // console.log('--------------', this.ufaceList)
+  },
+  methods: {
+    getData() {
+      let data = {
+        projectSn: this.$store.state.projectSn
+      }
+      // 获取塔吊数量
+      getSelectuFaceDevList(data).then((res) => {
+        if (res.code === 200) {
+          console.log('获取人脸闸机数量', res)
+          // let { result } = res
+          this.offlineNum = res.result.offlineNum
+          this.onlineNum = res.result.onlineNum
+          // console.log(result)
+        }
+      })
+    }
   }
 }
 </script>
@@ -73,49 +102,56 @@ export default {
       text-align: right;
     }
   }
-  .listBox{
+  .listBox {
     height: calc(100% - 15px);
-    overflow:auto;
+    overflow: auto;
-      .list-item {
+    .list-item {
-    margin-bottom: 6px;
+      margin-bottom: 6px;
-    padding: 0 16px;
+      padding: 0 16px;
-    height: 22px;
+      height: 22px;
-    display: flex;
+      display: flex;
-    align-items: center;
+      align-items: center;
-    &.online {
+      &.online {
-      background-image: linear-gradient(90deg, rgba(23, 54, 74, 1), rgba(23, 54, 74, 0.2));
+        background-image: linear-gradient(
+          90deg,
+          rgba(23, 54, 74, 1),
+          rgba(23, 54, 74, 0.2)
+        );
+        .status {
+          background-color: #3cabfd;
+        }
+      }
+      &.offline {
+        background-image: linear-gradient(
+          90deg,
+          rgba(67, 42, 63, 1),
+          rgba(67, 42, 63, 0.2)
+        );
+        .status {
+          background-color: #ff6c7f;
+        }
+      }
       .status {
-        background-color: #3cabfd;
+        margin-right: 20px;
+        width: 36px;
+        height: 16px;
+        line-height: 16px;
+        text-align: center;
+        font-size: 12px;
+        border-radius: 9px;
+      }
+      .label {
+        margin-right: auto;
+        font-size: 14px;
+      }
+      .enter {
+        width: 70px;
+      }
+      .outer {
+        width: 70px;
+        text-align: right;
       }
     }
-    &.offline {
-      background-image: linear-gradient(90deg, rgba(67, 42, 63, 1), rgba(67, 42, 63, 0.2));
-      .status {
-        background-color: #ff6c7f;
-      }
-    }
-    .status {
-      margin-right: 20px;
-      width: 36px;
-      height: 16px;
-      line-height: 16px;
-      text-align: center;
-      font-size: 12px;
-      border-radius: 9px;
-    }
-    .label {
-      margin-right: auto;
-      font-size: 14px;
-    }
-    .enter {
-      width: 70px;
-    }
-    .outer {
-      width: 70px;
-      text-align: right;
-    }
   }
-  }
-
 }
 </style>

src/views/projectAdmin/jlw/jChart/bar/JProgressChart.vue

@@ -41,6 +41,7 @@ export default {
   },
   methods: {
     createChart() {
+      this.JProgressChart = echarts.init(this.$refs.JProgressChart)
       const { grid, seriesData, yData } = this
       const max = Math.max(...seriesData)
       const maxData = seriesData.map((item) => max)

src/views/projectAdmin/jlw/jChart/pie/JNestedRingChart.vue

@@ -31,15 +31,13 @@ export default {
   },
   mounted() {
     this.jNestedRingChart = echarts.init(this.$refs.jNestedRingChart)
+    this.drawChart()
     this.createChart()
-    this.$nextTick(() => {
+    this.timer = setInterval(() => {
-      this.drawChart();
+      this.doing()
-      this.timer = setInterval(() => {
+    }, 200)
-        this.doing();
-      }, 200);
-    });
   },
-  destroyed(){
+  destroyed() {
     clearInterval(this.timer)
     this.timer = ''
   },
@@ -51,8 +49,8 @@ export default {
   methods: {
     createChart() {
       const { title, legend, series, showLegend } = this
-      const setSeries = (series => {
+      const setSeries = ((series) => {
-        return series.map(item => ({
+        return series.map((item) => ({
           type: 'pie',
           label: false,
           center: item.center || ['30%', '50%'],
@@ -62,6 +60,7 @@ export default {
           data: item.data
         }))
       })(series)
+      this.jNestedRingChart = echarts.init(this.$refs.jNestedRingChart)
 
       const option = {
         title: {
@@ -104,20 +103,21 @@ export default {
         series: setSeries
       }
       if (!showLegend) {
-        delete option.legend;
+        delete option.legend
       }
       this.jNestedRingChart.setOption(option)
     },
     drawChart() {
-      this.myChart = echarts.init(this.$refs.jNestedRingChart);
+      this.myChart = echarts.init(this.$refs.jNestedRingChart)
       this.option = {
         series: this.series
-      };
+      }
-    },
-    doing() {//转动饼图内圈
-      this.series[0].startAngle = this.series[0].startAngle - 5;
-     this.myChart.setOption(this.option);
     },
+    doing() {
+      //转动饼图内圈
+      this.series[0].startAngle = this.series[0].startAngle - 5
+      this.myChart.setOption(this.option)
+    }
   },
   watch: {
     series() {

src/views/projectAdmin/jlw/projectHuli/qualityProblem.vue

@@ -10,21 +10,30 @@
           :radius="['55%', '80%']"
         />-->
         <JRingChart
-        :color="['#3aaaff', '#ff6982']" 
+          :color="['#3aaaff', '#ff6982']"
-        :title="{ x: '47%', y: '35%', text: total.totalNum , subTitle: '质量问题数' }" 
+          :title="{
-        :data ="[
+            x: '47%',
-          { value: total.totalNum-total.rectificationNum, name: '已整改质量问题' },
+            y: '35%',
+            text: total.totalNum,
+            subTitle: '质量问题数'
+          }"
+          :data="[
+            {
+              value: total.totalNum - total.rectificationNum,
+              name: '已整改质量问题'
+            },
             { value: total.rectificationNum, name: '未整改质量问题' }
-        ]" />
+          ]"
+        />
       </div>
       <div class="count">
         <div class="count-item">
           <div class="label">已整改质量问题</div>
-          <div class="num">{{( total.totalNum-total.rectificationNum)}}</div>
+          <div class="num">{{ total.totalNum - total.rectificationNum }}</div>
         </div>
         <div class="count-item">
           <div class="label">未整改质量问题</div>
-          <div class="num">{{ total.rectificationNum}}</div>
+          <div class="num">{{ total.rectificationNum }}</div>
         </div>
       </div>
     </div>
@@ -54,47 +63,48 @@ export default {
         ratioNum: 0
       },
       series: [
-      {
+        {
           roseType: 'area',
-          startAngle:90,
+          startAngle: 90,
           center: ['50%', '50%'],
           radius: ['58%', '54%'],
           color: ['#0B1B35', '#244D8F'],
           data: [30, 40, 30, 40],
-          hoverAnimation:false,
+          hoverAnimation: false
         },
         {
           color: ['#3aaaff', '#ff6982'],
           center: ['50%', '50%'],
-          startAngle:90,
+          startAngle: 90,
           data: [
             { value: 0, name: '已整改质量问题' },
             { value: 0, name: '未整改质量问题' }
           ],
-          hoverAnimation:false,
+          hoverAnimation: false
         }
       ]
     }
   },
-  created(){
+  created() {
     this.getData()
   },
 
-  methods:{
+  methods: {
- //获取数据
+    //获取数据
- getData() {
+    getData() {
       let data = {
         projectSn: this.$store.state.projectSn
       }
-      selectQualityStatisticsApi(data).then(res => {
+      selectQualityStatisticsApi(data).then((res) => {
         this.total = res.result.total
         this.total.totalNum = Number(res.result.total.totalNum)
-        this.series[1].data[0].value = this.total.totalNum-this.total.rectificationNum
+        this.series[1].data[0].value =
+          this.total.totalNum - this.total.rectificationNum
         this.series[1].data[1].value = this.total.rectificationNum
-         console.log(this.total,'质量问题');
+        console.log(this.total, '质量问题')
       })
     }
-  },
+  }
 }
 </script>
 

src/views/projectAdmin/jlw/qualityManage/leftTop.vue

@@ -3,9 +3,9 @@
     <!-- <DaysSwitch class="days-switch" @change="handleSwitch" /> -->
     <div class="content">
       <JProgressChart
+        v-if="seriesData.length > 0"
         :seriesData="seriesData"
         :yData="yData"
-        v-if="seriesData.length > 0"
       />
       <div class="noData" v-else>
         <img src="@/assets/images/noData3.png" alt srcset />
@@ -60,6 +60,8 @@ export default {
         })
         this.yData = xdata
         this.seriesData = ydata
+        console.log('this.yData', this.yData)
+        console.log('this.seriesData', this.seriesData)
       })
     },
     handleSwitch(val) {

src/views/projectAdmin/jlw/qualityManage/rightBottom.vue

@@ -78,7 +78,7 @@ export default {
             ydata.push(item.num)
           })
           this.xData = xdata
-          this.series.data = ydata
+          this.series[0].data = ydata
         }
       })
     }

src/views/projectAdmin/jlw/safeManage/leftCenter.vue

@@ -1,29 +1,18 @@
 <template>
   <Card :title="title">
-    <!-- <div class="table">
+    <JNestedRingChart
-      <div class="thead">
+      :title="{ text: totals.total, subTitle: '问题总数', y: '35%' }"
-        <div class="row">
+      :series="series"
-          <div class="td">预警时间</div>
+    />
-          <div class="td">预警类型</div>
-          <div class="td"></div>
-        </div>
-      </div>
-      <div class="tbody">
-        <div class="row" v-for="i in 5" :key="i">
-          <div class="td">2022.03.05 15:23:22</div>
-          <div class="td">边临防护</div>
-          <div class="td">详情</div>
-        </div>
-      </div>
-    </div> -->
-
-    <JNestedRingChart :title="{ text: totalNum, subTitle: '问题总数', y: '35%' }" :series="series" />
   </Card>
 </template>
 
 <script>
 import Card from '../components/Card.vue'
-import { selectSecurityManageStatisticsApi } from '@/assets/js/api/dataBoard'
+import {
+  selectSecurityManageStatisticsApi,
+  getHiddenDangerInspectManageDataListApi
+} from '@/assets/js/api/dataBoard'
 import JNestedRingChart from '../jChart/pie/JNestedRingChart.vue'
 export default {
   components: { Card, JNestedRingChart },
@@ -33,55 +22,54 @@ export default {
       default: ''
     }
   },
-  mounted() {
-    this.series[1].data = [
-            { value: 3, name: '周检' },
-            { value: 7, name: '月检' },
-            { value: 1, name: '其他' }
-          ]
-    // selectSecurityManageStatisticsApi({ projectSn: this.projectSn }).then(res => {
-    //   const totals = res.result.total
-    //   this.series[1].data = [
-    //         { value: totals.weekInspectNum, name: '周检' },
-    //         { value: totals.monthInspectNum, name: '月检' },
-    //         { value: totals.otherInspectNum, name: '其他' }
-    //       ]
-    //   this.totalNum = totals.totalNum
-    // })
-  },
   data() {
     return {
-      projectSn: this.$store.state.projectSn,
+      totals: {
+        total: 0
+      },
       series: [
-       {
+        {
           roseType: 'area',
-          startAngle:90,
+          startAngle: 90,
           radius: ['58%', '54%'],
           color: ['#0B1B35', '#244D8F'],
           data: [30, 40, 30, 40],
-          hoverAnimation:false,
+          hoverAnimation: false
-        },{
+        },
-          color: ['#3DACFE', '#6DE4F0', '#FE6C7F'],
+        {
-          startAngle:90,
+          color: ['#3cabfd', '#58ec72', '#f43a8d', '#f294c6', '#6ee4f0'],
-          data:[],
+          startAngle: 90,
-          hoverAnimation:false,
+          data: [],
+          hoverAnimation: false
         }
-        ],
+      ]
-      total: 0
     }
   },
-  computed: {
+  mounted() {},
-    // legend() {
+  created() {
-    //   const data = (this.series[0] || []).data || []
+    this.getData()
-    //   const formatter = name => {
+    this.totals.total = JSON.parse(localStorage.getItem('safeTotal'))
-    //     const value = ((data.filter(item => item.name === name) || [])[0] || {}).value
+  },
-    //     return `${name} ${value}`
+  methods: {
-    //   }
+    getData() {
-    //   return {
+      let that = this
-    //     formatter
+      getHiddenDangerInspectManageDataListApi({
-    //   }
+        projectSn: this.$store.state.projectSn
-    // }
+      }).then((res) => {
-  }
+        console.log('问题占比数据', res)
+        res.result.forEach((element) => {
+          that.totals.total = element.total
+          localStorage.setItem('safeTotal', element.total)
+          // console.log('bbb', that.series[1].data)
+          that.series[1].data = [
+            { value: element.num, name: element.inspectTypeName }
+            // { value: 1, name: '安全生产' }
+          ]
+        })
+      })
+    }
+  },
+  computed: {}
 }
 </script>
 
@@ -115,7 +103,7 @@ export default {
           margin-right: 10px;
           color: #6ee4f0;
           cursor: pointer;
-          color: #3DACFE;
+          color: #3dacfe;
         }
       }
     }

src/views/projectAdmin/jlw/safeManage/leftTop.vue

@@ -37,6 +37,7 @@
           label="检查项"
         ></el-table-column>
         <el-table-column
+          width="180"
           align="center"
           prop="checkContent"
           label="检查内容"
@@ -45,7 +46,7 @@
           align="center"
           prop="inspectTime"
           label="检查时间"
-          width="100"
+          width="90"
         ></el-table-column>
         <el-table-column
           align="center"
@@ -159,4 +160,10 @@ export default {
     }
   }
 }
+::v-deep .el-table tr {
+  font-size: 12px !important;
+}
+::v-deep .el-table th > .cell {
+  font-size: 14px !important;
+}
 </style>

src/views/projectAdmin/jlw/safeManage/rightBottom.vue

@@ -1,5 +1,5 @@
 <template>
-  <Card :title="title" style="position: relative;">
+  <Card :title="title" style="position: relative">
     <!-- <el-date-picker
       v-model="dateRange"
       size="mini"
@@ -10,11 +10,16 @@
       start-placeholder="开始日期"
       end-placeholder="结束日期"
     ></el-date-picker> -->
-    <JLineChart :xData="xData" :series="series" />
+    <JLineChart :xData="xData" :series="series" v-if="xData.length > 0" />
+    <div class="noData" v-else>
+      <img src="@/assets/images/noData3.png" alt srcset />
+      <p>暂无数据</p>
+    </div>
   </Card>
 </template>
 
 <script>
+import { getHiddenDangerStateTrendListApi } from '@/assets/js/api/dataBoard'
 import Card from '../components/Card.vue'
 import JLineChart from '../jChart/line/JLineChart.vue'
 export default {
@@ -33,7 +38,7 @@ export default {
       series: [
         {
           name: '新增隐患',
-          data: [100, 235, 232, 532, 112, 532, 449, 269, 998, 33],
+          data: [],
           areaColor: ['rgba(250, 201, 21, .3)', 'rgba(250, 201, 21, .1)'],
           emphasis: {
             color: '#FAC915',
@@ -43,7 +48,7 @@ export default {
         },
         {
           name: '消除隐患',
-          data: [22, 432, 44, 55, 123, 433, 369, 269, 436, 203],
+          data: [],
           areaColor: ['rgba(255, 108, 127, .3)', 'rgba(255, 108, 127, .1)'],
           emphasis: {
             color: '#ff6c7f',
@@ -53,7 +58,7 @@ export default {
         },
         {
           name: '未消除隐患',
-          data: [655, 111, 224, 152, 65, 541, 334, 556, 326, 203],
+          data: [],
           areaColor: ['rgba(102, 212, 224, .3)', 'rgba(102, 212, 224, .1)'],
           emphasis: {
             color: '#6ee4f0',
@@ -63,8 +68,46 @@ export default {
         }
       ]
     }
+  },
+  mounted() {
+    this.getData()
+  },
+  methods: {
+    getData() {
+      let data = {
+        projectSn: this.$store.state.projectSn
+      }
+      getHiddenDangerStateTrendListApi(data).then((res) => {
+        console.log('安全问题趋势有数据吗', res)
+        var arr = res.result
+        if (arr != null) {
+          var ydata1 = [] //新增隐患
+          var ydata2 = [] //消除隐患
+          var ydata3 = [] //未消除隐患
+          var time = [] //时间
+          arr.forEach((item) => {
+            ydata1.push(item.increaseNum)
+            ydata2.push(item.solveNum)
+            ydata3.push(item.unResolveNum)
+            time.push(item.createTime)
+          })
+          this.xData = time
+          this.series[0].data = ydata1
+          this.series[1].data = ydata2
+          this.series[2].data = ydata3
+        }
+      })
+    }
   }
 }
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.noData {
+  margin-top: 12%;
+  margin-left: 40%;
+  p {
+    margin-left: 1.5%;
+  }
+}
+</style>