Browse Source

fix bug move

杨思远 5 ngày trước cách đây
mục cha
commit
1db5deae6e

+ 1 - 1
.env.development

@@ -1,5 +1,5 @@
 # 页面标题
-VUE_APP_TITLE = 北斗卫星信号增强系统管理平台
+VUE_APP_TITLE = 平台展示软件
 
 # 开发环境配置
 ENV = 'development'

+ 1 - 1
.env.production

@@ -1,5 +1,5 @@
 # 页面标题
-VUE_APP_TITLE = 北斗卫星信号增强系统管理平台
+VUE_APP_TITLE = 平台展示软件
 
 # 生产环境配置
 ENV = 'production'

BIN
dist.tar


+ 28 - 0
src/api/item/device.js

@@ -0,0 +1,28 @@
+import request from "@/utils/request";
+
+export default {
+  // 设备筛选项
+  getDeviceOptions() {
+    return request({
+      url: "/device/getDeviceOptions",
+      method: "get",
+    });
+  },
+
+  //获取设备信息
+  getDeviceData(id) {
+    return request({
+      url: "/device/getDeviceVoData",
+      method: "get",
+      params: { id },
+    });
+  },
+
+  // 获取设备xy坐标
+  getCoordinateData() {
+    return request({
+      url: "/device/getCoordinateData",
+      method: "get",
+    });
+  },
+};

BIN
src/assets/png/desk.png


BIN
src/assets/png/device-selected.png


BIN
src/assets/png/device.png


+ 20 - 9
src/layout/components/Sidebar/Logo.vue

@@ -1,15 +1,27 @@
 <template>
-  <div class="sidebar-logo-container" :class="{ 'collapse': collapse }"
+  <div class="sidebar-logo-container"
+    :class="{ 'collapse': collapse }"
     :style="{ backgroundColor: sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
     <transition name="sidebarLogoFade">
-      <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1 v-else class="sidebar-title"
+      <router-link v-if="collapse"
+        key="collapse"
+        class="sidebar-logo-link"
+        to="/">
+        <img v-if="logo"
+          :src="logo"
+          class="sidebar-logo" />
+        <h1 v-else
+          class="sidebar-title"
           :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">
           {{ title }} </h1>
       </router-link>
-      <router-link v-else key="expand" class="sidebar-logo-link" to="/">
-        <img v-if="logo" :src="logo" class="sidebar-logo" />
+      <router-link v-else
+        key="expand"
+        class="sidebar-logo-link"
+        to="/">
+        <img v-if="logo"
+          :src="logo"
+          class="sidebar-logo" />
         <h1 class="sidebar-title"
           :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">
           {{ title }} </h1>
@@ -19,8 +31,7 @@
 </template>
 
 <script>
-import logoImg from '@/assets/logo/logo.png'
-import variables from '@/assets/styles/variables.scss'
+import variables from '@/assets/styles/variables.scss';
 
 export default {
   name: 'SidebarLogo',
@@ -40,7 +51,7 @@ export default {
   },
   data() {
     return {
-      title: '系统管理平台',
+      title: 'UWB+RTK实验教学平台',
       logo: false
     }
   }

+ 18 - 1
src/router/index.js

@@ -65,7 +65,24 @@ export const constantRoutes = [
         component: () => import("@/views/index"),
         name: "Index",
         meta: {
-          title: "首页",
+          title: "室外定位",
+          icon: "dashboard",
+          affix: true,
+        },
+      },
+    ],
+  },
+  {
+    path: "",
+    component: Layout,
+    redirect: "outdoor",
+    children: [
+      {
+        path: "outdoor",
+        component: () => import("@/views/item/echart"),
+        name: "outdoor",
+        meta: {
+          title: "室内定位",
           icon: "dashboard",
           affix: true,
         },

+ 214 - 71
src/views/index.vue

@@ -1,97 +1,240 @@
 <template>
-  <div class="app-container home"
-    id="home">
+  <div class="home">
 
+    <el-card class="head_card"
+      shadow="always">
+      <el-row class="head_card_row">
+        <el-col :span="5"
+          class="head_card_item">
+          <span class="button_title">当前设备:</span>
+          <el-select v-model="value"
+            placeholder="请选择"
+            @change="selectDevice">
+            <el-option v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-col>
 
-    <!--  顶部标题  -->
-    <div class="idx__top">
-      <img src="../assets/images/index/top_rectangle.png"
-        alt="rectangle"
-        class="idx__top__rectangle-left">
-      <img src="../assets/images/index/top_rectangle.png"
-        alt="rectangle"
-        class="idx__top__rectangle-right">
-      <img src="../assets/images/index/guang.png"
-        alt="light"
-        class="idx__top__light">
-      <div class="idx__top__title">
-        <span>X X X X 平台管理</span>
-      </div>
-    </div>
+        <el-col :span="4"
+          class="head_card_item">
+          <span class="button_title">当前设备状态:</span>
 
+          <el-tag type="success"
+            v-if="device.statue === 1">设备在线</el-tag>
 
+          <el-tag type="danger"
+            v-else-if="device.statue === 0">设备离线</el-tag>
+          <el-tag v-else>无设备</el-tag>
+        </el-col>
+
+        <el-col :span="5"
+          class="head_card_item">
+          <span class="button_title">当前设备经度:</span>
+          <span style="font-size: 17px;font-weight: bold;">{{ device.lon }}</span>
+        </el-col>
+
+        <el-col :span="5"
+          class="head_card_item">
+          <span class="button_title">当前设备纬度:</span>
+          <span style="font-size: 17px;font-weight: bold;">{{ device.lat }}</span>
+        </el-col>
+
+        <el-col :span="5"
+          class="head_card_item">
+          <span class="button_title">当前设备解算状态:</span>
+          <span style="font-size: 17px;font-weight: bold;">
+            <!-- 只有当 f 为 0 时,显示 "无效" -->
+            <span v-if="device.f === 0">无效</span>
+
+            <!-- 当 f 为 1 时,显示 "单点定位" -->
+            <span v-else-if="device.f === 1">单点定位</span>
+
+            <!-- 当 f 为 2 时,显示 "差分定位" -->
+            <span v-else-if="device.f === 2">差分定位</span>
+
+            <!-- 当 f 为 3 时,显示 "GPS PPS 模式" -->
+            <span v-else-if="device.f === 3">GPS PPS 模式</span>
+
+            <!-- 当 f 为 4 时,显示 "RTK Int" -->
+            <span v-else-if="device.f === 4">RTK Int</span>
+
+            <!-- 当 f 为 5 时,显示 "RTK Float" -->
+            <span v-else-if="device.f === 5">RTK Float</span>
+
+            <!-- 当 f 为 6 时,显示 "惯导模式" -->
+            <span v-else-if="device.f === 6">惯导模式</span>
+
+            <!-- 当 f 为 7 时,显示 "手动输入模式" -->
+            <span v-else-if="device.f === 7">手动输入模式</span>
+
+            <!-- 当 f 为 8 时,显示 "模拟器模式" -->
+            <span v-else-if="device.f === 8">模拟器模式</span>
+
+            <!-- 其他情况都显示 "无" -->
+            <span v-else>无</span>
+          </span>
+        </el-col>
+
+
+      </el-row>
+
+    </el-card>
+
+    <el-card class="map_card"
+      shadow="always">
+      <div id="mapContainer"
+        class="map"></div>
+
+    </el-card>
 
   </div>
 </template>
 
+<script>
+import api from "@/api/item/device";
+import AMapLoader from '@amap/amap-jsapi-loader';
+export default {
+  name: 'Home',
+  data() {
+    return {
+      map: null,                   // 地图实例
+      options: [],                 // 设备选项
+      value: '',                   // 设备值
+      device: [],                  // 设备数据
+      marker: null,                // 标记点
+    };
+  },
+
+  mounted() {
+    this.initMap();
+    this.getOptions();
+
+  },
+  methods: {
+    // 获取设备选项
+    getOptions() {
+      api.getDeviceOptions().then(res => {
+        console.log(res.data);
+        this.options = res.data;
+      })
+    },
+
+    // 选择设备
+    selectDevice(val) {
+      console.log(val);
+      api.getDeviceData(val).then(res => {
+        console.log(res.data);
+        this.device = res.data;
+        this.drawMarkers(res.data);
+      })
+
+    },
+
+    // 绘制点标记
+    drawMarkers(device) {
+      console.log(this.marker);
+
+      let image = ''
+      if (this.marker) {
+        this.map.remove(this.marker);
+        this.marker = null;
+      }
+
+      if (device.statue === 1) {
+        image = 'https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png'
+      } else {
+        image = 'https://webapi.amap.com/theme/v1.3/markers/n/mark_r.png'
+      }
+
+      this.marker = new AMap.Marker({
+        map: this.map,
+        position: [device.lon, device.lat],
+        icon: new AMap.Icon({
+          size: new AMap.Size(30, 30),
+          image: image,
+          imageOffset: new AMap.Pixel(0, 0)
+        })
+      });
+      this.marker.on("click", () => {
+        console.log(device);
+        this.$router.push({ path: '/outdoor', query: { id: device.id, deviceId: device.deviceid } })   // 跳转到详情页
+      })
+      this.map.setCenter([device.lon, device.lat]);
+    },
+
+
+    // 初始化地图
+    initMap() {
+      AMapLoader.load({
+        key: "577ee62b1059d73852c20c1f37638659",
+        version: "2.0",
+        plugins: ['AMap.Marker', 'AMap.InfoWindow', 'AMap.Polygon', 'AMap.Icon'], // 需要使用的插件列表
+      }).then((AMap) => {
+        /*初始化地图*/
+        this.map = new AMap.Map("mapContainer", { //设置地图容器id
+          layers: [
+            // 路网
+            // new AMap.TileLayer.RoadNet(),
+          ],
+          center: [116.3912, 39.9062],
+          zoom: 12
+        });
+
+      }).catch(e => {
+        console.log(e)
+      })
+    },
+  }
+}
+</script>
 
 <style scoped lang="scss">
 .home {
   width: 100%;
   height: 100%;
-  padding: 0;
-  background-color: wheat;
-  overflow: hidden;
+  padding: 15px;
+  background-color: #ffffff;
 }
 
-.idx__top {
-  overflow: hidden;
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: 99;
-  width: 100%;
-  height: 75px;
-  background: rgba(3, 30, 51, .9);
-
-  &__rectangle-left {
-    position: absolute;
-    top: 8px;
-    left: 10%;
-    width: 140px;
-    height: 6px;
-  }
+.button_title {
+  font-family: '微软雅黑';
+  font-size: 16px;
+  margin-right: 10px;
+}
 
-  &__rectangle-right {
-    position: absolute;
-    top: 8px;
-    right: 10%;
-    width: 140px;
-    height: 6px;
-  }
+.head_card {
+  margin-bottom: 10px;
+  height: 75px;
 
-  &__light {
-    position: absolute;
-    left: 50%;
-    margin-left: -140px;
-    bottom: -17px;
-    width: 280px;
-    height: 56px;
+  &_row {
+    display: flex;
+    align-items: center;
+    /* 垂直居中所有列 */
   }
 
-  &__title {
-    text-align: center;
-    width: 100%;
-    margin-top: 10px;
-    height: 55px;
-    background: url("../assets/images/index/top.41ada94a.png") no-repeat;
-    background-size: 100% 100%;
-
-    & span {
-      text-align: center;
-      font-size: 30px;
-      font-weight: 900;
-      line-height: 55px;
-      background: linear-gradient(92deg, #0072ff, #00eaff 48.8525390625%, #01aaff);
-      -webkit-background-clip: text;
-      -webkit-text-fill-color: transparent;
-    }
-
+  &_item {
+    display: flex;
+    align-items: center;
+    /* 垂直居中 */
+    justify-content: flex-start;
+    /* 水平居中,视需要而定 */
+    height: 100%;
+    /* 确保有足够的高度 */
   }
 }
 
+.map_card {
+  position: relative;
+  height: calc(100% - 80px);
+  width: 100%;
+}
 
-::v-deep .dv-border-box-13 .border-box-content {
-  padding-top: 50px !important;
+.map {
+  position: absolute;
+  width: 98%;
+  height: 95%
 }
 </style>

+ 485 - 0
src/views/item/echart.vue

@@ -0,0 +1,485 @@
+<template>
+  <div style="width: 100%;height: 100%;padding: 15px;">
+
+    <el-card class="head_card"
+      shadow="always">
+      <el-row class="head_card_row">
+        <el-col :span="6"
+          class="head_card_item">
+          <span class="button_title">当前设备:</span>
+          <el-select v-model="value"
+            placeholder="请选择"
+            @change="selectDevice">
+            <el-option v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-col>
+
+        <el-col :span="6"
+          class="head_card_item">
+          <span class="button_title">当前设备状态:</span>
+
+          <el-tag type="success"
+            v-if="device.statue === 1">设备在线</el-tag>
+
+          <el-tag type="danger"
+            v-else-if="device.statue === 0">设备离线</el-tag>
+          <el-tag v-else>无设备</el-tag>
+        </el-col>
+
+        <el-col :span="4"
+          class="head_card_item">
+          <span class="button_title">当前设备X坐标:</span>
+          <span style="font-size: 17px;font-weight: bold;">{{ device.x }}</span>
+        </el-col>
+        <el-col :span="4"
+          class="head_card_item">
+          <span class="button_title">当前设备Y坐标:</span>
+          <span style="font-size: 17px;font-weight: bold;">{{ device.y }}</span>
+        </el-col>
+        <el-col :span="4"
+          class="head_card_item">
+          <span class="button_title">当前设备Z坐标:</span>
+          <span style="font-size: 17px;font-weight: bold;">{{ device.z }}</span>
+        </el-col>
+      </el-row>
+
+    </el-card>
+
+
+
+    <el-card class="echart_card">
+
+
+      <!-- 图例 -->
+      <div class="tips">
+        <el-card class="box-card">
+          <div class="legend-item">
+            <div class="color-box"
+              style="background-color: #7CFC00;"></div>
+            <span>展 示 柜</span>
+          </div>
+          <div class="legend-item">
+            <div class="color-box"
+              style="background-color: #f7b500;"></div>
+            <span>办 公 桌</span>
+          </div>
+          <div class="legend-item">
+            <div class="color-box"
+              style="background-color: #000000;"></div>
+            <span>定 位 器</span>
+          </div>
+        </el-card>
+      </div>
+
+      <!-- 室内俯视图 -->
+      <div ref="echart"
+        id="echart"></div>
+
+    </el-card>
+
+
+  </div>
+
+</template>
+
+<script>
+import api from "@/api/item/device";
+import * as echarts from 'echarts';
+
+export default {
+  data() {
+    return {
+      device: [],
+      options: [],
+      value: '',
+      deviceId: '',
+      coordinateData: [], // 坐标数据
+    }
+  },
+  mounted() {
+    this.checkRoute(this.$route.query.id, this.$route.query.deviceId);
+    this.initEchart();
+    this.getOptions();
+    this.getCoordinateData()
+    console.log(this.value);
+
+    setInterval(() => {
+      if (this.value != null && this.value != '') {
+        this.selectDevice(this.value); // 定时刷新当前设备数据
+        this.getCoordinateData(); // 定时刷新坐标数据
+      }
+    }, 1000)
+  },
+
+  methods: {
+    // 路由跳转判断
+    checkRoute(value, v2) {
+      console.log(value);
+
+      if (value != null) {
+        this.value = value;
+        this.deviceId = v2;
+        this.selectDevice(value);
+      }
+    },
+
+    // 获取设备选项
+    getOptions() {
+      api.getDeviceOptions().then(res => {
+        console.log(res.data);
+
+        this.options = res.data;
+      })
+    },
+    // 选择设备
+    selectDevice(id) {
+      api.getDeviceData(id).then(res => {
+        console.log(res.data);
+        this.device = res.data;
+        this.deviceId = res.data.deviceid;  // 获取选中的设备ID
+
+        this.updateEchartData(); // 更新ECharts图表数据
+      })
+    },
+
+    // 获取坐标
+    getCoordinateData() {
+      api.getCoordinateData().then(res => {
+        console.log(res.data);
+        // 过滤出statue为0的坐标数据
+        this.coordinateData = res.data.filter(item => item.statue === 1);
+        this.updateEchartData(); // 更新ECharts图表数据
+      });
+    },
+
+
+    // 更新ECharts图表数据
+    updateEchartData() {
+      console.log('Device:', this.device);  // 查看设备数据
+      console.log('Coordinate Data:', this.coordinateData);  // 查看坐标数据
+
+
+
+      // 获取选中的设备的 deviceid
+      const selectedDeviceId = this.deviceId;
+
+      // 扩展 coordinatePoints 数据为包含 deviceid 和颜色的对象
+      const coordinatePoints = this.coordinateData.map(item => ({
+        value: [item.coordinate[0] * 100, item.coordinate[1] * 100],  // 将 x 和 y 坐标都乘以 100     
+        deviceid: item.deviceid,
+        symbol: item.deviceid === selectedDeviceId
+          ? 'image://' + require('@/assets/png/device-selected.png')  // 选中设备时显示的图片
+          : 'image://' + require('@/assets/png/device.png'),           // 默认设备显示的图片
+      }));
+
+      // 直接更新系列数据
+      this.echart.setOption({
+        series: [
+          {
+            name: '设备坐标',
+            type: 'scatter',
+            data: coordinatePoints,
+            symbolSize: 30,
+            symbol: coordinatePoints.map(item => item.symbol),
+          }
+        ]
+      }, false); // 加上 false 确保重新渲染
+    },
+
+
+
+    // 初始化ECharts
+    initEchart() {
+      this.echart = echarts.init(this.$refs.echart);
+      console.log(11);
+
+      this.echart.setOption(this.getOption());
+
+    },
+
+    // 获取ECharts图表配置
+    getOption() {
+      var option = {
+        grid: {
+          left: '12%',  // 设定左边距为容器宽度的10%
+          right: '3%', // 设定右边距为容器宽度的10%
+          top: '5%',     // 设定上边距为容器高度的5%
+          bottom: '5%'   // 设定下边距为容器高度的5%
+        },
+        tooltip: {
+          trigger: 'item', // 设置触发方式为 item (即每个点)
+          formatter: function (params) {
+            if (params.seriesName !== '设备坐标')
+              return
+
+            // 你可以定制提示框的内容
+            const { deviceid, value } = params.data;
+            return `设备ID: ${deviceid}<br>设备坐标: (${value[0]}, ${value[1]})`;
+          }
+        },
+        title: {
+          text: '室内俯视图',
+          left: 'center'
+        },
+        xAxis: {
+          type: 'value',
+          min: 0,
+          max: 850, // x轴的最大值
+          splitLine: {
+            show: false,
+            lineStyle: {
+              type: 'dashed'
+            }
+          },
+          splitNumber: 2, // 设置分割数为2,通常与formatter配合使用
+          axisLabel: {
+            formatter: function (value) {
+              return value === 0 || value === 850 ? value : ''; // 仅显示0和最大值
+            },
+            interval: 0 // 显示指定刻度,不受默认的自动分割控制
+          }
+        },
+        yAxis: {
+          type: 'value',
+          min: 0,
+          max: 870, // y轴的最大值
+          splitLine: {
+            show: false,
+            lineStyle: {
+              type: 'dashed'
+            }
+          },
+          axisLabel: {
+            formatter: function (value) {
+              return value === 0 || value === 870 ? value : ''; // 仅显示0和最大值
+            },
+            interval: 0 // 显示指定刻度
+          }
+        },
+        series: [
+          { data: [10.304, 2.345], symbolSize: 10, type: 'scatter' },
+          {
+            data: [
+              [0, 0],
+              [0, 870],
+              [850, 870],
+              [850, 0],
+              [0, 0]
+            ],
+            symbolSize: 0,
+            type: 'line'
+          },
+          {
+            data: [
+              [870, 550],
+              [265, 550],
+              [265, 870]
+            ],
+            symbolSize: 0,
+            type: 'line'
+          },
+          {
+            data: [
+              [0, 870],
+              [35, 870],
+              [35, 230],
+              [0, 230],
+              [0, 870],
+            ],
+            symbolSize: 0,
+            type: 'line', // 矩形边框
+            areaStyle: {
+              color: '#7CFC00', // 填充颜色
+              opacity: 0.5   // 填充透明度
+            },
+            lineStyle: {
+              show: false,
+              opacity: 0
+            }
+          },
+
+          {
+            data: [
+              [265, 605],
+              [195, 605],
+              [195, 765],
+              [265, 765],
+              [265, 605],
+            ],
+            symbolSize: 0,
+            type: 'line', // 矩形边框
+            areaStyle: {
+              color: '#f7b500', // 填充颜色
+              opacity: 0.5   // 填充透明度
+            },
+            lineStyle: {
+              show: false,
+              opacity: 0
+            }
+          },
+
+          {
+            data: [
+              [35, 0], // 左上角
+              [35, 230], // 右上角
+              [105, 230], // 右下角
+              [105, 110], // 左下角
+              [195, 110], // 左下角
+              [195, 0], // 左下角
+            ],
+            symbolSize: 0,
+            type: 'line', // 矩形边框
+            areaStyle: {
+              color: '#f7b500', // 填充颜色
+              opacity: 0.5   // 填充透明度
+            },
+            lineStyle: {
+              show: false,
+              opacity: 0
+            }
+          },
+          {
+            data: [
+              [460, 790], // 左上角
+              [700, 790], // 右上角
+              [700, 665], // 右下角
+              [460, 665], // 左下角
+              [460, 790]  // 闭合路径
+            ],
+            symbolSize: 0,
+            type: 'line', // 矩形边框
+            areaStyle: {
+              color: '#f7b500', // 填充颜色
+              opacity: 0.5   // 填充透明度
+            },
+            lineStyle: {
+              show: false,
+              opacity: 0
+            }
+          },
+          {
+            data: [
+              [640, 420], // 左上角
+              [760, 420], // 右上角
+              [760, 60], // 右下角
+              [640, 60], // 左下角
+              [640, 420]  // 闭合路径
+            ],
+            symbolSize: 0,
+            type: 'line', // 矩形边框
+            areaStyle: {
+              color: '#f7b500', // 填充颜色
+              opacity: 0.5   // 填充透明度
+            },
+            lineStyle: {
+              show: false,
+              opacity: 0
+            }
+          },
+          {
+            data: [
+              [370, 420], // 左上角
+              [490, 420], // 右上角
+              [490, 60], // 右下角
+              [370, 60], // 左下角
+              [370, 420]  // 闭合路径
+            ],
+            symbolSize: 0,
+            type: 'line', // 矩形边框
+            areaStyle: {
+              color: '#f7b500', // 填充颜色
+              opacity: 0.5   // 填充透明度
+            },
+            lineStyle: {
+              show: false,
+              opacity: 0
+            }
+          },
+          {
+            name: "gnss",
+            type: "scatter",
+            data: [
+              [0, 0],
+              [850, 550],
+              [850, 0],
+              [0, 550]
+            ],
+            symbol: "rect",
+            color: "black",
+            symbolSize: 20,
+          },
+
+        ],
+
+      };
+
+      return option;
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+#echart {
+  position: absolute;
+  height: 95%;
+  width: 95%;
+
+}
+
+.echart_card {
+  position: relative;
+  height: calc(100% - 80px);
+  width: 100%;
+}
+
+.head_card {
+  margin-bottom: 10px;
+  height: 75px;
+
+  &_row {
+    display: flex;
+    align-items: center;
+    /* 垂直居中所有列 */
+  }
+
+  &_item {
+    display: flex;
+    align-items: center;
+    /* 垂直居中 */
+    justify-content: flex-start;
+    /* 水平居中,视需要而定 */
+    height: 100%;
+    /* 确保有足够的高度 */
+  }
+}
+
+.tips {
+  display: flex;
+  width: 160px;
+  flex-direction: column;
+  position: absolute;
+  left: 15px;
+  /* 调整图例的位置 */
+  top: 50px;
+  padding: 10px;
+
+}
+
+.legend-item {
+  display: flex;
+  align-items: center;
+  margin: 15px 0;
+
+}
+
+.color-box {
+  width: 20px;
+  height: 20px;
+  margin-right: 10px;
+}
+</style>

+ 1 - 1
src/views/login.vue

@@ -4,7 +4,7 @@
       :model="loginForm"
       :rules="loginRules"
       class="login-form">
-      <h3 class="title">北斗卫星信号增强系统管理平台</h3>
+      <h3 class="title">UWB+北斗高精度室内外一体化融合分系统展示平台软件</h3>
       <el-form-item prop="username">
         <el-input v-model="loginForm.username"
           type="text"

+ 497 - 396
src/views/system/user/index.vue

@@ -2,135 +2,279 @@
   <div class="app-container">
     <el-row :gutter="20">
       <!--部门数据-->
-      <el-col :span="4" :xs="24">
+      <el-col :span="4"
+        :xs="24">
         <div class="head-container">
-          <el-input v-model="deptName" placeholder="请输入部门名称" clearable size="small" prefix-icon="el-icon-search" style="margin-bottom: 20px"/>
+          <el-input v-model="deptName"
+            placeholder="请输入部门名称"
+            clearable
+            size="small"
+            prefix-icon="el-icon-search"
+            style="margin-bottom: 20px" />
         </div>
         <div class="head-container">
-          <el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false" :filter-node-method="filterNode" ref="tree" node-key="id" default-expand-all highlight-current @node-click="handleNodeClick"/>
+          <el-tree :data="deptOptions"
+            :props="defaultProps"
+            :expand-on-click-node="false"
+            :filter-node-method="filterNode"
+            ref="tree"
+            node-key="id"
+            default-expand-all
+            highlight-current
+            @node-click="handleNodeClick" />
         </div>
       </el-col>
       <!--用户数据-->
-      <el-col :span="20" :xs="24">
-        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-          <el-form-item label="用户名称" prop="userName">
-            <el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px" @keyup.enter.native="handleQuery"/>
+      <el-col :span="20"
+        :xs="24">
+        <el-form :model="queryParams"
+          ref="queryForm"
+          size="small"
+          :inline="true"
+          v-show="showSearch"
+          label-width="68px">
+          <el-form-item label="用户名称"
+            prop="userName">
+            <el-input v-model="queryParams.userName"
+              placeholder="请输入用户名称"
+              clearable
+              style="width: 240px"
+              @keyup.enter.native="handleQuery" />
           </el-form-item>
-          <el-form-item label="手机号码" prop="phonenumber">
-            <el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 240px" @keyup.enter.native="handleQuery"/>
+          <el-form-item label="手机号码"
+            prop="phonenumber">
+            <el-input v-model="queryParams.phonenumber"
+              placeholder="请输入手机号码"
+              clearable
+              style="width: 240px"
+              @keyup.enter.native="handleQuery" />
           </el-form-item>
-          <el-form-item label="状态" prop="status">
-            <el-select v-model="queryParams.status" placeholder="用户状态" clearable style="width: 240px">
-              <el-option v-for="dict in dict.type.sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value"/>
+          <el-form-item label="状态"
+            prop="status">
+            <el-select v-model="queryParams.status"
+              placeholder="用户状态"
+              clearable
+              style="width: 240px">
+              <el-option v-for="dict in dict.type.sys_normal_disable"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value" />
             </el-select>
           </el-form-item>
           <el-form-item label="创建时间">
-            <el-date-picker v-model="dateRange" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
+            <el-date-picker v-model="dateRange"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"></el-date-picker>
           </el-form-item>
           <el-form-item>
-            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+            <el-button type="primary"
+              icon="el-icon-search"
+              size="mini"
+              @click="handleQuery">搜索</el-button>
+            <el-button icon="el-icon-refresh"
+              size="mini"
+              @click="resetQuery">重置</el-button>
           </el-form-item>
         </el-form>
 
-        <el-row :gutter="10" class="mb8">
+        <el-row :gutter="10"
+          class="mb8">
           <el-col :span="1.5">
-            <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:user:add']">新增</el-button>
+            <el-button type="primary"
+              plain
+              icon="el-icon-plus"
+              size="mini"
+              @click="handleAdd"
+              v-hasPermi="['system:user:add']">新增</el-button>
           </el-col>
 
           <el-col :span="1.5">
-            <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" v-hasPermi="['system:user:remove']">删除</el-button>
+            <el-button type="danger"
+              plain
+              icon="el-icon-delete"
+              size="mini"
+              :disabled="multiple"
+              @click="handleDelete"
+              v-hasPermi="['system:user:remove']">删除</el-button>
           </el-col>
 
         </el-row>
 
-        <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
-          <el-table-column type="selection" width="50" align="center"/>
-          <el-table-column label="用户编号" align="center" key="userId" prop="userId"/>
-          <el-table-column label="用户名称" align="center" key="userName" prop="userName" :show-overflow-tooltip="true"/>
-          <el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" :show-overflow-tooltip="true"/>
-          <el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" :show-overflow-tooltip="true"/>
-          <el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" width="120"/>
+        <el-table v-loading="loading"
+          :data="userList"
+          @selection-change="handleSelectionChange">
+          <el-table-column type="selection"
+            width="50"
+            align="center" />
+          <el-table-column label="用户编号"
+            align="center"
+            key="userId"
+            prop="userId" />
+          <el-table-column label="用户名称"
+            align="center"
+            key="userName"
+            prop="userName"
+            :show-overflow-tooltip="true" />
+          <el-table-column label="用户昵称"
+            align="center"
+            key="nickName"
+            prop="nickName"
+            :show-overflow-tooltip="true" />
+          <el-table-column label="部门"
+            align="center"
+            key="deptName"
+            prop="dept.deptName"
+            :show-overflow-tooltip="true" />
+          <el-table-column label="手机号码"
+            align="center"
+            key="phonenumber"
+            prop="phonenumber"
+            width="120" />
 
-          <el-table-column label="状态" align="center" key="status">
+          <el-table-column label="状态"
+            align="center"
+            key="status">
             <template slot-scope="scope">
-              <el-switch v-model="scope.row.status" active-value="0" inactive-value="1"
-                         @change="handleStatusChange(scope.row)"></el-switch>
+              <el-switch v-model="scope.row.status"
+                active-value="0"
+                inactive-value="1"
+                @change="handleStatusChange(scope.row)"></el-switch>
             </template>
           </el-table-column>
 
-          <el-table-column label="创建时间" align="center" prop="createTime" width="160">
+          <el-table-column label="创建时间"
+            align="center"
+            prop="createTime"
+            width="160">
             <template slot-scope="scope"><span>{{ parseTime(scope.row.createTime) }}</span></template>
           </el-table-column>
 
-          <el-table-column label="操作" align="center" width="250" class-name="small-padding fixed-width">
-            <template slot-scope="scope" v-if="scope.row.userId !== 1">
-              <el-button size="mini" type="text" icon="el-icon-connection" @click="handleBind(scope.row)" v-hasPermi="['system:user:edit']">{{ isBind.includes(scope.row.userName) ? '解绑' : '绑定' }}</el-button>
-              <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:user:edit']">修改</el-button>
-              <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['system:user:remove']">删除</el-button>
-              <el-button size="mini" type="text" icon="el-icon-key" @click="handleResetPwd(scope.row)" v-hasPermi="['system:user:resetPwd']">重置密码</el-button>
+          <el-table-column label="操作"
+            align="center"
+            width="250"
+            class-name="small-padding fixed-width">
+            <template slot-scope="scope"
+              v-if="scope.row.userId !== 1">
+
+              <el-button size="mini"
+                type="text"
+                icon="el-icon-edit"
+                @click="handleUpdate(scope.row)"
+                v-hasPermi="['system:user:edit']">修改</el-button>
+              <el-button size="mini"
+                type="text"
+                icon="el-icon-delete"
+                @click="handleDelete(scope.row)"
+                v-hasPermi="['system:user:remove']">删除</el-button>
+              <el-button size="mini"
+                type="text"
+                icon="el-icon-key"
+                @click="handleResetPwd(scope.row)"
+                v-hasPermi="['system:user:resetPwd']">重置密码</el-button>
             </template>
           </el-table-column>
 
         </el-table>
 
-        <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList"/>
+        <pagination v-show="total > 0"
+          :total="total"
+          :page.sync="queryParams.pageNum"
+          :limit.sync="queryParams.pageSize"
+          @pagination="getList" />
       </el-col>
     </el-row>
 
     <!-- 添加或修改用户配置对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+    <el-dialog :title="title"
+      :visible.sync="open"
+      width="600px"
+      append-to-body>
+      <el-form ref="form"
+        :model="form"
+        :rules="rules"
+        label-width="80px">
         <el-row>
           <el-col :span="12">
-            <el-form-item label="用户昵称" prop="nickName">
-              <el-input v-model="form.nickName" placeholder="请输入用户昵称" maxlength="30"/>
+            <el-form-item label="用户昵称"
+              prop="nickName">
+              <el-input v-model="form.nickName"
+                placeholder="请输入用户昵称"
+                maxlength="30" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="归属部门" prop="deptId">
-              <treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" placeholder="请选择归属部门"/>
+            <el-form-item label="归属部门"
+              prop="deptId">
+              <treeselect v-model="form.deptId"
+                :options="deptOptions"
+                :show-count="true"
+                placeholder="请选择归属部门" />
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="12">
-            <el-form-item label="手机号码" prop="phonenumber">
-              <el-input v-model="form.phonenumber" placeholder="请输入手机号码" maxlength="11"/>
+            <el-form-item label="手机号码"
+              prop="phonenumber">
+              <el-input v-model="form.phonenumber"
+                placeholder="请输入手机号码"
+                maxlength="11" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item label="邮箱" prop="email">
-              <el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50"/>
+            <el-form-item label="邮箱"
+              prop="email">
+              <el-input v-model="form.email"
+                placeholder="请输入邮箱"
+                maxlength="50" />
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="12">
-            <el-form-item v-if="form.userId == undefined" label="用户名称" prop="userName">
-              <el-input v-model="form.userName" placeholder="请输入用户名称" maxlength="30"/>
+            <el-form-item v-if="form.userId == undefined"
+              label="用户名称"
+              prop="userName">
+              <el-input v-model="form.userName"
+                placeholder="请输入用户名称"
+                maxlength="30" />
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
-              <el-input v-model="form.password" placeholder="请输入用户密码" type="password" maxlength="20" show-password/>
+            <el-form-item v-if="form.userId == undefined"
+              label="用户密码"
+              prop="password">
+              <el-input v-model="form.password"
+                placeholder="请输入用户密码"
+                type="password"
+                maxlength="20"
+                show-password />
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="12">
             <el-form-item label="用户性别">
-              <el-select v-model="form.sex" placeholder="请选择性别">
-                <el-option v-for="dict in dict.type.sys_user_sex" :key="dict.value" :label="dict.label"
-                           :value="dict.value"></el-option>
+              <el-select v-model="form.sex"
+                placeholder="请选择性别">
+                <el-option v-for="dict in dict.type.sys_user_sex"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"></el-option>
               </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="状态">
               <el-radio-group v-model="form.status">
-                <el-radio v-for="dict in dict.type.sys_normal_disable" :key="dict.value"
-                          :label="dict.value">{{dict.label}}
+                <el-radio v-for="dict in dict.type.sys_normal_disable"
+                  :key="dict.value"
+                  :label="dict.value">{{ dict.label
+                  }}
                 </el-radio>
               </el-radio-group>
             </el-form-item>
@@ -139,8 +283,14 @@
         <el-row>
           <el-col :span="12">
             <el-form-item label="角色">
-              <el-select v-model="form.roleIds" multiple placeholder="请选择角色">
-                <el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName" :value="item.roleId" :disabled="item.status == 1"></el-option>
+              <el-select v-model="form.roleIds"
+                multiple
+                placeholder="请选择角色">
+                <el-option v-for="item in roleOptions"
+                  :key="item.roleId"
+                  :label="item.roleName"
+                  :value="item.roleId"
+                  :disabled="item.status == 1"></el-option>
               </el-select>
             </el-form-item>
           </el-col>
@@ -148,373 +298,324 @@
         <el-row>
           <el-col :span="24">
             <el-form-item label="备注">
-              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
+              <el-input v-model="form.remark"
+                type="textarea"
+                placeholder="请输入内容"></el-input>
             </el-form-item>
           </el-col>
         </el-row>
       </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
+      <div slot="footer"
+        class="dialog-footer">
+        <el-button type="primary"
+          @click="submitForm">确 定</el-button>
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
-    <!-- 选择绑定用户配置对话框 -->
-    <el-dialog :title="title2" :visible.sync="open2" width="500px" append-to-body>
-        <el-select v-model="selectedValue" @change="handleItemClick">
-            <el-option v-for="(item, index) in vxUsers" :key="index" :value="item">
-                {{ item }}
-            </el-option>
-        </el-select>
-        <div slot="footer" class="dialog-footer">
-            <el-button type="primary" @click="submitForm2">确 定</el-button>
-            <el-button @click="cancel2">取 消</el-button>
-        </div>
-    </el-dialog>
+
   </div>
 </template>
 
 <script>
-  import {addUser, changeUserStatus, delUser, deptTreeSelect, getUser, listUser, resetUserPwd, updateUser} from "@/api/system/user";
-  import vxuserApi from '@/api/system/vxuser';
-  import Treeselect from "@riophae/vue-treeselect";
-  import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+import { addUser, changeUserStatus, delUser, deptTreeSelect, getUser, listUser, resetUserPwd, updateUser } from "@/api/system/user";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 
-  export default {
-    name: "User",
-    dicts: ['sys_normal_disable', 'sys_user_sex'],
-    components: {
-      Treeselect
-    },
-    data() {
-      return {
-        // 遮罩层
-        loading: true,
-        // 选中数组
-        ids: [],
-        // 非单个禁用
-        single: true,
-        // 非多个禁用
-        multiple: true,
-        // 显示搜索条件
-        showSearch: true,
-        // 总条数
-        total: 0,
-        // 用户表格数据
-        userList: null,
-        // 弹出层标题
-        title: "",
-        // 部门树选项
-        deptOptions: undefined,
-        // 是否显示弹出层
-        open: false,
-        // 弹出层标题
-        title2: "",
-        // 是否显示弹出层
-        open2: false,
-        // 部门名称
-        deptName: undefined,
-        // 默认密码
-        initPassword: undefined,
-        // 日期范围
-        dateRange: [],
-        // 角色选项
-        roleOptions: [],
-        // 表单参数
-        form: {},
-        defaultProps: {
-          children: "children",
-          label: "label"
+export default {
+  name: "User",
+  dicts: ['sys_normal_disable', 'sys_user_sex'],
+  components: {
+    Treeselect
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 用户表格数据
+      userList: null,
+      // 弹出层标题
+      title: "",
+      // 部门树选项
+      deptOptions: undefined,
+      // 是否显示弹出层
+      open: false,
+      // 弹出层标题
+      title2: "",
+      // 是否显示弹出层
+      open2: false,
+      // 部门名称
+      deptName: undefined,
+      // 默认密码
+      initPassword: undefined,
+      // 日期范围
+      dateRange: [],
+      // 角色选项
+      roleOptions: [],
+      // 表单参数
+      form: {},
+      defaultProps: {
+        children: "children",
+        label: "label"
+      },
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        userName: undefined,
+        phonenumber: undefined,
+        status: undefined,
+        deptId: undefined
+      },
+      //查询是否绑定
+      isBind: [],
+      //当前绑定的vx用户
+      vxUser: undefined,
+      //未绑定的vx用户
+      //选中的数据
+      selectedValue: "请选择要绑定的用户",
+      //当前要绑定的系统用户
+      bindUser: undefined,
+      // 表单校验
+      rules: {
+        userName: [{
+          required: true,
+          message: "用户名称不能为空",
+          trigger: "blur"
         },
-        // 查询参数
-        queryParams: {
-          pageNum: 1,
-          pageSize: 10,
-          userName: undefined,
-          phonenumber: undefined,
-          status: undefined,
-          deptId: undefined
+        {
+          min: 2,
+          max: 20,
+          message: '用户名称长度必须介于 2 和 20 之间',
+          trigger: 'blur'
+        }
+        ],
+        nickName: [{
+          required: true,
+          message: "用户昵称不能为空",
+          trigger: "blur"
+        }],
+        password: [{
+          required: true,
+          message: "用户密码不能为空",
+          trigger: "blur"
         },
-        //查询是否绑定
-        isBind: [],
-        //当前绑定的vx用户
-        vxUser: undefined,
-        //未绑定的vx用户
-        vxUsers: [],
-        //选中的数据
-        selectedValue: "请选择要绑定的用户",
-        //当前要绑定的系统用户
-        bindUser: undefined,
-        // 表单校验
-        rules: {
-          userName: [{
-            required: true,
-            message: "用户名称不能为空",
-            trigger: "blur"
-          },
-            {
-              min: 2,
-              max: 20,
-              message: '用户名称长度必须介于 2 和 20 之间',
-              trigger: 'blur'
-            }
-          ],
-          nickName: [{
-            required: true,
-            message: "用户昵称不能为空",
-            trigger: "blur"
-          }],
-          password: [{
-            required: true,
-            message: "用户密码不能为空",
-            trigger: "blur"
-          },
-            {
-              min: 5,
-              max: 20,
-              message: '用户密码长度必须介于 5 和 20 之间',
-              trigger: 'blur'
-            }
-          ],
-          email: [{
-            type: "email",
-            message: "请输入正确的邮箱地址",
-            trigger: ["blur", "change"]
-          }],
-          phonenumber: [{
-            pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
-            message: "请输入正确的手机号码",
-            trigger: "blur"
-          }]
+        {
+          min: 5,
+          max: 20,
+          message: '用户密码长度必须介于 5 和 20 之间',
+          trigger: 'blur'
         }
-      };
-    },
-    watch: {
-      // 根据名称筛选部门树
-      deptName(val) {
-        this.$refs.tree.filter(val);
+        ],
+        email: [{
+          type: "email",
+          message: "请输入正确的邮箱地址",
+          trigger: ["blur", "change"]
+        }],
+        phonenumber: [{
+          pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
+          message: "请输入正确的手机号码",
+          trigger: "blur"
+        }]
       }
+    };
+  },
+  watch: {
+    // 根据名称筛选部门树
+    deptName(val) {
+      this.$refs.tree.filter(val);
+    }
+  },
+  created() {
+    this.getList();
+    this.getDeptTree();
+    this.getConfigKey("sys.user.initPassword").then(response => {
+      this.initPassword = response.msg;
+    });
+  },
+  methods: {
+    /** 查询用户列表 */
+    getList() {
+      //查询是否绑定vx用户
+
+      this.loading = true;
+      listUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
+        this.userList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    /** 查询部门下拉树结构 */
+    getDeptTree() {
+      deptTreeSelect().then(response => {
+        this.deptOptions = response.data;
+      });
+    },
+    // 筛选节点
+    filterNode(value, data) {
+      if (!value) return true;
+      return data.label.indexOf(value) !== -1;
+    },
+    // 节点单击事件
+    handleNodeClick(data) {
+      this.queryParams.deptId = data.id;
+      this.handleQuery();
+    },
+    // 用户状态修改
+    handleStatusChange(row) {
+      let text = row.status === "0" ? "启用" : "停用";
+      this.$modal.confirm('确认要"' + text + '""' + row.userName + '"用户吗?').then(function () {
+        return changeUserStatus(row.userId, row.status);
+      }).then(() => {
+        this.$modal.msgSuccess(text + "成功");
+      }).catch(function () {
+        row.status = row.status === "0" ? "1" : "0";
+      });
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false;
+      this.reset();
     },
-    created() {
+    // 表单重置
+    reset() {
+      this.form = {
+        userId: undefined,
+        deptId: undefined,
+        userName: undefined,
+        nickName: undefined,
+        password: undefined,
+        phonenumber: undefined,
+        email: undefined,
+        sex: undefined,
+        status: "0",
+        remark: undefined,
+        postIds: [],
+        roleIds: []
+      };
+      this.resetForm("form");
+    },
+
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
       this.getList();
-      this.getDeptTree();
-      this.getConfigKey("sys.user.initPassword").then(response => {
-        this.initPassword = response.msg;
+    },
+
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.dateRange = [];
+      this.resetForm("queryForm");
+      this.queryParams.deptId = undefined;
+      this.$refs.tree.setCurrentKey(null);
+      this.handleQuery();
+    },
+
+    /**
+     * 多选框选中数据
+     */
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.userId);
+      this.single = selection.length !== 1;
+      this.multiple = !selection.length;
+    },
+
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset();
+      getUser().then(response => {
+        this.roleOptions = response.data.roles;
+        this.open = true;
+        this.title = "添加用户";
+        this.form.password = this.initPassword;
       });
     },
-    methods: {
-      /** 查询用户列表 */
-      getList() {
-        //查询是否绑定vx用户
-        vxuserApi.getBindUser().then(response => {
-          this.isBind = response.data;
-        });
-        this.loading = true;
-        listUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
-          this.userList = response.rows;
-          this.total = response.total;
-          this.loading = false;
-        });
-        this.getVxUsers();
-      },
-      /** 查询部门下拉树结构 */
-      getDeptTree() {
-        deptTreeSelect().then(response => {
-          this.deptOptions = response.data;
-        });
-      },
-      // 筛选节点
-      filterNode(value, data) {
-        if (!value) return true;
-        return data.label.indexOf(value) !== -1;
-      },
-      // 节点单击事件
-      handleNodeClick(data) {
-        this.queryParams.deptId = data.id;
-        this.handleQuery();
-      },
-      // 用户状态修改
-      handleStatusChange(row) {
-        let text = row.status === "0" ? "启用" : "停用";
-        this.$modal.confirm('确认要"' + text + '""' + row.userName + '"用户吗?').then(function () {
-          return changeUserStatus(row.userId, row.status);
-        }).then(() => {
-          this.$modal.msgSuccess(text + "成功");
-        }).catch(function () {
-          row.status = row.status === "0" ? "1" : "0";
-        });
-      },
-      // 取消按钮
-      cancel() {
-        this.open = false;
-        this.reset();
-      },
-      // 表单重置
-      reset() {
-        this.form = {
-          userId: undefined,
-          deptId: undefined,
-          userName: undefined,
-          nickName: undefined,
-          password: undefined,
-          phonenumber: undefined,
-          email: undefined,
-          sex: undefined,
-          status: "0",
-          remark: undefined,
-          postIds: [],
-          roleIds: []
-        };
-        this.resetForm("form");
-      },
+    handleItemClick(item) {
+      this.selectedValue = item;
+    },
 
-      /** 搜索按钮操作 */
-      handleQuery() {
-        this.queryParams.pageNum = 1;
-        this.getList();
-      },
+    /** 绑定与解绑按钮操作 */
 
-      /** 重置按钮操作 */
-      resetQuery() {
-        this.dateRange = [];
-        this.resetForm("queryForm");
-        this.queryParams.deptId = undefined;
-        this.$refs.tree.setCurrentKey(null);
-        this.handleQuery();
-      },
+    // 取消按钮
 
-      /**
-       * 多选框选中数据
-       */
-      handleSelectionChange(selection) {
-        this.ids = selection.map(item => item.userId);
-        this.single = selection.length !== 1;
-        this.multiple = !selection.length;
-      },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset();
+      const userId = row.userId || this.ids;
+      getUser(userId).then(response => {
+        this.form = response.data.user;
+        this.roleOptions = response.data.roles;
+        this.$set(this.form, "roleIds", response.data.roleIds);
+        this.open = true;
+        this.title = "修改用户";
+        this.form.password = "";
+      });
+    },
 
-      /** 新增按钮操作 */
-      handleAdd() {
-        this.reset();
-        getUser().then(response => {
-          this.roleOptions = response.data.roles;
-          this.open = true;
-          this.title = "添加用户";
-          this.form.password = this.initPassword;
+    /**
+     *重置密码按钮操作
+     */
+    handleResetPwd(row) {
+      this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        closeOnClickModal: false,
+        inputPattern: /^.{5,20}$/,
+        inputErrorMessage: "用户密码长度必须介于 5 和 20 之间"
+      }).then(({ value }) => {
+        resetUserPwd(row.userId, value).then(response => {
+          this.$modal.msgSuccess("修改成功,新密码是:" + value);
         });
-      },
-      handleItemClick(item) {
-        this.selectedValue = item;
-      },
-      getVxUsers() {
-        vxuserApi.getVxUsers().then(response => {
-          this.vxUsers = response.data;
-        })
-      },
-      /** 绑定与解绑按钮操作 */
-      handleBind(row) {
-        if(this.isBind.includes(row.userName)){
-          //查询绑定的vx用户
-          vxuserApi.getVxUser(row.userName).then(response => {
-            this.vxUser = response.data;
-            this.$modal.confirm('是否确认解绑昵称为"' + this.vxUser + '"的vx用户?').then(function () {
-              //更新对应userName为空
-              return vxuserApi.setUserName(row.userName); 
-            }).then(() => {
+      }).catch(() => {
+      });
+    },
+
+    /**
+     * 提交按钮
+     */
+    submitForm: function () {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.userId != null) {
+            updateUser(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.open = false;
+              this.getList();
+            });
+          } else {
+            addUser(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.open = false;
               this.getList();
-              this.getVxUsers();
-              this.$modal.msgSuccess("解绑成功");
-            }).catch(() => {
             });
-          })
-        }else {
-          this.bindUser = row.userName;
-          this.open2 = true;
-          this.title2 = "绑定vx用户";
-        }
-      },
-      // 取消按钮
-      cancel2() {
-        this.open2 = false;
-      },
-      /** 提交按钮 */
-      submitForm2: function() {
-        const vxUser = this.selectedValue;
-        vxuserApi.setVxUser(vxUser,this.bindUser).then(response => {
-            this.$modal.msgSuccess("绑定成功");
-            this.open2 = false;
-            this.getList();
-            this.getVxUsers();
-            this.selectedValue = "请选择要绑定的用户";
-        });
-      },
-      /** 修改按钮操作 */
-      handleUpdate(row) {
-        this.reset();
-        const userId = row.userId || this.ids;
-        getUser(userId).then(response => {
-          this.form = response.data.user;
-          this.roleOptions = response.data.roles;
-          this.$set(this.form, "roleIds", response.data.roleIds);
-          this.open = true;
-          this.title = "修改用户";
-          this.form.password = "";
-        });
-      },
-
-      /**
-       *重置密码按钮操作
-       */
-      handleResetPwd(row) {
-        this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          closeOnClickModal: false,
-          inputPattern: /^.{5,20}$/,
-          inputErrorMessage: "用户密码长度必须介于 5 和 20 之间"
-        }).then(({value}) => {
-          resetUserPwd(row.userId, value).then(response => {
-            this.$modal.msgSuccess("修改成功,新密码是:" + value);
-          });
-        }).catch(() => {
-        });
-      },
-
-      /**
-       * 提交按钮
-       */
-      submitForm: function () {
-        this.$refs["form"].validate(valid => {
-          if (valid) {
-            if (this.form.userId != null) {
-              updateUser(this.form).then(response => {
-                this.$modal.msgSuccess("修改成功");
-                this.open = false;
-                this.getList();
-              });
-            } else {
-              addUser(this.form).then(response => {
-                this.$modal.msgSuccess("新增成功");
-                this.open = false;
-                this.getList();
-              });
-            }
           }
-        });
-      },
+        }
+      });
+    },
 
-      /**
-       * 删除按钮操作
-       */
-      handleDelete(row) {
-        const userIds = row.userId || this.ids;
-        this.$modal.confirm('是否确认删除用户编号为"' + userIds + '"的数据项?').then(function () {
-          return delUser(userIds);
-        }).then(() => {
-          this.getList();
-          this.$modal.msgSuccess("删除成功");
-        }).catch(() => {
-        });
-      },
+    /**
+     * 删除按钮操作
+     */
+    handleDelete(row) {
+      const userIds = row.userId || this.ids;
+      this.$modal.confirm('是否确认删除用户编号为"' + userIds + '"的数据项?').then(function () {
+        return delUser(userIds);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {
+      });
+    },
 
-    }
-  };
+  }
+};
 </script>

+ 4 - 4
vue.config.js

@@ -7,9 +7,9 @@ function resolve(dir) {
 
 const CompressionPlugin = require("compression-webpack-plugin");
 
-const name = process.env.VUE_APP_TITLE || "北斗卫星信号增强系统管理平台"; // 网页标题
+const name = process.env.VUE_APP_TITLE || "平台展示软件"; // 网页标题
 
-const port = process.env.port || process.env.npm_config_port || 80; // 端口
+const port = process.env.port || process.env.npm_config_port || 5437; // 端口
 
 // vue.config.js 配置说明
 //官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions
@@ -31,9 +31,9 @@ module.exports = {
     proxy: {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
-        // target: `http://192.168.1.100:8888`,
+        // target: `http://0.0.0.0:8888`,
         // target: `http://192.168.233.102:8080`,
-        target: "http://0.0.0.0:8888/",
+        target: "http://lq.ailishi.org:7051/",
         // target: "http://62.234.186.213:8082/",
 
         changeOrigin: true,