功能完善

public/index.html

@@ -8,8 +8,8 @@
   <link rel="icon" href="<%= BASE_URL %>favicon.ico">
   <title>智慧运营管理平台</title>
 
-  <link rel="stylesheet" href="/css/all_page_loading.css">
-  <link rel="stylesheet" href="/css/reset.css">
+  <link rel="stylesheet" href="/static/css/all_page_loading.css">
+  <link rel="stylesheet" href="/static/css/reset.css">
   <!-- <script type="module" src="/src/plugins/gverify.js"></script> -->
 </head>
 

src/api/deviceManagement/api.js

@@ -1,21 +1,94 @@
 import {
+    splicingParam,
     get,
+    del,
+    put,
     post,
-    postform
+    postform,
+    postFile
 } from '../../utils/requestMethod'
 
-// 获取设备类型列表
+// 获取设备 类型 列表
 const getDeviceTypeList = () => {
     return get('/device/device_type');
 }
+// 获取设备 种类 列表
+const getDeviceKindList = () => {
+    return get('/device/device_kind');
+}
+
+// 根据种类获取设备列表
+const getDeviceListByKind = (param) => {
+    return get('/device/device_kind_list?' + splicingParam(param));
+}
+
+// 根据类型获取设备列表
+const getDeviceListByType = (param) => {
+    return get('/device/device_list?' + splicingParam(param));
+}
 
 // 添加设备类型
 const addNewDeviceType = (data) => {
     return postform('/device/device_type', data);
 }
+// 获取 类型 下的 某个设备 的 详细信息
+const getDeviceInfoInType = (data) => {
+    return get('/device/device', data);
+}
+// 删除 类型 下的 设备
+const deleteDeviceInType = (data) => {
+    return del('/device/device', data);
+}
+// 批量删除 类型 下的 设备
+const deleteBatchDeviceInType = (data) => {
+    return del('/device/batch_delete_device', data);
+}
+// 删除 类型
+const deleteDeviceType = (data) => {
+    return del('/device/device_type', data);
+}
+
+// 向设备类型中添加设备
+const addDeviceToType = (data) => {
+    return postform('/device/device', data);
+}
+
+// 向设备类型中添加设备
+const updateDeviceInType = (data) => {
+    return put('/device/device', data);
+}
+
+// 向设备类型中添加设备
+const importDeviceToType = (data) => {
+    return postFile('/device/import_device', data);
+}
+
+// 根据告警类型获取告警列表
+const getAlarmListByType = (data) => {
+    return get('/device/device_alarm', data);
+}
+
+// 删除 告警 
+const deleteAlarm = (data) => {
+    return del('/device/device_alarm', data);
+}
+
 
 export default {
     getDeviceTypeList,
-    addNewDeviceType
+    getDeviceKindList,
+    getDeviceListByKind,
+    getDeviceListByType,
+    getDeviceInfoInType,
+    addNewDeviceType,
+    deleteDeviceType,
+    deleteDeviceInType,
+    deleteBatchDeviceInType,
+    updateDeviceInType,
+    addDeviceToType,
+    importDeviceToType,
+
+    getAlarmListByType,
+    deleteAlarm
 }
 

src/api/infoConfig/api.js

@@ -0,0 +1,82 @@
+import {
+    splicingParam,
+    get,
+    post,
+    put,
+    del,
+    postFile
+} from '../../utils/requestMethod'
+
+// 获取楼层地图信息配置
+const getFloorInfoConfiguration = (param) => {
+    return get('/information/floor_configuration?' + splicingParam(param));
+}
+// 删除楼层地图信息配置
+const delFloorInfoConfiguration = (param) => {
+    return del('/information/floor_configuration', param);
+}
+// 修改楼层地图信息配置
+const updateFloorInfoConfiguration = (param) => {
+    return put('/information/floor_configuration', param);
+}
+// 添加楼层地图信息配置
+const addFloorInfoConfiguration = (param) => {
+    return post('/information/floor_configuration', param);
+}
+// 获取楼层地图信息配置历史记录
+const getFloorInfoConfigurationHistory = (param) => {
+    return get('/information/get_floor_configuration_history?' + splicingParam(param));
+}
+// 获取信息列表
+const getInfoList = (param) => {
+    return get('/information/information_list');
+}
+// 获取人员名单
+const getPersonList = (param) => {
+    return get('/information/security_person');
+}
+
+// 获取安保人员信息配置
+const getSecurityInfoConfiguration = (param) => {
+    return get('/information/staff_configuration?' + splicingParam(param));
+}
+// 删除安保人员信息配置
+const delSecurityInfoConfiguration = (param) => {
+    return del('/information/staff_configuration', param);
+}
+// 修改安保人员信息配置
+const updateSecurityInfoConfiguration = (param) => {
+    return put('/information/staff_configuration', param);
+}
+// 添加安保人员信息配置
+const addSecurityInfoConfiguration = (param) => {
+    return post('/information/staff_configuration', param);
+}
+
+// 获取安保人员信息配置历史记录
+const getSecurityInfoConfigurationHistory = (param) => {
+    return get('/information/staff_configuration_history?' + splicingParam(param));
+}
+
+// 上传图片
+const uploadImage = (param) => {
+    return postFile('/information/upload_pictures', param)
+}
+
+
+
+export default {
+    getFloorInfoConfiguration,
+    delFloorInfoConfiguration,
+    updateFloorInfoConfiguration,
+    addFloorInfoConfiguration,
+    getFloorInfoConfigurationHistory,
+    getInfoList,
+    getPersonList,
+    getSecurityInfoConfiguration,
+    delSecurityInfoConfiguration,
+    updateSecurityInfoConfiguration,
+    addSecurityInfoConfiguration,
+    getSecurityInfoConfigurationHistory,
+    uploadImage,
+}

src/api/message/api.js

@@ -0,0 +1,46 @@
+import {
+    splicingParam,
+    get,
+    post,
+    put,
+    del
+} from '../../utils/requestMethod'
+
+// 获取消息详情
+const getMessageDetail = (data) => {
+    return get('/message/message?' + splicingParam(data));
+}
+// 删除消息
+const delMessage = (data) => {
+    return del('/message/message', data);
+}
+// 修改消息
+const updateMessage = (data) => {
+    return put('/message/message', data);
+}
+// 新增消息
+const addNewMessage = (data) => {
+    return post('/message/message', data);
+}
+// 获取消息列表
+const getMessageList = () => {
+    return get('/message/message_list');
+}
+// 获取消息模块类型
+const getMessageType = () => {
+    return get('/message/message_module');
+}
+// 获取消息模块搜索
+const getMessageSearch = (data) => {
+    return get('/message/search?' + splicingParam(data));
+}
+
+export default {
+    getMessageDetail,
+    delMessage,
+    updateMessage,
+    addNewMessage,
+    getMessageList,
+    getMessageType,
+    getMessageSearch
+}

src/api/systemConfig/api.js

@@ -1,12 +1,34 @@
 import {
+    splicingParam,
     get,
     post
 } from '../../utils/requestMethod'
+
+
 // 获取menu
 const getFloorList = () => {
     return get('/strategy');
 }
+// 获取 指标菜单
+const getIndexList = () => {
+    return get('/index/get_system_menus_list');
+}
+// 获取 指标 二级详细内容列表
+const getIndexSecondList = (data) => {
+    return get('/index/index_list?' + splicingParam(data));
+}
+
+
+// 获取 指标 二级详细内容列表
+const updateIndex = (data) => {
+    return post('/index/edit_index', data);
+}
+
+
 export default {
     getFloorList,
+    getIndexList,
+    getIndexSecondList,
+    updateIndex
 }
 

src/utils/requestMethod.js

@@ -2,6 +2,22 @@ import request from '@/utils/request'
 import qs from 'qs'
 import user from '@/store/modules/user';
 
+/**
+ * 整合url中拼接的参数
+ * @method
+ * @param {Object} params 传入需要拼接的参数对象
+ * @return {String} 返回的参数字符串 例：keyword=黄河&number=1&string=huanghe
+ */
+function splicingParam(params) {
+  let str = ""
+  for (const key in params) {
+    if (params.hasOwnProperty(key)) {
+      str += "&" + key + "=" + params[key]
+    }
+  }
+  return str.substr(1, str.length)
+}
+
 function get(url, params) {
   return new Promise((resolve, reject) => {
     request({
@@ -177,6 +193,7 @@ function delform(url, data) {
 }
 
 export {
+  splicingParam,
   get,
   getFile,
   post,

src/views/deviceManagement/deviceConfig.vue

@@ -2,7 +2,7 @@
   <div class="container">
     <div class="left-pane">
       <el-input
-        placeholder="告警类别"
+        placeholder="请输入设备类别"
         v-model="filterText"
         class="left-input"
         suffix-icon="el-icon-search"
@@ -20,12 +20,13 @@
         >
           <span slot-scope="{ node, data }">
             <!-- <el-image :src="data.url"></el-image> -->
-            <span style="padding-left: 10px; vertical-align: text-bottom">{{
-            node.label
-          }}</span>
+            <span style="padding-left: 10px; vertical-align: text-bottom">
+              {{node.label}}
+            </span>
             <span class="operate_btns">
+              <!-- :events="data.id ? menuEvents : subMenuEvents" -->
               <dropdown
-                :events="data.id ? menuEvents : subMenuEvents"
+                :events="menuEvents"
                 :data="{ node, data }"
                 @itemClick="dropDownClick"
               ></dropdown>
@@ -38,9 +39,18 @@
         @click="newDeviceType()"
       ><i class="el-icon-s-order"></i>新建设备类别</el-button>
     </div>
-    <div class="right-pane">
+    <div
+      class="right-pane"
+      v-if="Object.getOwnPropertyNames(selectedType).length!=0"
+    >
       <div class="right-pane-inner">
         <div class="top">
+          <el-breadcrumb
+            class="info"
+            separator-class="el-icon-arrow-right"
+          >
+            <el-breadcrumb-item>{{ selectedType.type_name }}</el-breadcrumb-item>
+          </el-breadcrumb>
           <el-button
             @click="addDevice()"
             class="add-btn"
@@ -49,10 +59,11 @@
             @click="dataImport()"
             class="import-btn"
           >批量导入</el-button>
-          <!-- <el-button @click="batchDelete" class="delete-btn"
-            >批量删除</el-button
-          > -->
-          <el-input
+          <el-button
+            @click="deviceBatchDelete"
+            class="delete-btn"
+          >批量删除</el-button>
+          <!-- <el-input
             class="search-input"
             v-model="searchInput"
             placeholder="请输入搜索内容"
@@ -64,7 +75,7 @@
                 @click="searchTypeEvent"
               ></i>
             </template>
-          </el-input>
+          </el-input> -->
         </div>
         <div class="center">
           <el-table
@@ -74,7 +85,7 @@
             :header-cell-style="{ textAlign: 'center' }"
             :cell-style="{ textAlign: 'center' }"
             style="width: 100%"
-            height="500"
+            height="660"
             @selection-change="handleSelectionChange"
           >
             <el-table-column
@@ -88,52 +99,51 @@
             >
             </el-table-column>
             <el-table-column
-              prop="deviceName"
+              prop="device_name"
               label="设备名称"
             >
             </el-table-column>
             <el-table-column
-              prop="deviceID"
+              prop="id"
               label="设备ID"
             > </el-table-column>
-            <el-table-column
+            <!-- <el-table-column
               prop="deviceUse"
               label="设备用途"
             >
-            </el-table-column>
+            </el-table-column> -->
             <el-table-column
-              prop="devicePosition"
+              prop="device_location"
               label="设备位置"
+              width="360"
             >
             </el-table-column>
-            <el-table-column
+            <!-- <el-table-column
               prop="deviceLife"
               label="设备使用年限"
             >
-            </el-table-column>
-            <el-table-column
+            </el-table-column> -->
+            <!-- <el-table-column
               prop="company"
               label="设备单位"
-            > </el-table-column>
-            <el-table-column
+            > </el-table-column> -->
+            <!-- <el-table-column
               prop="deviceRespon"
               label="设备责任人"
             >
-            </el-table-column>
-            <el-table-column
-              prop="operation"
-              label="操作"
-            >
+            </el-table-column> -->
+            <el-table-column label="操作">
               <template slot-scope="scope">
+                <!-- v-show="scope.row.deviceID == null ? false : true" -->
+
                 <el-button
-                  v-show="scope.row.deviceID == null ? false : true"
                   size="mini"
                   type="text"
-                  @click="deviceEdit"
+                  @click="deviceEdit(scope.row)"
                   style="color: #2ea8e6"
                 >编辑</el-button>
+                <!-- v-show="scope.row.deviceID == null ? false : true" -->
                 <el-button
-                  v-show="scope.row.deviceID == null ? false : true"
                   size="mini"
                   type="text"
                   style="color: #2ea8e6"
@@ -151,23 +161,42 @@
     <!--弹窗-->
     <NewDeviceType
       ref="newDevice"
-      v-bind="{
-      update:getDeviceTypeList
-    }"
+      v-bind="{ 
+        update:getDeviceTypeList
+      }"
     ></NewDeviceType>
-    <addDevice ref="addDevice"></addDevice>
-    <dataImport ref="dataImport"></dataImport>
-    <deviceEdit ref="deviceEdit"></deviceEdit>
+    <addDevice
+      ref="addDevice"
+      v-bind="{
+        selectedTypeObj:selectedType,
+        update:getListByDeviceType
+      }"
+    ></addDevice>
+    <dataImport
+      ref="dataImport"
+      v-bind="{
+        update:getListByDeviceType,
+        selectedType:selectedType,
+      }"
+    ></dataImport>
+    <deviceEdit
+      ref="deviceEdit"
+      v-bind="{
+        update:getListByDeviceType,
+        selectedType:selectedType,
+        deviceInfo: deviceInfo
+      }"
+    ></deviceEdit>
   </div>
 </template>
 
 <script>
 import checkbox from "@/components/Checkbox/index";
 import page from "@/components/pagination/index";
-import NewDeviceType from "./messageDailog/newDeviceType";
-import dataImport from "./messageDailog/dataImport";
-import addDevice from "./messageDailog/addDevice";
-import deviceEdit from "./messageDailog/deviceEdit";
+import NewDeviceType from "./messageDialog/newDeviceType";
+import dataImport from "./messageDialog/dataImport";
+import addDevice from "./messageDialog/addDevice";
+import deviceEdit from "./messageDialog/deviceEdit";
 import dropdown from "@/components/Dropdown/index";
 
 import api from "@/api/deviceManagement/api";
@@ -189,63 +218,13 @@ export default {
       form: {
         typeName: "",
       },
-      deviceTypeList: [
-        // {
-        //   id: 1,
-        //   label: "A设备",
-        // },
-        // {
-        //   id: 2,
-        //   label: "B设备",
-        // },
-      ],
+      deviceTypeList: [],
       defaultProps: {
         children: "children",
-        label: "label",
+        label: "type_name",
       },
-      menuEvents: [
-        { label: "新建", funcName: "addNode" },
-        { label: "上移", funcName: "moveUp" },
-        { label: "下移", funcName: "moveDown" },
-        { label: "编辑", funcName: "editNode" },
-        { label: "删除", funcName: "removeNode" },
-      ],
-      subMenuEvents: [
-        { label: "新建", funcName: "addNode" },
-        { label: "上移", funcName: "moveUp" },
-        { label: "下移", funcName: "moveDown" },
-        { label: "编辑", funcName: "editNode" },
-        { label: "删除", funcName: "removeNode" },
-      ],
-      tableData: [
-        {
-          deviceName: "摄像头",
-          deviceID: "SXT-001",
-          deviceUse: "监控摄像头",
-          devicePosition: "1层101",
-          deviceLife: "3年6个月",
-          company: "北京电信规划院",
-          deviceRespon: "张三",
-        },
-        {
-          deviceName: "摄像头",
-          deviceID: "SXT-001",
-          deviceUse: "监控摄像头",
-          devicePosition: "1层101",
-          deviceLife: "3年6个月",
-          company: "北京电信规划院",
-          deviceRespon: "张三",
-        },
-        {
-          deviceName: "摄像头",
-          deviceID: "SXT-001",
-          deviceUse: "监控摄像头",
-          devicePosition: "1层101",
-          deviceLife: "3年6个月",
-          company: "北京电信规划院",
-          deviceRespon: "张三",
-        },
-      ],
+      menuEvents: [{ label: "删除", funcName: "removeNode" }],
+      tableData: [],
       multipleSelection: [],
       show: true,
       paginationData: {
@@ -253,18 +232,23 @@ export default {
         pagerCount: 5,
         currentPage: 1,
         pageSizes: [5, 10, 20, 30],
-        total: 30,
+        total: 0,
         currentChange: (val) => {
-          this.getTableData(val);
+          this.handlePageChange(val);
         },
         handleSizeChange: (val) => {
           this.handleSizeChange(val);
         },
       },
+      selectedType: {},
+      deviceInfo: {},
     };
   },
   mounted() {
-    this.getDeviceTypeList();
+    this.getDeviceTypeList().then(() => {
+      this.selectedType = this.deviceTypeList[0];
+      this.handlePageChange(1);
+    });
   },
   watch: {
     filterText(val) {
@@ -274,24 +258,149 @@ export default {
   methods: {
     getDeviceTypeList() {
       let that = this;
-      api
-        .getDeviceTypeList()
-        .then((result) => {
-          that.deviceTypeList = result.data.data.map(function (item) {
-            item.label = item.type_name;
-            return item;
-          });
-        })
+      return new Promise((resolve, reject) => {
+        api.getDeviceTypeList().then((result) => {
+          that.deviceTypeList = result.data.data;
+          resolve();
+        });
+      });
+    },
+
+    // searchTypeEvent() {},
+    dropDownClick(eventType, data) {
+      switch (eventType) {
+        case "removeNode":
+          // 删除
+          this.$confirm(
+            "此操作将删除 " + data.data.type_name + " , 是否继续?",
+            "提示",
+            {
+              confirmButtonText: "确定",
+              cancelButtonText: "取消",
+              type: "warning",
+            }
+          )
+            .then(() => {
+              const loading = this.$loading({
+                lock: true,
+                text: "删除中，请稍后！",
+                spinner: "el-icon-loading",
+                background: "rgba(0, 0, 0, 0.7)",
+                customClass: "systemConfigLoading",
+              });
+              api
+                .deleteDeviceType({
+                  id: data.data.id,
+                })
+                .then((result) => {
+                  loading.close();
+                  if (result.data.code == 0) {
+                    this.getDeviceTypeList();
+                    this.$message({
+                      type: "success",
+                      message: "删除成功!",
+                    });
+                  } else {
+                    this.$message({
+                      type: "error",
+                      message: "删除失败!",
+                    });
+                  }
+                })
+                .catch((err) => {
+                  loading.close();
+                  this.$message({
+                    type: "error",
+                    message: "删除失败!",
+                  });
+                });
+            })
+            .catch(() => {
+              this.$message({
+                type: "info",
+                message: "已取消删除",
+              });
+            });
+
+          break;
+        default:
+          break;
+      }
+    },
+    getListByDeviceType() {
+      this.resetPageConfig({
+        currentPage: 1,
+      });
+      this.handlePageChange(1);
+    },
+
+    handlePageChange(val) {
+      this.paginationData.currentPage = val;
+      this.getListData({
+        id: this.selectedType.id,
+        page_size: this.paginationData.pageSize,
+        page: val,
+      })
+        .then((result) => {})
+        .catch((err) => {});
+    },
+
+    handleSizeChange(val) {
+      this.paginationData.pageSize = val;
+      this.getListData({
+        id: this.selectedType.id,
+        page_size: val,
+        page: this.paginationData.currentPage,
+      })
+        .then((result) => {})
         .catch((err) => {});
     },
 
-    searchTypeEvent() {},
-    dropDownClick() {},
-    getTableData(val) {},
-    handleSizeChange(val) {},
+    getListData(obj) {
+      let that = this;
+      return new Promise((resolve, reject) => {
+        api
+          .getDeviceListByType(obj)
+          .then((result) => {
+            if (result.data.code == 0) {
+              that.tableData = result.data.data;
+              that.paginationData.total = result.data.total;
+              resolve();
+            } else {
+              reject();
+            }
+          })
+          .catch((err) => {
+            reject();
+          });
+      });
+    },
+
+    resetPageConfig(obj) {
+      let t = {
+        pageSize: 10,
+        pagerCount: 5,
+        currentPage: 1,
+        pageSizes: [5, 10, 20, 30],
+        total: 30,
+        currentChange: (val) => {
+          this.handlePageChange(val);
+        },
+        handleSizeChange: (val) => {
+          this.handleSizeChange(val);
+        },
+      };
+      if (obj != null || obj != undefined) {
+        for (const key in obj) {
+          t[key] = obj[key];
+        }
+        this.paginationData = t;
+      }
+    },
+
     filterNode(value, data) {
       if (!value) return true;
-      return data.label.indexOf(value) !== -1;
+      return data.type_name.indexOf(value) !== -1;
     },
     newDeviceType() {
       this.$refs.newDevice.dialogVisible = true;
@@ -302,20 +411,136 @@ export default {
     addDevice() {
       this.$refs.addDevice.dialogVisible = true;
     },
-    deviceEdit() {
+    deviceEdit(data) {
       this.$refs.deviceEdit.dialogVisible = true;
+      this.deviceInfo = data;
     },
+
     deviceDelete(data) {
-      // this.tableData = this.tableData.filter(()=>{
-      // })
+      this.$confirm("此操作将删除当前设备类别下的此设备, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          const loading = this.$loading({
+            lock: true,
+            text: "删除中，请稍后！",
+            spinner: "el-icon-loading",
+            background: "rgba(0, 0, 0, 0.7)",
+            customClass: "systemConfigLoading",
+          });
+          api
+            .deleteDeviceInType({
+              device_type_id: this.selectedType.id,
+              device_id: data.id,
+            })
+            .then((result) => {
+              loading.close();
+              if (result.data.code == 0) {
+                this.handlePageChange(this.paginationData.currentPage);
+                this.$message({
+                  type: "success",
+                  message: "删除成功!",
+                });
+              } else {
+                this.$message({
+                  type: "error",
+                  message: "删除失败!",
+                });
+              }
+            })
+            .catch((err) => {
+              loading.close();
+              this.$message({
+                type: "error",
+                message: "删除失败!",
+              });
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
     },
-    handleSelectionChange() {
-      //
+    deviceBatchDelete() {
+      if (this.multipleSelection.length == 0) {
+        this.$message({
+          type: "info",
+          message: "未选择要删除的设备，请选择后重试。",
+        });
+        return;
+      } else {
+        this.$confirm(
+          "此操作将删除当前设备类别下的勾选的全部设备, 是否继续?",
+          "提示",
+          {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning",
+          }
+        )
+          .then(() => {
+            const loading = this.$loading({
+              lock: true,
+              text: "删除中，请稍后！",
+              spinner: "el-icon-loading",
+              background: "rgba(0, 0, 0, 0.7)",
+              customClass: "systemConfigLoading",
+            });
+            api
+              .deleteBatchDeviceInType({
+                device_type_id: this.selectedType.id,
+                device_ids: JSON.stringify(
+                  this.multipleSelection.map(function (item) {
+                    return item.id;
+                  })
+                ),
+              })
+              .then((result) => {
+                loading.close();
+                if (result.data.code == 0) {
+                  this.handlePageChange(this.paginationData.currentPage);
+                  this.$message({
+                    type: "success",
+                    message: "删除成功!",
+                  });
+                } else {
+                  this.$message({
+                    type: "error",
+                    message: "删除失败!",
+                  });
+                }
+              })
+              .catch((err) => {
+                loading.close();
+                this.$message({
+                  type: "error",
+                  message: "删除失败!",
+                });
+              });
+          })
+          .catch(() => {
+            this.$message({
+              type: "info",
+              message: "已取消删除",
+            });
+          });
+      }
+    },
+
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
     },
-    handleNodeClick() {
-      //
+    handleNodeClick(obj) {
+      this.tableData = [];
+      this.multipleSelection = [];
+      this.deviceInfo = {};
+      this.selectedType = obj;
+      this.getListByDeviceType();
     },
-    batchDelete() {},
   },
 };
 </script>
@@ -387,7 +612,7 @@ export default {
       color: #fff;
       background: #3da0d6;
       margin-left: 24px;
-      color: #fff; 
+      color: #fff;
     }
   }
 
@@ -408,24 +633,25 @@ export default {
         .import-btn,
         .delete-btn {
           color: #fff;
+          float: right;
         }
         .add-btn {
           position: absolute;
           background: #2ea8e6;
-          top: 20px;
-          left: 20px;
+          top: 10px;
+          right: 130px;
         }
         .import-btn {
           position: absolute;
           background: #2ea8e6;
-          top: 20px;
-          left: 130px;
+          top: 10px;
+          right: 20px;
         }
         .delete-btn {
           position: absolute;
           background: #b3b3b3;
-          top: 20px;
-          left: 250px;
+          top: 10px;
+          right: 250px;
         }
         .search-input {
           position: absolute;
@@ -433,6 +659,14 @@ export default {
           right: 30px;
           width: 300px;
         }
+        .info {
+          height: 40px;
+          line-height: 40px;
+          text-align: left;
+          padding: 10px;
+          font-size: 25px;
+          margin-bottom: 30px;
+        }
       }
       .center {
         width: 100%;

src/views/deviceManagement/deviceWarning.vue

@@ -9,40 +9,43 @@
       </el-input>
       <el-tree
         ref="tree"
-        :data="data"
+        :data="list"
         :props="defaultProps"
         node-key="id"
         default-expand-all
         :filter-node-method="filterNode"
         @node-click="handleNodeClick"
       >
-        <span slot-scope="{ node, data }">
-          <!-- <el-image :src="data.url"></el-image> -->
-          <span style="padding-left: 10px; vertical-align: text-bottom">{{
-            node.label
-          }}</span>
+        <span slot-scope="{ node }">
+          <span class="list_item_style">
+            {{node.label}}
+          </span>
           <span class="operate_btns">
-            <dropdown
+            <!-- <dropdown
               :events="data.id ? menuEvents : subMenuEvents"
               :data="{ node, data }"
               @itemClick="dropDownClick"
-            ></dropdown>
+            ></dropdown> -->
           </span>
         </span>
       </el-tree>
-      <el-button
+      <!-- <el-button
         class="newWarning"
         style="color: #fff; background: #3da0d6"
         @click="newAlarmType"
-      ><i class="el-icon-s-order"></i>新建告警类别</el-button>
+      ><i class="el-icon-s-order"></i>新建告警类别</el-button> -->
     </div>
     <div class="right-pane">
+
       <div class="right-pane-inner">
         <div class="top">
-          <!-- <el-button @click="batchDelete" class="delete-btn"
-            >批量删除</el-button
-          > -->
-          <el-input
+          <el-breadcrumb
+            class="info"
+            separator-class="el-icon-arrow-right"
+          >
+            <el-breadcrumb-item>{{breadcrumb.label}}</el-breadcrumb-item>
+          </el-breadcrumb>
+          <!-- <el-input
             class="search-input"
             v-model="searchInput"
             placeholder="请输入搜索内容"
@@ -54,8 +57,12 @@
                 @click="searchEvent"
               ></i>
             </template>
-          </el-input>
+          </el-input> -->
+          <!-- <el-button @click="batchDelete" class="delete-btn"
+            >批量删除</el-button
+          > -->
         </div>
+
         <div class="center">
           <el-table
             ref="multipleTable"
@@ -64,7 +71,7 @@
             :header-cell-style="{ textAlign: 'center' }"
             :cell-style="{ textAlign: 'center' }"
             style="width: 100%"
-            height="500"
+            height="640"
             @selection-change="handleSelectionChange"
           >
             <el-table-column
@@ -78,46 +85,44 @@
             >
             </el-table-column>
             <el-table-column
-              prop="deviceType"
-              label="设备类别"
+              prop="device_name"
+              width="120"
+              label="设备名称"
             >
             </el-table-column>
             <el-table-column
-              prop="devicewarningType"
-              label="涵盖设备警告类别"
+              prop="message"
+              label="设备警告内容"
             >
             </el-table-column>
             <el-table-column
               prop="Respon"
+              width="120"
               label="责任人"
             > </el-table-column>
             <el-table-column
-              prop="operation"
+              width="160"
               label="操作"
             >
-              <!-- <el-button
-                size="mini"
-                type="text"
-                style="color: #2ea8e6"
-              >
-                查看
-              </el-button> -->
-              <!-- <el-switch
-                v-model="value"
-                active-color="#13ce66"
-                inactive-color="#ff4949"
-              >
-              </el-switch> -->
-              <el-button
-                size="mini"
-                type="text"
-                style="color: #2ea8e6"
-              >编辑</el-button>
-              <el-button
-                size="mini"
-                type="text"
-                style="color: #2ea8e6"
-              >删除</el-button>
+              <template slot-scope="scope">
+                <el-switch
+                  class="changeGJ"
+                  v-model="scope.row.status"
+                  active-color="#13ce66"
+                  inactive-color="#ff4949"
+                  :title="`当前状态为：${scope.row.status?'启用':'关闭'}`"
+                >
+                </el-switch>
+                <el-button
+                  class="deleteGJ"
+                  type="text"
+                  icon="el-icon-remove-outline"
+                  title="删除"
+                  @click="deleteGJ(scope.row)"
+                >
+                </el-button>
+              </template>
+
             </el-table-column>
           </el-table>
         </div>
@@ -133,63 +138,51 @@
 import checkbox from "@/components/Checkbox/index";
 import page from "@/components/pagination/index";
 import dropdown from "@/components/Dropdown/index";
+
+import api from "@/api/deviceManagement/api";
 export default {
   components: { checkbox, page, dropdown },
   data() {
+    let list = [
+      {
+        id: 3,
+        label: "紧急告警",
+        children: [],
+      },
+      {
+        id: 2,
+        label: "重要告警",
+      },
+      {
+        id: 1,
+        label: "一般告警",
+      },
+    ];
     return {
       searchInput: "",
       filterText: "",
       input: "",
-      data: [
-        {
-          id: 1,
-          label: "紧急告警",
-          children: [],
-        },
-        {
-          id: 2,
-          label: "重要告警",
-        },
-        {
-          id: 3,
-          label: "一般告警",
-        },
-      ],
-      menuEvents: [
-        { label: "新建", funcName: "addNode" },
-        { label: "上移", funcName: "moveUp" },
-        { label: "下移", funcName: "moveDown" },
-        { label: "编辑", funcName: "editNode" },
-        { label: "删除", funcName: "removeNode" },
-      ],
-      subMenuEvents: [
-        { label: "新建", funcName: "addNode" },
-        { label: "上移", funcName: "moveUp" },
-        { label: "下移", funcName: "moveDown" },
-        { label: "编辑", funcName: "editNode" },
-        { label: "删除", funcName: "removeNode" },
-      ],
+      breadcrumb: list[0],
+      list: list,
+      // menuEvents: [
+      //   { label: "新建", funcName: "addNode" },
+      //   { label: "上移", funcName: "moveUp" },
+      //   { label: "下移", funcName: "moveDown" },
+      //   { label: "编辑", funcName: "editNode" },
+      //   { label: "删除", funcName: "removeNode" },
+      // ],
+      // subMenuEvents: [
+      //   { label: "新建", funcName: "addNode" },
+      //   { label: "上移", funcName: "moveUp" },
+      //   { label: "下移", funcName: "moveDown" },
+      //   { label: "编辑", funcName: "editNode" },
+      //   { label: "删除", funcName: "removeNode" },
+      // ],
       defaultProps: {
         children: "children",
         label: "label",
       },
-      tableData: [
-        {
-          deviceType: "摄像头",
-          devicewarningType: "[设备离线][设备xxx]",
-          Respon: "张三",
-        },
-        {
-          deviceType: "摄像头",
-          devicewarningType: "[设备离线][设备xxx]",
-          Respon: "张三",
-        },
-        {
-          deviceType: "摄像头",
-          devicewarningType: "[设备离线][设备xxx]",
-          Respon: "张三",
-        },
-      ],
+      tableData: [],
       multipleSelection: [],
       show: true,
       paginationData: {
@@ -197,9 +190,9 @@ export default {
         pagerCount: 5,
         currentPage: 1,
         pageSizes: [5, 10, 20, 30],
-        total: 30,
+        total: 0,
         currentChange: (val) => {
-          this.getTableData(val);
+          this.handlePageChange(val);
         },
         handleSizeChange: (val) => {
           this.handleSizeChange(val);
@@ -207,6 +200,10 @@ export default {
       },
     };
   },
+  mounted() {
+    this.resetPageConfig();
+    this.handlePageChange(1);
+  },
   watch: {
     filterText(val) {
       this.$refs.tree.filter(val);
@@ -223,18 +220,146 @@ export default {
       if (!value) return true;
       return data.label.indexOf(value) !== -1;
     },
-    handleNodeClick() {
-      //
+    handleNodeClick(data, node, vueEle) {
+      this.breadcrumb = data;
+      this.resetPageConfig();
+      this.handlePageChange(1);
     },
-    handleSelectionChange() {
-      //
+    getAlarmListByType(obj) {
+      const loading = this.$loading({
+        lock: true,
+        text: "查询中，请稍后！",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)",
+        customClass: "systemConfigLoading",
+      });
+      return new Promise((resolve, reject) => {
+        api
+          .getAlarmListByType(obj)
+          .then((result) => {
+            loading.close();
+            if (result.data.code == 0) {
+              this.tableData = result.data.data;
+              this.paginationData.total = result.data.total;
+              this.$message({
+                type: "success",
+                message: "查询成功!",
+              });
+              resolve();
+            } else {
+              this.$message({
+                type: "error",
+                message: "查询失败!",
+              });
+            }
+          })
+          .catch((err) => {
+            this.$message({
+              type: "error",
+              message: "查询失败!",
+            });
+          });
+      });
     },
-    getTableData() {},
-    handleSizeChange() {},
-    batchDelete() {},
-    searchEvent() {
-      console.log("查询");
+
+    resetPageConfig(obj) {
+      let t = {
+        pageSize: 10,
+        pagerCount: 5,
+        currentPage: 1,
+        pageSizes: [5, 10, 20, 30],
+        total: 30,
+        currentChange: (val) => {
+          this.handlePageChange(val);
+        },
+        handleSizeChange: (val) => {
+          this.handleSizeChange(val);
+        },
+      };
+      if (obj != null || obj != undefined) {
+        for (const key in obj) {
+          t[key] = obj[key];
+        }
+        this.paginationData = t;
+      }
     },
+    deleteGJ(data) {
+      this.$confirm("此操作将永久删除该告警, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          const loading = this.$loading({
+            lock: true,
+            text: "删除中，请稍后！",
+            spinner: "el-icon-loading",
+            background: "rgba(0, 0, 0, 0.7)",
+            customClass: "systemConfigLoading",
+          });
+          api
+            .deleteAlarm({
+              alarm_message_id: data.id,
+            })
+            .then((result) => {
+              loading.close();
+              this.handlePageChange(this.paginationData.currentPage);
+              if (result.data.code == 0) {
+                this.$message({
+                  type: "success",
+                  message: "删除成功!",
+                });
+              } else {
+                this.$message({
+                  type: "error",
+                  message: "删除失败!",
+                });
+              }
+            })
+            .catch((err) => {
+              loading.close();
+              this.$message({
+                type: "error",
+                message: "删除失败!",
+              });
+            });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+    },
+
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    handlePageChange(val) {
+      this.paginationData.currentPage = val;
+      this.getAlarmListByType({
+        alarm_type: this.breadcrumb.id,
+        page_size: this.paginationData.pageSize,
+        page: val,
+      })
+        .then((result) => {})
+        .catch((err) => {});
+    },
+    handleSizeChange(val) {
+      this.paginationData.pageSize = val;
+      this.getAlarmListByType({
+        alarm_type: this.breadcrumb.id,
+        page_size: val,
+        page: this.paginationData.currentPage,
+      })
+        .then((result) => {})
+        .catch((err) => {});
+    },
+
+    // batchDelete() {},
+    // searchEvent() {
+    //   console.log("查询");
+    // },
   },
 };
 </script>
@@ -291,18 +416,23 @@ export default {
           padding-left: 60px !important;
         }
       }
+
+      .list_item_style {
+        padding-left: 10px;
+        vertical-align: text-bottom;
+      }
     }
   }
 
-  .newWarning {
-    position: relative;
-    bottom: 50px;
-    width: 250px;
-    text-align: center;
-    font-size: 16px;
-    color: #fff;
-    background: #3da0d6;
-  }
+  // .newWarning {
+  //   position: relative;
+  //   bottom: 50px;
+  //   width: 250px;
+  //   text-align: center;
+  //   font-size: 16px;
+  //   color: #fff;
+  //   background: #3da0d6;
+  // }
   .right-pane {
     width: calc(100% - 300px);
     height: 100%;
@@ -342,10 +472,19 @@ export default {
         }
         .search-input {
           position: absolute;
-          top: 20px;
+          top: 10px;
           right: 30px;
           width: 300px;
         }
+
+        .info {
+          height: 40px;
+          line-height: 40px;
+          text-align: left;
+          padding: 10px;
+          font-size: 25px;
+          margin-bottom: 30px;
+        }
       }
       .center {
         width: 100%;
@@ -399,6 +538,18 @@ export default {
             }
           }
         }
+        .deleteGJ {
+          width: 20px;
+          height: 20px;
+          padding: 0 0;
+          color: #2ea8e6;
+          font-size: 20px;
+          vertical-align: top;
+        }
+        .changeGJ {
+          margin-right: 10px;
+          vertical-align: top;
+        }
       }
       .bottom {
         height: 70px;

src/views/deviceManagement/messageDailog/addDevice.vue → src/views/deviceManagement/messageDialog/addDevice.vue

@@ -5,36 +5,44 @@
       class="dialog"
       title="添加设备"
       :visible.sync="dialogVisible"
-      width="460px"
+      width="570px"
       left
     >
       <el-divider></el-divider>
       <div class="container">
         <div class="leftpane">
-          <el-tree
-            ref="tree"
-            :data="data"
-            :props="defaultProps"
-            node-key="id"
-            default-expand-all
-            @node-click="handleNodeClick"
+          <el-menu
+            :default-active="deviceKindDefaultActive"
+            class="el-menu-vertical-demo"
+            @select="getDeviceList"
           >
-          </el-tree>
+
+            <el-menu-item
+              v-for="(item, index) in list"
+              :key="index"
+              :index="index+1+''"
+            >
+              <span slot="title">{{item.name}}</span>
+            </el-menu-item>
+
+          </el-menu>
+
         </div>
         <div class="rightpane">
           <el-input
             class="search"
-            v-model="filter"
+            v-model="searchText"
             placeholder="请输入"
             suffix-icon="el-icon-search"
           ></el-input>
           <el-table
             ref="multipleTable"
-            :data="tableData"
+            :data="tableData.filter(data => !searchText || String(data.id).indexOf(searchText)>-1)"
             tooltip-effect="dark"
             :header-cell-style="{ textAlign: 'center' }"
             :cell-style="{ textAlign: 'center' }"
-            style="width: 100%"
+            style="width: 100%;"
+            height="340"
             @selection-change="handleSelectionChange"
           >
             <el-table-column
@@ -42,11 +50,11 @@
               width="50"
             > </el-table-column>
             <el-table-column
-              prop="deviceID"
+              prop="id"
               label="设备ID"
             > </el-table-column>
             <el-table-column
-              prop="devicePosition"
+              prop="device_location"
               label="设备位置"
             >
             </el-table-column>
@@ -64,6 +72,7 @@
         <el-button
           type="primary"
           style="background: #2ea8e6"
+          @click="sure"
         >确认</el-button>
       </div>
     </el-dialog>
@@ -71,56 +80,101 @@
 </template>
 
 <script>
+import api from "@/api/deviceManagement/api";
 export default {
+  props: {
+    selectedTypeObj: {
+      type: Object,
+    },
+    update: {
+      type: Function,
+    },
+  },
   data() {
     return {
       dialogVisible: false,
-      filter: "",
-      data: [
-        {
-          label: "设备种类",
-          children: [
-            {
-              label: "摄像头",
-            },
-            {
-              label: "门禁设备",
-            },
-            {
-              label: "水浸设备",
-            },
-            {
-              label: "电表设备",
-            },
-            {
-              label: "其他设备",
-            },
-          ],
-        },
-      ],
-      defaultProps: {
-        children: "children",
-        label: "label",
-      },
-      tableData: [
-        {
-          deviceID: "111",
-          devicePosition: "1F-101",
-        },
-        {
-          deviceID: "112",
-          devicePosition: "1F-101",
-        },
-        {
-          deviceID: "113",
-          devicePosition: "1F-101",
-        },
-      ],
+      searchText: "",
+      deviceKindDefaultActive: "1",
+      list: [],
+      tableData: [],
+      multipleSelection: [],
     };
   },
+  mounted() {
+    this.getDeviceKindList().then((result) => {
+      this.getDeviceList(this.deviceKindDefaultActive);
+    });
+  },
   methods: {
-    handleNodeClick() {},
-    handleSelectionChange() {},
+    // handleNodeClick() {},
+    handleSelectionChange(arr) {
+      this.multipleSelection = arr;
+    },
+
+    getDeviceKindList() {
+      return new Promise((resolve, reject) => {
+        api
+          .getDeviceKindList()
+          .then((result) => {
+            if (result.data.code == 0) {
+              // code: 1, id: 19, name: "电"
+              this.list = result.data.data;
+            }
+            resolve();
+          })
+          .catch((err) => {});
+      });
+    },
+    getDeviceList(index) {
+      let id = this.list[Number(index) - 1].code;
+      api
+        .getDeviceListByKind({
+          id: id,
+        })
+        .then((result) => {
+          // device_id: null
+          // device_location: "主要大厦-中国联通北京电信规划院-地下配电室"
+          // device_name: "无机房电梯"
+          // device_type: 1
+          // gateway_code: "0407d3090e52014"
+          // gateway_ip: "10.100.66.8"
+          // id: 7
+          // loop_detail: "401-AA01-1-无机房电梯"
+          // status: 0
+          // usage: "动力用电"
+          // console.log(result.data.data);
+          this.tableData = result.data.data;
+        })
+        .catch((err) => {});
+    },
+    sure() {
+      api
+        .addDeviceToType({
+          device_type_id: this.selectedTypeObj.id,
+          device_ids: JSON.stringify(
+            this.multipleSelection.map(function (item) {
+              return item.id;
+            })
+          ),
+        })
+        .then((result) => {
+          if (result.data.code == 0) {
+            this.update();
+            this.$message.success("添加成功!");
+            this.dialogVisible = false;
+          } else {
+            this.$message.error("添加失败!");
+          }
+        })
+        .catch((err) => {
+          this.$message.error("添加失败!");
+        });
+    },
+    close() {
+      this.dialogVisible = false;
+      this.searchText = "";
+      this.deviceKindDefaultActive = "1";
+    },
   },
 };
 </script>
@@ -133,10 +187,12 @@ export default {
   padding: 0 0;
   margin: 20px 20px;
   .leftpane {
-    width: 120px;
-
+    width: 150px;
+    height: 100%;
+    overflow: hidden;
+    overflow-y: auto;
     .el-tree {
-      width: 120px;
+      width: 100%;
       height: 100%;
       background-color: rgb(247, 245, 243);
     }
@@ -144,7 +200,7 @@ export default {
 
   .rightpane {
     .search {
-      width: 224.8px;
+      width: 300px;
       margin-left: 60px;
       margin-top: 10px;
 

src/views/deviceManagement/messageDailog/dataImport.vue → src/views/deviceManagement/messageDialog/dataImport.vue

@@ -88,7 +88,16 @@
 </template>
 
 <script>
+import api from "@/api/deviceManagement/api";
 export default {
+  props: {
+    update: {
+      type: Function,
+    },
+    selectedType: {
+      type: Object,
+    },
+  },
   data() {
     return {
       dialogVisible: false,
@@ -108,7 +117,38 @@ export default {
   },
   methods: {
     confirmEvent() {
-      console.log("确认导入");
+      const loading = this.$loading({
+        lock: true,
+        text: "导入中，请稍后！",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)",
+        customClass: "systemConfigLoading",
+      });
+      api
+        .importDeviceToType(this.flieObj)
+        .then((result) => {
+          loading.close();
+          if (result.data.code == 0) {
+            this.$message({
+              type: "success",
+              message: "设备导入成功!",
+            });
+            this.dialogVisible = false;
+            this.update();
+          } else {
+            this.$message({
+              type: "error",
+              message: "设备导入失败!",
+            });
+          }
+        })
+        .catch((err) => {
+          loading.close();
+          this.$message({
+            type: "error",
+            message: "设备导入失败!",
+          });
+        });
     },
     downloadTemplate() {
       const a = document.createElement("a");
@@ -127,8 +167,13 @@ export default {
       document.body.removeChild(a);
     },
     beforeUploadBeforeExcel(file) {
-      console.log(arguments);
+      // console.log(arguments);
       this.input = file.name;
+      let formData = new FormData();
+      formData.append("files", file);
+      formData.append("group_id", this.selectedType.id);
+      this.flieObj = formData;
+      return false;
     },
     close() {
       this.dialogVisible = false;

src/views/deviceManagement/messageDailog/deviceEdit.vue → src/views/deviceManagement/messageDialog/deviceEdit.vue

@@ -7,9 +7,10 @@
       :visible.sync="dialogVisible"
       width="460px"
       left
+      @before-close="close"
     >
       <el-divider></el-divider>
-      <div style="height: 530px">
+      <div class="container">
         <el-scrollbar style="height: 100%">
           <el-form
             ref="form"
@@ -18,24 +19,34 @@
             label-width="75px"
           >
             <el-form-item label="设备名称：">
-              <el-input v-model="form.name"></el-input>
+              <el-input v-model="form.device_name"></el-input>
             </el-form-item>
             <el-form-item label="设备ID：">
-              <el-input v-model="form.id"></el-input>
+              <el-input
+                v-model="form.id"
+                disabled
+              ></el-input>
             </el-form-item>
             <el-form-item label="设备类别：">
-              <el-select v-model="form.type" placeholder="请选择设备类别">
+              <el-select
+                v-model="selectedType.id"
+                placeholder="请选择设备类别"
+                disabled
+              >
                 <el-option
                   v-for="item in deviceTypeOptions"
-                  :key="item.value"
-                  :label="item.label"
-                  :value="item.value"
+                  :key="item.id"
+                  :label="item.type_name"
+                  :value="item.id"
                 >
                 </el-option>
               </el-select>
             </el-form-item>
-            <el-form-item label="设备用途：">
-              <el-select v-model="form.use" placeholder="请选择设备用途">
+            <!-- <el-form-item label="设备用途：">
+              <el-select
+                v-model="form.use"
+                placeholder="请选择设备用途"
+              >
                 <el-option
                   v-for="item in purposeOptions"
                   :key="item.value"
@@ -44,29 +55,38 @@
                 >
                 </el-option>
               </el-select>
-            </el-form-item>
+            </el-form-item> -->
             <el-form-item label="设备位置：">
               <el-input
-                v-model="form.position"
+                v-model="form.device_location"
                 placeholder="请输入位置"
               ></el-input>
             </el-form-item>
-            <el-form-item label-width="105px" label="设备使用年限：">
+            <!-- <el-form-item
+              label-width="105px"
+              label="设备使用年限："
+            >
               <el-input
                 class="life"
                 v-model="form.life"
                 placeholder="请输入使用时间"
               ></el-input>
-            </el-form-item>
-            <el-form-item label-width="90px" label="设备责任人：">
+            </el-form-item> -->
+            <!-- <el-form-item
+              label-width="90px"
+              label="设备责任人："
+            >
               <el-input
                 class="person"
                 v-model="form.person"
                 placeholder="请输入负责人姓名"
               ></el-input>
-            </el-form-item>
-            <el-form-item label="公司名称：">
-              <el-select v-model="form.corpor_name" placeholder="请选择">
+            </el-form-item> -->
+            <!-- <el-form-item label="公司名称：">
+              <el-select
+                v-model="form.corpor_name"
+                placeholder="请选择"
+              >
                 <el-option
                   v-for="item in companyOptions"
                   :key="item.value"
@@ -75,9 +95,12 @@
                 >
                 </el-option>
               </el-select>
-            </el-form-item>
-            <el-form-item label="部门名称：">
-              <el-select v-model="form.depart_name" placeholder="请选择">
+            </el-form-item> -->
+            <!-- <el-form-item label="部门名称：">
+              <el-select
+                v-model="form.depart_name"
+                placeholder="请选择"
+              >
                 <el-option
                   v-for="item in departOptions"
                   :key="item.value"
@@ -86,56 +109,85 @@
                 >
                 </el-option>
               </el-select>
-            </el-form-item>
-            <el-form-item label-width="45px" label="备注：">
+            </el-form-item> -->
+            <!-- <el-form-item
+              label-width="45px"
+              label="备注："
+            >
               <el-input
                 class="note"
                 type="textarea"
                 :rows="2"
                 v-model="form.note"
               ></el-input>
-            </el-form-item>
-            <el-form-item
+            </el-form-item> -->
+            <!-- <el-form-item
               label-width="45px"
               style="width: 370px"
               :model="form.attachment"
               label="附件："
             >
-              <el-upload class="attachment" drag :action="action" multiple>
+              <el-upload
+                class="attachment"
+                drag
+                :action="action"
+                multiple
+              >
                 <i class="el-icon-upload"></i>
                 <div class="el-upload__text">
                   将文件拖到此处，或<em>点击上传</em>
                 </div>
-                <div class="el-upload__tip" slot="tip" style="display: flex">
+                <div
+                  class="el-upload__tip"
+                  slot="tip"
+                  style="display: flex"
+                >
                   请上传大小不小于
                   <p style="color: crimson">5MB</p>
                   ，格式为 <P style="color: crimson">png/jpd/jpeg</P>的文件
                 </div>
               </el-upload>
-            </el-form-item>
+            </el-form-item> -->
           </el-form>
         </el-scrollbar>
       </div>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" style="background: #2ea8e6">下一个</el-button>
+      <div
+        slot="footer"
+        class="dialog-footer"
+      >
+        <!-- <el-button
+          type="primary"
+          style="background: #2ea8e6"
+        >下一个</el-button> -->
+        <!-- @click="resetForm('form')" -->
         <el-button
           style="background: #2ea8e6; color: #fff"
-          @click="resetForm('form')"
-          >重置</el-button
-        >
+          @click="close"
+        >取消</el-button>
         <el-button
           type="primary"
           style="background: #2ea8e6"
           @click="submitForm('form')"
-          >确认</el-button
-        >
+        >确认</el-button>
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
+import api from "@/api/deviceManagement/api";
 export default {
+  props: {
+    update: {
+      type: Function,
+    },
+    selectedType: {
+      type: Object,
+    },
+    deviceInfo: {
+      type: Object,
+    },
+  },
   data() {
     return {
       dialogVisible: false,
@@ -200,19 +252,114 @@ export default {
     resetForm(formName) {
       this.$refs[formName].resetFields();
     },
-    submitForm(formName) {
-      this.$refs[formName].validate((valid) => {
-        if (valid) {
-          //
-        }
+    submitForm() {
+      const loading = this.$loading({
+        lock: true,
+        text: "更新中，请稍后！",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)",
+        customClass: "systemConfigLoading",
       });
+      api
+        .updateDeviceInType(this.form)
+        .then((result) => {
+          loading.close();
+          if (result.data.code == 0) {
+            this.$message({
+              type: "success",
+              message: "设备更新成功!",
+            });
+            this.update();
+            this.dialogVisible = false;
+          } else {
+            this.$message({
+              type: "error",
+              message: "设备更新失败!",
+            });
+          }
+        })
+        .catch((err) => {
+          loading.close();
+          this.$message({
+            type: "error",
+            message: "设备更新失败!",
+          });
+        });
+    },
+    getDeviceTypeList() {
+      let that = this;
+      return new Promise((resolve, reject) => {
+        api.getDeviceTypeList().then((result) => {
+          that.deviceTypeOptions = result.data.data;
+          resolve();
+        });
+      });
+    },
+
+    getDeviceDetails() {
+      api
+        .getDeviceInfoInType({
+          id: this.deviceInfo.id,
+        })
+        .then((result) => {
+          if (result.data.code == 0) {
+            // device_id: null,
+            // device_location: null,
+            // device_name: "漏水传感器2",
+            // device_type: 5,
+            // gateway_code: "43DA309306400E31",
+            // gateway_ip: null,
+            // id: 1,
+            // loop_detail: "0",
+            // status: 0,
+            // usage: null,
+
+            let form = {
+              // device_id: null,
+              device_location: null,
+              device_name: "",
+              // device_type: 5,
+              // gateway_code: "43DA309306400E31",
+              // gateway_ip: null,
+              id: 1,
+              // loop_detail: "0",
+              // status: 0,
+              // usage: null,
+            };
+            for (const key in form) {
+              if (Object.hasOwnProperty.call(form, key)) {
+                if (result.data.data[key] == null) {
+                  form[key] = "";
+                }
+                form[key] = result.data.data[key];
+              }
+            }
+            this.form = form;
+          }
+        })
+        .catch((err) => {});
+    },
+    close() {
+      this.dialogVisible = false;
+    },
+  },
+  watch: {
+    deviceInfo(newVal) {
+      if (newVal != null && Object.getOwnPropertyNames(newVal).length != 0)
+        this.getDeviceTypeList();
+      this.getDeviceDetails();
     },
   },
 };
 </script>
 <style lang="less" scoped>
-/deep/.el-dialog {
-  height: 725px !important;
+// /deep/.el-dialog {
+//   height: 725px !important;
+// }
+
+.container {
+  height: 230px;
+  padding: 10px 10px;
 }
 
 .el-form {
@@ -250,10 +397,10 @@ export default {
   }
 }
 
-.dialog-footer {
-  display: flex;
-  margin-top: 10px;
-}
+// .dialog-footer {
+//   // display: flex;
+//   // margin-top: 10px;
+// }
 
 // /deep/.el-dialog {
 //   height: 30vh;

src/views/deviceManagement/messageDailog/newDeviceType.vue → src/views/deviceManagement/messageDialog/newDeviceType.vue

@@ -41,7 +41,7 @@
 import api from "@/api/deviceManagement/api";
 export default {
   props: {
-    getDeviceTypeList: {
+    update: {
       type: Function,
     },
   },
@@ -67,7 +67,7 @@ export default {
             that.$message.success("类别添加成功!");
             that.dialogVisible = false;
             // 刷新列表
-            that.getDeviceTypeList();
+            that.update();
           } else {
             that.$message.error("类别添加失败!");
           }

src/views/systemManagement/indexConfiguration/dialog/editDialog.vue

@@ -0,0 +1,215 @@
+<template>
+  <div>
+    <el-dialog
+      v-dialog-drag
+      class="dialog"
+      title="指标编辑"
+      :visible.sync="dialogVisible"
+      width="460px"
+      left
+      @before-close="close"
+    >
+      <el-divider></el-divider>
+      <div class="container">
+        <el-scrollbar style="height: 100%">
+          <el-form
+            ref="form"
+            :model="form"
+            label-position="left"
+            label-width="75px"
+          >
+            <el-form-item label="指标名称：">
+              <el-input v-model="form.name"></el-input>
+            </el-form-item>
+            <el-form-item label="默认值：">
+              <el-input
+                type="number"
+                v-model="form.defaultValue"
+              ></el-input>
+            </el-form-item>
+            <el-form-item label="比较值：">
+              <el-input
+                type="number"
+                v-model="form.compare"
+              ></el-input>
+            </el-form-item>
+            <el-form-item label="计算规则：">
+              <el-input v-model="form.rule"></el-input>
+            </el-form-item>
+          </el-form>
+        </el-scrollbar>
+      </div>
+      <div
+        slot="footer"
+        class="dialog-footer"
+      >
+        <el-button
+          style="background: #2ea8e6; color: #fff"
+          @click="close"
+        >取消</el-button>
+        <el-button
+          type="primary"
+          style="background: #2ea8e6"
+          @click="submitForm('form')"
+        >确认</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import api from "@/api/systemConfig/api";
+export default {
+  props: {
+    update: {
+      type: Function,
+    },
+    beforeFrom: {
+      type: Object,
+    },
+  },
+  data() {
+    return {
+      dialogVisible: false,
+      form: {},
+      action: "",
+    };
+  },
+  methods: {
+    submitForm() {
+      const loading = this.$loading({
+        lock: true,
+        text: "更新中，请稍后！",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)",
+        customClass: "systemConfigLoading",
+      });
+      this.form.defaultValue =
+        this.form.defaultValue.replace(/ /g, "") == ""
+          ? "0"
+          : this.form.compare;
+      this.form.compare =
+        this.form.compare.replace(/ /g, "") == "" ? "0" : this.form.compare;
+      api
+        .updateIndex({ data: JSON.stringify(this.form) })
+        .then((result) => {
+          loading.close();
+          if (result.data.code == 0) {
+            this.$message({
+              type: "success",
+              message: "指标更新成功!",
+            });
+            this.update();
+            this.dialogVisible = false;
+          } else {
+            this.$message({
+              type: "error",
+              message: "指标更新失败!",
+            });
+          }
+        })
+        .catch((err) => {
+          loading.close();
+          this.$message({
+            type: "error",
+            message: "指标更新失败!",
+          });
+        });
+    },
+    close() {
+      this.dialogVisible = false;
+    },
+  },
+  watch: {
+    beforeFrom(newVal) {
+      this.form = JSON.parse(JSON.stringify(newVal));
+    },
+  },
+};
+</script>
+<style lang="less" scoped>
+.container {
+  height: 230px;
+  padding: 10px 10px;
+}
+
+.el-form {
+  .el-form-item {
+    margin: 10px 0 0 40px;
+    width: 400px;
+
+    /deep/.el-form-item__label {
+      padding: 0;
+      font-size: 15px;
+    }
+
+    /deep/.el-input__inner {
+      width: 300px;
+      height: 30px;
+    }
+
+    .life {
+      /deep/.el-input__inner {
+        width: 270px !important;
+      }
+    }
+
+    .person {
+      /deep/.el-input__inner {
+        width: 285px !important;
+      }
+    }
+
+    .note {
+      /deep/.el-input__inner {
+        width: 330px !important;
+      }
+    }
+  }
+}
+
+// .dialog-footer {
+//   // display: flex;
+//   // margin-top: 10px;
+// }
+
+// /deep/.el-dialog {
+//   height: 30vh;
+// }
+
+// /deep/.el-dialog__title {
+//   margin-right: 330px;
+// }
+/deep/.el-dialog__header {
+  padding-bottom: 0;
+  color: #333333;
+}
+
+/deep/.el-dialog__headerbtn {
+  font-size: 25px;
+}
+
+/deep/.el-dialog__body {
+  padding: 0;
+}
+
+/deep/.el-divider--horizontal {
+  display: block;
+  height: 1px;
+  width: 95%;
+  margin: 0;
+  margin-left: 2.5%;
+}
+
+/deep/.el-dialog__footer {
+  padding: 0;
+}
+
+.el-button {
+  width: 100px;
+  height: 30px;
+  text-align: center;
+  margin: 30px;
+  padding: 5px;
+}
+</style>

src/views/systemManagement/indexConfiguration/index.vue

@@ -1,42 +1,437 @@
 <template>
-    <div class="container">
-        <div class="header">
-            <el-button>智能看板</el-button>
-            <el-button>智享生活</el-button>
-            <el-button>智慧办公</el-button>
-            <el-button>数智双碳</el-button>
-            <el-button>智慧安防</el-button>
-        </div>
-        <smart-board></smart-board>
+  <div class="container">
+    <div class="header">
+      <el-menu
+        :default-active="activeIndex"
+        class="el-menu-demo"
+        mode="horizontal"
+        @select="handleSelect"
+      >
+        <el-menu-item
+          v-for="(item, index) in indexList"
+          :key="index"
+          :index="item.id+''"
+        >
+          <el-button round>{{item.name}}</el-button>
+        </el-menu-item>
+      </el-menu>
+
+    </div>
+    <div class="left-pane">
+      <el-input
+        placeholder="请输入关键字"
+        suffix-icon="el-icon-search"
+        v-model="filterText"
+      ></el-input>
+      <div class="tree_container">
+
+        <el-tree
+          ref="tree"
+          :data="indexSecondList"
+          :props="defaultProps"
+          node-key="id"
+          default-expand-all
+          :filter-node-method="filterNode"
+          @node-click="handleNodeClick"
+        >
+          <span slot-scope="{node}">
+            <span style="padding-left: 10px; vertical-align: text-bottom;">{{ node.label }}</span>
+          </span>
+        </el-tree>
+      </div>
+
+    </div>
+    <div
+      class="right-pane"
+      v-if="tableData.length!=0"
+    >
+      <div>
+        <p class="info">{{selectedIndexItem.name}}</p>
+        <!-- <el-button class="new_button">新建</el-button> -->
+      </div>
+      <el-table
+        ref="multipleTable"
+        :data="tableData"
+        tooltip-effect="dark"
+        :header-cell-style="{ textAlign: 'center' }"
+        :cell-style="{ textAlign: 'center' }"
+        style="width: 100%"
+      >
+        <!-- @selection-change="handleSelectionChange" -->
+        <!-- <el-table-column
+          type="selection"
+          width="50"
+        >
+        </el-table-column> -->
+        <el-table-column
+          prop="name"
+          label="指标名称"
+        >
+        </el-table-column>
+        <!-- <el-table-column
+          prop="indexUnit"
+          label="指标单位"
+        >
+        </el-table-column> -->
+        <el-table-column
+          prop="defaultValue"
+          label="默认值"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="compare"
+          label="比较值"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="rule"
+          label="计算规则"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="operation"
+          label="操作"
+        >
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="text"
+              @click="edit(scope.row)"
+            >编辑</el-button>
+          </template>
+
+        </el-table-column>
+      </el-table>
     </div>
+    <div class="bottom">
+      <page
+        class="page"
+        :paginationData="paginationData"
+      ></page>
+    </div>
+    <editDialog
+      ref="editDialog"
+      v-bind="{
+        update:getSecondListAfterUpdate,
+        beforeFrom:selectedSingleIndex
+      }"
+    ></editDialog>
+  </div>
+
 </template>
 
 <script>
-import SmartBoard from './smartBoard'
+import page from "@/components/pagination/index";
+// import dropdown from "@/components/Dropdown/index";
+
+import editDialog from "./dialog/editDialog.vue";
+
+import api from "@/api/systemConfig/api";
 export default {
-    components: { SmartBoard },
-    data() {
-        return {}
-    }
-}
+  components: {
+    editDialog,
+    page,
+    // dropdown,
+  },
+  data() {
+    return {
+      total: 0,
+      filterText: "",
+      show: true,
+      value: "test",
+
+      activeIndex: "1",
+      indexList: [],
+      indexSecondList: [],
+      defaultProps: {
+        children: "children",
+        label: "name",
+      },
+      selectedIndexItem: null,
+      tableData: [],
+      selectedSingleIndex: null,
+
+      paginationData: {
+        pageSize: 10,
+        pagerCount: 5,
+        currentPage: 1,
+        pageSizes: [5, 10, 20, 30],
+        total: 0,
+        currentChange: (val) => {
+          this.handlePageChange(val);
+        },
+        handleSizeChange: (val) => {
+          this.handleSizeChange(val);
+        },
+      },
+    };
+  },
+  mounted() {
+    this.getIndexList();
+  },
+  watch: {
+    filterText(val) {
+      this.$refs.tree.filter(val);
+    },
+  },
+  methods: {
+    filterNode(value, data) {
+      if (!value) return true;
+      return data.name.indexOf(value) !== -1;
+    },
+    handleSelect(key, keyPath) {
+      this.activeIndex = key;
+      this.indexSecondList =
+        this.indexList[Number(this.activeIndex) - 1].children;
+    },
+    handleNodeClick(data, node) {
+      this.selectedIndexItem = data;
+      this.resetPageConfig();
+      this.handlePageChange(1);
+    }, 
+
+    handlePageChange(val) {
+      this.paginationData.currentPage = val;
+      this.getSecondList({
+        parent_id: this.selectedIndexItem.id,
+        page_size: this.paginationData.pageSize,
+        page: val,
+      })
+        .then((result) => {})
+        .catch((err) => {});
+    },
+    handleSizeChange(val) {
+      this.paginationData.pageSize = val;
+      this.getSecondList({
+        parent_id: this.selectedIndexItem.id,
+        page_size: val,
+        page: this.paginationData.currentPage,
+      })
+        .then((result) => {})
+        .catch((err) => {});
+    },
+
+    resetPageConfig(obj) {
+      let t = {
+        pageSize: 10,
+        pagerCount: 5,
+        currentPage: 1,
+        pageSizes: [5, 10, 20, 30],
+        total: 30,
+        currentChange: (val) => {
+          this.handlePageChange(val);
+        },
+        handleSizeChange: (val) => {
+          this.handleSizeChange(val);
+        },
+      };
+      if (obj != null || obj != undefined) {
+        for (const key in obj) {
+          t[key] = obj[key];
+        }
+        this.paginationData = t;
+      }
+    },
+
+    getIndexList() {
+      let that = this;
+      return new Promise((resolve, reject) => {
+        api
+          .getIndexList({ id: -1 })
+          .then((result) => {
+            that.indexList = result.data.data.data;
+            that.indexSecondList =
+              that.indexList[Number(that.activeIndex) - 1].children;
+            resolve();
+          })
+          .catch((err) => {});
+      });
+    },
+
+    getSecondList(param) {
+      let that = this;
+      return new Promise((resolve, reject) => {
+        api
+          .getIndexSecondList(param)
+          .then((result) => {
+            that.tableData = result.data.data.data.list;
+            that.paginationData.total = result.data.data.data.total
+            // "compare": null,
+            // "defaultValue": "0",
+            // "id": 4,
+            // "isDel": 0,
+            // "name": "\u4eca\u65e5\u79bb\u5f00\u5927\u697c(\u4eba)",
+            // "parentId": 7,
+            // "remark": null,
+            // "rule": null,
+            // "units": "",
+            // "useSite": null
+          })
+          .catch((err) => {});
+      });
+    },
+
+    getSecondListAfterUpdate() {
+      this.resetPageConfig({
+        currentPage: 1,
+      });
+      this.handlePageChange(1);
+    },
+
+    edit(data) {
+      this.$refs.editDialog.dialogVisible = true;
+      this.selectedSingleIndex = data;
+    },
+  },
+};
 </script>
+
 <style lang="less" scoped>
 .container {
-    position: relative;
-    height: 100%;
-    background-color: rgba(255, 255, 255, 1);
-    text-align: center;
-    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
-}
+  position: relative;
+  width: 100%;
+  height: 100%;
+  line-height: 20px;
+  background-color: rgba(255, 255, 255, 1);
+  color: rgba(16, 16, 16, 1);
+  font-size: 14px;
 
-.header {
-    text-align: left;
+  .header {
+    .el-menu-item {
+      font-size: 16px;
+    }
+    .el-menu.el-menu--horizontal {
+      border-bottom: 0px solid #e6e6e6;
+      .el-menu-item {
+        border-bottom: 0px;
+        padding-left: 10px;
+        padding-right: 10px;
+        .el-button {
+          color: #606266;
+          border-color: #ebebeb;
+          border: 1px solid #ebebeb;
+        }
+      }
+      > .el-menu-item.is-active {
+        border-bottom: 0px;
+        .el-button {
+          color: #ffffff;
+          border-color: #2ea8e6;
+          background-color: #2ea8e6;
+        }
+      }
+    }
+  }
+
+  .left-pane {
+    width: 300px;
+    padding: 15px;
+    height: calc(100% - 90px);
+    display: inline-block;
+
+    .tree_container {
+      height: calc(100% - 45px);
+      margin-top: 10px;
+      margin-bottom: 10px;
+      overflow: hidden;
+      overflow-y: auto;
+      .el-tree {
+        height: 100%;
+        background-color: #fafafa;
+
+        /deep/.el-tree-node__content {
+          align-items: center;
+          height: 30px;
+          cursor: pointer;
+          font-size: 16px;
+          position: relative;
+          color: #999999;
+          padding-top: 10px;
+          padding-left: 30px !important;
+
+          .operate_btns {
+            position: absolute;
+            right: 20px;
+            display: none;
+          }
+
+          &:hover,
+          :focus-within {
+            background-color: #f7fbff;
+
+            .operate_btns {
+              display: inline;
+            }
+          }
+        }
+
+        /deep/.el-tree-node__children {
+          .el-tree-node__content {
+            padding-left: 60px !important;
+          }
+        }
+      }
+    }
+  }
+
+  .right-pane {
+    box-sizing: border-box;
     padding: 15px;
-    font-size: 25px;
-    margin-left: 15px;
+    width: calc(100% - 330px);
+    height: calc(100% - 120px);
+    display: inline-block;
+    vertical-align: top;
+    .info {
+      text-align: left;
+      padding: 10px;
+      font-size: 25px;
+    }
+
+    .new_button {
+      padding: 5px;
+      width: 100px;
+      position: relative;
+      left: 42%;
+      text-align: center;
+      font-size: 16px;
+      color: #fff;
+      background: #3da0d6;
+    }
+
+    .el-table {
+      margin-top: 10px;
+    }
+
+    .el-select {
+      width: 80px;
+      margin-right: 20px;
+    }
+  }
+
+  .bottom {
+    position: absolute;
+    left: 345px;
+    right: 16px;
+    bottom: 30px;
+    height: 50px;
+    line-height: 20px;
+    text-align: center;
+
+    .checkbox {
+      position: absolute;
+      left: 30px;
+      top: 15px;
+      font-size: 14px;
+    }
 
-    .el-button {
-        border-radius: 50px;
+    .check-cancel {
+      position: absolute;
+      // line-height: 20px;
+      font-size: 14px;
+      text-align: center;
+      left: 140px;
+      top: 10px;
     }
+  }
 }
 </style>

src/views/systemManagement/indexConfiguration/smartBoard.vue

@@ -1,288 +0,0 @@
-<template>
-    <div class="sub-container">
-        <div class="left-pane">
-            <el-input placeholder="请输入关键字" suffix-icon="el-icon-search" v-model="filterText"></el-input>
-            <el-tree ref="tree" :data="data" :props="defaultProps" node-key="id" default-expand-all
-                :filter-node-method="filterNode" @node-click="handleNodeClick">
-                <span slot-scope="{node,data}">
-                    <el-image :src="data.url"></el-image>
-                    <span style="padding-left: 10px; vertical-align: text-bottom;">{{ node.label }}</span>
-                    <span class="operate_btns">
-                        <dropdown :events="data.id ? menuEvents : subMenuEvents" :data="{ node, data }"
-                            @itemClick="dropDownClick"></dropdown>
-                    </span>
-                </span>
-            </el-tree>
-        </div>
-        <div class="right-pane">
-            <div>
-                <p class="info">指标列表</p>
-                <el-button class="new_button">新建</el-button>
-            </div>
-            <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark"
-                :header-cell-style="{ textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" style="width: 100%"
-                @selection-change="handleSelectionChange">
-                <el-table-column type="selection" width="50">
-                </el-table-column>
-                <el-table-column prop="indexName" label="指标名称">
-                </el-table-column>
-                <el-table-column prop="indexUnit" label="指标单位">
-                </el-table-column>
-                <el-table-column prop="defaultValue" label="默认值">
-                </el-table-column>
-                <el-table-column prop="calculateRules" label="计算规则">
-                </el-table-column>
-                <el-table-column prop="operation" label="操作">
-                    <el-select v-model="value">
-                        <el-option value="test"></el-option>
-                    </el-select>
-                    <el-button size="mini" type="text">删除</el-button>
-                </el-table-column>
-            </el-table>
-        </div>
-        <div class="bottom">
-
-            <page class="page" :paginationData="paginationData"></page>
-        </div>
-    </div>
-</div></template>
-
-<script>
-import page from '@/components/pagination/index';
-import dropdown from '@/components/Dropdown/index';
-export default {
-    components: { page, dropdown },
-    data() {
-        return {
-            total: 0,
-            filterText: '',
-            show: true,
-            value: 'test',
-            data: [
-                {
-                    id:1,
-                    label: '人员画像',
-                    url: require('@/assets/tree/strategy/louceng@3x.png'),
-                    children: [{
-                        url: require('@/assets/tree/strategy/huiyishi@3x.png'),
-                        label: '人员态势',
-                    }, {
-                        url: require('@/assets/tree/strategy/huiyishi@3x.png'),
-                        label: '餐厅消费态势'
-                    }, {
-                        url: require('@/assets/tree/strategy/huiyishi@3x.png'),
-                        label: '商超消费态势'
-                    }]
-                },
-                {
-                    id:2,
-                    url: require('@/assets/tree/strategy/louceng@3x.png'),
-                    label: '能源画像',
-                    children: [{
-                        url: require('@/assets/tree/strategy/huiyishi@3x.png'),
-                        label: '用电态势',
-                    }, {
-                        url: require('@/assets/tree/strategy/huiyishi@3x.png'),
-                        label: '用水态势'
-                    }, {
-                        url: require('@/assets/tree/strategy/huiyishi@3x.png'),
-                        label: '用热态势'
-                    }]
-                }
-            ],
-            menuEvents: [
-                { label: '新建', funcName: 'addNode' }
-            ],
-            subMenuEvents: [
-                { label: '新建', funcName: 'addNode' },
-                { label: '上移', funcName: 'moveUp' },
-                { label: '下移', funcName: 'moveDown' },
-                { label: '编辑', funcName: 'editNode' },
-                { label: '删除', funcName: 'removeNode' }
-            ],
-            tableData: [
-                {
-                    indexName: '进入大楼人数',
-                    indexUnit: '人数/时间',
-                    defaultValue: '1000',
-                    calculateRules: '测试中。。。',
-                    operation: '',
-                },
-                {
-                    indexName: '进入大楼人数',
-                    indexUnit: '人数/时间',
-                    defaultValue: '实时',
-                    calculateRules: '测试中。。。',
-                    operation: '',
-                },
-                {
-                    indexName: '进入大楼人数',
-                    indexUnit: '人数/时间',
-                    defaultValue: '1000',
-                    calculateRules: '测试中。。。',
-                    operation: '',
-                }
-            ],
-            defaultProps: {
-                children: 'children',
-                label: 'label'
-            },
-            paginationData: {
-                pageSize: 10,
-                pagerCount: 5,
-                currentPage: 1,
-                pageSizes: [5, 10, 20, 30],
-                total: 30,
-                currentChange: (val) => {
-                    this.getTableData(val);
-                },
-                handleSizeChange: (val) => {
-                    this.handleSizeChange(val);
-                },
-            },
-        }
-    },
-    watch: {
-        filterText(val) {
-            this.$refs.tree.filter(val);
-        }
-    },
-    methods: {
-        filterNode(value, data) {
-            if (!value) return true;
-            return data.label.indexOf(value) !== -1;
-        },
-        handleNodeClick() {
-            //
-        },
-        handleSelectionChange() {
-            //
-        },
-        dropDownClick(){},
-        getTableData() {
-            this.tableData = [];
-            getUserList()
-        },
-        handleSizeChange(val) {
-            console.log(`每页 ${val} 条`);
-            this.currentPageSize = val;
-            this.getTableData(this.currentPage);
-        },
-    }
-}
-</script>
-
-<style lang="less" scoped>
-.sub-container {
-    position: relative;
-    height: calc(100% - 70px);
-    line-height: 20px;
-    background-color: rgba(255, 255, 255, 1);
-    color: rgba(16, 16, 16, 1);
-    font-size: 14px;
-    text-align: center;
-    display: flex;
-
-    .left-pane {
-        width: 300px;
-        padding: 15px;
-        height: calc(100% - 30px);
-
-        .el-tree {
-            margin-top: 10px;
-            height: calc(98% - 30px);
-            background-color: #FAFAFA;
-
-
-            /deep/.el-tree-node__content {
-                align-items: center;
-                height: 30px;
-                cursor: pointer;
-                font-size: 16px;
-                position: relative;
-                color: #999999;
-                padding-top: 10px;
-                padding-left: 30px !important;
-
-                .operate_btns {
-                    position: absolute;
-                    right: 20px;
-                    display: none;
-                }
-
-                &:hover,
-                :focus-within {
-                    background-color: #f7fbff;
-
-                    .operate_btns {
-                        display: inline;
-                    }
-                }
-            }
-
-            /deep/.el-tree-node__children {
-                .el-tree-node__content {
-                    padding-left: 60px !important;
-                }
-            }
-        }
-    }
-
-    .right-pane {
-        width: calc(100% - 330px);
-
-        .info {
-            text-align: left;
-            padding: 10px;
-            font-size: 25px;
-        }
-
-        .new_button {
-            padding: 5px;
-            width: 100px;
-            position: relative;
-            left: 42%;
-            text-align: center;
-            font-size: 16px;
-            color: #fff;
-            background: #3da0d6;
-        }
-
-        .el-table {
-            margin-top: 10px;
-        }
-
-        .el-select {
-            width: 80px;
-            margin-right: 20px;
-        }
-    }
-
-    .bottom {
-        position: absolute;
-        left: 330px;
-        right: 16px;
-        bottom: 20px;
-        height: 50px;
-        line-height: 20px;
-        background-color: rgba(255, 255, 255, 1);
-        text-align: center;
-
-        .checkbox {
-            position: absolute;
-            left: 30px;
-            top: 15px;
-            font-size: 14px;
-        }
-
-        .check-cancel {
-            position: absolute;
-            // line-height: 20px;
-            font-size: 14px;
-            text-align: center;
-            left: 140px;
-            top: 10px;
-        }
-    }
-}
-</style>

src/views/systemManagement/infoConfiguration/dailog/createUpdateFloor.vue

@@ -1,227 +0,0 @@
-<template>
-  <div>
-    <el-dialog
-      v-dialog-drag
-      class="dialog"
-      title="更新楼层配置"
-      :visible.sync="dialogVisible"
-      @before-close="close"
-      width="500px"
-      left
-    >
-      <el-divider></el-divider>
-      <el-form
-        label-position="left"
-        label-width="80px"
-      >
-        <el-form-item label="楼层位置：">
-          <el-select
-            v-model="form.floorIndex"
-            placeholder="请选择"
-          >
-            <el-option
-              v-for="item in floorTotal"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            >
-            </el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item label="楼层用途：">
-          <el-select
-            v-model="form.floorUseIndex"
-            placeholder="请选择"
-          >
-            <el-option
-              v-for="item in floorUseTotal"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
-            >
-            </el-option>
-          </el-select>
-        </el-form-item>
-        <el-form-item label="备注：">
-          <el-input
-            type="textarea"
-            :rows="2"
-            placeholder="请输入内容"
-            v-model="form.beizhu"
-          >
-          </el-input>
-        </el-form-item>
-        <el-form-item
-          label="附件："
-          style="display:block"
-        >
-          <el-row>
-            <el-image @click="uploadImage"></el-image>
-          </el-row>
-          <el-row>
-            <div>
-              请上传大小不小于<span style="color:#ff0000;">5MB</span>格式为<span style="color:#ff0000;">png/jpg/jpeg</span>的文件
-            </div>
-          </el-row>
-        </el-form-item>
-      </el-form>
-      <div
-        slot="footer"
-        class="dialog-footer"
-      >
-        <el-button
-          @click="close"
-          type="primary"
-        >取消</el-button>
-        <el-button
-          type="primary"
-          @click="addType"
-        >确认</el-button>
-      </div>
-    </el-dialog>
-  </div>
-</template>
-
-<script>
-export default {
-  props: {
-    beforeForm: {
-      type: Object,
-    },
-  },
-  data() {
-    let floorTotal = [];
-    for (let i = 1; i < 31; i++) {
-      floorTotal.push({
-        value: i + "",
-        label: i + "F",
-      });
-    }
-
-    return {
-      value: "",
-      dialogVisible: false,
-      form: {
-        floorIndex: "",
-        floorUseIndex: "",
-        beizhu: "",
-        fujian: "",
-      },
-
-      floorTotal: floorTotal,
-
-      floorUseTotal: [
-        {
-          value: "1",
-          label: "办公",
-        },
-        {
-          value: "2",
-          label: "会议",
-        },
-        {
-          value: "3",
-          label: "文娱",
-        },
-      ],
-    };
-  },
-  methods: {
-    addType() {
-      let that = this;
-      // api
-      //   .addNewDeviceType({
-      //     id: "",
-      //     name: this.value,
-      //   })
-      //   .then((result) => {
-      //     if (result.data.code == 0) {
-      //       that.$message.success("类别添加成功!");
-      //       that.dialogVisible = false;
-      //       // 刷新列表
-      //       that.getDeviceTypeList();
-      //     } else {
-      //       that.$message.error("类别添加失败!");
-      //     }
-      //   })
-      //   .catch((err) => {
-      //     that.$message.error("类别添加失败!");
-      //   });
-    },
-    uploadImage() {},
-    close() {
-      this.form = {
-        floorIndex: "",
-        floorUseIndex: "",
-        beizhu: "",
-        fujian: "",
-      };
-      this.dialogVisible = false;
-    },
-  },
-  watch: {
-    beforeForm(newVal) {
-      this.form = newVal;
-    },
-  },
-};
-</script>
-<style lang="less" scoped>
-.el-select {
-  width: 280px;
-}
-
-.el-form {
-  .el-form-item {
-    margin-inline: 20px;
-  }
-
-  /deep/.el-form-item__label {
-    padding: 0;
-  }
-
-  /deep/.el-form-item__content {
-    // display: flex;
-    text-align: left;
-  }
-}
-
-/deep/.el-dialog__header {
-  padding-bottom: 0;
-  color: #333333;
-}
-
-/deep/.el-dialog__headerbtn {
-  font-size: 25px;
-}
-
-/deep/.el-dialog__body {
-  padding: 0;
-}
-
-/deep/.el-divider--horizontal {
-  display: block;
-  height: 1px;
-  width: 95%;
-  margin: 0;
-  margin-left: 2.5%;
-}
-
-// /deep/.el-dialog__footer {
-//   // margin-top: 60px;
-// }
-
-.el-button {
-  width: 100px;
-  height: 30px;
-  text-align: center;
-  padding: 5px;
-}
-.el-image {
-  width: 380px;
-  height: 120px;
-  cursor: pointer;
-}
-// .el-image + div {
-// }
-</style>

src/views/systemManagement/infoConfiguration/dailog/historyFloor.vue

@@ -1,105 +0,0 @@
-<template>
-  <el-dialog
-    v-dialog-drag
-    class="dialog"
-    title="历史记录"
-    :visible.sync="dialogVisible"
-    @before-close="close"
-    width="500px"
-    left
-  >
-    <el-divider></el-divider>
-    <el-form
-      label-position="left"
-      label-width="80px"
-    >
-      <el-form-item label="楼层位置：">
-        <el-select
-          v-model="form.floorIndex"
-          placeholder="请选择"
-        >
-          <el-option
-            v-for="item in floorTotal"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          >
-          </el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="楼层用途：">
-        <el-select
-          v-model="form.floorUseIndex"
-          placeholder="请选择"
-        >
-          <el-option
-            v-for="item in floorUseTotal"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
-          >
-          </el-option>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="备注：">
-        <el-input
-          type="textarea"
-          :rows="2"
-          placeholder="请输入内容"
-          v-model="form.beizhu"
-        >
-        </el-input>
-      </el-form-item>
-      <el-form-item
-        label="附件："
-        style="display:block"
-      >
-        <el-row>
-          <el-image @click="uploadImage"></el-image>
-        </el-row>
-        <el-row>
-          <div>
-            请上传大小不小于<span style="color:#ff0000;">5MB</span>格式为<span style="color:#ff0000;">png/jpg/jpeg</span>的文件
-          </div>
-        </el-row>
-      </el-form-item>
-    </el-form>
-    <div
-      slot="footer"
-      class="dialog-footer"
-    >
-      <el-button
-        @click="close"
-        type="primary"
-      >取消</el-button>
-      <el-button
-        type="primary"
-        @click="addType"
-      >确认</el-button>
-    </div>
-  </el-dialog>
-</template>
-<script>
-export default {
-  props: {
-    floorInfo: {
-      type: Object,
-    },
-  },
-  data() {
-    return {};
-  },
-  methods: {
-    
-  },
-  watch: {
-    floorInfo() {
-
-    },
-  },
-};
-</script>
-
- 
-<style lang="less" scoped>
-</style>

src/views/systemManagement/infoConfiguration/dailog/createFloor.vue → src/views/systemManagement/infoConfiguration/dialog/createFloor.vue

@@ -2,7 +2,7 @@
   <div>
     <el-dialog
       v-dialog-drag
-      class="dialog"
+      class="create_floor_dialog"
       title="新建楼层配置"
       :visible.sync="dialogVisible"
       @before-close="close"
@@ -178,61 +178,61 @@ export default {
 
  
 <style lang="less" scoped>
-.el-select {
-  width: 280px;
-}
-
-.el-form {
-  .el-form-item {
-    margin-inline: 20px;
+.create_floor_dialog {
+  .el-select {
+    width: 280px;
   }
 
-  /deep/.el-form-item__label {
-    padding: 0;
-  }
+  .el-form {
+    .el-form-item {
+      margin-inline: 20px;
+    }
 
-  /deep/.el-form-item__content {
-    // display: flex;
-    text-align: left;
+    /deep/.el-form-item__label {
+      padding: 0;
+    }
+
+    /deep/.el-form-item__content {
+      // display: flex;
+      text-align: left;
+    }
   }
-}
 
-/deep/.el-dialog__header {
-  padding-bottom: 0;
-  color: #333333;
-}
+  /deep/.el-dialog__header {
+    padding-bottom: 0;
+    color: #333333;
+  }
 
-/deep/.el-dialog__headerbtn {
-  font-size: 25px;
-}
+  /deep/.el-dialog__headerbtn {
+    font-size: 25px;
+  }
 
-/deep/.el-dialog__body {
-  padding: 0;
-}
+  /deep/.el-dialog__body {
+    padding: 0;
+  }
 
-/deep/.el-divider--horizontal {
-  display: block;
-  height: 1px;
-  width: 95%;
-  margin: 0;
-  margin-left: 2.5%;
-}
+  /deep/.el-divider--horizontal {
+    display: block;
+    height: 1px;
+    width: 100%;
+    margin: 0;
+    // margin-left: 2.5%;
+  }
 
-// /deep/.el-dialog__footer {
-//   // margin-top: 60px;
-// }
+  // /deep/.el-dialog__footer {
+  //   // margin-top: 60px;
+  // }
 
-.el-button {
-  width: 100px;
-  height: 30px;
-  text-align: center;
-  padding: 5px;
-}
-.el-image {
-  width: 380px;
-  height: 120px;
-  cursor: pointer;
+  .el-button {
+    width: 100px;
+    height: 30px;
+    text-align: center;
+    padding: 5px;
+  }
+  .el-image {
+    width: 380px;
+    height: 120px;
+    cursor: pointer;
+  }
 }
-// .el-image + div {
-// }
 </style>

src/views/systemManagement/infoConfiguration/dailog/createInfo.vue → src/views/systemManagement/infoConfiguration/dialog/createInfo.vue

@@ -30,7 +30,7 @@
         >取消</el-button>
         <el-button
           type="primary"
-          @click="addType"
+          @click="sure"
         >确认</el-button>
       </div>
     </el-dialog>
@@ -38,10 +38,10 @@
 </template>
 
 <script>
-import api from "@/api/deviceManagement/api";
+import api from "@/api/infoConfig/api";
 export default {
   props: {
-    getDeviceTypeList: {
+    update: {
       type: Function,
     },
   },
@@ -55,27 +55,29 @@ export default {
     };
   },
   methods: {
-    addType() {
+    sure() {
       let that = this;
       api
-        .addNewDeviceType({
-          id: "",
+        .addSecurityInfoConfiguration({
           name: this.value,
         })
         .then((result) => {
           if (result.data.code == 0) {
-            that.$message.success("类别添加成功!");
+            that.$message.success("配置添加成功!");
             that.dialogVisible = false;
             // 刷新列表
-            that.getDeviceTypeList();
+            that.update();
           } else {
-            that.$message.error("类别添加失败!");
+            that.$message.error("配置添加失败!");
           }
         })
         .catch((err) => {
-          that.$message.error("类别添加失败!");
+          that.$message.error("配置添加失败!");
         });
     },
+    close() {
+      this.dialogVisible = false;
+    },
   },
 };
 </script>
@@ -126,9 +128,9 @@ export default {
 /deep/.el-divider--horizontal {
   display: block;
   height: 1px;
-  width: 95%;
+  width: 100%;
   margin: 0;
-  margin-left: 2.5%;
+  // margin-left: 2.5%;
 }
 
 /deep/.el-dialog__footer {

src/views/systemManagement/infoConfiguration/dailog/createPeople.vue → src/views/systemManagement/infoConfiguration/dialog/createPeople.vue

@@ -43,9 +43,9 @@
           >
             <el-option
               v-for="item in peopleArr"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
             >
             </el-option>
           </el-select>
@@ -94,6 +94,7 @@
   </div>
 </template>
 <script>
+import api from "@/api/infoConfig/api";
 export default {
   data() {
     return {
@@ -122,27 +123,21 @@ export default {
           label: "安防",
         },
       ],
-      peopleArr: [
-        {
-          value: "1",
-          label: "张三",
-        },
-        {
-          value: "2",
-          label: "李四",
-        },
-        {
-          value: "3",
-          label: "王五",
-        },
-        {
-          value: "4",
-          label: "张柳",
-        },
-      ],
+      peopleArr: [],
     };
   },
+  mounted() {
+    this.getPersonList();
+  },
   methods: {
+    getPersonList() {
+      api
+        .getPersonList()
+        .then((result) => {
+          this.peopleArr = result.data.data;
+        })
+        .catch((err) => {});
+    },
     sure() {
       let that = this;
       const loading = this.$loading({
@@ -152,23 +147,44 @@ export default {
         background: "rgba(0, 0, 0, 0.7)",
         customClass: "systemConfigLoading",
       });
-      setTimeout(() => {
-        loading.close();
-        that.dialogVisible = true;
-      }, 2000);
+
+      api
+        .addDeviceToType(this.form)
+        .then((result) => {
+          if (result.data.code == 0) {
+            this.update();
+            this.$message.success("添加成功!");
+            this.dialogVisible = false;
+          } else {
+            this.$message.error("添加失败!");
+          }
+        })
+        .catch((err) => {
+          this.$message.error("添加失败!");
+        });
+
+      // setTimeout(() => {
+      loading.close();
+      that.dialogVisible = true;
+      // }, 2000);
     },
     close() {
-      this.form = {
-        personnelCategoryIndex: "",
-        responsibilities: "",
-        people: [],
-        beizhu: "",
-        start: "",
-        stop: "",
-      };
+      // this.form = {
+      //   personnelCategoryIndex: "",
+      //   responsibilities: "",
+      //   people: [],
+      //   beizhu: "",
+      //   start: "",
+      //   stop: "",
+      // };
       this.dialogVisible = false;
     },
   },
+  watch: {
+    dialogVisible(newVal) {
+      if (newVal) this.getPersonList();
+    },
+  },
 };
 </script>
 
@@ -209,9 +225,9 @@ export default {
 /deep/.el-divider--horizontal {
   display: block;
   height: 1px;
-  width: 95%;
+  width: 100%;
   margin: 0;
-  margin-left: 2.5%;
+  // margin-left: 2.5%;
 }
 
 // /deep/.el-dialog__footer {

src/views/systemManagement/infoConfiguration/dialog/createUpdateFloor.vue

@@ -0,0 +1,392 @@
+<template>
+  <el-dialog
+    v-dialog-drag
+    class="update_Floor_dialog"
+    title="更新楼层配置"
+    :visible.sync="dialogVisible"
+    @before-close="close"
+    width="500px"
+    left
+  >
+    <el-dialog
+      class="uploadImageDialog"
+      width="600px"
+      title="上传图片"
+      :visible.sync="innerVisible"
+      @before-close="beforeCloseUploadImage"
+      append-to-body
+    >
+      <el-divider></el-divider>
+      <div>
+        <el-row>
+          <el-col
+            :span="4"
+            class="label"
+          >
+            图片选择：
+          </el-col>
+          <el-col :span="12">
+            <el-input
+              v-model="imageName"
+              disabled
+            ></el-input>
+          </el-col>
+          <el-col
+            :span="1"
+            style="color:transparent"
+          >
+            1
+          </el-col>
+          <el-col :span="7">
+            <el-upload
+              :action="''"
+              :accept="'.jpg, .jpeg, .png, .JPG, .JPEG, .PNG'"
+              :before-upload="beforeUpload"
+            >
+              <el-button
+                type="primary"
+                style="background: #2ea8e6"
+              >选择文件</el-button>
+            </el-upload>
+          </el-col>
+
+        </el-row>
+        <el-row>
+          <el-col
+            :span="4"
+            class="label"
+          >
+            图片预览：
+          </el-col>
+          <el-col
+            :span="18"
+            class="label"
+          >
+            <el-image :src="uploadImageUrl"></el-image>
+          </el-col>
+        </el-row>
+      </div>
+      <div
+        slot="footer"
+        class="dialog-footer"
+      >
+        <el-button
+          @click="beforeCloseUploadImage"
+          type="primary"
+        >取消</el-button>
+        <el-button
+          type="primary"
+          @click="uploadImageFunc"
+        >确认</el-button>
+      </div>
+    </el-dialog>
+    <el-divider></el-divider>
+    <el-form
+      label-position="left"
+      label-width="80px"
+    >
+      <el-form-item label="楼层位置：">
+        <el-select
+          v-model="form.floorIndex"
+          placeholder="请选择"
+        >
+          <el-option
+            v-for="item in floorTotal"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="楼层用途：">
+        <el-select
+          v-model="form.floorUseIndex"
+          placeholder="请选择"
+        >
+          <el-option
+            v-for="item in floorUseTotal"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          >
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="备注：">
+        <el-input
+          type="textarea"
+          :rows="2"
+          placeholder="请输入内容"
+          v-model="form.beizhu"
+        >
+        </el-input>
+      </el-form-item>
+      <el-form-item
+        label="附件："
+        style="display:block"
+      >
+        <el-row>
+          <div @click="uploadImage">
+            <el-image></el-image>
+          </div>
+        </el-row>
+        <el-row>
+          <div>
+            请上传大小不小于<span style="color:#ff0000;">5MB</span>格式为<span style="color:#ff0000;">png/jpg/jpeg</span>的文件
+          </div>
+        </el-row>
+      </el-form-item>
+    </el-form>
+    <div
+      slot="footer"
+      class="dialog-footer"
+    >
+      <el-button
+        @click="close"
+        type="primary"
+      >取消</el-button>
+      <el-button
+        type="primary"
+        @click="sure"
+      >确认</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  props: {
+    beforeForm: {
+      type: Object,
+    },
+  },
+  data() {
+    let floorTotal = [];
+    for (let i = 1; i < 31; i++) {
+      floorTotal.push({
+        value: i + "",
+        label: i + "F",
+      });
+    }
+
+    return {
+      innerVisible: false,
+      uploadImageUrl: "/static/image/floor/area_1F.png",
+      imageName: "",
+
+      value: "",
+      dialogVisible: false,
+      form: {
+        floorIndex: "",
+        floorUseIndex: "",
+        beizhu: "",
+        fujian: "",
+      },
+
+      floorTotal: floorTotal,
+
+      floorUseTotal: [
+        {
+          value: "1",
+          label: "办公",
+        },
+        {
+          value: "2",
+          label: "会议",
+        },
+        {
+          value: "3",
+          label: "文娱",
+        },
+      ],
+    };
+  },
+  methods: {
+    sure() {
+      let that = this;
+      const loading = this.$loading({
+        lock: true,
+        text: "更新中，请稍后！",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)",
+        customClass: "systemConfigLoading",
+      });
+      setTimeout(() => {
+        loading.close();
+        if (parseInt(Math.random() * 10) % 2 == 0) {
+          that.$notify({
+            title: "成功",
+            message: "更新成功！",
+            type: "success",
+          });
+          that.dialogVisible = false;
+        } else {
+          that.$notify.error({
+            title: "错误",
+            message: "更新失败，请重试！",
+          });
+        }
+      }, 2000);
+    },
+    uploadImage() {
+      this.innerVisible = true;
+    },
+    beforeUpload(file) {
+      // console.log(arguments);
+
+      var that = this;
+      this.imageName = file.name;
+
+      // 创建文件读取对象
+      var reader = new FileReader();
+
+      //  将文件读取为DataURL
+      reader.readAsDataURL(file);
+
+      // 读取成功调用方法
+      reader.onload = (e) => {
+        // console.log("读取成功");
+
+        // e.target.result 获取 读取成功后的  文件DataURL
+        that.uploadImageUrl = e.target.result;
+
+        // 如果要将图片上传服务器，就在这里调用后台方法
+      };
+    },
+    beforeCloseUploadImage() {
+      this.imageName = "";
+      this.innerVisible = false;
+    },
+    uploadImageFunc() {
+      let that = this;
+      const loading = this.$loading({
+        lock: true,
+        text: "上传中，请稍后！",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)",
+        customClass: "systemConfigLoading",
+      });
+      setTimeout(() => {
+        loading.close();
+        if (parseInt(Math.random() * 10) % 2 == 0) {
+          that.$notify({
+            title: "成功",
+            message: "图片上传成功！",
+            type: "success",
+          });
+          that.innerVisible = false;
+        } else {
+          that.$notify.error({
+            title: "错误",
+            message: "图片上传失败，请重试！",
+          });
+        }
+      }, 2000);
+    },
+    close() {
+      this.form = {
+        floorIndex: "",
+        floorUseIndex: "",
+        beizhu: "",
+        fujian: "",
+      };
+      this.dialogVisible = false;
+    },
+  },
+  watch: {
+    beforeForm(newVal) {
+      this.form = newVal;
+    },
+  },
+};
+</script>
+<style lang="less" scoped>
+.update_Floor_dialog {
+  .el-select {
+    width: 280px;
+  }
+
+  .el-form {
+    .el-form-item {
+      margin-inline: 20px;
+    }
+
+    /deep/.el-form-item__label {
+      padding: 0;
+    }
+
+    /deep/.el-form-item__content {
+      // display: flex;
+      text-align: left;
+    }
+  }
+
+  /deep/.el-dialog__header {
+    padding-bottom: 0;
+    color: #333333;
+  }
+
+  /deep/.el-dialog__headerbtn {
+    font-size: 25px;
+  }
+
+  /deep/.el-dialog__body {
+    padding: 0;
+  }
+
+  /deep/.el-divider--horizontal {
+    display: block;
+    height: 1px;
+    width: 100%;
+    // margin: 0;
+    margin-left: 2.5%;
+  }
+
+  // /deep/.el-dialog__footer {
+  //   // margin-top: 60px;
+  // }
+
+  .el-button {
+    width: 100px;
+    height: 30px;
+    text-align: center;
+    padding: 5px;
+  }
+  .el-image {
+    width: 380px;
+    height: 120px;
+    cursor: pointer;
+  }
+}
+
+.uploadImageDialog {
+  /deep/.el-dialog__header {
+    padding-bottom: 0;
+    color: #333333;
+  }
+  /deep/.el-dialog__body {
+    padding: 0 10px 20px 10px;
+  }
+  .label {
+    line-height: 40px;
+  }
+  .el-row {
+    margin-bottom: 10px;
+    &:last-child {
+      margin-bottom: 0px;
+    }
+    :deep(.el-upload-list) {
+      display: none;
+    }
+  }
+  .el-image {
+    width: 100%;
+    max-height: 300px;
+    :deep(.el-image__error) {
+      height: 100%;
+      max-height: 300px;
+    }
+  }
+}
+</style>

src/views/systemManagement/infoConfiguration/dailog/createUpdatePeople.vue → src/views/systemManagement/infoConfiguration/dialog/createUpdatePeople.vue

@@ -152,7 +152,7 @@ export default {
       let that = this;
       const loading = this.$loading({
         lock: true,
-        text: "新建中，请稍后！",
+        text: "更新中，请稍后！",
         spinner: "el-icon-loading",
         background: "rgba(0, 0, 0, 0.7)",
         customClass: "systemConfigLoading",
@@ -219,9 +219,9 @@ export default {
 /deep/.el-divider--horizontal {
   display: block;
   height: 1px;
-  width: 95%;
+  width: 100%;
   margin: 0;
-  margin-left: 2.5%;
+  // margin-left: 2.5%;
 }
 
 // /deep/.el-dialog__footer {

src/views/systemManagement/infoConfiguration/dialog/historyFloor.vue

@@ -0,0 +1,192 @@
+<template>
+  <el-dialog
+    v-dialog-drag
+    class="history_floor_dialog"
+    title="历史记录"
+    :visible.sync="dialogVisible"
+    @before-close="close"
+    width="500px"
+    left
+  >
+    <el-divider></el-divider>
+    <div class="list">
+      <ul>
+        <li
+          v-for="(item, index) in list[itemInfo.data.label]"
+          :key="index"
+        >
+          <div class="time">{{item.time}}</div>
+          <div class="image">
+            <el-image
+              :src="item.image"
+              :fit="'contain'"
+            ></el-image>
+          </div>
+        </li>
+      </ul>
+    </div>
+  </el-dialog>
+</template>
+<script>
+export default {
+  props: {
+    itemInfo: {
+      type: Object,
+    },
+  },
+  data() {
+    return {
+      list: {
+        "1F": [
+          {
+            time: "2023-01-01 08:00:00",
+            image: "/static/image/floor/area_1F.png",
+          },
+          {
+            time: "2023-02-01 08:00:00",
+            image: "/static/image/floor/area_1F.png",
+          },
+          {
+            time: "2023-03-01 08:00:00",
+            image: "/static/image/floor/area_1F.png",
+          },
+          {
+            time: "2023-04-01 08:00:00",
+            image: "/static/image/floor/area_1F.png",
+          },
+        ],
+        "15F": [
+          {
+            time: "2023-01-01 08:00:00",
+            image: "/static/image/floor/area_15F.png",
+          },
+          {
+            time: "2023-02-01 08:00:00",
+            image: "/static/image/floor/area_15F.png",
+          },
+          {
+            time: "2023-03-01 08:00:00",
+            image: "/static/image/floor/area_15F.png",
+          },
+          {
+            time: "2023-04-01 08:00:00",
+            image: "/static/image/floor/area_15F.png",
+          },
+        ],
+        "20F": [
+          {
+            time: "2023-01-01 08:00:00",
+            image: "/static/image/floor/area_20F.png",
+          },
+          {
+            time: "2023-02-01 08:00:00",
+            image: "/static/image/floor/area_20F.png",
+          },
+          {
+            time: "2023-03-01 08:00:00",
+            image: "/static/image/floor/area_20F.png",
+          },
+          {
+            time: "2023-04-01 08:00:00",
+            image: "/static/image/floor/area_20F.png",
+          },
+        ],
+        "21F": [
+          {
+            time: "2023-01-01 08:00:00",
+            image: "/static/image/floor/area_21F.png",
+          },
+          {
+            time: "2023-02-01 08:00:00",
+            image: "/static/image/floor/area_21F.png",
+          },
+          {
+            time: "2023-03-01 08:00:00",
+            image: "/static/image/floor/area_21F.png",
+          },
+          {
+            time: "2023-04-01 08:00:00",
+            image: "/static/image/floor/area_21F.png",
+          },
+        ],
+        B2: [
+          {
+            time: "2023-01-01 08:00:00",
+            image: "/static/image/floor/area_B2.png",
+          },
+          {
+            time: "2023-02-01 08:00:00",
+            image: "/static/image/floor/area_B2.png",
+          },
+          {
+            time: "2023-03-01 08:00:00",
+            image: "/static/image/floor/area_B2.png",
+          },
+          {
+            time: "2023-04-01 08:00:00",
+            image: "/static/image/floor/area_B2.png",
+          },
+        ],
+        B3: [
+          {
+            time: "2023-01-01 08:00:00",
+            image: "/static/image/floor/area_B3.png",
+          },
+          {
+            time: "2023-02-01 08:00:00",
+            image: "/static/image/floor/area_B3.png",
+          },
+          {
+            time: "2023-03-01 08:00:00",
+            image: "/static/image/floor/area_B3.png",
+          },
+          {
+            time: "2023-04-01 08:00:00",
+            image: "/static/image/floor/area_B3.png",
+          },
+        ],
+      },
+      dialogVisible: false,
+    };
+  },
+  methods: {
+    close() {
+      this.dialogVisible = false;
+    },
+  },
+  watch: {
+    itemInfo() {},
+  },
+};
+</script>
+
+ 
+<style lang="less" scoped>
+.history_floor_dialog {
+  :deep(.el-dialog__header) {
+    padding-bottom: 0px;
+  }
+  :deep(.el-dialog__body) {
+    padding: 0px 0px 20px 20px;
+  }
+  .list {
+    height: 500px;
+    overflow: hidden;
+    overflow-y: auto;
+    padding-right: 20px;
+    .time {
+      text-align: left;
+      margin-top: 10px;
+      height: 40px;
+      line-height: 40px;
+      font-size: 17px;
+      font-weight: bold;
+    }
+    li:first-child {
+      .time {
+        margin-top: 0px;
+      }
+    }
+  }
+}
+</style>

src/views/systemManagement/infoConfiguration/dailog/historyPeople.vue → src/views/systemManagement/infoConfiguration/dialog/historyPeople.vue

@@ -1,7 +1,7 @@
 <template>
   <el-dialog
     v-dialog-drag
-    class="dialog"
+    class="history_people_dialog"
     title="历史记录"
     :visible.sync="dialogVisible"
     @before-close="close"
@@ -85,7 +85,13 @@
 </template>
 
 <script>
+import api from "@/api/infoConfig/api";
 export default {
+  props: {
+    itemInfo: {
+      type: Object,
+    },
+  },
   data() {
     return {
       dialogVisible: false,
@@ -199,72 +205,70 @@ export default {
       ],
     };
   },
+  mounted() {
+    this.getHistroyPeople();
+  },
   methods: {
-    sure() {
-      let that = this;
-      const loading = this.$loading({
-        lock: true,
-        text: "新建中，请稍后！",
-        spinner: "el-icon-loading",
-        background: "rgba(0, 0, 0, 0.7)",
-        customClass: "systemConfigLoading",
-      });
-      setTimeout(() => {
-        loading.close();
-        that.dialogVisible = true;
-      }, 2000);
+    getHistroyPeople() {
+      api
+        .getSecurityInfoConfigurationHistory({
+          id: this.itemInfo.data.id,
+        })
+        .then((result) => {
+          this.list = result.data.data;
+        })
+        .catch((err) => {});
     },
     close() {
-      this.form = {
-        personnelCategoryIndex: "",
-        responsibilities: "",
-        people: [],
-        beizhu: "",
-        start: "",
-        stop: "",
-      };
       this.dialogVisible = false;
     },
   },
+  watch: {
+    dialogVisible(newVal) {
+      if (newVal) this.getHistroyPeople();
+    },
+  },
 };
 </script>
 
 <style lang="less" scope>
-.el-dialog__header {
-  color: #333333;
-  padding-bottom: 20px;
-}
+.history_people_dialog {
+  .el-dialog__header {
+    color: #333333;
+    padding-bottom: 20px;
+  }
 
-.el-dialog__headerbtn {
-  font-size: 25px;
-}
+  .el-dialog__headerbtn {
+    font-size: 25px;
+  }
 
-.el-dialog__body {
-  padding: 0;
-  height: 500px;
-}
+  .el-dialog__body {
+    padding: 0;
+    height: 500px;
+  }
 
-.el-divider--horizontal {
-  display: block;
-  height: 1px;
-  width: 100%;
-  margin: 0 !important;
-}
-.table_con {
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  overflow-y: auto;
-  padding-left: 20px;
-  padding-right: 20px;
-  box-sizing: border-box;
-  .time {
-    text-align: left;
-    margin-top: 10px;
-    height: 40px;
-    line-height: 40px;
-    font-size: 17px;
-    font-weight: bold;
+  .el-divider--horizontal {
+    display: block;
+    height: 1px;
+    width: 100%;
+    margin: 0 !important;
+  }
+  .table_con {
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    overflow-y: auto;
+    padding-left: 20px;
+    padding-right: 20px;
+    box-sizing: border-box;
+    .time {
+      text-align: left;
+      margin-top: 10px;
+      height: 40px;
+      line-height: 40px;
+      font-size: 17px;
+      font-weight: bold;
+    }
   }
 }
 </style>

src/views/systemManagement/infoConfiguration/floorInfo.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="floorInfo">
     <div class="header_container">
       <el-breadcrumb
         class="info"
@@ -8,29 +8,44 @@
         <el-breadcrumb-item>{{itemInfo.parentData.label}}</el-breadcrumb-item>
         <el-breadcrumb-item>{{itemInfo.data.label}}</el-breadcrumb-item>
       </el-breadcrumb>
-      <el-button type="text">历史记录</el-button>
+      <el-button
+        class="history_record"
+        type="text"
+        @click="showHistoryFloor"
+      >
+        历史记录
+      </el-button>
     </div>
     <div class="image_container">
       <el-image
-        :src="testUrl"
-        :preview-src-list="srcList"
+        :src="itemInfo.data.pmt"
+        :fit="'contain'"
       ></el-image>
     </div>
     <el-button
       class="bianji"
       @click="updateFloor"
-    >编辑</el-button>
+    >
+      编辑
+    </el-button>
     <createUpdateFloor
       ref="createUpdateFloor"
       v-bind="{
-        beforeForm:form
+        beforeForm:beforeForm
       }"
     ></createUpdateFloor>
+    <historyFloor
+      ref="historyFloor"
+      v-bind="{
+        itemInfo:itemInfo
+      }"
+    ></historyFloor>
   </div>
 </template>
 
 <script>
-import createUpdateFloor from "./dailog/createUpdateFloor.vue";
+import createUpdateFloor from "./dialog/createUpdateFloor.vue";
+import historyFloor from "./dialog/historyFloor.vue";
 export default {
   props: {
     itemInfo: {
@@ -39,55 +54,70 @@ export default {
   },
   components: {
     createUpdateFloor,
+    historyFloor,
   },
   data() {
     return {
-      label: "1F",
-      testUrl: "",
       srcList: [""],
-      form: {},
+      beforeForm: {},
     };
   },
   methods: {
     updateFloor() {
-      this.form = {
-        floorIndex: "1",
+      this.beforeForm = {
+        floorIndex: this.itemInfo.data.label.replace("F", ""),
         floorUseIndex: "2",
         beizhu: "本楼用途为会议",
         fujian: "",
       };
       this.$refs.createUpdateFloor.dialogVisible = true;
     },
+    showHistoryFloor() {
+      this.$refs.historyFloor.dialogVisible = true;
+    },
   },
 };
 </script>
 
 <style lang="less" scoped>
-.header_container {
-  position: relative;
+.floorInfo {
   width: 100%;
-  height: 60px;
-  margin-top: 10px;
-  .el-breadcrumb {
-    line-height: 60px;
-    font-size: 20px;
+  height: 100%;
+  .header_container {
+    position: relative;
+    width: 100%;
+    height: 60px;
+    margin-top: 10px;
+    .el-breadcrumb {
+      line-height: 60px;
+      font-size: 20px;
+    }
+    .history_record {
+      position: absolute;
+      right: 0;
+      bottom: 0;
+      margin-right: 50px;
+      float: right;
+    }
   }
-}
-.image_container {
-  height: 690px;
-  width: 100%;
-  margin-top: 10px;
-  .el-image {
+  .image_container {
     width: 100%;
-    height: 100%;
+    height: calc(100% - 130px);
+    margin-top: 10px;
+    overflow: hidden;
+    overflow-y: auto;
+    .el-image {
+      height: 690px;
+      width: 100%;
+    }
+  }
+  .bianji {
+    height: 30px;
+    width: 100px;
+    padding: 3px;
+    color: #fff;
+    background: #3da0d6;
+    margin-top: 20px;
   }
-}
-.bianji {
-  height: 30px;
-  width: 100px;
-  padding: 3px;
-  color: #fff;
-  background: #3da0d6;
-  margin-top: 20px;
 }
 </style>

src/views/systemManagement/infoConfiguration/index.vue

@@ -9,7 +9,7 @@
       <div class="tree_container">
         <el-tree
           ref="tree"
-          :data="data"
+          :data="list"
           :props="defaultProps"
           node-key="id"
           default-expand-all
@@ -22,7 +22,7 @@
             <span class="operate_btns">
               <!-- v-if="data.children" -->
               <dropdown
-                :events="data.id?menuEvents:subMenuEvents"
+                :events="data.children!=undefined?menuEvents:subMenuEvents"
                 :data="{ node, data }"
                 @itemClick="dropDownClick"
               ></dropdown>
@@ -30,24 +30,29 @@
           </span>
         </el-tree>
       </div>
-      <!-- <el-button class="createNewInfoMessageType"><i class="el-icon-s-order"></i>新建信息配置模块</el-button> -->
     </div>
     <div class="right-pane">
       <floorInfo
         v-if="winType == 1"
         v-bind="{
-          itemInfo:itemInfo
+          itemInfo:itemInfo, 
         }"
       ></floorInfo>
       <SecuritystaffInfo
         v-if="winType == 2"
         v-bind="{
-          itemInfo:itemInfo
+          itemInfo:itemInfo, 
         }"
       ></SecuritystaffInfo>
     </div>
-    <createFloor ref="createFloor"></createFloor>
-    <createInfo ref="createInfo"></createInfo>
+    <createFloor
+      ref="createFloor"
+      v-bind="{update:getInfoList}"
+    ></createFloor>
+    <createInfo
+      ref="createInfo"
+      v-bind="{update:getInfoList}"
+    ></createInfo>
   </div>
 </template>
 
@@ -56,12 +61,13 @@ import dropdown from "@/components/Dropdown/index";
 import floorInfo from "./floorInfo";
 import SecuritystaffInfo from "./securitystaffInfo";
 
-import createFloor from "./dailog/createFloor.vue";
-import createInfo from "./dailog/createInfo.vue";
+import createFloor from "./dialog/createFloor.vue";
+import createInfo from "./dialog/createInfo.vue";
 
 import louceng from "@/assets/tree/strategy/louceng@3x.png";
 import huiyishi from "@/assets/tree/strategy/huiyishi@3x.png";
-import { isArray } from "@/utils/validate";
+
+import api from "@/api/infoConfig/api";
 
 export default {
   components: {
@@ -78,7 +84,7 @@ export default {
       filterText: "",
       winType: 0,
       itemInfo: null,
-      data: [
+      list: [
         {
           id: 1,
           url: louceng,
@@ -88,26 +94,32 @@ export default {
             {
               url: huiyishi,
               label: "1F",
+              pmt: "/static/image/floor/area_1F.png",
             },
             {
               url: huiyishi,
               label: "15F",
+              pmt: "/static/image/floor/area_15F.png",
             },
             {
               url: huiyishi,
               label: "20F",
+              pmt: "/static/image/floor/area_20F.png",
             },
             {
               url: huiyishi,
               label: "21F",
+              pmt: "/static/image/floor/area_21F.png",
             },
             {
               url: huiyishi,
-              label: "B1",
+              label: "B2",
+              pmt: "/static/image/floor/area_B2.png",
             },
             {
               url: huiyishi,
               label: "B3",
+              pmt: "/static/image/floor/area_B3.png",
             },
           ],
         },
@@ -132,13 +144,7 @@ export default {
         label: "label",
       },
       menuEvents: [{ label: "新建", funcName: "addNode" }],
-      subMenuEvents: [
-        // { label: "新建", funcName: "addNode" },
-        // { label: "上移", funcName: "moveUp" },
-        // { label: "下移", funcName: "moveDown" },
-        // { label: "编辑", funcName: "editNode" },
-        { label: "删除", funcName: "removeNode" },
-      ],
+      subMenuEvents: [{ label: "删除", funcName: "removeNode" }],
     };
   },
   watch: {
@@ -146,13 +152,16 @@ export default {
       this.$refs.tree.filter(val);
     },
   },
+  mounted() {
+    this.getInfoList();
+  },
   methods: {
     filterNode(value, data) {
       if (!value) return true;
       return data.label.indexOf(value) !== -1;
     },
     handleNodeClick(data, node) {
-      if (!isArray(node.parent.data)) {
+      if (!Array.isArray(node.parent.data)) {
         switch (node.parent.data.type) {
           case "floor":
             this.winType = 1;
@@ -188,10 +197,47 @@ export default {
             }
           )
             .then(() => {
-              this.$message({
-                type: "success",
-                message: "删除成功!",
+              const loading = this.$loading({
+                lock: true,
+                text: "删除中，请稍后！",
+                spinner: "el-icon-loading",
+                background: "rgba(0, 0, 0, 0.7)",
+                customClass: "systemConfigLoading",
               });
+              if (data.data.type != undefined && data.data.type != "floor") {
+                loading.close();
+                this.$message({
+                  type: "success",
+                  message: "删除成功!",
+                });
+              } else {
+                api
+                  .delSecurityInfoConfiguration({
+                    id: data.data.id,
+                  })
+                  .then((result) => {
+                    loading.close();
+                    if (result.data.code == 0) {
+                      this.getInfoList();
+                      this.$message({
+                        type: "success",
+                        message: "删除成功!",
+                      });
+                    } else {
+                      this.$message({
+                        type: "error",
+                        message: "删除失败!",
+                      });
+                    }
+                  })
+                  .catch((err) => {
+                    loading.close();
+                    this.$message({
+                      type: "error",
+                      message: "删除失败!",
+                    });
+                  });
+              }
             })
             .catch(() => {
               this.$message({
@@ -200,11 +246,31 @@ export default {
               });
             });
           break;
-
         default:
           break;
       }
     },
+
+    getInfoList() {
+      api
+        .getInfoList()
+        .then((result) => {
+          let arr = result.data.data["安保人员信息配置"];
+          arr = arr.map((item) => {
+            item.url = huiyishi;
+            item.label = item.name;
+            return item;
+          });
+          this.list[1] = {
+            id: 2,
+            url: louceng,
+            label: "安保人员信息配置",
+            children: arr,
+          };
+          this.list = JSON.parse(JSON.stringify(this.list));
+        })
+        .catch((err) => {});
+    },
   },
 };
 </script>

src/views/systemManagement/infoConfiguration/securitystaffInfo.vue

@@ -42,12 +42,12 @@
         >
         </el-table-column>
         <el-table-column
-          prop="job_number"
+          prop="work_number"
           label="工号"
         >
         </el-table-column>
         <el-table-column
-          prop="phone_number"
+          prop="phone"
           label="联系方式"
         >
         </el-table-column>
@@ -56,10 +56,7 @@
           label="职责范围"
         >
         </el-table-column>
-        <el-table-column
-          prop="photo"
-          label="照片"
-        >
+        <el-table-column label="照片">
           <template slot-scope="scope">
             <el-image
               :src="scope.row.photo"
@@ -87,7 +84,9 @@
               type="text"
               size="small"
             >编辑</el-button> -->
-            {{$dayjs(scope.row.date.start).format("YYYY-MM-DD HH:mm:ss").replace("-","年").replace("-","月").replace(" ","日 ")}} 至 {{$dayjs(scope.row.date.stop).format("YYYY-MM-DD HH:mm:ss").replace("-","年").replace("-","月").replace(" ","日 ")}}
+            <span v-if="scope.row.date">
+              {{$dayjs(scope.row.date.start).format("YYYY-MM-DD HH:mm:ss").replace("-","年").replace("-","月").replace(" ","日 ")}} 至 {{$dayjs(scope.row.date.stop).format("YYYY-MM-DD HH:mm:ss").replace("-","年").replace("-","月").replace(" ","日 ")}}
+            </span>
 
           </template>
         </el-table-column>
@@ -120,19 +119,27 @@
     <createUpdatePeople
       ref="createUpdatePeople"
       v-bind="{
-        beforeForm:beforeForm
+        beforeForm:beforeForm,
+        update:getListAfterUpdate
       }"
     ></createUpdatePeople>
-    <historyPeople ref="historyPeople"></historyPeople>
+    <historyPeople
+      ref="historyPeople"
+      v-bind="{
+        itemInfo:itemInfo
+      }"
+    ></historyPeople>
   </div>
 </template>
 
 <script>
 import page from "@/components/pagination/index";
 
-import createPeople from "./dailog/createPeople.vue";
-import createUpdatePeople from "./dailog/createUpdatePeople.vue";
-import historyPeople from "./dailog/historyPeople.vue";
+import createPeople from "./dialog/createPeople.vue";
+import createUpdatePeople from "./dialog/createUpdatePeople.vue";
+import historyPeople from "./dialog/historyPeople.vue";
+
+import api from "@/api/infoConfig/api";
 export default {
   props: {
     itemInfo: {
@@ -147,73 +154,6 @@ export default {
   },
   data() {
     let that = this;
-    let tableData = [
-      {
-        name: "张三",
-        job_number: "01111",
-        phone_number: "13945678901",
-        territory: "九层前台",
-        photo:
-          "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png",
-        status: "正常",
-        date: {
-          start: 1683876585974,
-          stop: 1683876601553,
-        },
-      },
-      {
-        name: "张三",
-        job_number: "01111",
-        phone_number: "13945678901",
-        territory: "九层前台",
-        photo:
-          "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png",
-        status: "正常",
-        date: {
-          start: 1683876585974,
-          stop: 1683876601553,
-        },
-      },
-      {
-        name: "张三",
-        job_number: "01111",
-        phone_number: "13945678901",
-        territory: "九层前台",
-        photo:
-          "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png",
-        status: "正常",
-        date: {
-          start: 1683876585974,
-          stop: 1683876601553,
-        },
-      },
-      {
-        name: "李四",
-        job_number: "01111",
-        phone_number: "13945678901",
-        territory: "九层前台",
-        photo:
-          "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png",
-        status: "已离职",
-        date: {
-          start: 1683876585974,
-          stop: 1683876601553,
-        },
-      },
-      {
-        name: "王五",
-        job_number: "01111",
-        phone_number: "13945678901",
-        territory: "九层前台",
-        photo:
-          "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png",
-        status: "暂时冻结",
-        date: {
-          start: 1683876585974,
-          stop: 1683876601553,
-        },
-      },
-    ];
     return {
       // 正常 已离职 暂时冻结
       currentPageSize: 10,
@@ -223,18 +163,24 @@ export default {
         pagerCount: 5,
         currentPage: 1,
         pageSizes: [5, 10, 20, 30],
-        total: tableData.length,
+        total: 0,
         currentChange: (val) => {
-          that.getTableData(val);
+          that.handlePageChange(val);
         },
         handleSizeChange: (val) => {
           that.handleSizeChange(val);
         },
       },
       beforeForm: null,
-      tableData: tableData,
+      tableData: [],
     };
   },
+  mounted() {
+    this.resetPageConfig({
+      currentPage: 1,
+    });
+    this.handlePageChange(1);
+  },
   methods: {
     createNewPeople() {
       this.$refs.createPeople.dialogVisible = true;
@@ -243,17 +189,49 @@ export default {
       console.log(data);
       this.$refs.createUpdatePeople.dialogVisible = true;
     },
-    deletePeo() {
+    deletePeo(data) {
       this.$confirm("此操作将删除该条信息, 是否继续?", "提示", {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
         type: "warning",
       })
         .then(() => {
-          this.$message({
-            type: "success",
-            message: "删除成功!",
+          const loading = this.$loading({
+            lock: true,
+            text: "删除中，请稍后！",
+            spinner: "el-icon-loading",
+            background: "rgba(0, 0, 0, 0.7)",
+            customClass: "systemConfigLoading",
           });
+          api
+            .delSecurityInfoConfiguration({
+              id: data.id,
+            })
+            .then((result) => {
+              loading.close();
+              if (result.data.code == 0) {
+                this.resetPageConfig({
+                  currentPage: 1,
+                });
+                this.handlePageChange(1);
+                this.$message({
+                  type: "success",
+                  message: "删除成功!",
+                });
+              } else {
+                this.$message({
+                  type: "error",
+                  message: "删除失败!",
+                });
+              }
+            })
+            .catch((err) => {
+              loading.close();
+              this.$message({
+                type: "error",
+                message: "删除失败!",
+              });
+            });
         })
         .catch(() => {
           this.$message({
@@ -262,12 +240,102 @@ export default {
           });
         });
     },
-    getTableData() {},
-    handleSizeChange() {},
+    handlePageChange(val) {
+      this.paginationData.currentPage = val;
+      this.getListData({
+        id: String(this.itemInfo.data.id),
+        page_size: this.paginationData.pageSize,
+        page: val,
+      })
+        .then((result) => {})
+        .catch((err) => {});
+    },
+    handleSizeChange(val) {
+      this.paginationData.pageSize = val;
+      this.getListData({
+        id: String(this.itemInfo.data.id),
+        page_size: val,
+        page: this.paginationData.currentPage,
+      })
+        .then((result) => {})
+        .catch((err) => {});
+    },
+    resetPageConfig(obj) {
+      let t = {
+        pageSize: 10,
+        pagerCount: 5,
+        currentPage: 1,
+        pageSizes: [5, 10, 20, 30],
+        total: 0,
+        currentChange: (val) => {
+          this.handlePageChange(val);
+        },
+        handleSizeChange: (val) => {
+          this.handleSizeChange(val);
+        },
+      };
+      if (obj != null || obj != undefined) {
+        for (const key in obj) {
+          t[key] = obj[key];
+        }
+        this.paginationData = t;
+      }
+    },
+    getListData(obj) {
+      let that = this;
+      return new Promise((resolve, reject) => {
+        api
+          .getSecurityInfoConfiguration(obj)
+          .then((result) => {
+            if (result.data.code == 0) {
+              // "company": null,
+              // "company_id": null,
+              // "department": null,
+              // "dept_id": null,
+              // "id": 1,
+              // "name": "",
+              // "phone": "010-68799999-6688",
+              // "photo": "/images/0402.png",
+              // "register_time": "2023-04-03 10:30:34",
+              // "scope": null,
+              // "type": 1,
+              // "work_number": "0402"
+              let tableData = result.data.data.staff_list;
+              this.tableData = tableData.map((item) => {
+                // item.photo = "/api" + item.photo;
+                item.photo =
+                  "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png";
+                return item;
+              });
+              that.paginationData.total = tableData.length;
+              resolve();
+            } else {
+              reject();
+            }
+          })
+          .catch((err) => {
+            reject();
+          });
+      });
+    },
+    getListAfterUpdate() {
+      this.resetPageConfig({
+        currentPage: 1,
+      });
+      this.handlePageChange(1);
+    },
     openHistory() {
       this.$refs.historyPeople.dialogVisible = true;
     },
   },
+  watch: {
+    itemInfo() {
+      this.resetPageConfig({
+        currentPage: 1,
+      });
+      this.handlePageChange(1);
+    },
+  },
 };
 </script>
 

src/views/systemManagement/messageConfiguration/commonMessage.vue

@@ -6,34 +6,38 @@
       label-width="80px"
       :disabled="disabled"
     >
-      <el-form-item
-        :model="form.channelconfig"
-        label="通道配置："
-      >
+      <el-form-item label="通道配置：">
         <el-checkbox
+          disabled
           label="短信"
-          v-model="checked"
         ></el-checkbox>
-        <el-checkbox label="邮件"></el-checkbox>
-        <el-checkbox label="钉钉"></el-checkbox>
-        <el-checkbox label="站内通知"></el-checkbox>
+        <el-checkbox
+          disabled
+          label="邮件"
+        ></el-checkbox>
+        <el-checkbox
+          disabled
+          label="钉钉"
+        ></el-checkbox>
+        <el-checkbox
+          disabled
+          label="站内通知"
+          :checked="true"
+        ></el-checkbox>
       </el-form-item>
-      <el-form-item
-        :model="form.personconfig"
-        label="人员配置："
-      >
+      <el-form-item label="人员配置：">
         <el-checkbox
-          v-model="checked1"
+          disabled
           label="全体"
+          :checked="true"
         ></el-checkbox>
         <el-checkbox
-          v-model="checked2"
+          disabled
           label="运管管理员"
         ></el-checkbox>
         <div style="display: flex; margin-left: 30px;">
           <el-checkbox
             style="margin-right: 10px;"
-            v-model="checked3"
             disabled
           ></el-checkbox><span>
             <el-cascader
@@ -47,10 +51,7 @@
           </span>
         </div>
       </el-form-item>
-      <el-form-item
-        :model="form.sendtiming"
-        label="发送时间："
-      >
+      <el-form-item label="发送时间：">
         <el-radio
           v-model="radio"
           label="1"
@@ -58,8 +59,9 @@
         >定时</el-radio>
         <span>
           <el-date-picker
-            v-model="value1"
+            v-model="form.send_time"
             type="datetime"
+            format="yyyy-MM-dd HH:mm:ss"
             placeholder="选择日期时间"
           >
           </el-date-picker>
@@ -72,34 +74,25 @@
         >立刻</el-radio>
       </el-form-item>
       <div style="margin-top:30px">
-        <el-tag>{{label}}模板</el-tag>
-        <el-form-item
-          :model="form.title"
-          label="标题："
-        >
+        <el-tag>{{selectedMessage.label}}模板</el-tag>
+        <el-form-item label="标题：">
           <el-input
             class="input_title"
-            v-model="title"
+            v-model="form.title"
             placeholder=""
           ></el-input>
         </el-form-item>
-        <el-form-item
-          :model="form.content"
-          label="内容："
-        >
+        <el-form-item label="内容：">
           <el-input
             class="input_content"
-            v-model="content"
+            v-model="form.content"
             placeholder="请输入内容"
           ></el-input>
         </el-form-item>
-        <el-form-item
-          :model="form.messagePreview"
-          label="样式预览："
-        >
+        <el-form-item label="样式预览：">
           <el-input
             class="stylePreview"
-            v-model="messagePreview"
+            v-model="form.style"
           ></el-input>
         </el-form-item>
       </div>
@@ -118,18 +111,15 @@
 </template>
 
 <script>
+import api from "@/api/message/api";
 export default {
   props: {
-    label: {
-      type: String,
+    selectedMessage: {
+      type: Object,
     },
   },
   data() {
     return {
-      checked: true,
-      checked1: true,
-      checked2: false,
-      checked3: false,
       disabled: true,
       radio: "1",
       value1: "",
@@ -167,10 +157,33 @@ export default {
       input: "",
     };
   },
+  mounted() {
+    this.getMessaageDetail();
+  },
   methods: {
     edit() {
       this.disabled = false;
     },
+    getMessaageDetail() {
+      api
+        .getMessageDetail({
+          message_id: this.selectedMessage.id,
+        })
+        .then((result) => {
+          let form = Array.isArray(result.data.data)
+            ? result.data.data[0]
+            : result.data.data;
+          form.message_id = form.id;
+          if (form.send_time != "immediately") {
+            this.radio = "1";
+            form.send_time = new Date(form.send_time);
+          } else {
+            this.radio = "2";
+          }
+          this.form = form;
+        })
+        .catch((err) => {});
+    },
     update() {
       let that = this;
       const loading = this.$loading({
@@ -180,18 +193,56 @@ export default {
         background: "rgba(0, 0, 0, 0.7)",
         customClass: "systemConfigLoading",
       });
-      setTimeout(() => {
+      if (this.radio == 1 && this.form.send_time == "") {
         loading.close();
-        that.disabled = true;
-      }, 2000);
+        this.$message({
+          type: "error",
+          message: "定时发送的时间未选择，请完善后重试！",
+        });
+        return;
+      } else {
+        if (this.radio == "1") {
+          this.form.send_time = this.$dayjs(this.form.send_time).format(
+            "YYYY-MM-DD HH:mm:ss"
+          );
+        } else {
+          this.form.send_time = "immediately";
+        }
+      }
+      api
+        .updateMessage(this.form)
+        .then((result) => {
+          loading.close();
+          if (result.data.code == 0) {
+            this.$message({
+              type: "success",
+              message: "更新成功!",
+            });
+            this.getMessaageDetail();
+            this.disabled = true;
+          } else {
+            this.$message({
+              type: "error",
+              message: "更新失败!",
+            });
+          }
+        })
+        .catch((err) => {
+          loading.close();
+          this.$message({
+            type: "error",
+            message: "更新失败!",
+          });
+        });
+    },
+  },
+  watch: {
+    selectedMessage(val) {
+      debugger;
+      this.disabled = true;
+      this.getMessaageDetail();
     },
   },
-  watch:{
-    label(){
-        this.disabled = true;
-        // console.log(arguments)
-    }
-  }
 };
 </script>
 

src/views/systemManagement/messageConfiguration/dailog/messageCreate.vue

@@ -1,276 +0,0 @@
-<template>
-  <div>
-    <el-dialog
-      v-dialog-drag
-      class="dialog"
-      title="新建消息模块"
-      :visible.sync="dialogVisible"
-      width="700px"
-      left
-    >
-      <el-divider></el-divider>
-      <div style="height: 530px">
-        <el-scrollbar style="height: 100%">
-          <el-form
-            :model="form"
-            label-position="left"
-            label-width="80px"
-          >
-            <el-form-item label="模块名称：">
-              <el-input
-                v-model="form.template_name"
-                class="template_name"
-              ></el-input>
-            </el-form-item>
-            <el-form-item label="模块上级：">
-              <el-select v-model="form.template_superior">
-                <el-option
-                  v-for="item in superiorOptions"
-                  :value="item.value"
-                  :key="item.value"
-                  :label="item.label"
-                ></el-option>
-              </el-select>
-            </el-form-item>
-            <el-form-item
-              :model="form.channelconfig"
-              label="通道配置："
-            >
-              <el-checkbox
-                label="短信"
-                v-model="checked"
-              ></el-checkbox>
-              <el-checkbox label="邮件"></el-checkbox>
-              <el-checkbox label="钉钉"></el-checkbox>
-              <el-checkbox label="站内通知"></el-checkbox>
-            </el-form-item>
-            <el-form-item
-              :model="form.personconfig"
-              label="人员配置："
-            >
-              <el-checkbox
-                label="全体"
-                v-model="checked2"
-              ></el-checkbox>
-              <el-checkbox label="运管管理员"></el-checkbox>
-              <div style="display: flex; margin-left: 0px;">
-                <el-checkbox
-                  style="margin-right: 10px;"
-                  disabled
-                ></el-checkbox><span>
-                  <el-cascader
-                    style="width: 300px;"
-                    :options="options"
-                    placeholder="选择角色/部门/单位"
-                    filterable
-                    disabled
-                  >
-                  </el-cascader>
-                </span>
-              </div>
-            </el-form-item>
-            <el-form-item
-              :model="form.sendtiming"
-              label="发送时间："
-            >
-              <el-radio
-                v-model="radio"
-                label="1"
-                style="margin-top:13px"
-              >定时</el-radio>
-              <span>
-                <el-date-picker
-                  v-model="value"
-                  type="datetime"
-                  placeholder="选择日期时间"
-                >
-                </el-date-picker>
-              </span>
-            </el-form-item>
-            <el-form-item>
-              <el-radio
-                v-model="radio"
-                label="2"
-              >立刻</el-radio>
-            </el-form-item>
-          </el-form>
-        </el-scrollbar>
-      </div>
-      <div
-        slot="footer"
-        class="dialog-footer"
-      >
-        <el-button
-          type="primary"
-          style="background: #2ea8e6"
-          @click="nextMessage"
-        >下一个</el-button>
-        <el-button
-          style="background: #2ea8e6; color: #fff"
-          @click="resetForm('form')"
-        >重置</el-button>
-        <el-button
-          type="primary"
-          style="background: #2ea8e6"
-          @click="submitForm('form')"
-        >确认</el-button>
-      </div>
-    </el-dialog>
-  </div>
-
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      dialogVisible: false,
-      checked: true,
-      checked2: true,
-      radio: "1",
-      value: "",
-      defaultProps: {
-        children: "children",
-        label: "label",
-      },
-      form: {},
-      options: [],
-      superiorOptions: [
-        {
-          value: "1",
-          label: "普通消息",
-        },
-        {
-          value: "2",
-          label: "提醒消息",
-        },
-      ],
-    };
-  },
-
-  methods: {
-    resetForm() {},
-    submitForm() {},
-    nextMessage() {
-      // 提交信息
-    },
-  },
-};
-</script>
-
-<style lang="less" scoped>
-/deep/.el-dialog {
-  height: 725px !important;
-  .el-dialog__body {
-    padding-top: 0px;
-  }
-}
-.el-divider {
-  margin-top: 10px !important;
-  margin-bottom: 0px !important;
-}
-
-.el-form {
-  //   padding-left: 30px;
-
-  .el-form-item {
-    padding-top: 20px;
-    margin-inline: 20px;
-    margin-bottom: 0;
-
-    /deep/.el-form-item__label {
-      padding: 0;
-      font-size: 16px;
-      color: #4d4d4d;
-      font-weight: 550;
-    }
-
-    /deep/.el-form-item__content {
-      display: flex;
-    }
-
-    // /deep/.el-input__inner {
-    //   //   width: 600px;
-    // }
-  }
-
-  .el-checkbox {
-    margin-right: 10px;
-    margin-left: 10px;
-
-    /deep/.el-checkbox__label {
-      color: #4d4d4d;
-    }
-  }
-
-  .el-cascader {
-    /deep/.el-input__inner {
-      width: 320px;
-    }
-
-    /deep/.el-input__suffix {
-      right: -8px;
-    }
-  }
-
-  .el-radio {
-    margin-left: 20px;
-  }
-
-  .el-date-editor {
-    /deep/.el-input__inner {
-      width: 320px;
-    }
-
-    /deep/.el-input__suffix {
-      right: -80px;
-    }
-  }
-
-  .el-date-picker {
-    width: 450px;
-
-    /deep/.el-picker-panel__content {
-      width: 370px;
-    }
-  }
-}
-
-// .template_name {
-//   /deep/.el-input__inner {
-//     float: left;
-//   }
-// }
-
-// .el-tag {
-//   position: relative;
-//   background-color: transparent;
-//   border-color: transparent;
-//   font-size: 20px;
-//   color: #4d4d4d;
-//   right: 600px;
-//   font-weight: 550;
-//   margin-top: 20px;
-// }
-
-// .el-button--text {
-//   position: absolute;
-//   top: 70px;
-//   right: 20px;
-// }
-
-.el-button {
-  height: 30px;
-  width: 100px;
-  padding: 3px;
-  color: #fff;
-  background: #3da0d6;
-  margin-right: 50px;
-}
-
-.bottom {
-  position: absolute;
-  left: 750px;
-  bottom: 15px;
-}
-</style>

src/views/systemManagement/messageConfiguration/dialog/messageCreate.vue

@@ -0,0 +1,340 @@
+<template>
+  <el-dialog
+    v-dialog-drag
+    class="dialog"
+    title="新建消息模块"
+    :visible.sync="dialogVisible"
+    width="700px"
+    left
+    @before-close="close"
+  >
+    <el-divider></el-divider>
+    <div style="height: 340px">
+      <el-scrollbar style="height: 100%">
+        <el-form
+          :model="form"
+          label-position="left"
+          label-width="80px"
+        >
+          <el-form-item label="模块名称：">
+            <el-input
+              v-model="form.name"
+              class="template_name"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="模块上级：">
+            <el-select v-model="form.type">
+              <el-option
+                v-for="item in superiorOptions"
+                :value="item.label"
+                :key="item.label"
+                :label="item.label"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="通道配置：">
+            <el-checkbox
+              disabled
+              label="短信"
+            ></el-checkbox>
+            <el-checkbox
+              disabled
+              label="邮件"
+            ></el-checkbox>
+            <el-checkbox
+              disabled
+              label="钉钉"
+            ></el-checkbox>
+            <el-checkbox
+              disabled
+              label="站内通知"
+              :checked="true"
+            ></el-checkbox>
+          </el-form-item>
+          <el-form-item
+            :model="form.personconfig"
+            label="人员配置："
+          >
+            <el-checkbox
+              disabled
+              label="全体"
+              :checked="true"
+            ></el-checkbox>
+            <el-checkbox
+              disabled
+              label="运管管理员"
+            ></el-checkbox>
+            <div style="display: flex; margin-left: 0px;">
+              <el-checkbox
+                style="margin-right: 10px;"
+                disabled
+              ></el-checkbox><span>
+                <el-cascader
+                  style="width: 300px;"
+                  :options="options"
+                  placeholder="选择角色/部门/单位"
+                  filterable
+                  disabled
+                >
+                </el-cascader>
+              </span>
+            </div>
+          </el-form-item>
+          <el-form-item label="发送时间：">
+            <el-radio
+              v-model="radio"
+              label="1"
+              style="margin-top:13px"
+            >定时</el-radio>
+            <span>
+              <el-date-picker
+                v-model="form.send_time"
+                type="datetime"
+                placeholder="选择日期时间"
+                :disabled="radio!=1"
+              >
+              </el-date-picker>
+            </span>
+          </el-form-item>
+          <el-form-item>
+            <el-radio
+              v-model="radio"
+              label="2"
+            >立刻</el-radio>
+          </el-form-item>
+        </el-form>
+      </el-scrollbar>
+    </div>
+    <div
+      slot="footer"
+      class="dialog-footer"
+    >
+      <el-button
+        style="background: #2ea8e6; color: #fff"
+        @click="close"
+      >取消</el-button>
+      <el-button
+        type="primary"
+        style="background: #2ea8e6"
+        @click="submitForm"
+      >确认</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import api from "@/api/message/api";
+
+export default {
+  props: {
+    update: {
+      type: Function,
+    },
+  },
+  data() {
+    return {
+      dialogVisible: false,
+      radio: "1",
+      defaultProps: {
+        children: "children",
+        label: "label",
+      },
+      form: {
+        // id: 2,
+        name: "",
+        pipeline: "instation",
+        staff: "all",
+        send_time: "",
+        title: "",
+        content: "",
+        style: "",
+        type: "",
+      },
+      options: [],
+      superiorOptions: [
+        {
+          label: "普通消息",
+        },
+        {
+          label: "提醒消息",
+        },
+      ],
+    };
+  },
+  methods: {
+    submitForm() {
+      let that = this;
+      const loading = this.$loading({
+        lock: true,
+        text: "新建中，请稍后！",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)",
+        customClass: "systemConfigLoading",
+      });
+      if (this.radio == 1 && this.form.send_time == "") {
+        loading.close();
+        this.$message({
+          type: "error",
+          message: "定时发送的时间未选择，请完善后重试！",
+        });
+        return;
+      } else {
+        if (this.radio == "1") {
+          this.form.send_time = this.$dayjs(this.form.send_time).format(
+            "YYYY-MM-DD HH:mm:ss"
+          );
+        } else {
+          this.form.send_time = "immediately";
+        }
+      }
+      api
+        .addNewMessage(this.form)
+        .then((result) => {
+          loading.close();
+          if (result.data.code == 0) {
+            this.$message({
+              type: "success",
+              message: "新建成功!",
+            });
+            this.update();
+            this.close();
+          } else {
+            this.$message({
+              type: "error",
+              message: "新建失败!",
+            });
+          }
+        })
+        .catch((err) => {
+          loading.close();
+          this.$message({
+            type: "error",
+            message: "新建失败!",
+          });
+        });
+    },
+    close() {
+      this.form.name = "";
+      this.form.type = "";
+      this.form.send_time = "";
+      this.dialogVisible = false;
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+/deep/.el-dialog {
+  .el-dialog__body {
+    padding-top: 0px;
+  }
+}
+.el-divider {
+  margin-top: 10px !important;
+  margin-bottom: 0px !important;
+}
+
+.el-form {
+  //   padding-left: 30px;
+
+  .el-form-item {
+    padding-top: 20px;
+    margin-inline: 20px;
+    margin-bottom: 0;
+
+    /deep/.el-form-item__label {
+      padding: 0;
+      font-size: 16px;
+      color: #4d4d4d;
+      font-weight: 550;
+    }
+
+    /deep/.el-form-item__content {
+      display: flex;
+    }
+
+    // /deep/.el-input__inner {
+    //   //   width: 600px;
+    // }
+  }
+
+  .el-checkbox {
+    margin-right: 10px;
+    margin-left: 10px;
+
+    /deep/.el-checkbox__label {
+      color: #4d4d4d;
+    }
+  }
+
+  .el-cascader {
+    /deep/.el-input__inner {
+      width: 320px;
+    }
+
+    /deep/.el-input__suffix {
+      right: -8px;
+    }
+  }
+
+  .el-radio {
+    margin-left: 20px;
+  }
+
+  .el-date-editor {
+    /deep/.el-input__inner {
+      width: 320px;
+    }
+
+    /deep/.el-input__suffix {
+      right: -80px;
+    }
+  }
+
+  .el-date-picker {
+    width: 450px;
+
+    /deep/.el-picker-panel__content {
+      width: 370px;
+    }
+  }
+}
+
+// .template_name {
+//   /deep/.el-input__inner {
+//     float: left;
+//   }
+// }
+
+// .el-tag {
+//   position: relative;
+//   background-color: transparent;
+//   border-color: transparent;
+//   font-size: 20px;
+//   color: #4d4d4d;
+//   right: 600px;
+//   font-weight: 550;
+//   margin-top: 20px;
+// }
+
+// .el-button--text {
+//   position: absolute;
+//   top: 70px;
+//   right: 20px;
+// }
+
+.el-button {
+  height: 30px;
+  width: 100px;
+  padding: 3px;
+  color: #fff;
+  background: #3da0d6;
+  margin-right: 50px;
+}
+
+.bottom {
+  position: absolute;
+  left: 750px;
+  bottom: 15px;
+}
+</style>

src/views/systemManagement/messageConfiguration/index.vue

@@ -9,25 +9,24 @@
       <div class="tree_container">
         <el-tree
           ref="tree"
-          :data="data"
+          :data="list"
           :props="defaultProps"
           node-key="id"
           default-expand-all
           :filter-node-method="filterNode"
           @node-click="handleNodeClick"
         >
-          <span slot-scope="{node,data}">
+          <span slot-scope="{node, data}">
             <el-image :src="data.url"></el-image>
             <span style="padding-left: 10px; vertical-align: text-bottom;">{{ node.label }}</span>
-            <!--<span class="operate_btns">
-                :events="data.id ? menuEvents : subMenuEvents" 
+            <span class="operate_btns">
               <dropdown
-                v-if="data.id!=undefined"
-                :events="menuEvents"
+                v-if="data.children==undefined"
+                :events="subMenuEvents"
                 :data="{ node, data }"
                 @itemClick="dropDownClick"
               ></dropdown>
-            </span>-->
+            </span>
           </span>
         </el-tree>
       </div>
@@ -43,31 +42,30 @@
     <div class="right-pane">
       <commonMessage
         v-if="commonShow"
-        v-bind="{label:selectedMessageLabel}"
+        v-bind="{selectedMessage:selectedMessage}"
       ></commonMessage>
-      <!-- <messageRemind v-if="remindShow"></messageRemind> -->
     </div>
     <messageCreate
       ref="messageCreate"
-      v-bind="{show:createSHow}"
+      v-bind="{update:getMessageList}"
     ></messageCreate>
   </div>
 </template>
 
 <script>
 import commonMessage from "./commonMessage";
-import messageCreate from "./dailog/messageCreate";
-// import messageRemind from "./messageRemind";
+import messageCreate from "./dialog/messageCreate";
 
 import dropdown from "@/components/Dropdown/index";
 
 import xiaoxi from "@/assets/tree/message/xiaoxi@2x.png";
 
+import api from "@/api/message/api";
+
 export default {
   components: {
     commonMessage,
     messageCreate,
-    // messageRemind,
     dropdown,
   },
   data() {
@@ -76,63 +74,20 @@ export default {
       createSHow: false,
       remindShow: false,
       filterText: "",
-      data: [
-        {
-          id: 1,
-          label: "普通消息",
-          url: xiaoxi,
-          children: [
-            {
-              label: "年度报告通知",
-              url: xiaoxi,
-            },
-            {
-              label: "报表导出通知",
-              url: xiaoxi,
-            },
-            {
-              label: "系统更新通知",
-              url: xiaoxi,
-            },
-          ],
-        },
-        {
-          id: 2,
-          label: "提醒消息",
-          url: xiaoxi,
-          children: [
-            {
-              label: "资产年限提醒",
-              url: xiaoxi,
-            },
-            {
-              label: "人员画像提醒",
-              url: xiaoxi,
-            },
-            {
-              label: "备餐提醒",
-              url: xiaoxi,
-            },
-          ],
-        },
-      ],
+      list: [],
       defaultProps: {
         children: "children",
         label: "label",
       },
       form: {},
       input: "",
-      //   menuEvents: [{ label: "新建", funcName: "addNode" }],
-      //   subMenuEvents: [
-      //     { label: "新建", funcName: "addNode" },
-      //     { label: "上移", funcName: "moveUp" },
-      //     { label: "下移", funcName: "moveDown" },
-      //     { label: "编辑", funcName: "editNode" },
-      //     { label: "删除", funcName: "removeNode" },
-      //   ],
-      selectedMessageLabel: "",
+      subMenuEvents: [{ label: "删除", funcName: "removeNode" }],
+      selectedMessage: null,
     };
   },
+  mounted() {
+    this.getMessageList();
+  },
   watch: {
     filterText(val) {
       this.$refs.tree.filter(val);
@@ -143,37 +98,101 @@ export default {
       if (!value) return true;
       return data.label.indexOf(value) !== -1;
     },
-    // dropDownClick(eventName, data) {
-    //   if (data.data.children) {
-    //     this.$refs.messageCreate.dialogVisible = true;
-    //   } else {
-    //   }
-    // },
     createNewMessage() {
       this.$refs.messageCreate.dialogVisible = true;
     },
     handleNodeClick(data) {
       if (!data.children) {
         this.commonShow = true;
-        this.selectedMessageLabel = data.label;
+        this.selectedMessage = data;
+      }
+    },
+    getMessageList() {
+      api
+        .getMessageList()
+        .then((result) => {
+          let arr = [];
+          let index = 1;
+          for (const key in result.data.data) {
+            if (Object.hasOwnProperty.call(result.data.data, key)) {
+              const element = result.data.data[key].map((item) => {
+                item.url = xiaoxi;
+                item.label = item.name;
+                return item;
+              });
+              let obj = {
+                id: index,
+                label: key,
+                url: xiaoxi,
+                children: element,
+              };
+              arr.push(obj);
+              index++;
+            }
+          }
+          this.list = arr;
+        })
+        .catch((err) => {});
+    },
+    dropDownClick(eventType, data) {
+      let that = this;
+      switch (eventType) {
+        case "removeNode":
+          // 删除
+          this.$confirm(
+            "此操作将删除 " + data.data.label + " , 是否继续?",
+            "提示",
+            {
+              confirmButtonText: "确定",
+              cancelButtonText: "取消",
+              type: "warning",
+            }
+          )
+            .then(() => {
+              const loading = this.$loading({
+                lock: true,
+                text: "删除中，请稍后！",
+                spinner: "el-icon-loading",
+                background: "rgba(0, 0, 0, 0.7)",
+                customClass: "systemConfigLoading",
+              });
+              api
+                .delMessage({
+                  message_id: data.data.id,
+                })
+                .then((result) => {
+                  loading.close();
+                  if (result.data.code == 0) {
+                    this.$message({
+                      type: "success",
+                      message: "删除成功!",
+                    });
+                    that.getMessageList();
+                  } else {
+                    this.$message({
+                      type: "error",
+                      message: "删除失败!",
+                    });
+                  }
+                })
+                .catch((err) => {
+                  loading.close();
+                  this.$message({
+                    type: "error",
+                    message: "删除失败!",
+                  });
+                });
+            })
+            .catch(() => {
+              this.$message({
+                type: "info",
+                message: "已取消删除",
+              });
+            });
+          break;
+        default:
+          break;
       }
-      //   switch (data.label) {
-      //     case "年度报告通知":
-      //       this.commonShow = true;
-      //       this.createSHow = false;
-      //       this.remindShow = false;
-      //       break;
-      //     case "普通消息":
-      //       this.commonShow = false;
-      //       this.createSHow = true;
-      //       this.remindShow = false;
-      //       break;
-      //     case "资产年限提醒":
-      //       this.commonShow = false;
-      //       this.createSHow = false;
-      //       this.remindShow = true;
-      //       break;
-      //   }
     },
   },
 };

src/views/systemManagement/strategyConfiguration/index.vue

@@ -2,8 +2,7 @@
   <div class="container">
     <div class="header">
       <el-menu
-        :default-active="activeIndex"
-        class="el-menu-demo"
+        :default-active="activeIndex" 
         mode="horizontal"
         @select="handleSelect"
       >

vue.config.js

@@ -6,32 +6,32 @@ const Components = require('unplugin-vue-components/webpack');
 
 module.exports = defineConfig({
   transpileDependencies: true,
-    configureWebpack: {
-        plugins: [
-            Components({
-                dts: false,
-                resolvers: [IconResolver({ componentPrefix: 'i' })]
-            }),
-            Icons({ compiler: 'vue2', scale: 1, autoInstall: true })
-        ]
-    },
-  devServer:{
-    port:8080,
-    proxy:{
-      '/api':{
-          target:'http://121.43.55.7:5000',
-          changeOrigin:true,
-          pathRewrite:{
-            '^/api':''
-          }
-      }
+  configureWebpack: {
+    plugins: [
+      Components({
+        dts: false,
+        resolvers: [IconResolver({ componentPrefix: 'i' })]
+      }),
+      Icons({ compiler: 'vue2', scale: 1, autoInstall: true })
+    ]
+  },
+  devServer: {
+    port: 8080,
+    proxy: {
       // '/api':{
-      //     target:'http://192.168.3.32:5000',
+      //     target:'http://121.43.55.7:5000',
       //     changeOrigin:true,
       //     pathRewrite:{
       //       '^/api':''
       //     }
       // }
+      '/api': {
+        target: 'http://192.168.3.32:5000',
+        changeOrigin: true,
+        pathRewrite: {
+          '^/api': ''
+        }
+      }
     }
   }
 })