From 26adb1a4b89d6d4176a62d81b1d7957dd98a37e1 Mon Sep 17 00:00:00 2001
From: zhangzhang <1747194829@qq.com>
Date: Fri, 12 Apr 2024 15:59:15 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E5=BA=A6=E8=81=94=E7=BB=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-ui/src/api/commandDispatch/index.js     |   9 +
 .../components/Descriptions.vue               |  27 +-
 .../CrowdnessIndicatorRankings/charts.js      |  83 ++++
 .../CrowdnessIndicatorRankings/index.vue      |  39 +-
 .../StatsDialogVisible/index.vue              | 373 ++++++++++++++++++
 .../Cards/DispatchLiaison/index.vue           | 171 +++++---
 ruoyi-ui/vue.config.js                        |   4 +-
 7 files changed, 623 insertions(+), 83 deletions(-)
 create mode 100644 ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/CrowdnessIndicatorRankings/charts.js
 create mode 100644 ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DispatchLiaison/StatsDialogVisible/index.vue

diff --git a/ruoyi-ui/src/api/commandDispatch/index.js b/ruoyi-ui/src/api/commandDispatch/index.js
index 967cdc8a..ca7af949 100644
--- a/ruoyi-ui/src/api/commandDispatch/index.js
+++ b/ruoyi-ui/src/api/commandDispatch/index.js
@@ -11,3 +11,12 @@ export function WeatherForecast(lng, lat) {
     method: "get",
   });
 }
+
+// 查询调度联络
+export function commandDispatch(data) {
+  return request({
+    url: "/business/warning/commandAndDispatch",
+    method: "post",
+    data,
+  });
+}
diff --git a/ruoyi-ui/src/views/JiHeExpressway/components/Descriptions.vue b/ruoyi-ui/src/views/JiHeExpressway/components/Descriptions.vue
index 1ed8c50e..1db5ee26 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/components/Descriptions.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/components/Descriptions.vue
@@ -1,8 +1,16 @@
 <template>
   <div class="Descriptions keep-ratio" origin="left" :style="getStyle()">
-    <div class="item" v-for="(item, index) in getResolveList" :key="`${item.key || item.label}${index}`"
-      :style="[gridStyle(item, index), transformStyle(itemStyle)]" v-if="item.visible != false">
-      <div class="text title" :style="{...transformStyle(titleStyle), width: labelWidth }">
+    <div
+      class="item"
+      v-for="(item, index) in getResolveList"
+      :key="`${item.key || item.label}${index}`"
+      :style="[gridStyle(item, index), transformStyle(itemStyle)]"
+      v-if="item.visible != false"
+    >
+      <div
+        class="text title"
+        :style="{ ...transformStyle(titleStyle), width: labelWidth }"
+      >
         <p>
           <slot :name="`title-${item.key || item.label}`" :data="item">
             {{ item.label || "-" }}
@@ -10,9 +18,18 @@
         </p>
         :
       </div>
-      <ContentText :style="transformStyle(titleStyle)" class="content text" :data="data" :_config="item">
+      <ContentText
+        :style="transformStyle(titleStyle)"
+        class="content text"
+        :data="data"
+        :_config="item"
+      >
         <template #default="{ value }">
-          <slot :name="`content-${item.key || item.label}`" :value="value" :data="item">
+          <slot
+            :name="`content-${item.key || item.label}`"
+            :value="value"
+            :data="item"
+          >
             {{ value }}
           </slot>
         </template>
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/CrowdnessIndicatorRankings/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/CrowdnessIndicatorRankings/charts.js
new file mode 100644
index 00000000..f42320f6
--- /dev/null
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/CrowdnessIndicatorRankings/charts.js
@@ -0,0 +1,83 @@
+import * as echarts from "echarts";
+
+export const StatChartOption = {
+  width: "100%",
+  height: "100%",
+  color: ["#2AD9FD"],
+  xAxis: {
+    name: "日",
+    type: "category",
+    // boundaryGap: ["15%", "15%"],
+    nameTextStyle: {
+      color: "#2AD9FD",
+      align: "right",
+      fontSize: 15,
+      padding: [0, -15, 0, 0],
+    },
+    boundaryGap: false,
+    data: ["1", "5", "10", "15", "20", "25", "30"],
+    axisTick: {
+      show: false,
+    },
+    axisLabel: {
+      color: "#fff",
+      fontSize: 12,
+    },
+    axisLine: {
+      lineStyle: {
+        color: "#668598",
+      },
+    },
+  },
+  grid: {
+    left: 50,
+    top: 10,
+    // bottom: 30,
+    // right: 30,
+  },
+  tooltip: {
+    trigger: "axis",
+    valueFormatter: (value) => {
+      return value + "%";
+    },
+  },
+  yAxis: {
+    max: 100,
+    type: "value",
+    splitLine: {
+      lineStyle: {
+        type: [6, 9],
+        color: "rgba(255,255,255, .3)",
+      },
+    },
+    axisLabel: {
+      color: "#fff",
+      fontSize: 12,
+      formatter: "{value} %",
+    },
+  },
+  series: [
+    {
+      data: [0, 90, 65, 90, 45, 36, 27],
+      type: "line",
+      showSymbol: false,
+      smooth: true,
+      lineStyle: {
+        color: "#2AD9FD",
+      },
+      areaStyle: {
+        opacity: 0.8,
+        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+          {
+            offset: 0,
+            color: "rgb(90, 227, 255, .9)",
+          },
+          {
+            offset: 1,
+            color: "rgba(42,217,253,0)",
+          },
+        ]),
+      },
+    },
+  ],
+};
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/CrowdnessIndicatorRankings/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/CrowdnessIndicatorRankings/index.vue
index 6758ab69..142646bc 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/CrowdnessIndicatorRankings/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/CrowdnessIndicatorRankings/index.vue
@@ -10,18 +10,18 @@
         :key="item.key"
         @click="handleClick(item)"
       >
-        <ElPopover
-          trigger="manual"
-          :value="isActive(item)"
-          :disabled="item.key !== 'weather'"
-          placement="left"
-        >
+        <ElPopover trigger="manual" :value="isActive(item)" placement="left">
           <div v-if="item.key === 'weather'" class="weather">
             <span>天气：{{ weatherData.text }}</span>
             <span>能见度：{{ weatherData.vis }}公里</span>
             <span>风向：{{ weatherData.windDir }}</span>
             <span>风力：{{ weatherData.windScale }}级</span>
           </div>
+          <div
+            v-if="item.key === 'pie'"
+            class="statistics"
+            id="statChartRef"
+          ></div>
           <div
             class="label"
             slot="reference"
@@ -42,6 +42,8 @@ import Card from "@screen/components/Card2/Card.vue";
 import AMapContainer from "@screen/pages/Home/components/AMapContainer/index.vue";
 import { provideMixin } from "./../../mixin";
 import { WeatherForecast } from "@/api/commandDispatch";
+import * as echarts from "echarts";
+import { StatChartOption } from "./charts";
 
 export default {
   name: "CrowdnessIndicatorRankings",
@@ -76,7 +78,7 @@ export default {
         },
         {
           key: "pie",
-          label: "天气",
+          label: "统计",
         },
       ],
       delayLoad: true,
@@ -93,6 +95,16 @@ export default {
       const findIndex = this.active.indexOf(item.key);
       if (findIndex === -1) this.active.push(item.key);
       else this.active.splice(findIndex, 1);
+      if (item.key === "weather") {
+        this.getWeatherForecast();
+      } else if (item.key === "pie") {
+        this.$nextTick(() => {
+          const statChart = echarts.init(
+            document.getElementById("statChartRef")
+          );
+          statChart.setOption(StatChartOption);
+        });
+      }
     },
     getWeatherForecast() {
       WeatherForecast(117.2, 36.65).then((res) => {
@@ -102,12 +114,7 @@ export default {
       });
     },
   },
-  mounted() {
-    this.getWeatherForecast();
-    // setTimeout(() => {
-    //   this.delayLoad = true;
-    // }, 240);
-  },
+  mounted() {},
 };
 </script>
 
@@ -178,4 +185,10 @@ export default {
   margin-right: 20px;
   display: inline-block;
 }
+.statistics {
+  width: 300px;
+  height: 180px;
+  display: flex;
+  margin: 5px;
+}
 </style>
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DispatchLiaison/StatsDialogVisible/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DispatchLiaison/StatsDialogVisible/index.vue
new file mode 100644
index 00000000..7f63425b
--- /dev/null
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DispatchLiaison/StatsDialogVisible/index.vue
@@ -0,0 +1,373 @@
+<template>
+  <Dialog v-model="modelVisible" title="智能调度" style="width: 100%">
+    <div class="StatsDetail">
+      <el-form ref="form" :model="form"><el-form/>
+      <el-table :data="data">
+        <el-table-column prop="organizationName" label="路管驻点" width="180">
+        </el-table-column>
+        <el-table-column prop="difference" label="距离" width="180">
+          <template slot-scope="scope">
+            <span>{{ scope.row.difference }}公里</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="shiftsMap" label="人员">
+          <template slot-scope="scope"> </template>
+        </el-table-column>
+        <el-table-column prop="vehiclesMap" label="车辆"> </el-table-column>
+      </el-table>
+    </div>
+  </Dialog>
+</template>
+
+<script>
+import Dialog from "@screen/components/Dialog/index";
+import InputSearch from "@screen/components/InputSearch/index.vue";
+import Table from "@screen/components/Table.vue";
+import { selectTollStation } from "@/api/event/governanceAnalysis";
+import request from "@/utils/request";
+export default {
+  name: "StatsDetail",
+  components: {
+    Dialog,
+    InputSearch,
+    Table,
+  },
+  model: {
+    prop: "visible",
+    event: "update:value",
+  },
+  props: {
+    visible: Boolean,
+    data: Array,
+  },
+  data() {
+    return {
+      num: 0,
+      tableData: [],
+      weatherNum: [],
+      startTime: "",
+      endTime: "",
+      pickerOptions: {
+        disabledDate(time) {
+          return time.getTime() > Date.now();
+        },
+      },
+      searchType: 1,
+      controlType: 1,
+      facilityIds: [],
+      facilityTableData: [],
+      searchFormList: [
+        {
+          label: "查询条件:",
+          key: "searchType",
+          required: true,
+          isAlone: true,
+          type: "RadioGroup",
+          default: 1,
+          options: {
+            type: "circle",
+            options: [
+              {
+                key: 1,
+                label: "站点",
+              },
+              {
+                key: 2,
+                label: "原因",
+              },
+            ],
+          },
+        },
+        {
+          label: "事件类型:",
+          key: "controlType",
+          required: true,
+          isAlone: true,
+          type: "RadioGroup",
+          visible: (data) => {
+            if (data.searchType == 2) {
+              return true;
+            }
+          },
+          default: 1,
+          options: {
+            type: "circle",
+            options: [
+              {
+                key: 1,
+                label: "收费站封闭",
+              },
+              {
+                key: 2,
+                label: "收费站限行",
+              },
+            ],
+          },
+        },
+        {
+          label: "选择站点:",
+          key: "facilityId",
+          required: true,
+          type: "Select",
+          options: {
+            multiple: true,
+            options: [],
+          },
+          default: [],
+          visible: (data) => {
+            if (data.searchType == 1) {
+              return true;
+            }
+          },
+        },
+        {
+          label: "日期:",
+          key: "date",
+          required: true,
+          type: "datePicker",
+          default: "",
+          options: {
+            pickerOptions: {
+              disabledDate(time) {
+                return time.getTime() > Date.now();
+              },
+            },
+            valueFormat: "yyyy-MM-dd",
+            type: "daterange",
+          },
+        },
+      ],
+      queryParams: {},
+    };
+  },
+  computed: {
+    modelVisible: {
+      get() {
+        return this.visible;
+      },
+      set(val) {
+        this.$emit("update:value", val);
+      },
+    },
+  },
+
+  methods: {
+    getFacilityList() {
+      Promise.allSettled([
+        // 查询收费站
+        request({
+          url: `/business/facility/query`,
+          method: "get",
+        }),
+      ]).then((res) => {
+        if (res[0].status === "fulfilled" && res[0].value.code == 200) {
+          // this.searchFormList[2].options.options = res[0].value.data.map(
+          //   (item) => ({
+          //     key: item.id,
+          //     label: item.facilityName,
+          //   })
+          // );
+          let dataList = [];
+          res[0].value.data.forEach((item) => {
+            if (item.facilityType == 1) {
+              dataList.push({
+                key: item.id,
+                label: item.facilityName,
+              });
+            }
+          });
+          this.searchFormList[2].options.options = dataList;
+          this.facilityIds = res[0].value.data.map((item) => item.id);
+          this.searchFormList[2].default = dataList.map((item) => item.key);
+          console.log(56, this.searchFormList[2].default);
+          let currentMonth = moment().format("YYYY-MM");
+          let currentDate = moment().format("YYYY-MM-DD");
+          this.queryParams = {
+            searchType: 1,
+            facilityId: this.facilityIds,
+            date: [currentMonth + "-01", currentDate],
+          };
+          this.searchFormList[3].default = [currentMonth + "-01", currentDate];
+          this.getSelectTollStation(this.queryParams);
+        }
+      });
+    },
+    // handleResetForm(data) {
+    //   this.getSelectTollStation(data);
+    // },
+    handleSearch(data, value) {
+      console.log(888, data, value);
+      if (value == "reset") {
+        data = this.queryParams;
+      }
+      this.getSelectTollStation(data);
+    },
+    arraySpanMethod({ row, column, rowIndex, columnIndex }) {
+      if (this.searchType == 2) {
+        if (!row.causeTypeName) {
+          if (columnIndex === 0) {
+            return [1, 2];
+          } else if (columnIndex === 1) {
+            return [0, 0];
+          }
+        }
+        if (row.controlCauseName === "恶劣天气") {
+          if (columnIndex === 0) {
+            console.log(this.weatherNum.length);
+            if (rowIndex === 0) {
+              return [this.weatherNum.length, 1];
+            } else if (rowIndex <= this.weatherNum.length) {
+              return [0, 0];
+            }
+            // if (rowIndex === 2) {
+            //     return [7, 1];
+            // }
+            // else if (rowIndex === 3) {
+            //     return [0, 0];
+            // } else if (rowIndex === 4) {
+            //     return [0, 0];
+            // }
+            // else if (rowIndex === 5) {
+            //     return [0, 0];
+            // }
+            // else if (rowIndex === 6) {
+            //     return [0, 0];
+            // }
+            // else if (rowIndex === 7) {
+            //     return [0, 0];
+            // }
+            // else if (rowIndex === 8) {
+            //     return [0, 0];
+            // }
+          }
+          // this.weatherNum = 0
+        }
+      }
+    },
+    getSelectTollStation(data) {
+      let startTime = "";
+      let endTime = "";
+      if (data) {
+        startTime = data.date[0] + " 00:00:00";
+        endTime = data.date[1] + " 23:59:59";
+      } else {
+        startTime = new Date("2024-01-01 11:12:21");
+        startTime = new Date("2024-01-26 11:12:36");
+      }
+
+      var formData = new FormData();
+      this.searchType = data.searchType;
+      this.controlType = data.controlType;
+      if (data.searchType == 1) {
+        formData.append("facilityId", data.facilityId);
+      } else {
+        formData.append("controlType", data.controlType);
+      }
+      formData.append("searchType", data.searchType);
+      formData.append("startTime", startTime);
+      formData.append("endTime", endTime);
+      let weatherData = [];
+      let otherData = [];
+      selectTollStation(formData).then((res) => {
+        if (data.searchType == 2) {
+          this.weatherNum = [];
+          res.data.forEach((item) => {
+            if (item.causeTypeName) {
+              this.weatherNum.push(item.causeTypeName);
+              weatherData.push(item);
+            } else {
+              otherData.push(item);
+            }
+          });
+          this.tableData = weatherData.concat(otherData);
+        } else {
+          res.data.forEach((item) => {
+            item.total =
+              item.facilityClose +
+              item.facilityRestriction +
+              item.facilityInterval;
+          });
+          this.facilityTableData = res.data;
+        }
+      });
+    },
+  },
+  mounted() {
+    this.getFacilityList();
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.dialog {
+  min-height: 800px;
+}
+
+.search {
+  display: flex;
+  flex-direction: row-reverse;
+}
+
+::v-deep .is-scrolling-none {
+  background: #0b6581;
+}
+
+::v-deep .el-table__empty-text {
+  color: #3ae0f8;
+}
+
+.StatsDetail {
+  // height: 770px;
+  margin: 20px 0;
+  width: 100%;
+  display: flex;
+  gap: 5px;
+}
+
+.el-table {
+  border: 1px solid #07aec6;
+  background: #0b6581;
+}
+
+::v-deep .el-table .el-table__header-wrapper th,
+.el-table .el-table__fixed-header-wrapper th {
+  background: #0b6581;
+  border: 1px solid #07aec6;
+}
+
+::v-deep .el-table th.el-table__cell > .cell {
+  color: #3de8ff;
+}
+
+::v-deep .el-table thead.is-group th.el-table__cell {
+  background: #0b6581;
+  border: 1px solid #07aec6;
+}
+
+// ::v-deep .el-table th.el-table__cell.is-leaf,
+::v-deep .el-table td.el-table__cell {
+  border: 1px solid #07aec6;
+  background: #1b586d;
+  color: #fff;
+}
+
+::v-deep .el-table tr {
+  border: 1px solid #07aec6;
+  background-color: #0b6581;
+}
+
+::v-deep
+  .el-table--enable-row-hover
+  .el-table__body
+  tr:hover
+  > td.el-table__cell {
+  background: #1b586d;
+  border: 1px solid #07aec6;
+}
+
+::v-deep .el-table::before,
+.el-table--group::after,
+.el-table--border::after {
+  background: none;
+}
+</style>
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DispatchLiaison/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DispatchLiaison/index.vue
index 49339079..644868cf 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DispatchLiaison/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/commandDispatch/Cards/DispatchLiaison/index.vue
@@ -1,95 +1,140 @@
 <template>
-  <Card class='DispatchLiaison' title="调度联络">
+  <Card class="DispatchLiaison" title="调度联络">
     <template #title-suffix>
       <ButtonGradient class="title-button" @click.native="handleClick">
         调度
       </ButtonGradient>
     </template>
-    <Descriptions :list="list" style="gap: 24px; flex: 1;">
-      <template #content-phone1="{ data: { text } }">
-        {{ text }}
-        <img src="./images/phone.svg" />
-      </template>
-      <template #content-phone2="{ data: { text } }">
-        {{ text }}
-        <img src="./images/phone.svg" />
-        <img src="./images/camera.svg" />
-      </template>
-      <template #content-rescueVehicles="{ data: { text } }">
-        {{ text }}
-        <img src="./images/rescueVehicles.svg" />
-      </template>
-    </Descriptions>
+    <div class="dispatch-content">
+      <div class="dispatch-item">
+        <span class="label">业务单位：</span>
+        <span class="value">{{
+          dispatchData.organizationName ? dispatchData.organizationName : "-"
+        }}</span>
+      </div>
+      <div class="dispatch-item">
+        <div>
+          <span class="label">值班领导：</span>
+          <span class="value">{{
+            dispatchData.shiftsName ? dispatchData.shiftsName : "-"
+          }}</span>
+        </div>
+        <div>
+          <span class="label">手机号：</span>
+          <span class="value">{{
+            dispatchData.shiftsNumber ? dispatchData.shiftsNumber : "-"
+          }}</span>
+        </div>
+      </div>
+      <div class="dispatch-item">
+        <span class="label">调度人员：</span>
+        <span class="value" v-for="item in dispatchData.shiftsMap">{{
+          dispatchData.shiftsMap.length > 0 ? item.shiftsName : "-"
+        }}</span>
+      </div>
+      <div class="dispatch-item">
+        <div>
+          <span class="label">路管人员：</span>
+          <span class="value">{{
+            dispatchData.name ? dispatchData.name : "-"
+          }}</span>
+        </div>
+        <div>
+          <span class="label">手机号：</span>
+          <span class="value">{{
+            dispatchData.contactNumber ? dispatchData.contactNumber : "-"
+          }}</span>
+        </div>
+      </div>
+      <div class="dispatch-item">
+        <span class="label">救援车辆： </span>
+        <span class="value" v-for="item in dispatchData.vehiclesMap">{{
+          dispatchData.vehiclesMap.length > 0 ? "a" : "-"
+        }}</span>
+      </div>
+    </div>
+    <StatsDialogVisible
+      :visible="statsDialogVisible"
+      :data="dispatchList"
+      @update:value="handleClose"
+    />
   </Card>
 </template>
 
 <script>
 import Card from "@screen/components/Card2/Card.vue";
-import ButtonGradient from '@screen/components/Buttons/ButtonGradient.vue';
-import Descriptions from '@screen/components/Descriptions.vue';
-import { provideMixin } from "./../../mixin"
+import ButtonGradient from "@screen/components/Buttons/ButtonGradient.vue";
+import Descriptions from "@screen/components/Descriptions.vue";
+import { provideMixin } from "./../../mixin";
+import { commandDispatch } from "@/api/commandDispatch";
+import StatsDialogVisible from "./StatsDialogVisible/index.vue";
 
 export default {
-  name: 'DispatchLiaison',
+  name: "DispatchLiaison",
   mixins: [provideMixin],
   components: {
     Card,
     ButtonGradient,
-    Descriptions
+    Descriptions,
+    StatsDialogVisible,
   },
   data() {
     return {
-      list: [
-        {
-          label: '业务单位',
-          text: '山东正晨科技股份有限公司',
-          gridColumn: 2
-        },
-        {
-          label: '值班领导',
-          text: '张亮亮',
-        },
-        {
-          label: '手机',
-          key: "phone1",
-          text: '18888888888',
-        },
-        {
-          label: '调度人员',
-          text: '',
-          gridColumn: 2
-        },
-        {
-          label: '路管人员',
-          text: '王一博',
-        },
-        {
-          label: '手机',
-          key: "phone2",
-          text: '16666666666',
-        },
-        {
-          label: '救援车辆',
-          key: "rescueVehicles",
-          text: '鲁A34567 （大型清障车）',
-          gridColumn: 2
-        },
-      ]
-    }
+      dispatchData: [],
+      dispatchList: [],
+      statsDialogVisible: false,
+    };
   },
   methods: {
     handleClick() {
-    }
-  }
-}
+      console.log("-------");
+      this.statsDialogVisible = true;
+    },
+    handleClose() {
+      this.statsDialogVisible = false;
+    },
+    getCommandDispatch() {
+      let data = {
+        stakeMark: "K099+750",
+      };
+      commandDispatch(data).then((res) => {
+        this.dispatchList = res.data;
+        this.dispatchData = res.data[0];
+      });
+    },
+  },
+  mounted() {
+    this.getCommandDispatch();
+  },
+};
 </script>
 
-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .DispatchLiaison {
   ::v-deep {
     .content {
       display: flex;
-      align-items: center;
+      align-items: flex-start;
+    }
+  }
+  .dispatch-content {
+    width: 100%;
+    .dispatch-item {
+      display: flex;
+      width: 100%;
+      align-items: flex-start;
+      margin: 15px 0;
+      div {
+        width: 50%;
+      }
+      .label {
+        font-size: 14px;
+        color: #38d2e7;
+      }
+      .value {
+        font-size: 14px;
+        color: #fff;
+      }
     }
   }
 }
diff --git a/ruoyi-ui/vue.config.js b/ruoyi-ui/vue.config.js
index dae05292..12505ec7 100644
--- a/ruoyi-ui/vue.config.js
+++ b/ruoyi-ui/vue.config.js
@@ -52,8 +52,8 @@ module.exports = {
         // target: `http://10.0.81.204:8087`, //现场后台 刘文阁
         // target: `http://10.168.69.255:8087`, //正晨后台 连现场物联 刘文阁
         // target: `http://10.168.78.135:8087`,  //王钦
-        target: `http://10.168.66.196:8087`, //正晨后台 连现场物联 刘文阁2
-        // target: `http://10.168.68.42:8087`, //王思祥
+        // target: `http://10.168.66.196:8087`, //正晨后台 连现场物联 刘文阁2
+        target: `http://10.168.68.42:8087`, //王思祥
         // target: `http://10.168.65.194:8087`, //赵祥龙
         // target: `http://10.168.65.156:8097`, //孟
         // target: `http://10.168.56.165:8087`, //王家宝