首页 发现 帮助
注册 登录
skyversation-public
/
ioc-admin-ui
2
0
派生 0
文件 工单管理 0 合并请求 0 Wiki
浏览代码

信息配置，消息配置

wandequan 2 年之前
父节点
a9242d8df9
当前提交
daef7e23b9
共有 26 个文件被更改，包括 2992 次插入 和 844 次删除
分列视图 显示文件统计
  1. 8 0
      public/css/all_page_loading.css
  2. 15 0
      public/css/reset.css
  3. 二进制
      public/image/floor/area_15F.png
  4. 二进制
      public/image/floor/area_1F.png
  5. 二进制
      public/image/floor/area_20F.png
  6. 二进制
      public/image/floor/area_21F.png
  7. 二进制
      public/image/floor/area_B2.png
  8. 二进制
      public/image/floor/area_B3.png
  9. 23 16
      public/index.html
  10. 52 16
      src/views/deviceManagement/deviceWarning.vue
  11. 238 0
      src/views/systemManagement/infoConfiguration/dailog/createFloor.vue
  12. 145 0
      src/views/systemManagement/infoConfiguration/dailog/createInfo.vue
  13. 234 0
      src/views/systemManagement/infoConfiguration/dailog/createPeople.vue
  14. 227 0
      src/views/systemManagement/infoConfiguration/dailog/createUpdateFloor.vue
  15. 244 0
      src/views/systemManagement/infoConfiguration/dailog/createUpdatePeople.vue
  16. 105 0
      src/views/systemManagement/infoConfiguration/dailog/historyFloor.vue
  17. 270 0
      src/views/systemManagement/infoConfiguration/dailog/historyPeople.vue
  18. 80 42
      src/views/systemManagement/infoConfiguration/floorInfo.vue
  19. 286 159
      src/views/systemManagement/infoConfiguration/index.vue
  20. 291 83
      src/views/systemManagement/infoConfiguration/securitystaffInfo.vue
  21. 260 163
      src/views/systemManagement/messageConfiguration/commonMessage.vue
  22. 276 0
      src/views/systemManagement/messageConfiguration/dailog/messageCreate.vue
  23. 229 171
      src/views/systemManagement/messageConfiguration/index.vue
  24. 0 185
      src/views/systemManagement/messageConfiguration/messageCreate.vue
  25. 1 1
      src/views/systemManagement/strategyConfiguration/smartMeeting.vue
  26. 8 8
      vue.config.js

+ 8 - 0
public/css/all_page_loading.css
查看文件 

@@ -0,0 +1,8 @@
 
+.allPageLoading .el-loading-spinner .el-icon-loading {
 
+    font-size: 40px;
 
+    margin: 10px;
 
+}
 
+
 
+.allPageLoading .el-loading-spinner .el-loading-text {
 
+    font-size: 20px;
 
+}

+ 15 - 0
public/css/reset.css
查看文件 

@@ -0,0 +1,15 @@
 
+/*滚动条样式*/
 
+::-webkit-scrollbar {
 
+    width: 8px;
 
+    height: 8px;
 
+}
 
+
 
+::-webkit-scrollbar-thumb {
 
+    border-radius: 10px;
 
+    background: #dddddd;
 
+}
 
+
 
+::-webkit-scrollbar-track {
 
+    border-radius: 10px;
 
+    background: #eeeeee;
 
+}

二进制
public/image/floor/area_15F.png
查看文件


二进制
public/image/floor/area_1F.png
查看文件


二进制
public/image/floor/area_20F.png
查看文件


二进制
public/image/floor/area_21F.png
查看文件


二进制
public/image/floor/area_B2.png
查看文件


二进制
public/image/floor/area_B3.png
查看文件


+ 23 - 16
public/index.html
查看文件 

@@ -1,18 +1,25 @@
 
 <!DOCTYPE html>
 
 <html lang="">
 
-  <head>
 
-    <meta charset="utf-8">
 
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
 
-    <title>智慧运营管理平台</title>
 
-    <!-- <script type="module" src="/src/plugins/gverify.js"></script> -->
 
-  </head>
 
-  <body>
 
-    <noscript>
 
-      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
 
-    </noscript>
 
-    <div id="app"></div>
 
-    <!-- built files will be auto injected -->
 
-  </body>
 
-</html>
 
+
 
+<head>
 
+  <meta charset="utf-8">
 
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
+  <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
+  <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">
 
+  <!-- <script type="module" src="/src/plugins/gverify.js"></script> -->
 
+</head>
 
+
 
+<body>
 
+  <noscript>
 
+    <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
 
+        Please enable it to continue.</strong>
 
+  </noscript>
 
+  <div id="app"></div>
 
+  <!-- built files will be auto injected -->
 
+</body>
 
+
 
+</html>

+ 52 - 16
src/views/deviceManagement/deviceWarning.vue
查看文件 

@@ -1,7 +1,11 @@
 
 <template>
 
   <div class="container">
 
     <div class="left-pane">
 
-      <el-input placeholder="告警类别" v-model="filterText" class="left-input">
 
+      <el-input
 
+        placeholder="告警类别"
 
+        v-model="filterText"
 
+        class="left-input"
 
+      >
 
       </el-input>
 
       <el-tree
 
         ref="tree"
 
@@ -30,8 +34,7 @@
 
         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">
 
@@ -64,24 +67,57 @@
 
             height="500"
 
             @selection-change="handleSelectionChange"
 
           >
 
-            <el-table-column type="selection" width="50"> </el-table-column>
 
-            <el-table-column type="index" width="80" label="序号">
 
+            <el-table-column
 
+              type="selection"
 
+              width="50"
 
+            > </el-table-column>
 
+            <el-table-column
 
+              type="index"
 
+              width="80"
 
+              label="序号"
 
+            >
 
             </el-table-column>
 
-            <el-table-column prop="deviceType" label="设备类别">
 
+            <el-table-column
 
+              prop="deviceType"
 
+              label="设备类别"
 
+            >
 
             </el-table-column>
 
-            <el-table-column prop="devicewarningType" label="涵盖设备警告类别">
 
+            <el-table-column
 
+              prop="devicewarningType"
 
+              label="涵盖设备警告类别"
 
+            >
 
             </el-table-column>
 
-            <el-table-column prop="Respon" label="责任人"> </el-table-column>
 
-            <el-table-column prop="operation" label="操作">
 
-              <el-button size="mini" type="text" style="color: #2ea8e6"
 
-                >查看</el-button
 
-              >
 
-              <el-button size="mini" type="text" style="color: #2ea8e6"
 
-                >编辑</el-button
 
+            <el-table-column
 
+              prop="Respon"
 
+              label="责任人"
 
+            > </el-table-column>
 
+            <el-table-column
 
+              prop="operation"
 
+              label="操作"
 
+            >
 
+              <!-- <el-button
 
+                size="mini"
 
+                type="text"
 
+                style="color: #2ea8e6"
 
               >
 
-              <el-button size="mini" type="text" style="color: #2ea8e6"
 
-                >删除</el-button
 
+                查看
 
+              </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>
 
             </el-table-column>
 
           </el-table>
 
         </div>

+ 238 - 0
src/views/systemManagement/infoConfiguration/dailog/createFloor.vue
查看文件 

@@ -0,0 +1,238 @@
 
+<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: "机房",
 
+        },
 
+        {
 
+          value: "4",
 
+          label: "会议区",
 
+        },
 
+        {
 
+          value: "5",
 
+          label: "党建园地",
 
+        },
 
+        {
 
+          value: "6",
 
+          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() {},
 
+  },
 
+};
 
+</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>

+ 145 - 0
src/views/systemManagement/infoConfiguration/dailog/createInfo.vue
查看文件 

@@ -0,0 +1,145 @@
 
+<template>
 
+  <div>
 
+    <el-dialog
 
+      v-dialog-drag
 
+      class="dialog"
 
+      title="新建人员配置"
 
+      :visible.sync="dialogVisible"
 
+      width="360px"
 
+      left
 
+    >
 
+      <el-divider></el-divider>
 
+      <el-form
 
+        label-position="left"
 
+        label-width="80px"
 
+      >
 
+        <el-form-item
 
+          :model="form.typeName"
 
+          label="类别名称："
 
+        >
 
+          <el-input v-model="value"></el-input>
 
+        </el-form-item>
 
+      </el-form>
 
+      <div
 
+        slot="footer"
 
+        class="dialog-footer"
 
+      >
 
+        <el-button
 
+          @click="dialogVisible = false"
 
+          type="primary"
 
+        >取消</el-button>
 
+        <el-button
 
+          type="primary"
 
+          @click="addType"
 
+        >确认</el-button>
 
+      </div>
 
+    </el-dialog>
 
+  </div>
 
+</template>
 
+
 
+<script>
 
+import api from "@/api/deviceManagement/api";
 
+export default {
 
+  props: {
 
+    getDeviceTypeList: {
 
+      type: Function,
 
+    },
 
+  },
 
+  data() {
 
+    return {
 
+      value: "",
 
+      dialogVisible: false,
 
+      form: {
 
+        typeName: "",
 
+      },
 
+    };
 
+  },
 
+  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("类别添加失败!");
 
+        });
 
+    },
 
+  },
 
+};
 
+</script>
 
+<style lang="less" scoped>
 
+/deep/.el-dialog {
 
+  height: 295px !important;
 
+}
 
+
 
+.el-select {
 
+  width: 280px;
 
+}
 
+
 
+.el-form {
 
+  .el-form-item {
 
+    margin-inline: 20px;
 
+    // margin-bottom: 0;
 
+  }
 
+
 
+  /deep/.el-form-item__label {
 
+    padding: 0;
 
+  }
 
+
 
+  /deep/.el-form-item__content {
 
+    display: flex;
 
+  }
 
+}
 
+
 
+// /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 {
 
+  margin-top: 60px;
 
+}
 
+
 
+.el-button {
 
+  width: 100px;
 
+  height: 30px;
 
+  text-align: center;
 
+  margin: 30px;
 
+  padding: 5px;
 
+}
 
+</style>

+ 234 - 0
src/views/systemManagement/infoConfiguration/dailog/createPeople.vue
查看文件 

@@ -0,0 +1,234 @@
 
+<template>
 
+  <div>
 
+    <el-dialog
 
+      v-dialog-drag
 
+      class="dialog"
 
+      title="新建人员配置"
 
+      :visible.sync="dialogVisible"
 
+      @before-close="close"
 
+      width="600px"
 
+      left
 
+    >
 
+      <el-divider></el-divider>
 
+      <el-form
 
+        label-position="left"
 
+        label-width="80px"
 
+      >
 
+        <el-form-item label="人员类别：">
 
+          <el-select
 
+            v-model="form.personnelCategoryIndex"
 
+            placeholder="请选择"
 
+          >
 
+            <el-option
 
+              v-for="item in personnelCategory"
 
+              :key="item.value"
 
+              :label="item.label"
 
+              :value="item.value"
 
+            >
 
+            </el-option>
 
+          </el-select>
 
+        </el-form-item>
 
+        <el-form-item label="职责范围：">
 
+          <el-input
 
+            placeholder="请输入内容"
 
+            v-model="form.responsibilities"
 
+          >
 
+          </el-input>
 
+        </el-form-item>
 
+        <el-form-item label="人员名单：">
 
+          <el-select
 
+            v-model="form.people"
 
+            multiple
 
+            placeholder="请选择"
 
+          >
 
+            <el-option
 
+              v-for="item in peopleArr"
 
+              :key="item.value"
 
+              :label="item.label"
 
+              :value="item.value"
 
+            >
 
+            </el-option>
 
+          </el-select>
 
+        </el-form-item>
 
+        <el-form-item label="值班日期：">
 
+          <el-date-picker
 
+            v-model="form.start"
 
+            type="datetime"
 
+            placeholder="选择日期时间"
 
+          >
 
+          </el-date-picker> 至
 
+          <el-date-picker
 
+            v-model="form.stop"
 
+            type="datetime"
 
+            placeholder="选择日期时间"
 
+          >
 
+          </el-date-picker>
 
+        </el-form-item>
 
+        <el-form-item
 
+          label="备注："
 
+          style="display:block"
 
+        >
 
+          <el-input
 
+            type="textarea"
 
+            :rows="2"
 
+            placeholder="请输入内容"
 
+            v-model="form.beizhu"
 
+          >
 
+          </el-input>
 
+        </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>
 
+  </div>
 
+</template>
 
+<script>
 
+export default {
 
+  data() {
 
+    return {
 
+      value: "",
 
+      dialogVisible: false,
 
+      form: {
 
+        personnelCategoryIndex: "",
 
+        responsibilities: "",
 
+        people: [],
 
+        beizhu: "",
 
+        start: "",
 
+        stop: "",
 
+      },
 
+
 
+      personnelCategory: [
 
+        {
 
+          value: "1",
 
+          label: "保洁",
 
+        },
 
+        {
 
+          value: "2",
 
+          label: "前台",
 
+        },
 
+        {
 
+          value: "3",
 
+          label: "安防",
 
+        },
 
+      ],
 
+      peopleArr: [
 
+        {
 
+          value: "1",
 
+          label: "张三",
 
+        },
 
+        {
 
+          value: "2",
 
+          label: "李四",
 
+        },
 
+        {
 
+          value: "3",
 
+          label: "王五",
 
+        },
 
+        {
 
+          value: "4",
 
+          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();
 
+        that.dialogVisible = true;
 
+      }, 2000);
 
+    },
 
+    close() {
 
+      this.form = {
 
+        personnelCategoryIndex: "",
 
+        responsibilities: "",
 
+        people: [],
 
+        beizhu: "",
 
+        start: "",
 
+        stop: "",
 
+      };
 
+      this.dialogVisible = false;
 
+    },
 
+  },
 
+};
 
+</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>

+ 227 - 0
src/views/systemManagement/infoConfiguration/dailog/createUpdateFloor.vue
查看文件 

@@ -0,0 +1,227 @@
 
+<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>

+ 244 - 0
src/views/systemManagement/infoConfiguration/dailog/createUpdatePeople.vue
查看文件 

@@ -0,0 +1,244 @@
 
+<template>
 
+  <el-dialog
 
+    v-dialog-drag
 
+    class="dialog"
 
+    title="编辑人员配置"
 
+    :visible.sync="dialogVisible"
 
+    @before-close="close"
 
+    width="600px"
 
+    left
 
+  >
 
+    <el-divider></el-divider>
 
+    <el-form
 
+      label-position="left"
 
+      label-width="80px"
 
+    >
 
+      <el-form-item label="人员类别：">
 
+        <el-select
 
+          v-model="form.personnelCategoryIndex"
 
+          placeholder="请选择"
 
+          disabled
 
+        >
 
+          <el-option
 
+            v-for="item in personnelCategory"
 
+            :key="item.value"
 
+            :label="item.label"
 
+            :value="item.value"
 
+          >
 
+          </el-option>
 
+        </el-select>
 
+      </el-form-item>
 
+      <el-form-item label="职责范围：">
 
+        <el-input
 
+          placeholder="请输入内容"
 
+          v-model="form.responsibilities"
 
+        >
 
+        </el-input>
 
+      </el-form-item>
 
+      <el-form-item label="人员名单：">
 
+        <el-select
 
+          v-model="form.people"
 
+          multiple
 
+          placeholder="请选择"
 
+          disabled
 
+        >
 
+          <el-option
 
+            v-for="item in peopleArr"
 
+            :key="item.value"
 
+            :label="item.label"
 
+            :value="item.value"
 
+          >
 
+          </el-option>
 
+        </el-select>
 
+      </el-form-item>
 
+      <el-form-item label="值班日期：">
 
+        <el-date-picker
 
+          v-model="form.start"
 
+          type="datetime"
 
+          placeholder="选择日期时间"
 
+        >
 
+        </el-date-picker> 至
 
+        <el-date-picker
 
+          v-model="form.stop"
 
+          type="datetime"
 
+          placeholder="选择日期时间"
 
+        >
 
+        </el-date-picker>
 
+      </el-form-item>
 
+      <el-form-item
 
+        label="备注："
 
+        style="display:block"
 
+      >
 
+        <el-input
 
+          type="textarea"
 
+          :rows="2"
 
+          placeholder="请输入内容"
 
+          v-model="form.beizhu"
 
+        >
 
+        </el-input>
 
+      </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() {
 
+    return {
 
+      value: "",
 
+      dialogVisible: false,
 
+      form: {
 
+        personnelCategoryIndex: "",
 
+        responsibilities: "",
 
+        people: [],
 
+        beizhu: "",
 
+        start: "",
 
+        stop: "",
 
+      },
 
+
 
+      personnelCategory: [
 
+        {
 
+          value: "1",
 
+          label: "保洁",
 
+        },
 
+        {
 
+          value: "2",
 
+          label: "前台",
 
+        },
 
+        {
 
+          value: "3",
 
+          label: "安防",
 
+        },
 
+      ],
 
+      peopleArr: [
 
+        {
 
+          value: "1",
 
+          label: "张三",
 
+        },
 
+        {
 
+          value: "2",
 
+          label: "李四",
 
+        },
 
+        {
 
+          value: "3",
 
+          label: "王五",
 
+        },
 
+        {
 
+          value: "4",
 
+          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();
 
+        that.dialogVisible = true;
 
+      }, 2000);
 
+    },
 
+    close() {
 
+      this.form = {
 
+        personnelCategoryIndex: "",
 
+        responsibilities: "",
 
+        people: [],
 
+        beizhu: "",
 
+        start: "",
 
+        stop: "",
 
+      };
 
+      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>

+ 105 - 0
src/views/systemManagement/infoConfiguration/dailog/historyFloor.vue
查看文件 

@@ -0,0 +1,105 @@
 
+<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>

+ 270 - 0
src/views/systemManagement/infoConfiguration/dailog/historyPeople.vue
查看文件 

@@ -0,0 +1,270 @@
 
+<template>
 
+  <el-dialog
 
+    v-dialog-drag
 
+    class="dialog"
 
+    title="历史记录"
 
+    :visible.sync="dialogVisible"
 
+    @before-close="close"
 
+    width="900px"
 
+    left
 
+  >
 
+    <el-divider></el-divider>
 
+    <div class="table_con">
 
+      <div
 
+        v-for="(item, index) in list"
 
+        :key="index"
 
+      >
 
+        <div class="time">
 
+          {{$dayjs(item.date).format("YYYY-MM-DD HH:mm:ss").replace("-","年").replace("-","月").replace(" ","日 ")}}
 
+        </div>
 
+        <div class="table">
 
+          <el-table
 
+            :data="item.data"
 
+            tooltip-effect="dark"
 
+            :header-cell-style="{ textAlign: 'center' }"
 
+            :cell-style="{ textAlign: 'center' }"
 
+            height="250"
 
+            style="width: 100%"
 
+          >
 
+            <el-table-column
 
+              type="index"
 
+              width="50"
 
+              label="序号"
 
+            >
 
+            </el-table-column>
 
+            <el-table-column
 
+              prop="name"
 
+              label="姓名"
 
+            >
 
+            </el-table-column>
 
+            <el-table-column
 
+              prop="job_number"
 
+              label="工号"
 
+            >
 
+            </el-table-column>
 
+            <el-table-column
 
+              prop="phone_number"
 
+              label="联系方式"
 
+            >
 
+            </el-table-column>
 
+            <el-table-column
 
+              prop="territory"
 
+              label="职责范围"
 
+            >
 
+            </el-table-column>
 
+            <el-table-column
 
+              prop="photo"
 
+              label="照片"
 
+            >
 
+              <template slot-scope="scope">
 
+                <el-image
 
+                  :src="scope.row.photo"
 
+                  style="width: 40px; height: 40px;"
 
+                  :preview-src-list="[scope.row.photo]"
 
+                ></el-image>
 
+              </template>
 
+            </el-table-column>
 
+            <el-table-column
 
+              prop="status"
 
+              label="状态"
 
+            >
 
+            </el-table-column>
 
+            <el-table-column
 
+              label="值班日期"
 
+              width="360"
 
+            >
 
+              <template slot-scope="scope">
 
+                {{$dayjs(scope.row.date.start).format("YYYY-MM-DD HH:mm:ss")}} 至 {{$dayjs(scope.row.date.stop).format("YYYY-MM-DD HH:mm:ss")}}
 
+              </template>
 
+            </el-table-column>
 
+          </el-table>
 
+        </div>
 
+      </div>
 
+    </div>
 
+  </el-dialog>
 
+</template>
 
+
 
+<script>
 
+export default {
 
+  data() {
 
+    return {
 
+      dialogVisible: false,
 
+      list: [
 
+        {
 
+          time: new Date("2023-02-01 08:00:00"),
 
+          data: [
 
+            {
 
+              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,
 
+              },
 
+            },
 
+          ],
 
+        },
 
+        {
 
+          time: new Date("2023-03-01 08:00:00"),
 
+          data: [
 
+            {
 
+              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,
 
+              },
 
+            },
 
+          ],
 
+        },
 
+        {
 
+          time: new Date("2023-04-01 08:00:00"),
 
+          data: [
 
+            {
 
+              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,
 
+              },
 
+            },
 
+          ],
 
+        },
 
+      ],
 
+    };
 
+  },
 
+  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);
 
+    },
 
+    close() {
 
+      this.form = {
 
+        personnelCategoryIndex: "",
 
+        responsibilities: "",
 
+        people: [],
 
+        beizhu: "",
 
+        start: "",
 
+        stop: "",
 
+      };
 
+      this.dialogVisible = false;
 
+    },
 
+  },
 
+};
 
+</script>
 
+
 
+<style lang="less" scope>
 
+.el-dialog__header {
 
+  color: #333333;
 
+  padding-bottom: 20px;
 
+}
 
+
 
+.el-dialog__headerbtn {
 
+  font-size: 25px;
 
+}
 
+
 
+.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;
 
+  }
 
+}
 
+</style>

+ 80 - 42
src/views/systemManagement/infoConfiguration/floorInfo.vue
查看文件 

@@ -1,55 +1,93 @@
 
 <template>
 
-    <div>
 
-        <div style="width: 100%; height: 100px;margin-top: 10px;">
 
-            <el-tag>{{ label }}</el-tag>
 
-            <el-button type="text">历史记录</el-button>
 
-        </div>
 
-        <div style="height: 600px;width: 100%; margin-top: 10px;">
 
-            <el-image style="height: 100%;" :src="testUrl" :preview-src-list="srcList"></el-image>
 
-        </div>
 
-        <el-button>删除</el-button>
 
-        <el-button>更新</el-button>
 
+  <div>
 
+    <div class="header_container">
 
+      <el-breadcrumb
 
+        class="info"
 
+        separator-class="el-icon-arrow-right"
 
+      >
 
+        <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>
 
     </div>
 
+    <div class="image_container">
 
+      <el-image
 
+        :src="testUrl"
 
+        :preview-src-list="srcList"
 
+      ></el-image>
 
+    </div>
 
+    <el-button
 
+      class="bianji"
 
+      @click="updateFloor"
 
+    >编辑</el-button>
 
+    <createUpdateFloor
 
+      ref="createUpdateFloor"
 
+      v-bind="{
 
+        beforeForm:form
 
+      }"
 
+    ></createUpdateFloor>
 
+  </div>
 
 </template>
 
 
 <script>
 
+import createUpdateFloor from "./dailog/createUpdateFloor.vue";
 
 export default {
 
-    data() {
 
-        return {
 
-            label: "1F",
 
-            testUrl: "",
 
-            srcList: [
 
-                "",
 
-            ],
 
-        }
 
-    }
 
-}
 
+  props: {
 
+    itemInfo: {
 
+      type: Object,
 
+    },
 
+  },
 
+  components: {
 
+    createUpdateFloor,
 
+  },
 
+  data() {
 
+    return {
 
+      label: "1F",
 
+      testUrl: "",
 
+      srcList: [""],
 
+      form: {},
 
+    };
 
+  },
 
+  methods: {
 
+    updateFloor() {
 
+      this.form = {
 
+        floorIndex: "1",
 
+        floorUseIndex: "2",
 
+        beizhu: "本楼用途为会议",
 
+        fujian: "",
 
+      };
 
+      this.$refs.createUpdateFloor.dialogVisible = true;
 
+    },
 
+  },
 
+};
 
 </script>
 
 
 <style lang="less" scoped>
 
-
 
-.el-tag {
 
-    position: absolute;
 
-    background-color: transparent;
 
-    border-color: transparent;
 
-    font-size: 25px;
 
-    color: #000;
 
-    top: 20px;
 
-    left: 20px;
 
-
 
+.header_container {
 
+  position: relative;
 
+  width: 100%;
 
+  height: 60px;
 
+  margin-top: 10px;
 
+  .el-breadcrumb {
 
+    line-height: 60px;
 
+    font-size: 20px;
 
+  }
 
 }
 
-
 
-.el-button--text {
 
-    position: absolute;
 
-    top: 70px;
 
-    right: 20px;
 
+.image_container {
 
+  height: 690px;
 
+  width: 100%;
 
+  margin-top: 10px;
 
+  .el-image {
 
+    width: 100%;
 
+    height: 100%;
 
+  }
 
 }
 
-
 
-.el-button {
 
-    height: 30px;
 
-    width: 100px;
 
-    margin-top: 20px;
 
-    margin-inline: 40px;
 
-    padding: 5px;
 
+.bianji {
 
+  height: 30px;
 
+  width: 100px;
 
+  padding: 3px;
 
+  color: #fff;
 
+  background: #3da0d6;
 
+  margin-top: 20px;
 
 }
 
 </style>

+ 286 - 159
src/views/systemManagement/infoConfiguration/index.vue
查看文件 

@@ -1,186 +1,313 @@
 
 <template>
 
-    <div class="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>
 
-            <el-button><i class="el-icon-s-order"></i>新建消息模块</el-button>
 
-        </div>
 
-        <div class="right-pane">
 
-            <floorInfo></floorInfo>
 
-            <!-- <SecuritystaffInfo ></SecuritystaffInfo> -->
 
-        </div>
 
+  <div class="container">
 
+    <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="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">
 
+              <!-- v-if="data.children" -->
 
+              <dropdown
 
+                :events="data.id?menuEvents:subMenuEvents"
 
+                :data="{ node, data }"
 
+                @itemClick="dropDownClick"
 
+              ></dropdown>
 
+            </span>
 
+          </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
 
+        }"
 
+      ></floorInfo>
 
+      <SecuritystaffInfo
 
+        v-if="winType == 2"
 
+        v-bind="{
 
+          itemInfo:itemInfo
 
+        }"
 
+      ></SecuritystaffInfo>
 
+    </div>
 
+    <createFloor ref="createFloor"></createFloor>
 
+    <createInfo ref="createInfo"></createInfo>
 
+  </div>
 
 </template>
 
 
 <script>
 
-import dropdown from '@/components/Dropdown/index';
 
-import floorInfo from './floorInfo';
 
-import SecuritystaffInfo from './securitystaffInfo';
 
+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 louceng from "@/assets/tree/strategy/louceng@3x.png";
 
+import huiyishi from "@/assets/tree/strategy/huiyishi@3x.png";
 
+import { isArray } from "@/utils/validate";
 
+
 
 export default {
 
-    components: { floorInfo, dropdown, SecuritystaffInfo },
 
-    data() {
 
-        return {
 
-            floorShow: true,
 
-            infoShow: false,
 
-            filterText: '',
 
-            data: [{
 
-                id: 1,
 
-                url: require('@/assets/tree/strategy/louceng@3x.png'),
 
-                label: '楼层地图信息配置',
 
-                children: [{
 
-                    url: require('@/assets/tree/strategy/huiyishi@3x.png'),
 
-                    label: '1F',
 
-                }, {
 
-                    url: require('@/assets/tree/strategy/huiyishi@3x.png'),
 
-                    label: '20F'
 
-                }, {
 
-                    url: require('@/assets/tree/strategy/huiyishi@3x.png'),
 
-                    label: 'B1'
 
-                }]
 
+  components: {
 
+    floorInfo,
 
+    dropdown,
 
+    SecuritystaffInfo,
 
+    createFloor,
 
+    createInfo,
 
+  },
 
+  data() {
 
+    return {
 
+      floorShow: true,
 
+      infoShow: false,
 
+      filterText: "",
 
+      winType: 0,
 
+      itemInfo: null,
 
+      data: [
 
+        {
 
+          id: 1,
 
+          url: louceng,
 
+          type: "floor",
 
+          label: "楼层地图信息配置",
 
+          children: [
 
+            {
 
+              url: huiyishi,
 
+              label: "1F",
 
             },
 
             {
 
-                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: '安防人员排班信息'
 
-                }]
 
-            }],
 
-            defaultProps: {
 
-                children: 'children',
 
-                label: 'label'
 
+              url: huiyishi,
 
+              label: "15F",
 
             },
 
-            menuEvents: [
 
-                { label: '新建', funcName: 'addNode' }
 
-            ],
 
-            subMenuEvents: [
 
-                { label: '新建', funcName: 'addNode' },
 
-                { label: '上移', funcName: 'moveUp' },
 
-                { label: '下移', funcName: 'moveDown' },
 
-                { label: '编辑', funcName: 'editNode' },
 
-                { label: '删除', funcName: 'removeNode' }
 
-            ]
 
-        }
 
-    },
 
-    watch: {
 
-        filterText(val) {
 
-            this.$refs.tree.filter(val);
 
-        }
 
-    },
 
-    methods: {
 
-        filterNode(value, data) {
 
-            if (!value) return true;
 
-            return data.label.indexOf(value) !== -1;
 
+            {
 
+              url: huiyishi,
 
+              label: "20F",
 
+            },
 
+            {
 
+              url: huiyishi,
 
+              label: "21F",
 
+            },
 
+            {
 
+              url: huiyishi,
 
+              label: "B1",
 
+            },
 
+            {
 
+              url: huiyishi,
 
+              label: "B3",
 
+            },
 
+          ],
 
         },
 
-        handleNodeClick(data) {
 
+        {
 
+          id: 2,
 
+          url: louceng,
 
+          label: "安保人员信息",
 
+          children: [
 
+            {
 
+              url: huiyishi,
 
+              label: "前台人员排班信息",
 
+            },
 
+            {
 
+              url: huiyishi,
 
+              label: "安防人员排班信息",
 
+            },
 
+          ],
 
         },
 
-        dropDownClick() {
 
+      ],
 
+      defaultProps: {
 
+        children: "children",
 
+        label: "label",
 
+      },
 
+      menuEvents: [{ label: "新建", funcName: "addNode" }],
 
+      subMenuEvents: [
 
+        // { label: "新建", funcName: "addNode" },
 
+        // { label: "上移", funcName: "moveUp" },
 
+        // { label: "下移", funcName: "moveDown" },
 
+        // { label: "编辑", funcName: "editNode" },
 
+        { label: "删除", funcName: "removeNode" },
 
+      ],
 
+    };
 
+  },
 
+  watch: {
 
+    filterText(val) {
 
+      this.$refs.tree.filter(val);
 
+    },
 
+  },
 
+  methods: {
 
+    filterNode(value, data) {
 
+      if (!value) return true;
 
+      return data.label.indexOf(value) !== -1;
 
+    },
 
+    handleNodeClick(data, node) {
 
+      if (!isArray(node.parent.data)) {
 
+        switch (node.parent.data.type) {
 
+          case "floor":
 
+            this.winType = 1;
 
+            break;
 
+          default:
 
+            this.winType = 2;
 
+            break;
 
         }
 
-    }
 
-}
 
+        this.itemInfo = {
 
+          data: JSON.parse(JSON.stringify(data)),
 
+          parentData: JSON.parse(JSON.stringify(node.parent.data)),
 
+        };
 
+      }
 
+    },
 
+    dropDownClick(eventType, data) {
 
+      switch (eventType) {
 
+        case "addNode":
 
+          if (data.data.type != "floor") {
 
+            this.$refs.createInfo.dialogVisible = true;
 
+          } else {
 
+            this.$refs.createFloor.dialogVisible = true;
 
+          }
 
+          break;
 
+        case "removeNode":
 
+          // 删除楼层
 
+          this.$confirm(
 
+            "此操作将删除 " + data.data.label + " , 是否继续?",
 
+            "提示",
 
+            {
 
+              confirmButtonText: "确定",
 
+              cancelButtonText: "取消",
 
+              type: "warning",
 
+            }
 
+          )
 
+            .then(() => {
 
+              this.$message({
 
+                type: "success",
 
+                message: "删除成功!",
 
+              });
 
+            })
 
+            .catch(() => {
 
+              this.$message({
 
+                type: "info",
 
+                message: "已取消删除",
 
+              });
 
+            });
 
+          break;
 
+
 
+        default:
 
+          break;
 
+      }
 
+    },
 
+  },
 
+};
 
 </script>
 
 
 <style lang="less" scoped>
 
 .container {
 
-    position: relative;
 
-    height: 100%;
 
-    line-height: 20px;
 
-    background-color: rgba(255, 255, 255, 1);
 
-    color: rgba(16, 16, 16, 1);
 
-    font-size: 14px;
 
-    text-align: center;
 
-    display: flex;
 
-    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
 
-
 
-    .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;
 
-                    }
 
-                }
 
-            }
 
+  position: relative;
 
+  height: 100%;
 
+  line-height: 20px;
 
+  background-color: rgba(255, 255, 255, 1);
 
+  color: rgba(16, 16, 16, 1);
 
+  font-size: 14px;
 
+  text-align: center;
 
+  display: flex;
 
+  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
 
 
-            /deep/.el-tree-node__children {
 
-                .el-tree-node__content {
 
-                    padding-left: 60px !important;
 
-                }
 
+  .left-pane {
 
+    width: 300px;
 
+    padding: 15px;
 
+    height: calc(100% - 30px);
 
+    .tree_container {
 
+      height: calc(100% - 50px);
 
+      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;
 
             }
 
+          }
 
         }
 
-    }
 
 
-    .right-pane {
 
-        width: calc(100% - 330px);
 
+        /deep/.el-tree-node__children {
 
+          .el-tree-node__content {
 
+            padding-left: 60px !important;
 
+          }
 
+        }
 
+      }
 
     }
 
-
 
-    .el-button {
 
-        position: absolute;
 
-        left: 40px;
 
-        bottom: 15px;
 
-        width: 250px;
 
-        text-align: center;
 
-        font-size: 16px;
 
-        color: #fff;
 
-        background: #3da0d6;
 
+    .createNewInfoMessageType {
 
+      position: relative;
 
+      width: 250px;
 
+      text-align: center;
 
+      font-size: 16px;
 
+      color: #fff;
 
+      background: #3da0d6;
 
+      color: #fff;
 
     }
 
-}
 
+  }
 
 
-.el-tag {
 
-    position: absolute;
 
-    background-color: transparent;
 
-    border-color: transparent;
 
-    font-size: 25px;
 
-    color: #000;
 
-    top: 20px;
 
-    left: 20px;
 
+  .right-pane {
 
+    width: calc(100% - 330px);
 
+  }
 
 
+  //   .el-button {
 
+  //     position: absolute;
 
+  //     left: 40px;
 
+  //     bottom: 15px;
 
+  //     width: 250px;
 
+  //     text-align: center;
 
+  //     font-size: 16px;
 
+  //     color: #fff;
 
+  //     background: #3da0d6;
 
+  //   }
 
 }
 
 
-.el-button--text {
 
-    position: absolute;
 
-    top: 70px;
 
-    right: 20px;
 
-}
 
+// .el-tag {
 
+//   position: absolute;
 
+//   background-color: transparent;
 
+//   border-color: transparent;
 
+//   font-size: 25px;
 
+//   color: #000;
 
+//   top: 20px;
 
+//   left: 20px;
 
+// }
 
+
 
+// .el-button--text {
 
+//   position: absolute;
 
+//   top: 70px;
 
+//   right: 20px;
 
+// }
 
 </style>

+ 291 - 83
src/views/systemManagement/infoConfiguration/securitystaffInfo.vue
查看文件 

@@ -1,98 +1,306 @@
 
 <template>
 
-    <div>
 
-        <div style="width: 100%; height: 100px;margin-top: 10px;">
 
-            <el-tag>{{ label }}</el-tag>
 
-            <el-button style="margin:70px 1180px 0 0 ">新建</el-button>
 
-            <el-button type="text">历史记录</el-button>
 
-        </div>
 
-        <div style="height: 600px;width: 100%; margin-top: 10px;">
 
-            <el-table :data="tableData" tooltip-effect="dark" 
-                :header-cell-style="{ textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" style="width: 100%">
 
-                <el-table-column type="index" width="50" label="序号">
 
-                </el-table-column>
 
-                <el-table-column prop="name" label="姓名">
 
-                </el-table-column>
 
-                <el-table-column prop="job_number" label="工号">
 
-                </el-table-column>
 
-                <el-table-column prop="phone_number" label="联系方式">
 
-                </el-table-column>
 
-                <el-table-column prop="territory" label="负责区域">
 
-                </el-table-column>
 
-                <el-table-column prop="photo" label="照片">
 
-                    <template slot-scope="scope">
 
-                        <el-image :src="scope.row.photo" style="width: 40px; height: 40px;" :preview-src-list="[scope.row.photo]"></el-image>
 
-                    </template>
 
-                </el-table-column>
 
-                <el-table-column prop="status" label="状态">
 
-                </el-table-column>
 
-                <el-table-column prop="EODInfo" label="值班信息">
 
-                </el-table-column>
 
-            </el-table>
 
-        </div>
 
-        <el-button>删除</el-button>
 
+  <div>
 
+
 
+    <div class="header_container">
 
+      <el-breadcrumb
 
+        class="info"
 
+        separator-class="el-icon-arrow-right"
 
+      >
 
+        <el-breadcrumb-item>{{itemInfo.parentData.label}}</el-breadcrumb-item>
 
+        <el-breadcrumb-item>{{itemInfo.data.label}}</el-breadcrumb-item>
 
+      </el-breadcrumb>
 
+    </div>
 
+    <div class="func_container">
 
+      <el-button
 
+        class="create"
 
+        @click="createNewPeople"
 
+      >新建</el-button>
 
+      <el-button
 
+        class="history"
 
+        type="text"
 
+        @click="openHistory"
 
+      >历史记录</el-button>
 
+    </div>
 
+    <div class="people_table">
 
+      <el-table
 
+        :data="tableData"
 
+        tooltip-effect="dark"
 
+        :header-cell-style="{ textAlign: 'center' }"
 
+        :cell-style="{ textAlign: 'center' }"
 
+        height="650"
 
+        style="width: 100%"
 
+      >
 
+        <el-table-column
 
+          type="index"
 
+          width="50"
 
+          label="序号"
 
+        >
 
+        </el-table-column>
 
+        <el-table-column
 
+          prop="name"
 
+          label="姓名"
 
+        >
 
+        </el-table-column>
 
+        <el-table-column
 
+          prop="job_number"
 
+          label="工号"
 
+        >
 
+        </el-table-column>
 
+        <el-table-column
 
+          prop="phone_number"
 
+          label="联系方式"
 
+        >
 
+        </el-table-column>
 
+        <el-table-column
 
+          prop="territory"
 
+          label="职责范围"
 
+        >
 
+        </el-table-column>
 
+        <el-table-column
 
+          prop="photo"
 
+          label="照片"
 
+        >
 
+          <template slot-scope="scope">
 
+            <el-image
 
+              :src="scope.row.photo"
 
+              style="width: 40px; height: 40px;"
 
+              :preview-src-list="[scope.row.photo]"
 
+            ></el-image>
 
+          </template>
 
+        </el-table-column>
 
+        <el-table-column
 
+          prop="status"
 
+          label="状态"
 
+        >
 
+        </el-table-column>
 
+        <el-table-column
 
+          label="值班日期"
 
+          width="400"
 
+        >
 
+          <template slot-scope="scope">
 
+            <!-- <el-button
 
+              @click="handleClick(scope.row)"
 
+              type="text"
 
+              size="small"
 
+            >查看</el-button>
 
+            <el-button
 
+              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(" ","日 ")}}
 
+
 
+          </template>
 
+        </el-table-column>
 
+        <el-table-column
 
+          fixed="right"
 
+          label="操作"
 
+          width="160"
 
+        >
 
+          <template slot-scope="scope">
 
+            <el-button
 
+              type="text"
 
+              size="small"
 
+              @click="updatePeo(scope.row)"
 
+            >
 
+              编辑
 
+            </el-button>
 
+            <el-button
 
+              type="text"
 
+              size="small"
 
+              @click="deletePeo(scope.row)"
 
+            >删除</el-button>
 
+          </template>
 
+        </el-table-column>
 
+      </el-table>
 
+    </div>
 
+    <div class="footer">
 
+      <page :paginationData="paginationData"></page>
 
     </div>
 
+    <createPeople ref="createPeople"></createPeople>
 
+    <createUpdatePeople
 
+      ref="createUpdatePeople"
 
+      v-bind="{
 
+        beforeForm:beforeForm
 
+      }"
 
+    ></createUpdatePeople>
 
+    <historyPeople ref="historyPeople"></historyPeople>
 
+  </div>
 
 </template>
 
 
 <script>
 
-export default {
 
-    data() {
 
-        return {
 
-            label: "前台人员信息",
 
-            tableData:[{
 
-                name:'张三',
 
-                job_number:'01111',
 
-                phone_number:'12345678901',
 
-                territory:'九层前台',
 
-                photo:'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
 
-                status:'正常'
 
-            },
 
-            {
 
-                name:'张三',
 
-                job_number:'01111',
 
-                phone_number:'12345678901',
 
-                territory:'九层前台',
 
-                photo:'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
 
-                status:'休假'
 
-            },
 
-            {
 
-                name:'张三',
 
-                job_number:'01111',
 
-                phone_number:'12345678901',
 
-                territory:'九层前台',
 
-                photo:'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
 
-                status:'正常'
 
-            }
 
-            ]
 
+import page from "@/components/pagination/index";
 
 
-        }
 
+import createPeople from "./dailog/createPeople.vue";
 
+import createUpdatePeople from "./dailog/createUpdatePeople.vue";
 
+import historyPeople from "./dailog/historyPeople.vue";
 
+export default {
 
+  props: {
 
+    itemInfo: {
 
+      type: Object,
 
     },
 
-}
 
+  },
 
+  components: {
 
+    page,
 
+    createPeople,
 
+    createUpdatePeople,
 
+    historyPeople,
 
+  },
 
+  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,
 
+      currentPage: 1,
 
+      paginationData: {
 
+        pageSize: 10,
 
+        pagerCount: 5,
 
+        currentPage: 1,
 
+        pageSizes: [5, 10, 20, 30],
 
+        total: tableData.length,
 
+        currentChange: (val) => {
 
+          that.getTableData(val);
 
+        },
 
+        handleSizeChange: (val) => {
 
+          that.handleSizeChange(val);
 
+        },
 
+      },
 
+      beforeForm: null,
 
+      tableData: tableData,
 
+    };
 
+  },
 
+  methods: {
 
+    createNewPeople() {
 
+      this.$refs.createPeople.dialogVisible = true;
 
+    },
 
+    updatePeo(data) {
 
+      console.log(data);
 
+      this.$refs.createUpdatePeople.dialogVisible = true;
 
+    },
 
+    deletePeo() {
 
+      this.$confirm("此操作将删除该条信息, 是否继续?", "提示", {
 
+        confirmButtonText: "确定",
 
+        cancelButtonText: "取消",
 
+        type: "warning",
 
+      })
 
+        .then(() => {
 
+          this.$message({
 
+            type: "success",
 
+            message: "删除成功!",
 
+          });
 
+        })
 
+        .catch(() => {
 
+          this.$message({
 
+            type: "info",
 
+            message: "已取消删除",
 
+          });
 
+        });
 
+    },
 
+    getTableData() {},
 
+    handleSizeChange() {},
 
+    openHistory() {
 
+      this.$refs.historyPeople.dialogVisible = true;
 
+    },
 
+  },
 
+};
 
 </script>
 
 
 <style lang="less" scoped>
 
-
 
-.el-tag {
 
-    position: absolute;
 
-    background-color: transparent;
 
-    border-color: transparent;
 
-    font-size: 25px;
 
-    color: #000;
 
-    top: 20px;
 
-    left: 20px;
 
-
 
-}
 
-
 
-.el-button--text {
 
-    position: absolute;
 
-    top: 70px;
 
-    right: 20px;
 
-}
 
-
 
-.el-button {
 
+.header_container {
 
+  position: relative;
 
+  width: 100%;
 
+  height: 60px;
 
+  margin-top: 10px;
 
+  .el-breadcrumb {
 
+    line-height: 60px;
 
+    font-size: 20px;
 
+  }
 
+  .el-button {
 
     height: 30px;
 
     width: 100px;
 
-    margin-top: 20px;
 
-    margin-inline: 40px;
 
     padding: 5px;
 
+  }
 
+}
 
+.func_container {
 
+  width: 100%;
 
+  height: 40px;
 
+  margin-top: 10px;
 
+  .create {
 
+    float: left;
 
+  }
 
+  .history {
 
+    float: right;
 
+  }
 
+}
 
+.people_table {
 
+  height: 650px;
 
+  width: 100%;
 
+  margin-top: 10px;
 
 }
 
 </style>

+ 260 - 163
src/views/systemManagement/messageConfiguration/commonMessage.vue
查看文件 

@@ -1,203 +1,300 @@
 
 <template>
 
-    <div>
 
-        <el-form :model="form" label-position="left" label-width="80px" :disabled="disabled">
 
-            <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="全体"></el-checkbox>
 
-                <el-checkbox label="运管管理员"></el-checkbox>
 
-                <div style="display: flex; margin-left: 30px;">
 
-                    <el-checkbox style="margin-right: 10px;" v-model="checked1"></el-checkbox><span>
 
-                        <el-cascader style="width: 300px;" :options="options" placeholder="选择角色/部门/单位" filterable>
 
-                        </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="value1" 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>
 
-            <div style="margin-top:30px">
 
-                <el-tag>年度报告通知模板</el-tag>
 
-                <el-form-item  :model="form.title" label="标题：">
 
-                    <el-input class="input_title" v-model="title" placeholder=""></el-input>
 
-                </el-form-item>
 
-                <el-form-item  :model="form.content" label="内容：">
 
-                    <el-input class="input_content" v-model="content" placeholder="请输入内容"></el-input>
 
-                </el-form-item>
 
-                <el-form-item  :model="form.messagePreview" label="样式预览：">
 
-                    <el-input class="stylePreview" v-model="messagePreview"></el-input>
 
-                </el-form-item>
 
-            </div>
 
-        </el-form>
 
-        <div class="bottom">
 
-            <el-button @click="edit">编辑</el-button>
 
+  <div>
 
+    <el-form
 
+      :model="form"
 
+      label-position="left"
 
+      label-width="80px"
 
+      :disabled="disabled"
 
+    >
 
+      <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
 
+          v-model="checked1"
 
+          label="全体"
 
+        ></el-checkbox>
 
+        <el-checkbox
 
+          v-model="checked2"
 
+          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
 
+              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="value1"
 
+            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>
 
+      <div style="margin-top:30px">
 
+        <el-tag>{{label}}模板</el-tag>
 
+        <el-form-item
 
+          :model="form.title"
 
+          label="标题："
 
+        >
 
+          <el-input
 
+            class="input_title"
 
+            v-model="title"
 
+            placeholder=""
 
+          ></el-input>
 
+        </el-form-item>
 
+        <el-form-item
 
+          :model="form.content"
 
+          label="内容："
 
+        >
 
+          <el-input
 
+            class="input_content"
 
+            v-model="content"
 
+            placeholder="请输入内容"
 
+          ></el-input>
 
+        </el-form-item>
 
+        <el-form-item
 
+          :model="form.messagePreview"
 
+          label="样式预览："
 
+        >
 
+          <el-input
 
+            class="stylePreview"
 
+            v-model="messagePreview"
 
+          ></el-input>
 
+        </el-form-item>
 
+      </div>
 
+    </el-form>
 
+    <div class="bottom">
 
+      <el-button
 
+        v-if="disabled"
 
+        @click="edit"
 
+      >编辑</el-button>
 
+      <el-button
 
+        v-if="!disabled"
 
+        @click="update"
 
+      >更新</el-button>
 
     </div>
 
+  </div>
 
 </template>
 
 
 <script>
 
 export default {
 
-    data() {
 
-        return {
 
-            checked: true,
 
-            checked1: true,
 
-            disabled:true,
 
-            radio: '1',
 
-            value1: '',
 
-            title: '',
 
-            content: '',
 
-            messagePreview: '',
 
-            form: {
 
-
 
+  props: {
 
+    label: {
 
+      type: String,
 
+    },
 
+  },
 
+  data() {
 
+    return {
 
+      checked: true,
 
+      checked1: true,
 
+      checked2: false,
 
+      checked3: false,
 
+      disabled: true,
 
+      radio: "1",
 
+      value1: "",
 
+      title: "",
 
+      content: "",
 
+      messagePreview: "",
 
+      form: {},
 
+      options: [
 
+        {
 
+          value: "角色",
 
+          label: "角色",
 
+          children: [
 
+            {
 
+              children: [{}],
 
             },
 
-            options: [
 
+          ],
 
+        },
 
+        {
 
+          value: "公司",
 
+          label: "公司",
 
+          children: [
 
+            {
 
+              value: "中讯设计院",
 
+              label: "中讯设计院",
 
+              children: [
 
                 {
 
-                    value: '角色',
 
-                    label: '角色',
 
-                    children: [{
 
-                        children: [
 
-                            {
 
-
 
-                            }
 
-                        ]
 
-                    }]
 
+                  value: "北京电信规划设计院",
 
+                  label: "北京电信规划设计院",
 
                 },
 
-                {
 
-                    value: '公司',
 
-                    label: '公司',
 
-                    children: [{
 
-                        value: '中讯设计院',
 
-                        label: '中讯设计院',
 
-                        children: [{
 
-                            value: '北京电信规划设计院',
 
-                            label: '北京电信规划设计院',
 
-                        }]
 
-                    }
 
-                    ]
 
-                }
 
-            ],
 
-            input: ''
 
-        }
 
+              ],
 
+            },
 
+          ],
 
+        },
 
+      ],
 
+      input: "",
 
+    };
 
+  },
 
+  methods: {
 
+    edit() {
 
+      this.disabled = false;
 
+    },
 
+    update() {
 
+      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.disabled = true;
 
+      }, 2000);
 
     },
 
-    methods: {
 
-        edit() {
 
-            this.disabled = false;
 
-        }
 
+  },
 
+  watch:{
 
+    label(){
 
+        this.disabled = true;
 
+        // console.log(arguments)
 
     }
 
-}
 
+  }
 
+};
 
 </script>
 
 
 <style lang="less" scoped>
 
 .el-form {
 
-    padding-left:30px;
 
-    .el-form-item {
 
-        padding-top: 20px;
 
-        margin-inline: 20px;
 
-        margin-bottom: 0;
 
+  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__label {
 
+      padding: 0;
 
+      font-size: 16px;
 
+      color: #4d4d4d;
 
+      font-weight: 550;
 
+    }
 
 
-        /deep/.el-form-item__content {
 
-            display: flex;
 
-        }
 
+    /deep/.el-form-item__content {
 
+      display: flex;
 
     }
 
+  }
 
 
-    .el-checkbox {
 
-        margin-right:30px;
 
-        margin-left: 50px;
 
-        /deep/.el-checkbox__label {
 
-            color: #4D4D4D;
 
-        }
 
+  .el-checkbox {
 
+    margin-right: 30px;
 
+    margin-left: 50px;
 
+    /deep/.el-checkbox__label {
 
+      color: #4d4d4d;
 
     }
 
-    .el-cascader{
 
-        /deep/.el-input__inner{
 
-            width: 400px;
 
-        }
 
-        /deep/.el-input__suffix{
 
-            right:-80px;
 
-        }
 
+  }
 
+  .el-cascader {
 
+    /deep/.el-input__inner {
 
+      width: 400px;
 
     }
 
-    .el-radio{
 
-        margin-left: 20px;
 
+    /deep/.el-input__suffix {
 
+      right: -80px;
 
     }
 
-    .el-date-editor{
 
-        /deep/.el-input__inner{
 
-            width: 320px;
 
-        }
 
-        /deep/.el-input__suffix{
 
-            right:-80px;
 
-        }
 
+  }
 
+  .el-radio {
 
+    margin-left: 20px;
 
+  }
 
+  .el-date-editor {
 
+    /deep/.el-input__inner {
 
+      width: 320px;
 
     }
 
-    .el-date-picker{
 
-        width: 450px;
 
-        /deep/.el-picker-panel__content{
 
-            width: 370px;
 
-        }
 
+    /deep/.el-input__suffix {
 
+      right: -80px;
 
     }
 
-
 
-    .el-tag {
 
-        position: relative;
 
-        background-color: transparent;
 
-        border-color: transparent;
 
-        font-size: 18px;
 
-        color: #4D4D4D;
 
-        right: 585px;
 
-        font-weight: 550;
 
+  }
 
+  .el-date-picker {
 
+    width: 450px;
 
+    /deep/.el-picker-panel__content {
 
+      width: 370px;
 
     }
 
+  }
 
+
 
+  .el-tag {
 
+    position: relative;
 
+    background-color: transparent;
 
+    border-color: transparent;
 
+    font-size: 18px;
 
+    color: #4d4d4d;
 
+    right: 585px;
 
+    font-weight: 550;
 
+  }
 
 }
 
-.input_title{
 
-    /deep/.el-input__inner{
 
-        width:500px;
 
-        float: left;
 
-    }
 
+.input_title {
 
+  /deep/.el-input__inner {
 
+    width: 500px;
 
+    float: left;
 
+  }
 
 }
 
-.input_content{
 
-    /deep/.el-input__inner{
 
-        width:500px;
 
-        float: left;
 
-    }
 
+.input_content {
 
+  /deep/.el-input__inner {
 
+    width: 500px;
 
+    float: left;
 
+  }
 
 }
 
-.stylePreview{
 
-    /deep/.el-input__inner{
 
-       width: 95%;
 
-       height: 300px;
 
-        float: left;
 
-    }
 
+.stylePreview {
 
+  /deep/.el-input__inner {
 
+    width: 95%;
 
+    height: 300px;
 
+    float: left;
 
+  }
 
 }
 
 
 .el-button--text {
 
-    position: absolute;
 
-    top: 70px;
 
-    right: 20px;
 
+  position: absolute;
 
+  top: 70px;
 
+  right: 20px;
 
 }
 
 
 .el-button {
 
-    height: 30px;
 
-    width: 100px;
 
-    padding: 3px;
 
-    color: #fff;
 
-    background: #3da0d6;
 
+  height: 30px;
 
+  width: 100px;
 
+  padding: 3px;
 
+  color: #fff;
 
+  background: #3da0d6;
 
 }
 
 
 .bottom {
 
-    position: absolute;
 
-    left: 900px;
 
-    bottom: 15px;
 
+  position: absolute;
 
+  left: 900px;
 
+  bottom: 15px;
 
 }
 
 </style>

+ 276 - 0
src/views/systemManagement/messageConfiguration/dailog/messageCreate.vue
查看文件 

@@ -0,0 +1,276 @@
 
+<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>

+ 229 - 171
src/views/systemManagement/messageConfiguration/index.vue
查看文件 

@@ -1,198 +1,256 @@
 
 <template>
 
-    <div class="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>
 
-            <el-button><i class="el-icon-s-order"></i>新建消息模块</el-button>
 
-        </div>
 
-        <div class="right-pane">
 
-            <commonMessage v-if="commonShow"></commonMessage>
 
-            <messageCreate v-if="createSHow"></messageCreate>
 
-            <messageRemind v-if="remindShow"></messageRemind>
 
-        </div>
 
+  <div class="container">
 
+    <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="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">
 
+                :events="data.id ? menuEvents : subMenuEvents" 
+              <dropdown
 
+                v-if="data.id!=undefined"
 
+                :events="menuEvents"
 
+                :data="{ node, data }"
 
+                @itemClick="dropDownClick"
 
+              ></dropdown>
 
+            </span>-->
 
+          </span>
 
+        </el-tree>
 
+      </div>
 
+
 
+      <el-button
 
+        class="createNewMessageType"
 
+        @click="createNewMessage"
 
+      >
 
+        <i class="el-icon-s-order"></i>
 
+        新建消息模块
 
+      </el-button>
 
+    </div>
 
+    <div class="right-pane">
 
+      <commonMessage
 
+        v-if="commonShow"
 
+        v-bind="{label:selectedMessageLabel}"
 
+      ></commonMessage>
 
+      <!-- <messageRemind v-if="remindShow"></messageRemind> -->
 
     </div>
 
+    <messageCreate
 
+      ref="messageCreate"
 
+      v-bind="{show:createSHow}"
 
+    ></messageCreate>
 
+  </div>
 
 </template>
 
 
 <script>
 
-import commonMessage from './commonMessage';
 
-import messageCreate from './messageCreate';
 
-import messageRemind from './messageRemind';
 
-import dropdown from '@/components/Dropdown/index';
 
+import commonMessage from "./commonMessage";
 
+import messageCreate from "./dailog/messageCreate";
 
+// import messageRemind from "./messageRemind";
 
+
 
+import dropdown from "@/components/Dropdown/index";
 
+
 
+import xiaoxi from "@/assets/tree/message/xiaoxi@2x.png";
 
+
 
 export default {
 
-    components: {
 
-        commonMessage, messageCreate, messageRemind, dropdown
 
-    },
 
-    data() {
 
-        return {
 
-            commonShow: false,
 
-            createSHow: true,
 
-            remindShow: false,
 
-            filterText: '',
 
-            data: [
 
-                {
 
-                    id: 1,
 
-                    label: '普通消息',
 
-                    url: require('@/assets/tree/message/xiaoxi@2x.png'),
 
-                    children: [{
 
-                        label: '年度报告通知',
 
-                        url: require('@/assets/tree/message/xiaoxi@2x.png'),
 
-                    }, {
 
-                        label: '报表导出通知',
 
-                        url: require('@/assets/tree/message/xiaoxi@2x.png'),
 
-                    }, {
 
-                        label: '系统更新通知',
 
-                        url: require('@/assets/tree/message/xiaoxi@2x.png'),
 
-                    }]
 
-                },
 
-                {
 
-                    id: 2,
 
-                    label: '提醒消息',
 
-                    url: require('@/assets/tree/message/xiaoxi@2x.png'),
 
-                    children: [{
 
-                        label: '资产年限提醒',
 
-                        url: require('@/assets/tree/message/xiaoxi@2x.png'),
 
-                    }, {
 
-                        label: '人员画像提醒',
 
-                        url: require('@/assets/tree/message/xiaoxi@2x.png'),
 
-                    }, {
 
-                        label: '备餐提醒',
 
-                        url: require('@/assets/tree/message/xiaoxi@2x.png'),
 
-                    }]
 
-                }],
 
-            defaultProps: {
 
-                children: 'children',
 
-                label: 'label'
 
+  components: {
 
+    commonMessage,
 
+    messageCreate,
 
+    // messageRemind,
 
+    dropdown,
 
+  },
 
+  data() {
 
+    return {
 
+      commonShow: false,
 
+      createSHow: false,
 
+      remindShow: false,
 
+      filterText: "",
 
+      data: [
 
+        {
 
+          id: 1,
 
+          label: "普通消息",
 
+          url: xiaoxi,
 
+          children: [
 
+            {
 
+              label: "年度报告通知",
 
+              url: xiaoxi,
 
             },
 
-            form: {
 
-
 
+            {
 
+              label: "报表导出通知",
 
+              url: xiaoxi,
 
             },
 
-            input: '',
 
-            menuEvents: [
 
-                { label: '新建', funcName: 'addNode' }
 
-            ],
 
-            subMenuEvents: [
 
-                { label: '新建', funcName: 'addNode' },
 
-                { label: '上移', funcName: 'moveUp' },
 
-                { label: '下移', funcName: 'moveDown' },
 
-                { label: '编辑', funcName: 'editNode' },
 
-                { label: '删除', funcName: 'removeNode' }
 
-            ]
 
-        }
 
+            {
 
+              label: "系统更新通知",
 
+              url: xiaoxi,
 
+            },
 
+          ],
 
+        },
 
+        {
 
+          id: 2,
 
+          label: "提醒消息",
 
+          url: xiaoxi,
 
+          children: [
 
+            {
 
+              label: "资产年限提醒",
 
+              url: xiaoxi,
 
+            },
 
+            {
 
+              label: "人员画像提醒",
 
+              url: xiaoxi,
 
+            },
 
+            {
 
+              label: "备餐提醒",
 
+              url: xiaoxi,
 
+            },
 
+          ],
 
+        },
 
+      ],
 
+      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: "",
 
+    };
 
+  },
 
+  watch: {
 
+    filterText(val) {
 
+      this.$refs.tree.filter(val);
 
     },
 
-    watch: {
 
-        filterText(val) {
 
-            this.$refs.tree.filter(val);
 
-        }
 
+  },
 
+  methods: {
 
+    filterNode(value, data) {
 
+      if (!value) return true;
 
+      return data.label.indexOf(value) !== -1;
 
     },
 
-    methods: {
 
-        filterNode(value, data) {
 
-            if (!value) return true;
 
-            return data.label.indexOf(value) !== -1;
 
-        },
 
-        dropDownClick(){},
 
-        handleNodeClick(data) {
 
-            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;
 
-            }
 
-        }
 
-    }
 
-}
 
+    // 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;
 
+      }
 
+      //   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;
 
+      //   }
 
+    },
 
+  },
 
+};
 
 </script>
 
 
 <style lang="less" scoped>
 
 .container {
 
-    position: relative;
 
-    height: 100%;
 
-    line-height: 20px;
 
-    background-color: rgba(255, 255, 255, 1);
 
-    color: rgba(16, 16, 16, 1);
 
-    font-size: 14px;
 
-    text-align: center;
 
-    display: flex;
 
-    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
 
-
 
-    .left-pane {
 
-        width: 300px;
 
-        padding: 15px;
 
-        height: calc(100% - 30px);
 
+  position: relative;
 
+  height: 100%;
 
+  line-height: 20px;
 
+  background-color: rgba(255, 255, 255, 1);
 
+  color: rgba(16, 16, 16, 1);
 
+  font-size: 14px;
 
+  text-align: center;
 
+  display: flex;
 
+  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
 
 
-        .el-tree {
 
-            margin-top: 10px;
 
-            height: calc(98% - 30px);
 
-            background-color: #FAFAFA;
 
+  .left-pane {
 
+    width: 300px;
 
+    padding: 15px;
 
+    height: calc(100% - 30px);
 
+    .tree_container {
 
+      height: calc(100% - 101px);
 
+      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;
 
 
-            /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;
 
+          }
 
 
-                .operate_btns {
 
-                    position: absolute;
 
-                    right: 20px;
 
-                    display: none;
 
-                }
 
+          &:hover,
 
+          :focus-within {
 
+            background-color: #f7fbff;
 
 
-                &:hover,
 
-                :focus-within {
 
-                    background-color: #f7fbff;
 
-
 
-                    .operate_btns {
 
-                        display: inline;
 
-                    }
 
-                }
 
+            .operate_btns {
 
+              display: inline;
 
             }
 
+          }
 
+        }
 
 
-            /deep/.el-tree-node__children {
 
-                .el-tree-node__content {
 
-                    padding-left: 60px !important;
 
-                }
 
-            }
 
+        /deep/.el-tree-node__children {
 
+          .el-tree-node__content {
 
+            padding-left: 60px !important;
 
+          }
 
         }
 
+      }
 
     }
 
-
 
-    .right-pane {
 
-        width: calc(100% - 330px);
 
+    .createNewMessageType {
 
+      position: relative;
 
+      width: 250px;
 
+      text-align: center;
 
+      font-size: 16px;
 
+      color: #fff;
 
+      background: #3da0d6;
 
+      color: #fff;
 
     }
 
+  }
 
 
-    .el-button {
 
-        position: absolute;
 
-        left: 40px;
 
-        bottom: 15px;
 
-        width: 250px;
 
-        text-align: center;
 
-        font-size: 16px;
 
-        color: #fff;
 
-        background: #3da0d6;
 
-    }
 
+  .right-pane {
 
+    width: calc(100% - 330px);
 
+  }
 
 }
 
 </style>

+ 0 - 185
src/views/systemManagement/messageConfiguration/messageCreate.vue
查看文件 

@@ -1,185 +0,0 @@
 
-<template>
 
-    <div>
 
-        <el-tag>新建消息模块</el-tag>
 
-        <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: 30px;">
 
-                    <el-checkbox style="margin-right: 10px;"></el-checkbox><span>
 
-                        <el-cascader style="width: 300px;" :options="options" placeholder="选择角色/部门/单位" filterable>
 
-                        </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>
 
-        <div class="bottom">
 
-            <el-button>下一个</el-button>
 
-            <el-button style="background:  #B3B3B3;">重置</el-button>
 
-            <el-button>确认</el-button>
 
-        </div>
 
-    </div>
 
-</template>
 
-
 
-<script>
 
-export default {
 
-    data() {
 
-        return {
 
-            checked: true,
 
-            checked2: true,
 
-            radio: '1',
 
-            value: '',
 
-            defaultProps: {
 
-                children: 'children',
 
-                label: 'label'
 
-            },
 
-            form: {
 
-
 
-            },
 
-            options: [],
 
-            superiorOptions: [
 
-                {
 
-                    value:'1',
 
-                    label:'test'
 
-                }
 
-            ]
 
-        }
 
-    },
 
-
 
-    methods: {
 
-
 
-    }
 
-}
 
-</script>
 
-
 
-<style lang="less" scoped>
 
-.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: 30px;
 
-        margin-left: 50px;
 
-
 
-        /deep/.el-checkbox__label {
 
-            color: #4D4D4D;
 
-        }
 
-    }
 
-
 
-    .el-cascader {
 
-        /deep/.el-input__inner {
 
-            width: 400px;
 
-        }
 
-
 
-        /deep/.el-input__suffix {
 
-            right: -80px;
 
-        }
 
-    }
 
-
 
-    .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>

+ 1 - 1
src/views/systemManagement/strategyConfiguration/smartMeeting.vue
查看文件 

@@ -68,7 +68,7 @@
 
           </el-col>
 
         </el-row>
 
       </div>
 
-      <div class="bottom">
 
+      <div class="bottom" v-if="deviceConfig.length > 0">
 
         <el-button
 
           class="delete_btn"
 
           @click="deletePZ"

+ 8 - 8
vue.config.js
查看文件 

@@ -18,20 +18,20 @@ module.exports = defineConfig({
 
   devServer:{
 
     port:8080,
 
     proxy:{
 
-      // '/api':{
 
-      //     target:'http://121.43.55.7:5000',
 
-      //     changeOrigin:true,
 
-      //     pathRewrite:{
 
-      //       '^/api':''
 
-      //     }
 
-      // }
 
       '/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':''
 
+      //     }
 
+      // }
 
     }
 
   }
 
 })