提交交通统计

ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFrameControl/index.vue

@@ -22,7 +22,7 @@
           <i class="el-icon-close" />
         </span>
         <!-- 批量管控 -->
-        <div v-if="tabAction === '1'" style="width:800px; min-height: 320px;">
+        <div v-if="tabAction === '1'" style="width:800px; min-height: 350px;">
           <Form v-model="data" labelWidth="90px" column="2" class="form" ref="FormConfigRef" :formList="formList" />
               <component ref="ControlComponent" :is="componentMap[DeviceTopics[data.deviceType]]" :isMultiControl="true"
                 :visible="true" :selectItems="data.childType" @update:activeIcon="(val) => { this.activeIcon = val }"
@@ -35,9 +35,10 @@
           </div>
         </div>
         <!-- 定时管控 -->
-        <div v-if="tabAction === '2'" style="width:800px; height: 320px; overflow-y:auto" class="cardPanel">
+        <div v-if="tabAction === '2'" style="width:800px; height: 350px; overflow-y:auto" class="cardPanel">
           <Empty v-if="!data2.length" class="no-data" style="position: absolute">暂无数据</Empty>
-          <template v-else>
+          <div v-else style="display: flex;flex-direction: column;">
+            <div style="height:300;width:100%;overflow-y: auto;display: flex;flex-wrap: wrap;">
             <div class="cardBox" v-for="(item, index) in data2" :key="index">
               <Card :buttonIcon="null" :keyMap="keyMap" :cardData="item" class="card" buttonText="详情">
                 <template #form-remark="{ data }">
@@ -55,12 +56,20 @@
                 </template>
               </Card>
             </div>
-          </template>
+          </div>
+            <!-- 分页 -->
+            <div class="footer">
+              <ElPagination @current-change="bindTimeing" @size-change="onSizeChange2" width="'100%'" :page-sizes="[10, 20, 30, 40, 50]"
+                :page-size="searchData2.pageSize" :current-page.sync="searchData2.pageNum" layout="total, sizes, prev, pager, next"
+                :total="tableTotal2" class="Pagination">
+              </ElPagination>
+            </div>
+          </div>
         </div>
         <!-- 管控记录 -->
-        <div v-if="tabAction === '3'" style="width:800px;height: 320px;display: flex;flex-direction: column; justify-content: center;align-items: flex-start;" >
+        <div v-if="tabAction === '3'" style="width:800px;height: 350px;display: flex;flex-direction: column; justify-content: center;align-items: flex-start;" >
           <Form v-model="dataRecord" style="width:100%;" labelWidth="90px" column="2" class="form" ref="FormRecordRef" :formList="formRecord" />
-          <Table :data="tableData" height="500px" style="margin: 20px;width:95%">
+          <Table :data="tableData" height="500px" style="margin: 20px 20px 0px 20px;width:95%">
             <ElTableColumn label="管控时间" prop="operTime" width="200"/>
             <ElTableColumn label="设备名称" prop="dcDeviceName"/>
             <ElTableColumn label="管控方式" prop="operType" width="100"/>
@@ -77,14 +86,12 @@
               </template>
             </ElTableColumn>
           </Table>
-
           <!-- 分页 -->
-          <div class="footer">
+          <div class="footer" style="width:100%">
             <ElPagination @current-change="bindRecord" @size-change="onSizeChange" width="'100%'" :page-sizes="[10, 20, 30, 40, 50]"
               :page-size="searchData.pageSize" :current-page.sync="searchData.pageNum" layout="total, sizes, prev, pager, next"
               :total="tableTotal" class="Pagination">
             </ElPagination>
-           
           </div>
         </div>
       </div>
@@ -345,6 +352,14 @@ export default {
         },
       ],
       data2:[], //批量管控
+      tableTotal2:0,
+      searchData2: {
+        pageSize: 20,
+        pageNum: 1,
+      },
+
+
+
       dataRecord:{
         operType: "0",
         operTime:[]
@@ -463,16 +478,22 @@ export default {
       request({
           url: `/business/dcBatchFunctionsJobGroup/list`,
           method: "get",
-          params: {},
+          params: {...this.searchData2},
         })
           .then((result) => {
             if (result.code != 200) return;
-            this.tableTotal = result.total;
+            this.tableTotal2 = result.total;
             this.data2 = result.rows;
           })
           .finally(() => {
           });
     },
+    onSizeChange2(pageSize) {
+      this.data2 = [];
+      this.searchData2.pageSize = pageSize;
+      this.searchData2.pageNum = 1;
+      this.bindTimeing();
+    },
     bindRecord(){
       request({
         url: `/business/dcOperLog/list`,
@@ -572,6 +593,7 @@ div.el-popper.global-input-search-popover {
   flex-basis: percentage(1/4);
   padding-right: 10px;
   padding-bottom: 10px;
+  overflow-y: auto;
 }
 .remark {
   font-size: 14px; line-height: 20px; height: 40px; overflow: hidden;

ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DeviceControl/data.js

@@ -4,7 +4,7 @@ export const defaultTableInfo = {
   deviceType: 2,
   searchRule: 1,
   number: 0,
-  isDefault: true
+  isDefault: true,
-  // zx_operationType: 2,
+  zx_operationType: 2,
   // hf_operationType: 2,
 };

ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DeviceControl/index.vue

@@ -130,7 +130,7 @@ export default {
                 "deviceType": this.tableData[index].deviceType,
                 "searchRule": this.tableData[index].searchRule,
                 "number": this.tableData[index].number,
-                "deviceList": this.tableData[index].devList.join(','),
+                "deviceList": this.tableData[index].devList?.join(','),
                 "executeConfig": "{\"operationType\":2}",
                 "recoverConfig": "{\"operationType\":2}"
             }

ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/index.vue

@@ -193,7 +193,10 @@ export default {
         // this.modelVisible = false;
         // this.submitting = false;
         // this.$emit('queryData',true)
-        // return;
+        // 匝道数组特殊处理
+        if(formData.dcEventTrafficControl && formData.dcEventTrafficControl.rampId){
+          formData.dcEventTrafficControl.rampId = formData.dcEventTrafficControl.rampId.join(',')
+        }
    
         request({
           url: `/dc/system/event`,
@@ -249,6 +252,7 @@ export default {
   .fader {
     height: 500px;
     overflow-y: auto;
+    overflow-x: none;
   }
 
   .form {

ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/smart/analysis/charts.js

@@ -0,0 +1,97 @@
+/* 数据 */
+let nameList = [
+  "1月",
+  "2月",
+  "3月",
+  "4月",
+  "5月",
+  "6月",
+  "7月",
+  "8月",
+  "9月",
+  "10月",
+  "11月",
+  "12月",
+]; // 类别
+var options = {
+  tooltip: {
+    show: true,
+    trigger: "axis",
+    valueFormatter: null
+  },
+  legend: {
+    icon: "circle",
+    itemHeight: 8,
+    itemWidth: 8,
+    top: "5%",
+    x: "right",
+    textStyle: {
+      color: "#fff",
+    },
+  },
+  grid: {
+    top: "25%", //上边距
+    right: "0%", //右边距
+    left: "0%", //左边距
+    bottom: "0%", //下边距
+    containLabel: true,
+  },
+  xAxis: {
+    data: [],
+    axisTick: {
+      show: false, //隐藏X轴刻度
+    },
+    axisLine: {
+      lineStyle: {
+        color: "rgba(49, 217, 255, 0.8)",
+      },
+    },
+    axisLabel: {
+      show: true,
+      color: "#fff",
+      fontFamily: "Source Han Sans CN-Regular",
+    },
+  },
+  yAxis: [
+    {
+      type: "value",
+      name: "(指标)",
+      nameTextStyle: {
+        color: "#fff",
+        fontFamily: "Source Han Sans CN-Regular",
+        align: "right",
+        verticalAlign: "center",
+      },
+      axisLabel: {
+        color: "#fff",
+        fontFamily: "HarmonyOS Sans-Regular",
+      },
+      splitLine: {
+        lineStyle: {
+          color: "rgba(49, 217, 255, 0.5)",
+        },
+      },
+    },
+  ],
+  series: [
+    {
+      name: "交通特征",
+      type: "line",
+      symbol: "circle",
+      symbolSize: 0,
+
+      // yAxisIndex: 1, // 与第二个 y 轴关联
+      itemStyle: {
+        color: "#32BB8A",
+      },
+      lineStyle: {
+        width: 2,
+      },
+      data: [
+        1000, 800, 520, 600, 900, 700, 700, 1000, 800, 520, 600, 900, 700, 700,
+      ], // 折线图的数据
+    }
+  ],
+};
+
+export default options;

ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/smart/analysis/index.vue

@@ -22,7 +22,7 @@
       </el-form>
       <div class="body">
         <vuescroll :ops="scrollOptions">
-          <div class="device keep-ratio" v-for="(item, index) of list">
+          <div :class="'device keep-ratio ' + (listIndex===index?'deviceSel':'')" v-for="(item, index) of list" @click="devClick(item,index)">
             <div>{{ item.deviceName }}</div>
             <el-tooltip :content="(item.deviceState == 0 || item.deviceState == null) ? '异常' : '在线'" placement="top">
               <img src="@/assets/jihe/images/offline.svg" class="state"
@@ -53,9 +53,25 @@
             style="width: 140px"
             placeholder="请选择"
           />
+          <el-select v-model="devParam" @change="devChange"
+            class="devparam" placeholder="请选择" >
+              <el-option v-for="item in devOptions" :key="item.id" :label="item.name" :value="item.id">
+            </el-option>
+          </el-select>
+          <Button style="margin-left: 25px"  @click.native="bindData()">查询</Button>
+        </div>
+      </div>
+     
+      <div class="right-bottom" >
+        <div id="chart1" class="chart1 keep-ratio" origin="top"></div>
+        <div class="right-table">
+          <Table :data="tableData" >
+            <ElTableColumn  label="名称" prop="name" width="300"  align="center" />
+            <ElTableColumn label="采集时间" prop="timestamp"  align="center" />
+            <ElTableColumn :label="devParamName" prop="result" width="300" align="center" />
+          </Table>
         </div>
       </div>
-      <div class="bottom"></div>
     </div>
   </div>
 </template>
@@ -66,14 +82,22 @@ import vuescroll from "vuescroll";
 import scrollOptions from "@/common/scrollbar.js";
 import { Message } from "element-ui";
 import WgtTitle from "@screen/pages/perception/widgets/title";
+import Button from "@screen/components/Buttons/Button.vue";
+import { setLoading } from "@screen/utils/index.js";
+import chart1 from "./charts";
+import * as echarts from "echarts";
+import Table from '@screen/components/Table.vue';
 export default {
   name: 'smartAnalysis',
   components: {
     vuescroll,
-    WgtTitle
+    WgtTitle,
+    Button,
+    Table
   },
   data() {
     return {
+      listIndex: -1,
       form: {
         deviceName: '',
         deviceState: [1, 0]
@@ -85,7 +109,11 @@ export default {
       total: 0,
       list: [],
       scrollOptions,
-      date:''
+      date:'',
+      devParam:null,
+      devOptions:[],
+      devParamName:'',
+      tableData:[]
     }
   },
   created() {
@@ -96,6 +124,81 @@ export default {
     this.date = moment().format('YYYY-MM-DD')
   },
   methods: {
+    bindData(){
+      if(this.devParam === null){
+        Message.warning('未选择参数')
+        return;
+      }
+      const param = _.find(this.devOptions,{id:this.devParam})
+      this.devParamName = param.name;
+      const closeLoading = setLoading();
+      request({
+        url: 'business/device/properties/deviceNameData',
+        method: 'post',
+        data:{
+          deviceId: this.list[this.listIndex].deviceId,
+          propertyId: param.propertyId,
+          propertyName: param.propertyName,
+          deviceType: param.deviceType,
+          dateTime: this.date
+        }
+      }).then(result => {
+        if (result.code != 200) return Message.error(result?.msg);
+        let name = [];
+        let value = []; 
+        let unit = ''
+        result.data.forEach((e,index) => {
+          e.name = this.list[this.listIndex].deviceName,
+          name.push(e.timestamp.substr(11))
+          const n = e.result.match(/\d+\.*\d*/g);
+          if(n.length > 0){
+            if(unit === ''){
+              unit = e.result.substr(n[0].length)
+            }
+            value.push(parseFloat(n[0]))
+          } else {
+            value.push(0)
+          }
+        });
+        this.tableData = result.data;
+        chart1.xAxis.data = name;
+        chart1.yAxis[0].name = unit;
+        chart1.series[0].name = param.name;
+        chart1.series[0].data = value;
+        chart1.tooltip['valueFormatter'] = function (value) {
+          return value + " "+unit;
+        }
+        var myChart1 = echarts.init(document.getElementById("chart1"));
+        myChart1.setOption(chart1);
+      }).finally(()=>{
+        closeLoading()
+      })
+    },
+    devChange(e){
+      const dev = _.find(devOptions,{id: e})
+      console.log(dev)
+    },
+    devClick(item,index){
+      this.listIndex = index;
+      request({
+        url: 'business/device/deviceParameter',
+        method: 'get',
+        params:{
+          deviceType:item.deviceType
+        }
+      }).then(result => {
+        if (result.code != 200) return Message.error(result?.msg);
+     
+        this.devOptions = result.rows;
+        if(result.rows.length > 0){
+          this.devParam = result.rows[0].id
+          this.bindData();
+        } else {
+          this.devParam = null; 
+        }
+        
+      })
+    },
     onSizeChange(pageSize) {
       this.page.pageSize = pageSize;
       this.bindList();
@@ -112,6 +215,7 @@ export default {
       if (params.deviceName === '') {
         delete params.deviceName
       }
+
       request({
         url: 'business/device/selectDeviceNameList',
         method: 'get',
@@ -120,6 +224,7 @@ export default {
         if (result.code != 200) return Message.error(result?.msg);
         this.list = result.rows;
         this.total = result.total;
+        
       })
     },
     onResetSearch() {
@@ -171,6 +276,31 @@ export default {
   .right {
     flex: 1;
     margin-left: 30px;
+    .top{
+      .search{
+        display: flex;
+        justify-content: flex-end;
+      }
+    }
+    .right-bottom{
+      width: 100%;
+      height: 100%;
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-start;
+      align-items: flex-start;
+    }
+    .chart1{
+      width: 100%;
+      flex:1;
+    }
+    .right-table{
+      width: 100%;
+      height: 600px;
+      overflow-y: auto;
+      margin-bottom: 30px;
+    }
   }
 }
 
@@ -197,7 +327,9 @@ export default {
   display: flex;
   justify-content: space-between;
 }
-
+.deviceSel{
+  background-color:#1798a9;
+}
 .device:hover {
   background-color: #1d647f;
 }
@@ -206,17 +338,11 @@ export default {
   width: 18px;
   height: 18px;
 }
-.top{
+
-  .search{
-    display: flex;
-    justify-content: flex-end;
-  }
-}
 </style>
 
 <style lang="scss" scoped>
 .Pagination {
-  // color: #fff;
  
   ::v-deep {
 
@@ -296,7 +422,11 @@ export default {
     margin-left: 10px;
   }
 }
+.devparam{
+  width: 200px;
+  margin-left: 20px;
   
+}
 .selectDate {
         width: 89px;
         border: 1px solid #00b3cc;