From ac885fb06b6405aa0fb8658f2b7b165947c8d317 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A8=8B=E5=BA=8F=E5=91=98=E5=B0=8F=E5=A2=A8?=
 <2291200076@qq.com>
Date: Mon, 3 Apr 2023 12:36:41 +0800
Subject: [PATCH] =?UTF-8?q?=E7=94=A8=E6=88=B7=E7=AE=A1=E7=90=86=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E5=AF=BC=E5=87=BA=E5=88=B0=E6=96=87=E4=BB=B6=EF=BC=9B?=
 =?UTF-8?q?=E4=B8=80=E4=BA=9B=E6=94=B9=E5=8A=A8=EF=BC=9B=E5=88=A0=E9=99=A4?=
 =?UTF-8?q?=E5=A4=9A=E4=BD=99=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../epp/PageTable/utils/FieldBuilder.java     |   2 +-
 .../epp/user/controller/UserController.java   |  32 ++
 frontend/components.d.ts                      |  21 +-
 frontend/src/api/user.js                      |  12 +
 frontend/src/components/manage-list.vue       | 195 ++++++++-
 frontend/src/components/sidebar.vue           | 122 +-----
 frontend/src/router/index.ts                  | 133 +-----
 frontend/src/store/permiss.ts                 |  49 +--
 frontend/src/views/demo/charts.vue            | 127 ------
 frontend/src/views/demo/editor.vue            |  37 --
 frontend/src/views/demo/export.vue            |  98 -----
 frontend/src/views/demo/form.vue              | 156 -------
 frontend/src/views/demo/icon.vue              | 212 ----------
 frontend/src/views/demo/import.vue            | 118 ------
 frontend/src/views/demo/markdown.vue          |  21 -
 frontend/src/views/demo/table.vue             | 191 ---------
 frontend/src/views/demo/tabs.vue              | 116 -----
 frontend/src/views/demo/user.vue              | 174 --------
 frontend/src/views/equipment-setting.vue      | 389 -----------------
 frontend/src/views/monitor-data-view.vue      | 182 --------
 frontend/src/views/privilege-role-setting.vue | 286 -------------
 frontend/src/views/privilege-user-setting.vue |   3 +-
 frontend/src/views/shop-good-setting.vue      |  11 +
 frontend/src/views/warning-setting.vue        | 302 -------------
 frontend/src/views/warning-view.vue           | 396 ------------------
 25 files changed, 257 insertions(+), 3128 deletions(-)
 delete mode 100644 frontend/src/views/demo/charts.vue
 delete mode 100644 frontend/src/views/demo/editor.vue
 delete mode 100644 frontend/src/views/demo/export.vue
 delete mode 100644 frontend/src/views/demo/form.vue
 delete mode 100644 frontend/src/views/demo/icon.vue
 delete mode 100644 frontend/src/views/demo/import.vue
 delete mode 100644 frontend/src/views/demo/markdown.vue
 delete mode 100644 frontend/src/views/demo/table.vue
 delete mode 100644 frontend/src/views/demo/tabs.vue
 delete mode 100644 frontend/src/views/demo/user.vue
 delete mode 100644 frontend/src/views/equipment-setting.vue
 delete mode 100644 frontend/src/views/monitor-data-view.vue
 delete mode 100644 frontend/src/views/privilege-role-setting.vue
 create mode 100644 frontend/src/views/shop-good-setting.vue
 delete mode 100644 frontend/src/views/warning-setting.vue
 delete mode 100644 frontend/src/views/warning-view.vue

diff --git a/backend/microservice-common/src/main/java/com/cxyxiaomo/epp/PageTable/utils/FieldBuilder.java b/backend/microservice-common/src/main/java/com/cxyxiaomo/epp/PageTable/utils/FieldBuilder.java
index ab434d7..eb28058 100644
--- a/backend/microservice-common/src/main/java/com/cxyxiaomo/epp/PageTable/utils/FieldBuilder.java
+++ b/backend/microservice-common/src/main/java/com/cxyxiaomo/epp/PageTable/utils/FieldBuilder.java
@@ -35,7 +35,7 @@ public class FieldBuilder {
      * @param addType              新增弹窗中该字段显示为什么类型 <br>
      * @param editType             修改弹窗中该字段显示为什么类型 <br>
      * @param fieldRuleListBuilder 提交时的表单验证 <br>
-     * @param mockDataPattern      mock数据正则 <br>
+     * @param mockDataPattern      mock数据正则 <a href="http://mockjs.com/examples.html">文档</a> <br>
      * @return FieldBuilder
      */
     public FieldBuilder add(String field, String prop, String fieldName, Object defaultValue,
diff --git a/backend/microservice-provider-user-8001/src/main/java/com/cxyxiaomo/epp/user/controller/UserController.java b/backend/microservice-provider-user-8001/src/main/java/com/cxyxiaomo/epp/user/controller/UserController.java
index 2ba7083..e8e24df 100644
--- a/backend/microservice-provider-user-8001/src/main/java/com/cxyxiaomo/epp/user/controller/UserController.java
+++ b/backend/microservice-provider-user-8001/src/main/java/com/cxyxiaomo/epp/user/controller/UserController.java
@@ -23,6 +23,9 @@ import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Controller;
 import org.springframework.web.bind.annotation.*;
 
+import java.text.SimpleDateFormat;
+import java.util.Calendar;
+import java.util.Date;
 import java.util.HashMap;
 import java.util.List;
 
@@ -92,6 +95,9 @@ public class UserController {
         // 新增、修改弹窗时，使用该列作为主键列进行操作
         String idFieldName = "id";
 
+        // 当前管理页面
+        String pageName = "用户管理";
+
         // 指定前端表格显示列
         JSONArray columns = FieldBuilder.create()
                 .add("username", "username", "账号", "",
@@ -185,6 +191,7 @@ public class UserController {
         map.put("columns", columns);
         map.put("fieldMapper", fieldMapper);
         map.put("idFieldName", idFieldName);
+        map.put("pageName", pageName);
 
         // 返回结果
         return Res.success(map);
@@ -213,6 +220,7 @@ public class UserController {
             }
             String passwordHash = DigestUtils.sha512Hex(password);
             user.setPassword(passwordHash);
+            user.setId(null);
             userService.addUser(user);
         } else {
             // 修改用户
@@ -250,4 +258,28 @@ public class UserController {
         boolean b = userService.deleteUser(existUser.getId());
         return Res.success(b);
     }
+
+    /**
+     * 导出用户列表
+     *
+     * @return
+     */
+    @GetMapping("/manage/exportUserList")
+    @ResponseBody
+    public Res exportUserList(UserVO userVO) {
+        List<User> userList = userService.getUserList(userVO);
+        List<UserVO> userVOList = UserVO.convertFrom(userList);
+
+        // 当前时间
+        Date now = Calendar.getInstance().getTime();
+        SimpleDateFormat format = new SimpleDateFormat("yyyyMMdd_HHmmss");
+        String dateTime = format.format(now);
+
+        HashMap<String, Object> map = new HashMap<>();
+        map.put("list", userVOList);
+        map.put("sheetName", "用户表-" + System.currentTimeMillis());
+        map.put("fileName", "用户表_导出时间_" + dateTime);
+
+        return Res.success(map);
+    }
 }
diff --git a/frontend/components.d.ts b/frontend/components.d.ts
index 858af70..b21c22c 100644
--- a/frontend/components.d.ts
+++ b/frontend/components.d.ts
@@ -9,16 +9,10 @@ declare module '@vue/runtime-core' {
   export interface GlobalComponents {
     Calender: typeof import('./src/components/calender.vue')['default']
     ContextMenu: typeof import('./src/components/context-menu.vue')['default']
-    ElAffix: typeof import('element-plus/es')['ElAffix']
+    ElAlert: typeof import('element-plus/es')['ElAlert']
     ElAvatar: typeof import('element-plus/es')['ElAvatar']
     ElButton: typeof import('element-plus/es')['ElButton']
-    ElCard: typeof import('element-plus/es')['ElCard']
-    ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
-    ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup']
-    ElCol: typeof import('element-plus/es')['ElCol']
-    ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
     ElDialog: typeof import('element-plus/es')['ElDialog']
-    ElDivider: typeof import('element-plus/es')['ElDivider']
     ElDropdown: typeof import('element-plus/es')['ElDropdown']
     ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
     ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
@@ -26,33 +20,20 @@ declare module '@vue/runtime-core' {
     ElForm: typeof import('element-plus/es')['ElForm']
     ElFormItem: typeof import('element-plus/es')['ElFormItem']
     ElIcon: typeof import('element-plus/es')['ElIcon']
-    ElImage: typeof import('element-plus/es')['ElImage']
     ElInput: typeof import('element-plus/es')['ElInput']
-    ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
     ElMenu: typeof import('element-plus/es')['ElMenu']
     ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
     ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
-    ElProgress: typeof import('element-plus/es')['ElProgress']
     ElRadio: typeof import('element-plus/es')['ElRadio']
-    ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
     ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
-    ElRow: typeof import('element-plus/es')['ElRow']
     ElSelect: typeof import('element-plus/es')['ElSelect']
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
-    ElSwitch: typeof import('element-plus/es')['ElSwitch']
     ElTable: typeof import('element-plus/es')['ElTable']
     ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
-    ElTabPane: typeof import('element-plus/es')['ElTabPane']
-    ElTabs: typeof import('element-plus/es')['ElTabs']
-    ElTag: typeof import('element-plus/es')['ElTag']
-    ElTimePicker: typeof import('element-plus/es')['ElTimePicker']
     ElTooltip: typeof import('element-plus/es')['ElTooltip']
-    ElTree: typeof import('element-plus/es')['ElTree']
-    ElUpload: typeof import('element-plus/es')['ElUpload']
     Header: typeof import('./src/components/header.vue')['default']
     ManageList: typeof import('./src/components/manage-list.vue')['default']
-    Popover: typeof import('./src/components/popover.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     Sidebar: typeof import('./src/components/sidebar.vue')['default']
diff --git a/frontend/src/api/user.js b/frontend/src/api/user.js
index f862d6f..5b93289 100644
--- a/frontend/src/api/user.js
+++ b/frontend/src/api/user.js
@@ -61,3 +61,15 @@ export function deleteUser(params) {
         params: params,
     });
 };
+
+/**
+ * 导出用户列表
+ * @returns
+ */
+export function exportUserList(params) {
+    return send_request({
+        url: '/user/manage/exportUserList',
+        method: 'GET',
+        params: params,
+    });
+};
diff --git a/frontend/src/components/manage-list.vue b/frontend/src/components/manage-list.vue
index 2ef3f9e..3335e4e 100644
--- a/frontend/src/components/manage-list.vue
+++ b/frontend/src/components/manage-list.vue
@@ -6,17 +6,24 @@
             <div class="handle-box">
                 <template v-for="field in searchFields">
                     <el-input v-if="field.searchType == 'input'" v-model="query[field.field]"
-                        @keyup.enter.native="handleSearch" :placeholder="field.placeholder"
+                        @keyup.enter.native="handleSearch" :placeholder="field.placeholder" :prefix-icon="Filter"
                         class="handle-input mr10"></el-input>
                     <el-select v-else-if="field.searchType == 'select'" v-model="query[field.field]" :clearable="true"
                         @change="handleSearch" :placeholder="field.placeholder" class="handle-select mr10">
+                        <template #prefix>
+                            <el-icon>
+                                <Filter />
+                            </el-icon>
+                        </template>
                         <el-option v-for="optKey in Object.keys(field.options)" :key="optKey" :label="field.options[optKey]"
                             :value="optKey"></el-option>
                     </el-select>
                     <template v-else>{{ field }}</template>
                 </template>
-                <el-button type="primary" :icon="Search" @click="handleSearch">搜索</el-button>
-                <el-button type="primary" :icon="Plus" @click="handleNew" v-permiss="props.editPermiss">新增</el-button>
+                <el-button type="primary" :icon="Search" @click="handleSearch">查询</el-button>
+                <el-button type="primary" :icon="Plus" @click="handleNew" v-permiss="props.editPermiss">新增记录</el-button>
+                <el-button type="primary" :icon="Download" @click="exportFormVisible = true"
+                    v-permiss="props.editPermiss">导出到文件</el-button>
             </div>
             <!-- 表格 -->
             <el-table :data="tableData" border class="table" ref="multipleTable" header-cell-class-name="table-header">
@@ -72,14 +79,38 @@
                 </span>
             </template>
         </el-dialog>
+
+        <!-- 导出 Excel 弹窗 -->
+        <el-dialog v-model="exportFormVisible" title="导出选项">
+            <el-form :model="form" label-width="80px">
+                <el-form-item label="数据范围">
+                    <el-radio-group v-model="exportConfig.withFilter">
+                        <el-radio :label="false">全部数据</el-radio>
+                        <el-radio :label="true">满足筛选条件的数据</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-form-item label="文件格式">
+                    <el-radio-group v-model="exportConfig.ext">
+                        <el-radio v-for="ext in supportExportFormatList" :label="ext">{{ ext }}</el-radio>
+                    </el-radio-group>
+                </el-form-item>
+                <el-alert v-if="exportInfo" :title="exportInfo.info" :type="exportInfo.type" :closable="false" show-icon />
+            </el-form>
+            <template #footer>
+                <span class="dialog-footer">
+                    <el-button @click="exportFormVisible = false">取消</el-button>
+                    <el-button type="primary" @click="handleExport">导出</el-button>
+                </span>
+            </template>
+        </el-dialog>
     </div>
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, onMounted } from 'vue';
+import { ref, reactive, onMounted, computed } from 'vue';
 import { FormInstance, FormRules, ElMessage, ElMessageBox } from 'element-plus';
-import { Delete, Edit, Search, Plus } from '@element-plus/icons-vue';
-import send_request from '../utils/send_request';
+import { Delete, Edit, Search, Plus, Filter, Download } from '@element-plus/icons-vue';
+import * as xlsx from 'xlsx';
 import Mock from 'mockjs';
 
 const props = defineProps({
@@ -103,7 +134,12 @@ const props = defineProps({
         type: Function,
         required: true,
     },
-    // 修改、删除权限
+    // 导出 接口函数
+    'exportFunc': {
+        type: Function,
+        required: true,
+    },
+    // 修改、删除、导出权限
     'editPermiss': {
         type: String,
         required: true,
@@ -118,6 +154,9 @@ const query = reactive({
     // 其他筛选条件
 }); // 筛选条件的值
 
+// 字段翻译字典（如 roleId -> roleName）
+let fieldsMapper: any;
+
 // 表格
 const tableData: any = ref(null);   // 表格数据
 const tableFields: any = ref([]);   // 表格列
@@ -136,9 +175,34 @@ const editForm = ref<FormInstance>();
 // const rules: FormRules = {};
 const rules = ref({} as FormRules);
 
-//
+// mock数据
 let mockData: any = []
 
+// 导出 Excel 弹窗
+const exportFormVisible: any = ref(false);
+let exportFields: any = []          // 导出 excel 列表对应中文
+const supportExportFormatList = ref(['xlsx', 'xls', 'csv', 'html', 'txt', 'json', 'rtf'] as Array<String>); // 支持的导出格式
+const exportConfig = ref({
+    withFilter: false, // 导出时是否携带筛选条件
+    ext: "xlsx", // 所选导出格式
+} as any);
+const exportInfo = computed(() => {
+    if (['xlsx', 'xls'].includes(exportConfig.value.ext)) {
+        return null
+    }
+    let info = '建议选择 xlsx 或 xls 格式'
+    let type = 'info'
+    if (['rtf'].includes(exportConfig.value.ext)) {
+        // 不推荐的导出格式
+        info = '该格式易出现编码问题，' + info
+        type = 'warning'
+    } else if (['json'].includes(exportConfig.value.ext)) {
+        info = '该格式方便程序读取，若您不了解该格式，建议选择其他格式进行导出'
+        type = 'warning'
+    }
+    return { info, type }
+})
+
 // 获取表格数据
 const getData = async () => {
     props.listFunc(query).then((data: any) => {
@@ -147,15 +211,15 @@ const getData = async () => {
         // 深拷贝一份
         let _tableData = JSON.parse(JSON.stringify(data.list));
         // 字段映射
-        let fieldsMapper = data.fieldMapper;
+        fieldsMapper = data.fieldMapper;
         if (fieldsMapper) {
             // 对于每一个需要映射的字段
             for (let m of fieldsMapper) {
                 // console.log("mapper", m)
                 _tableData = _tableData.map((row: any) => {
-                    let oldValue = row[m.key]
-                    let newValue = m.mapper[oldValue]
-                    row[m.value] = newValue
+                    let oldValue = row[m.key] // 取得旧值
+                    let newValue = m.mapper[oldValue] // 翻译新值
+                    row[m.value] = newValue // 塞回新值
                     return row
                 })
             }
@@ -167,6 +231,10 @@ const getData = async () => {
         tableFields.value = data.columns
             .filter((field: any) => field.showInTable)
             .map((field: any) => {
+                // query 填充默认空字符串
+                if (typeof (query[field.field]) === "undefined") {
+                    query[field.field] = ''
+                }
                 return { prop: field.prop, label: field.label }
             });
         console.log("tableFields", tableFields.value)
@@ -203,10 +271,6 @@ const getData = async () => {
         // 新增/修改弹窗列
         dialogFields.value = data.columns
             .map((field: any) => {
-                // 拼装 新增/修改弹窗 字段
-                if (typeof (query[field.field]) === "undefined") {
-                    query[field.field] = ''
-                }
                 let f: any = {
                     label: field.label,
                     field: field.field,
@@ -228,16 +292,17 @@ const getData = async () => {
             });
         console.log("dialogFields", dialogFields.value);
 
+        // 导出 excel 字段映射
+        exportFields = data.columns
+            .filter((field: any) => field.showInTable)
+            .map((field: any) => {
+                return { field: field.field, label: field.label }
+            });
+        console.log("exportFields", exportFields)
+
         // 表单验证
         for (let field of data.columns) {
             rules.value[field.field] = field.validateRules
-            // .map((rule: any) => {
-            //     if (rule.pattern) {
-            //         rule.pattern = new RegExp(rule.pattern)
-            //         console.log(rule.pattern)
-            //     }
-            //     return rule
-            // })
         }
         console.log("rules", rules.value)
 
@@ -382,6 +447,90 @@ const handleDelete = (index: number, row: any) => {
         .catch(() => { });
 };
 
+// 导出数据到文件
+const handleExport = async () => {
+    // 去除分页参数
+    let params = JSON.parse(JSON.stringify(query))
+    delete params["pageIndex"]
+    delete params["pageSize"]
+    props.exportFunc(params).then((data: any) => {
+        console.log("exportData", data)
+        let sheetName = data.sheetName
+        let fileName = data.fileName
+        console.log("data.list", data.list)
+
+        // 字段翻译
+        let dataList = JSON.parse(JSON.stringify(data.list))
+        if (fieldsMapper) {
+            // 对于每一个需要映射的字段
+            for (let m of fieldsMapper) {
+                // console.log("mapper", m)
+                dataList = dataList.map((row: any) => {
+                    let oldValue = row[m.key] // 取得旧值
+                    let newValue = m.mapper[oldValue] // 翻译新值
+                    row[m.key] = newValue // 直接在旧 key 塞回新值
+                    // 因为后续是通过翻译前的 key 拿的数据，所以这里不翻译 key 只翻译 value
+                    return row
+                })
+            }
+        }
+        console.log("dataList", dataList)
+
+        // 所有列的 field
+        let fieldNameList = exportFields.map((f: any) => f.field)
+        fieldNameList.unshift(idFieldName)
+
+        // 第一行表头
+        let firstRow = exportFields.map((f: any) => f.label)
+        firstRow.unshift("ID")
+
+        // 列宽
+        let rowWidth = exportFields.map(() => { return { wch: 13 } })
+        rowWidth.unshift({ wch: 5 })
+
+        // 数据部分
+        let excelList = dataList.map((row: any) => {
+            // 通过翻译前的 key 拿数据
+            return fieldNameList.map((field: any) => String(row[field]))
+        })
+        excelList.unshift(firstRow) // 插入表头
+
+        console.log("excelList", excelList)
+
+        function downloadFile(text: string, fileName: string, contentType: string) {
+            const blob = new Blob([text], { type: contentType });
+            const href = URL.createObjectURL(blob);
+            const alink = document.createElement("a");
+            alink.style.display = "none";
+            alink.download = fileName; // 下载后文件名
+            alink.href = href;
+            document.body.appendChild(alink);
+            alink.click();
+            document.body.removeChild(alink); // 下载完成移除元素
+            URL.revokeObjectURL(href); // 释放掉blob对象
+        }
+
+        // 生成文件
+        let _fileName: string = `${fileName || '数据导出'}.${exportConfig.value.ext || 'xlsx'}`
+        if (exportConfig.value.ext === "json") {
+            let text = JSON.stringify(excelList)
+            downloadFile(text, _fileName, "application/json;charset=utf-8")
+        } else if (exportConfig.value.ext === "txt") {
+            let text = excelList.map((row: Array<any>) => row.join('\t')).join('\n')
+            downloadFile(text, _fileName, "text/plain;charset=utf-8")
+        } else {
+            let worksheet = xlsx.utils.aoa_to_sheet(excelList)
+            let workbook = xlsx.utils.book_new()
+            worksheet["!cols"] = rowWidth; // 指定列宽
+            xlsx.utils.book_append_sheet(workbook, worksheet, sheetName || 'Sheet1')
+            xlsx.writeFile(workbook, _fileName)
+        }
+
+        ElMessage.success({ message: "导出成功" })
+        exportFormVisible.value = false
+    })
+}
+
 // 生成测试数据
 const doMockData = (isEdit: boolean) => {
     for (let mock of mockData) {
diff --git a/frontend/src/components/sidebar.vue b/frontend/src/components/sidebar.vue
index e577c89..4078b01 100644
--- a/frontend/src/components/sidebar.vue
+++ b/frontend/src/components/sidebar.vue
@@ -52,19 +52,6 @@ const items = [
         title: '系统首页', // 站点基础信息
         permiss: 'dashboard',
     },
-    {
-        icon: 'Monitor',
-        index: '/monitor-data',
-        title: '监测数据',
-        permiss: 'monitor-data',
-        subs: [
-        {
-                index: '/monitor-data-view',
-                title: '查看数据',
-                permiss: 'monitor-data-view',
-            },
-        ],
-    },
     {
         icon: 'BellFilled',
         index: '/warning',
@@ -85,123 +72,30 @@ const items = [
     },
     {
         icon: 'OfficeBuilding',
-        index: '/equipment',
-        title: '设备信息',
-        permiss: 'equipment',
+        index: '/shop',
+        title: '商品管理',
+        permiss: 'shop',
         subs: [
             {
-                index: '/equipment-setting',
-                title: '设备管理',
-                permiss: 'equipment-setting',
+                index: '/shop-good-setting',
+                title: '商品管理',
+                permiss: 'shop-good-setting',
             },
         ],
     },
     {
         icon: 'Avatar',
         index: '/privilege',
-        title: '用户角色',
+        title: '用户管理',
         permiss: 'privilege',
         subs: [
             {
                 index: '/privilege-user-setting',
-                title: '用户管理', // 列表 增删改
+                title: '用户管理',
                 permiss: 'privilege-user-setting',
             },
-            {
-                index: '/privilege-role-setting',
-                title: '角色权限', // 列表 增删改<角色名;角色对应权限>
-                permiss: 'privilege-role-setting',
-            },
         ],
     },
-
-
-
-
-    ... !settings.debugMode ? [] : [
-        {
-            icon: 'Odometer',
-            index: '/',
-            title: '——————————',
-            permiss: 'default',
-        },
-        {
-            icon: 'Calendar',
-            index: '1',
-            title: '表格相关',
-            permiss: 'default',
-            subs: [
-                {
-                    index: '/table',
-                    title: '常用表格',
-                    permiss: 'default',
-                },
-                {
-                    index: '/import',
-                    title: '导入Excel',
-                    permiss: 'default',
-                },
-                {
-                    index: '/export',
-                    title: '导出Excel',
-                    permiss: 'default',
-                },
-            ],
-        },
-        {
-            icon: 'DocumentCopy',
-            index: '/tabs',
-            title: 'tab选项卡',
-            permiss: 'default',
-        },
-        {
-            icon: 'Edit',
-            index: '3',
-            title: '表单相关',
-            permiss: 'default',
-            subs: [
-                {
-                    index: '/form',
-                    title: '基本表单',
-                    permiss: 'default',
-                },
-                {
-                    index: '/upload',
-                    title: '文件上传',
-                    permiss: 'default',
-                },
-                {
-                    index: '4',
-                    title: '三级菜单',
-                    permiss: 'default',
-                    subs: [
-                        {
-                            index: '/editor',
-                            title: '富文本编辑器',
-                            permiss: 'default',
-                        },
-                        {
-                            index: '/markdown',
-                            title: 'markdown编辑器',
-                            permiss: '9default',
-                        },
-                    ],
-                },
-            ],
-        },
-        {
-            icon: 'Setting',
-            index: '/icon',
-            title: '自定义图标',
-            permiss: 'default',
-        },
-        {
-            icon: 'PieChart',
-            index: '/charts',
-            title: 'schart图表',
-            permiss: 'default',
-        },
-    ]
 ];
 
 const route = useRoute();
diff --git a/frontend/src/router/index.ts b/frontend/src/router/index.ts
index 92cf19a..8bbd5b3 100644
--- a/frontend/src/router/index.ts
+++ b/frontend/src/router/index.ts
@@ -23,40 +23,13 @@ const routes: RouteRecordRaw[] = [
                 component: () => import('../views/dashboard.vue'),
             },
             {
-                path: '/monitor-data-view',
-                name: 'monitor-data-view',
+                path: '/shop-good-setting',
+                name: 'shop-good-setting',
                 meta: {
-                    title: '查看数据',
-                    permiss: 'monitor-data-view',
+                    title: '商品管理',
+                    permiss: 'shop-good-setting',
                 },
-                component: () => import('../views/monitor-data-view.vue'),
-            },
-            {
-                path: '/warning-view',
-                name: 'warning-view',
-                meta: {
-                    title: '总览',
-                    permiss: 'warning-view',
-                },
-                component: () => import('../views/warning-view.vue'),
-            },
-            {
-                path: '/warning-setting',
-                name: 'warning-setting',
-                meta: {
-                    title: '预警设置',
-                    permiss: 'warning-setting',
-                },
-                component: () => import('../views/warning-setting.vue'),
-            },
-            {
-                path: '/equipment-setting',
-                name: 'equipment-setting',
-                meta: {
-                    title: '设备管理',
-                    permiss: 'equipment-setting',
-                },
-                component: () => import('../views/equipment-setting.vue'),
+                component: () => import('../views/shop-good-setting.vue'),
             },
             {
                 path: '/privilege-user-setting',
@@ -67,15 +40,6 @@ const routes: RouteRecordRaw[] = [
                 },
                 component: () => import('../views/privilege-user-setting.vue'),
             },
-            {
-                path: '/privilege-role-setting',
-                name: 'privilege-role-setting',
-                meta: {
-                    title: '角色权限',
-                    permiss: 'privilege-role-setting',
-                },
-                component: () => import('../views/privilege-role-setting.vue'),
-            },
             {
                 path: '/user',
                 name: 'user',
@@ -84,93 +48,6 @@ const routes: RouteRecordRaw[] = [
                 },
                 component: () => import('../views/user.vue'),
             },
-
-
-
-
-
-
-            {
-                path: '/table',
-                name: 'basetable',
-                meta: {
-                    title: '表格',
-                    permiss: 'default',
-                },
-                component: () => import('../views/demo/table.vue'),
-            },
-            {
-                path: '/charts',
-                name: 'basecharts',
-                meta: {
-                    title: '图表',
-                    permiss: 'default',
-                },
-                component: () => import('../views/demo/charts.vue'),
-            },
-            {
-                path: '/form',
-                name: 'baseform',
-                meta: {
-                    title: '表单',
-                    permiss: 'default',
-                },
-                component: () => import('../views/demo/form.vue'),
-            },
-            {
-                path: '/tabs',
-                name: 'tabs',
-                meta: {
-                    title: 'tab标签',
-                    permiss: 'default',
-                },
-                component: () => import('../views/demo/tabs.vue'),
-            },
-            {
-                path: '/icon',
-                name: 'icon',
-                meta: {
-                    title: '自定义图标',
-                    permiss: 'default',
-                },
-                component: () => import('../views/demo/icon.vue'),
-            },
-            {
-                path: '/editor',
-                name: 'editor',
-                meta: {
-                    title: '富文本编辑器',
-                    permiss: 'default',
-                },
-                component: () => import('../views/demo/editor.vue'),
-            },
-            {
-                path: '/markdown',
-                name: 'markdown',
-                meta: {
-                    title: 'markdown编辑器',
-                    permiss: 'default',
-                },
-                component: () => import('../views/demo/markdown.vue'),
-            },
-            {
-                path: '/export',
-                name: 'export',
-                meta: {
-                    title: '导出Excel',
-                    permiss: 'default',
-                },
-                component: () => import('../views/demo/export.vue'),
-            },
-            {
-                path: '/import',
-                name: 'import',
-                meta: {
-                    title: '导入Excel',
-                    permiss: 'default',
-                },
-                component: () => import('../views/demo/import.vue'),
-            },
         ],
     },
     {
diff --git a/frontend/src/store/permiss.ts b/frontend/src/store/permiss.ts
index eb7f90e..3596cdd 100644
--- a/frontend/src/store/permiss.ts
+++ b/frontend/src/store/permiss.ts
@@ -10,47 +10,26 @@ export const usePermissStore = defineStore('permiss', {
     state: () => {
         return {
             "1": [
-                "dashboard",
-                "data-integration",
                 "default",
-                "equipment",
-                "equipment-setting",
-                "equipment-setting-manage",
-                "equipment-view",
-                "monitor-data",
-                "monitor-data-statistics",
-                "monitor-data-view",
+
+                "dashboard",
+
+                "shop",
+                "shop-good-setting",
+
                 "privilege",
-                "privilege-role-setting",
                 "privilege-user-setting",
-                "report",
-                "report-upload",
-                "resource",
-                "resource-staff-setting",
-                "resource-vehicle-setting",
-                "site-info",
-                "warning",
-                "warning-log",
-                "warning-setting",
-                "warning-view"
             ],
             "2": [
-                "dashboard",
-                "data-integration",
                 "default",
-                "equipment",
-                "equipment-setting",
-                "equipment-view",
-                "monitor-data",
-                "monitor-data-statistics",
-                "monitor-data-view",
-                "report",
-                "report-upload",
-                "site-info",
-                "warning",
-                "warning-log",
-                "warning-setting",
-                "warning-view"
+
+                "dashboard",
+
+                "shop",
+                "shop-good-setting",
+
+                "privilege",
+                "privilege-user-setting",
             ]
         };
     },
diff --git a/frontend/src/views/demo/charts.vue b/frontend/src/views/demo/charts.vue
deleted file mode 100644
index 7e4df52..0000000
--- a/frontend/src/views/demo/charts.vue
+++ /dev/null
@@ -1,127 +0,0 @@
-<template>
-	<div class="container">
-		<div class="plugins-tips">
-			vue-schart：vue.js封装sChart.js的图表组件。 访问地址：
-			<a href="https://github.com/lin-xin/vue-schart" target="_blank">vue-schart</a>
-		</div>
-		<div class="schart-box">
-			<div class="content-title">柱状图</div>
-			<schart class="schart" canvasId="bar" :options="options1"></schart>
-		</div>
-		<div class="schart-box">
-			<div class="content-title">折线图</div>
-			<schart class="schart" canvasId="line" :options="options2"></schart>
-		</div>
-		<div class="schart-box">
-			<div class="content-title">饼状图</div>
-			<schart class="schart" canvasId="pie" :options="options3"></schart>
-		</div>
-		<div class="schart-box">
-			<div class="content-title">环形图</div>
-			<schart class="schart" canvasId="ring" :options="options4"></schart>
-		</div>
-	</div>
-</template>
-
-<script setup lang="ts" name="basecharts">
-import Schart from 'vue-schart';
-
-const options1 = {
-	type: 'bar',
-	title: {
-		text: '最近一周各品类销售图'
-	},
-	bgColor: '#fbfbfb',
-	labels: ['周一', '周二', '周三', '周四', '周五'],
-	datasets: [
-		{
-			label: '家电',
-			fillColor: 'rgba(241, 49, 74, 0.5)',
-			data: [234, 278, 270, 190, 230]
-		},
-		{
-			label: '百货',
-			data: [164, 178, 190, 135, 160]
-		},
-		{
-			label: '食品',
-			data: [144, 198, 150, 235, 120]
-		}
-	]
-};
-const options2 = {
-	type: 'line',
-	title: {
-		text: '最近几个月各品类销售趋势图'
-	},
-	bgColor: '#fbfbfb',
-	labels: ['6月', '7月', '8月', '9月', '10月'],
-	datasets: [
-		{
-			label: '家电',
-			data: [234, 278, 270, 190, 230]
-		},
-		{
-			label: '百货',
-			data: [164, 178, 150, 135, 160]
-		},
-		{
-			label: '食品',
-			data: [114, 138, 200, 235, 190]
-		}
-	]
-};
-const options3 = {
-	type: 'pie',
-	title: {
-		text: '服装品类销售饼状图'
-	},
-	legend: {
-		position: 'left'
-	},
-	bgColor: '#fbfbfb',
-	labels: ['T恤', '牛仔裤', '连衣裙', '毛衣', '七分裤', '短裙', '羽绒服'],
-	datasets: [
-		{
-			data: [334, 278, 190, 235, 260, 200, 141]
-		}
-	]
-};
-const options4 = {
-	type: 'ring',
-	title: {
-		text: '环形三等分'
-	},
-	showValue: false,
-	legend: {
-		position: 'bottom',
-		bottom: 40
-	},
-	bgColor: '#fbfbfb',
-	labels: ['vue', 'react', 'angular'],
-	datasets: [
-		{
-			data: [500, 500, 500]
-		}
-	]
-};
-</script>
-
-<style scoped>
-.schart-box {
-	display: inline-block;
-	margin: 20px;
-}
-.schart {
-	width: 600px;
-	height: 400px;
-}
-.content-title {
-	clear: both;
-	font-weight: 400;
-	line-height: 50px;
-	margin: 10px 0;
-	font-size: 22px;
-	color: #1f2f3d;
-}
-</style>
diff --git a/frontend/src/views/demo/editor.vue b/frontend/src/views/demo/editor.vue
deleted file mode 100644
index c08d55b..0000000
--- a/frontend/src/views/demo/editor.vue
+++ /dev/null
@@ -1,37 +0,0 @@
-<template>
-	<div class="container">
-		<div class="plugins-tips">
-			wangEditor：轻量级 web 富文本编辑器，配置方便，使用简单。 访问地址：
-			<a href="https://www.wangeditor.com/doc/" target="_blank">wangEditor</a>
-		</div>
-		<div class="mgb20" ref="editor"></div>
-		<el-button type="primary" @click="syncHTML">提交</el-button>
-	</div>
-</template>
-
-<script setup lang="ts" name="editor">
-import WangEditor from 'wangeditor';
-import { ref, reactive, onMounted, onBeforeUnmount } from 'vue';
-
-const editor = ref(null);
-const content = reactive({
-	html: '',
-	text: ''
-});
-let instance: any;
-onMounted(() => {
-	instance = new WangEditor(editor.value);
-	instance.config.zIndex = 1;
-	instance.create();
-});
-onBeforeUnmount(() => {
-	instance.destroy();
-	instance = null;
-});
-const syncHTML = () => {
-	content.html = instance.txt.html();
-	console.log(content.html);
-};
-</script>
-
-<style></style>
diff --git a/frontend/src/views/demo/export.vue b/frontend/src/views/demo/export.vue
deleted file mode 100644
index 21ecf6b..0000000
--- a/frontend/src/views/demo/export.vue
+++ /dev/null
@@ -1,98 +0,0 @@
-<template>
-    <div>
-        <div class="container">
-            <div class="handle-box">
-                <el-button type="primary" @click="exportXlsx">导出Excel</el-button>
-            </div>
-            <el-table :data="tableData" border class="table" header-cell-class-name="table-header">
-                <el-table-column prop="id" label="ID" width="55" align="center"></el-table-column>
-                <el-table-column prop="name" label="姓名"></el-table-column>
-                <el-table-column prop="sno" label="学号"></el-table-column>
-                <el-table-column prop="class" label="班级"></el-table-column>
-                <el-table-column prop="age" label="年龄"></el-table-column>
-                <el-table-column prop="sex" label="性别"></el-table-column>
-            </el-table>
-        </div>
-    </div>
-</template>
-
-<script setup lang="ts" name="export">
-import { ref } from 'vue';
-import * as XLSX from 'xlsx';
-
-interface TableItem {
-    id: number;
-    name: string;
-    sno: string;
-    class: string;
-    age: string;
-    sex: string;
-}
-
-const tableData = ref<TableItem[]>([]);
-// 获取表格数据
-const getData = () => {
-    tableData.value = [
-        {
-            id: 1,
-            name: '小明',
-            sno: 'S001',
-            class: '一班',
-            age: '10',
-            sex: '男',
-        },
-        {
-            id: 2,
-            name: '小红',
-            sno: 'S002',
-            class: '一班',
-            age: '9',
-            sex: '女',
-        },
-    ];
-};
-getData();
-
-const list = [['序号', '姓名', '学号', '班级', '年龄', '性别']];
-const exportXlsx = () => {
-    tableData.value.map((item: any, i: number) => {
-        const arr: any[] = [i + 1];
-        arr.push(...[item.name, item.sno, item.class, item.age, item.sex]);
-        list.push(arr);
-    });
-    let WorkSheet = XLSX.utils.aoa_to_sheet(list);
-    let new_workbook = XLSX.utils.book_new();
-    XLSX.utils.book_append_sheet(new_workbook, WorkSheet, '第一页');
-    XLSX.writeFile(new_workbook, `表格.xlsx`);
-};
-</script>
-
-<style scoped>
-.handle-box {
-    margin-bottom: 20px;
-}
-
-.handle-select {
-    width: 120px;
-}
-
-.handle-input {
-    width: 300px;
-}
-.table {
-    width: 100%;
-    font-size: 14px;
-}
-.red {
-    color: #f56c6c;
-}
-.mr10 {
-    margin-right: 10px;
-}
-.table-td-thumb {
-    display: block;
-    margin: auto;
-    width: 40px;
-    height: 40px;
-}
-</style>
diff --git a/frontend/src/views/demo/form.vue b/frontend/src/views/demo/form.vue
deleted file mode 100644
index 75609ae..0000000
--- a/frontend/src/views/demo/form.vue
+++ /dev/null
@@ -1,156 +0,0 @@
-<template>
-    <div class="container">
-        <div class="form-box">
-            <el-form ref="formRef" :rules="rules" :model="form" label-width="80px">
-                <el-form-item label="表单名称" prop="name">
-                    <el-input v-model="form.name"></el-input>
-                </el-form-item>
-                <el-form-item label="选择器" prop="region">
-                    <el-select v-model="form.region" placeholder="请选择">
-                        <el-option key="小明" label="小明" value="小明"></el-option>
-                        <el-option key="小红" label="小红" value="小红"></el-option>
-                        <el-option key="小白" label="小白" value="小白"></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item label="日期时间">
-                    <el-col :span="11">
-                        <el-form-item prop="date1">
-                            <el-date-picker
-                                type="date"
-                                placeholder="选择日期"
-                                v-model="form.date1"
-                                style="width: 100%"
-                            ></el-date-picker>
-                        </el-form-item>
-                    </el-col>
-                    <el-col class="line" :span="2">-</el-col>
-                    <el-col :span="11">
-                        <el-form-item prop="date2">
-                            <el-time-picker placeholder="选择时间" v-model="form.date2" style="width: 100%">
-                            </el-time-picker>
-                        </el-form-item>
-                    </el-col>
-                </el-form-item>
-                <el-form-item label="城市级联" prop="options">
-                    <el-cascader :options="options" v-model="form.options"></el-cascader>
-                </el-form-item>
-                <el-form-item label="选择开关" prop="delivery">
-                    <el-switch v-model="form.delivery"></el-switch>
-                </el-form-item>
-                <el-form-item label="多选框" prop="type">
-                    <el-checkbox-group v-model="form.type">
-                        <el-checkbox label="小明" name="type"></el-checkbox>
-                        <el-checkbox label="小红" name="type"></el-checkbox>
-                        <el-checkbox label="小白" name="type"></el-checkbox>
-                    </el-checkbox-group>
-                </el-form-item>
-                <el-form-item label="单选框" prop="resource">
-                    <el-radio-group v-model="form.resource">
-                        <el-radio label="小明"></el-radio>
-                        <el-radio label="小红"></el-radio>
-                        <el-radio label="小白"></el-radio>
-                    </el-radio-group>
-                </el-form-item>
-                <el-form-item label="文本框" prop="desc">
-                    <el-input type="textarea" rows="5" v-model="form.desc"></el-input>
-                </el-form-item>
-                <el-form-item>
-                    <el-button type="primary" @click="onSubmit(formRef)">表单提交</el-button>
-                    <el-button @click="onReset(formRef)">重置表单</el-button>
-                </el-form-item>
-            </el-form>
-        </div>
-    </div>
-</template>
-
-<script setup lang="ts" name="baseform">
-import { reactive, ref } from 'vue';
-import { ElMessage } from 'element-plus';
-import type { FormInstance, FormRules } from 'element-plus';
-
-const options = [
-    {
-        value: 'guangdong',
-        label: '广东省',
-        children: [
-            {
-                value: 'guangzhou',
-                label: '广州市',
-                children: [
-                    {
-                        value: 'tianhe',
-                        label: '天河区',
-                    },
-                    {
-                        value: 'haizhu',
-                        label: '海珠区',
-                    },
-                ],
-            },
-            {
-                value: 'dongguan',
-                label: '东莞市',
-                children: [
-                    {
-                        value: 'changan',
-                        label: '长安镇',
-                    },
-                    {
-                        value: 'humen',
-                        label: '虎门镇',
-                    },
-                ],
-            },
-        ],
-    },
-    {
-        value: 'hunan',
-        label: '湖南省',
-        children: [
-            {
-                value: 'changsha',
-                label: '长沙市',
-                children: [
-                    {
-                        value: 'yuelu',
-                        label: '岳麓区',
-                    },
-                ],
-            },
-        ],
-    },
-];
-const rules: FormRules = {
-    name: [{ required: true, message: '请输入表单名称', trigger: 'blur' }],
-};
-const formRef = ref<FormInstance>();
-const form = reactive({
-    name: '',
-    region: '',
-    date1: '',
-    date2: '',
-    delivery: true,
-    type: ['小明'],
-    resource: '小红',
-    desc: '',
-    options: [],
-});
-// 提交
-const onSubmit = (formEl: FormInstance | undefined) => {
-    // 表单校验
-    if (!formEl) return;
-    formEl.validate((valid) => {
-        if (valid) {
-            console.log(form);
-            ElMessage.success('提交成功！');
-        } else {
-            return false;
-        }
-    });
-};
-// 重置
-const onReset = (formEl: FormInstance | undefined) => {
-    if (!formEl) return;
-    formEl.resetFields();
-};
-</script>
diff --git a/frontend/src/views/demo/icon.vue b/frontend/src/views/demo/icon.vue
deleted file mode 100644
index 0b01ff3..0000000
--- a/frontend/src/views/demo/icon.vue
+++ /dev/null
@@ -1,212 +0,0 @@
-<template>
-	<div class="container">
-		<h2>使用方法</h2>
-		<p style="line-height: 50px">
-			直接通过设置类名为 el-icon-lx-iconName 来使用即可。例如：（共{{ iconList.length }}个图标）
-		</p>
-		<p class="example-p">
-			<i class="el-icon-lx-redpacket_fill" style="font-size: 30px; color: #ff5900"></i>
-			<span>&lt;i class=&quot;el-icon-lx-redpacket_fill&quot;&gt;&lt;/i&gt;</span>
-		</p>
-		<p class="example-p">
-			<i class="el-icon-lx-weibo" style="font-size: 30px; color: #fd5656"></i>
-			<span>&lt;i class=&quot;el-icon-lx-weibo&quot;&gt;&lt;/i&gt;</span>
-		</p>
-		<p class="example-p">
-			<i class="el-icon-lx-emojifill" style="font-size: 30px; color: #ffc300"></i>
-			<span>&lt;i class=&quot;el-icon-lx-emojifill&quot;&gt;&lt;/i&gt;</span>
-		</p>
-		<br />
-		<h2>图标</h2>
-		<div class="search-box">
-			<el-input class="search" size="large" v-model="keyword" clearable placeholder="请输入图标名称"></el-input>
-		</div>
-		<ul>
-			<li class="icon-li" v-for="(item, index) in list" :key="index">
-				<div class="icon-li-content">
-					<i :class="`el-icon-lx-${item}`"></i>
-					<span>{{ item }}</span>
-				</div>
-			</li>
-		</ul>
-	</div>
-</template>
-
-<script setup lang="ts" name="icon">
-import { computed, ref } from 'vue';
-
-const iconList: Array<string> = [
-	'attentionforbid',
-	'attentionforbidfill',
-	'attention',
-	'attentionfill',
-	'tag',
-	'tagfill',
-	'people',
-	'peoplefill',
-	'notice',
-	'noticefill',
-	'mobile',
-	'mobilefill',
-	'voice',
-	'voicefill',
-	'unlock',
-	'lock',
-	'home',
-	'homefill',
-	'delete',
-	'deletefill',
-	'notification',
-	'notificationfill',
-	'notificationforbidfill',
-	'like',
-	'likefill',
-	'comment',
-	'commentfill',
-	'camera',
-	'camerafill',
-	'warn',
-	'warnfill',
-	'time',
-	'timefill',
-	'location',
-	'locationfill',
-	'favor',
-	'favorfill',
-	'skin',
-	'skinfill',
-	'news',
-	'newsfill',
-	'record',
-	'recordfill',
-	'emoji',
-	'emojifill',
-	'message',
-	'messagefill',
-	'goods',
-	'goodsfill',
-	'crown',
-	'crownfill',
-	'move',
-	'add',
-	'hot',
-	'hotfill',
-	'service',
-	'servicefill',
-	'present',
-	'presentfill',
-	'pic',
-	'picfill',
-	'rank',
-	'rankfill',
-	'male',
-	'female',
-	'down',
-	'top',
-	'recharge',
-	'rechargefill',
-	'forward',
-	'forwardfill',
-	'info',
-	'infofill',
-	'redpacket',
-	'redpacket_fill',
-	'roundadd',
-	'roundaddfill',
-	'friendadd',
-	'friendaddfill',
-	'cart',
-	'cartfill',
-	'more',
-	'moreandroid',
-	'back',
-	'right',
-	'shop',
-	'shopfill',
-	'question',
-	'questionfill',
-	'roundclose',
-	'roundclosefill',
-	'roundcheck',
-	'roundcheckfill',
-	'global',
-	'mail',
-	'punch',
-	'exit',
-	'upload',
-	'read',
-	'file',
-	'link',
-	'full',
-	'group',
-	'friend',
-	'profile',
-	'addressbook',
-	'calendar',
-	'text',
-	'copy',
-	'share',
-	'wifi',
-	'vipcard',
-	'weibo',
-	'remind',
-	'refresh',
-	'filter',
-	'settings',
-	'scan',
-	'qrcode',
-	'cascades',
-	'apps',
-	'sort',
-	'searchlist',
-	'search',
-	'edit'
-];
-const keyword = ref('');
-const list = computed(() => {
-	return iconList.filter(item => {
-		return item.indexOf(keyword.value) !== -1;
-	});
-});
-</script>
-
-<style scoped>
-.example-p {
-	height: 45px;
-	display: flex;
-	align-items: center;
-}
-.search-box {
-	text-align: center;
-	margin-top: 10px;
-}
-.search {
-	width: 300px;
-}
-ul,
-li {
-	list-style: none;
-}
-.icon-li {
-	display: inline-block;
-	padding: 10px;
-	width: 120px;
-	height: 120px;
-}
-.icon-li-content {
-	display: flex;
-	height: 100%;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	cursor: pointer;
-}
-.icon-li-content i {
-	font-size: 36px;
-	color: #606266;
-}
-.icon-li-content span {
-	margin-top: 10px;
-	color: #787878;
-}
-</style>
diff --git a/frontend/src/views/demo/import.vue b/frontend/src/views/demo/import.vue
deleted file mode 100644
index e0ca8c3..0000000
--- a/frontend/src/views/demo/import.vue
+++ /dev/null
@@ -1,118 +0,0 @@
-<template>
-    <div>
-        <div class="container">
-            <div class="handle-box">
-                <el-upload
-                    action="#"
-                    :limit="1"
-                    accept=".xlsx, .xls"
-                    :show-file-list="false"
-                    :before-upload="beforeUpload"
-                    :http-request="handleMany"
-                >
-                    <el-button class="mr10" type="success">批量导入</el-button>
-                </el-upload>
-                <el-link href="/template.xlsx" target="_blank">下载模板</el-link>
-            </div>
-            <el-table :data="tableData" border class="table" header-cell-class-name="table-header">
-                <el-table-column prop="id" label="ID" width="55" align="center"></el-table-column>
-                <el-table-column prop="name" label="姓名"></el-table-column>
-                <el-table-column prop="sno" label="学号"></el-table-column>
-                <el-table-column prop="class" label="班级"></el-table-column>
-                <el-table-column prop="age" label="年龄"></el-table-column>
-                <el-table-column prop="sex" label="性别"></el-table-column>
-            </el-table>
-        </div>
-    </div>
-</template>
-
-<script setup lang="ts" name="import">
-import { UploadProps } from 'element-plus';
-import { ref, reactive } from 'vue';
-import * as XLSX from 'xlsx';
-
-interface TableItem {
-    id: number;
-    name: string;
-    sno: string;
-    class: string;
-    age: string;
-    sex: string;
-}
-
-const tableData = ref<TableItem[]>([]);
-// 获取表格数据
-const getData = () => {
-    tableData.value = [
-        {
-            id: 1,
-            name: '小明',
-            sno: 'S001',
-            class: '一班',
-            age: '10',
-            sex: '男',
-        },
-        {
-            id: 2,
-            name: '小红',
-            sno: 'S002',
-            class: '一班',
-            age: '9',
-            sex: '女',
-        },
-    ];
-};
-getData();
-
-const importList = ref<any>([]);
-const beforeUpload: UploadProps['beforeUpload'] = async (rawFile) => {
-    importList.value = await analysisExcel(rawFile);
-    return true;
-};
-const analysisExcel = (file: any) => {
-    return new Promise(function (resolve, reject) {
-        const reader = new FileReader();
-        reader.onload = function (e: any) {
-            const data = e.target.result;
-            let datajson = XLSX.read(data, {
-                type: 'binary',
-            });
-
-            const sheetName = datajson.SheetNames[0];
-            const result = XLSX.utils.sheet_to_json(datajson.Sheets[sheetName]);
-            resolve(result);
-        };
-        reader.readAsBinaryString(file);
-    });
-};
-
-const handleMany = async () => {
-    // 把数据传给服务器后获取最新列表，这里只是示例，不做请求
-    const list = importList.value.map((item: any, index: number) => {
-        return {
-            id: index,
-            name: item['姓名'],
-            sno: item['学号'],
-            class: item['班级'],
-            age: item['年龄'],
-            sex: item['性别'],
-        };
-    });
-    tableData.value.push(...list);
-};
-</script>
-
-<style scoped>
-.handle-box {
-    display: flex;
-    margin-bottom: 20px;
-}
-
-.table {
-    width: 100%;
-    font-size: 14px;
-}
-.mr10 {
-    margin-right: 10px;
-}
-</style>
diff --git a/frontend/src/views/demo/markdown.vue b/frontend/src/views/demo/markdown.vue
deleted file mode 100644
index d435f9c..0000000
--- a/frontend/src/views/demo/markdown.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-<template>
-	<div class="container">
-		<div class="plugins-tips">
-			md-editor-v3：vue3版本的 markdown 编辑器，配置丰富，请详看文档。 访问地址：
-			<a href="https://imzbf.github.io/md-editor-v3/index" target="_blank">md-editor-v3</a>
-		</div>
-		<md-editor class="mgb20" v-model="text" @on-upload-img="onUploadImg" />
-		<el-button type="primary">提交</el-button>
-	</div>
-</template>
-
-<script setup lang="ts" name="md">
-import { ref } from 'vue';
-import MdEditor from 'md-editor-v3';
-import 'md-editor-v3/lib/style.css';
-
-const text = ref('Hello Editor!');
-const onUploadImg = (files: any) => {
-	console.log(files);
-};
-</script>
diff --git a/frontend/src/views/demo/table.vue b/frontend/src/views/demo/table.vue
deleted file mode 100644
index a51be82..0000000
--- a/frontend/src/views/demo/table.vue
+++ /dev/null
@@ -1,191 +0,0 @@
-<template>
-	<div>
-		<div class="container">
-			<div class="handle-box">
-				<el-select v-model="query.address" placeholder="地址" class="handle-select mr10">
-					<el-option key="1" label="广东省" value="广东省"></el-option>
-					<el-option key="2" label="湖南省" value="湖南省"></el-option>
-				</el-select>
-				<el-input v-model="query.name" placeholder="用户名" class="handle-input mr10"></el-input>
-				<el-button type="primary" :icon="Search" @click="handleSearch">搜索</el-button>
-				<el-button type="primary" :icon="Plus">新增</el-button>
-			</div>
-			<el-table :data="tableData" border class="table" ref="multipleTable" header-cell-class-name="table-header">
-				<el-table-column prop="id" label="ID" width="55" align="center"></el-table-column>
-				<el-table-column prop="name" label="用户名"></el-table-column>
-				<el-table-column label="账户余额">
-					<template #default="scope">￥{{ scope.row.money }}</template>
-				</el-table-column>
-				<el-table-column label="头像(查看大图)" align="center">
-					<template #default="scope">
-						<el-image
-							class="table-td-thumb"
-							:src="scope.row.thumb"
-							:z-index="10"
-							:preview-src-list="[scope.row.thumb]"
-							preview-teleported
-						>
-						</el-image>
-					</template>
-				</el-table-column>
-				<el-table-column prop="address" label="地址"></el-table-column>
-				<el-table-column label="状态" align="center">
-					<template #default="scope">
-						<el-tag
-							:type="scope.row.state === '成功' ? 'success' : scope.row.state === '失败' ? 'danger' : ''"
-						>
-							{{ scope.row.state }}
-						</el-tag>
-					</template>
-				</el-table-column>
-
-				<el-table-column prop="date" label="注册时间"></el-table-column>
-				<el-table-column label="操作" width="220" align="center">
-					<template #default="scope">
-						<el-button text :icon="Edit" @click="handleEdit(scope.$index, scope.row)" v-permiss="'default'">
-							编辑
-						</el-button>
-						<el-button text :icon="Delete" class="red" @click="handleDelete(scope.$index)" v-permiss="'default'">
-							删除
-						</el-button>
-					</template>
-				</el-table-column>
-			</el-table>
-			<div class="pagination">
-				<el-pagination
-					background
-					layout="total, prev, pager, next"
-					:current-page="query.pageIndex"
-					:page-size="query.pageSize"
-					:total="pageTotal"
-					@current-change="handlePageChange"
-				></el-pagination>
-			</div>
-		</div>
-
-		<!-- 编辑弹出框 -->
-		<el-dialog title="编辑" v-model="editVisible" width="30%">
-			<el-form label-width="70px">
-				<el-form-item label="用户名">
-					<el-input v-model="form.name"></el-input>
-				</el-form-item>
-				<el-form-item label="地址">
-					<el-input v-model="form.address"></el-input>
-				</el-form-item>
-			</el-form>
-			<template #footer>
-				<span class="dialog-footer">
-					<el-button @click="editVisible = false">取 消</el-button>
-					<el-button type="primary" @click="saveEdit">确 定</el-button>
-				</span>
-			</template>
-		</el-dialog>
-	</div>
-</template>
-
-<script setup lang="ts" name="basetable">
-import { ref, reactive } from 'vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-import { Delete, Edit, Search, Plus } from '@element-plus/icons-vue';
-import { fetchData } from '../../api/index';
-
-interface TableItem {
-	id: number;
-	name: string;
-	money: string;
-	state: string;
-	date: string;
-	address: string;
-}
-
-const query = reactive({
-	address: '',
-	name: '',
-	pageIndex: 1,
-	pageSize: 10
-});
-const tableData = ref<TableItem[]>([]);
-const pageTotal = ref(0);
-// 获取表格数据
-const getData = () => {
-	fetchData().then(res => {
-		tableData.value = res.data.list;
-		pageTotal.value = res.data.pageTotal || 50;
-	});
-};
-getData();
-
-// 查询操作
-const handleSearch = () => {
-	query.pageIndex = 1;
-	getData();
-};
-// 分页导航
-const handlePageChange = (val: number) => {
-	query.pageIndex = val;
-	getData();
-};
-
-// 删除操作
-const handleDelete = (index: number) => {
-	// 二次确认删除
-	ElMessageBox.confirm('确定要删除吗？', '提示', {
-		type: 'warning'
-	})
-		.then(() => {
-			ElMessage.success('删除成功');
-			tableData.value.splice(index, 1);
-		})
-		.catch(() => {});
-};
-
-// 表格编辑时弹窗和保存
-const editVisible = ref(false);
-let form = reactive({
-	name: '',
-	address: ''
-});
-let idx: number = -1;
-const handleEdit = (index: number, row: any) => {
-	idx = index;
-	form.name = row.name;
-	form.address = row.address;
-	editVisible.value = true;
-};
-const saveEdit = () => {
-	editVisible.value = false;
-	ElMessage.success(`修改第 ${idx + 1} 行成功`);
-	tableData.value[idx].name = form.name;
-	tableData.value[idx].address = form.address;
-};
-</script>
-
-<style scoped>
-.handle-box {
-	margin-bottom: 20px;
-}
-
-.handle-select {
-	width: 120px;
-}
-
-.handle-input {
-	width: 300px;
-}
-.table {
-	width: 100%;
-	font-size: 14px;
-}
-.red {
-	color: #F56C6C;
-}
-.mr10 {
-	margin-right: 10px;
-}
-.table-td-thumb {
-	display: block;
-	margin: auto;
-	width: 40px;
-	height: 40px;
-}
-</style>
diff --git a/frontend/src/views/demo/tabs.vue b/frontend/src/views/demo/tabs.vue
deleted file mode 100644
index 849a131..0000000
--- a/frontend/src/views/demo/tabs.vue
+++ /dev/null
@@ -1,116 +0,0 @@
-<template>
-	<div class="container">
-		<el-tabs v-model="message">
-			<el-tab-pane :label="`未读消息(${state.unread.length})`" name="first">
-				<el-table :data="state.unread" :show-header="false" style="width: 100%">
-					<el-table-column>
-						<template #default="scope">
-							<span class="message-title">{{ scope.row.title }}</span>
-						</template>
-					</el-table-column>
-					<el-table-column prop="date" width="180"></el-table-column>
-					<el-table-column width="120">
-						<template #default="scope">
-							<el-button size="small" @click="handleRead(scope.$index)">标为已读</el-button>
-						</template>
-					</el-table-column>
-				</el-table>
-				<div class="handle-row">
-					<el-button type="primary">全部标为已读</el-button>
-				</div>
-			</el-tab-pane>
-			<el-tab-pane :label="`已读消息(${state.read.length})`" name="second">
-				<template v-if="message === 'second'">
-					<el-table :data="state.read" :show-header="false" style="width: 100%">
-						<el-table-column>
-							<template #default="scope">
-								<span class="message-title">{{ scope.row.title }}</span>
-							</template>
-						</el-table-column>
-						<el-table-column prop="date" width="150"></el-table-column>
-						<el-table-column width="120">
-							<template #default="scope">
-								<el-button type="danger" @click="handleDel(scope.$index)">删除</el-button>
-							</template>
-						</el-table-column>
-					</el-table>
-					<div class="handle-row">
-						<el-button type="danger">删除全部</el-button>
-					</div>
-				</template>
-			</el-tab-pane>
-			<el-tab-pane :label="`回收站(${state.recycle.length})`" name="third">
-				<template v-if="message === 'third'">
-					<el-table :data="state.recycle" :show-header="false" style="width: 100%">
-						<el-table-column>
-							<template #default="scope">
-								<span class="message-title">{{ scope.row.title }}</span>
-							</template>
-						</el-table-column>
-						<el-table-column prop="date" width="150"></el-table-column>
-						<el-table-column width="120">
-							<template #default="scope">
-								<el-button @click="handleRestore(scope.$index)">还原</el-button>
-							</template>
-						</el-table-column>
-					</el-table>
-					<div class="handle-row">
-						<el-button type="danger">清空回收站</el-button>
-					</div>
-				</template>
-			</el-tab-pane>
-		</el-tabs>
-	</div>
-</template>
-
-<script setup lang="ts" name="tabs">
-import { ref, reactive } from 'vue';
-
-const message = ref('first');
-const state = reactive({
-	unread: [
-		{
-			date: '2018-04-19 20:00:00',
-			title: '【系统通知】该系统将于今晚凌晨2点到5点进行升级维护'
-		},
-		{
-			date: '2018-04-19 21:00:00',
-			title: '今晚12点整发大红包，先到先得'
-		}
-	],
-	read: [
-		{
-			date: '2018-04-19 20:00:00',
-			title: '【系统通知】该系统将于今晚凌晨2点到5点进行升级维护'
-		}
-	],
-	recycle: [
-		{
-			date: '2018-04-19 20:00:00',
-			title: '【系统通知】该系统将于今晚凌晨2点到5点进行升级维护'
-		}
-	]
-});
-
-const handleRead = (index: number) => {
-	const item = state.unread.splice(index, 1);
-	state.read = item.concat(state.read);
-};
-const handleDel = (index: number) => {
-	const item = state.read.splice(index, 1);
-	state.recycle = item.concat(state.recycle);
-};
-const handleRestore = (index: number) => {
-	const item = state.recycle.splice(index, 1);
-	state.read = item.concat(state.read);
-};
-</script>
-
-<style>
-.message-title {
-	cursor: pointer;
-}
-.handle-row {
-	margin-top: 30px;
-}
-</style>
diff --git a/frontend/src/views/demo/user.vue b/frontend/src/views/demo/user.vue
deleted file mode 100644
index 1d281a2..0000000
--- a/frontend/src/views/demo/user.vue
+++ /dev/null
@@ -1,174 +0,0 @@
-<template>
-	<div>
-		<el-row :gutter="20">
-			<el-col :span="12">
-				<el-card shadow="hover">
-					<template #header>
-						<div class="clearfix">
-							<span>基础信息</span>
-						</div>
-					</template>
-					<div class="info">
-						<div class="info-image" @click="showDialog">
-							<el-avatar :size="100" :src="avatarImg" />
-							<span class="info-edit">
-								<i class="el-icon-lx-camerafill"></i>
-							</span>
-						</div>
-						<div class="info-name">{{ name }}</div>
-						<div class="info-desc">不可能！我的代码怎么可能会有bug！</div>
-					</div>
-				</el-card>
-			</el-col>
-			<el-col :span="12">
-				<el-card shadow="hover">
-					<template #header>
-						<div class="clearfix">
-							<span>账户编辑</span>
-						</div>
-					</template>
-					<el-form label-width="90px">
-						<el-form-item label="用户名："> {{ name }} </el-form-item>
-						<el-form-item label="旧密码：">
-							<el-input type="password" v-model="form.old"></el-input>
-						</el-form-item>
-						<el-form-item label="新密码：">
-							<el-input type="password" v-model="form.new"></el-input>
-						</el-form-item>
-						<el-form-item label="个人简介：">
-							<el-input v-model="form.desc"></el-input>
-						</el-form-item>
-						<el-form-item>
-							<el-button type="primary" @click="onSubmit">保存</el-button>
-						</el-form-item>
-					</el-form>
-				</el-card>
-			</el-col>
-		</el-row>
-		<el-dialog title="裁剪图片" v-model="dialogVisible" width="600px">
-			<vue-cropper
-				ref="cropper"
-				:src="imgSrc"
-				:ready="cropImage"
-				:zoom="cropImage"
-				:cropmove="cropImage"
-				style="width: 100%; height: 400px"
-			></vue-cropper>
-
-			<template #footer>
-				<span class="dialog-footer">
-					<el-button class="crop-demo-btn" type="primary"
-						>选择图片
-						<input class="crop-input" type="file" name="image" accept="image/*" @change="setImage" />
-					</el-button>
-					<el-button type="primary" @click="saveAvatar">上传并保存</el-button>
-				</span>
-			</template>
-		</el-dialog>
-	</div>
-</template>
-
-<script setup lang="ts" name="user">
-import { reactive, ref } from 'vue';
-import VueCropper from 'vue-cropperjs';
-import 'cropperjs/dist/cropper.css';
-import avatar from '../../assets/img/img.jpg';
-
-const name = localStorage.getItem('ms_username');
-const form = reactive({
-	old: '',
-	new: '',
-	desc: '不可能！我的代码怎么可能会有bug！'
-});
-const onSubmit = () => {};
-
-const avatarImg = ref(avatar);
-const imgSrc = ref('');
-const cropImg = ref('');
-const dialogVisible = ref(false);
-const cropper: any = ref();
-
-const showDialog = () => {
-	dialogVisible.value = true;
-	imgSrc.value = avatarImg.value;
-};
-
-const setImage = (e: any) => {
-	const file = e.target.files[0];
-	if (!file.type.includes('image/')) {
-		return;
-	}
-	const reader = new FileReader();
-	reader.onload = (event: any) => {
-		dialogVisible.value = true;
-		imgSrc.value = event.target.result;
-		cropper.value && cropper.value.replace(event.target.result);
-	};
-	reader.readAsDataURL(file);
-};
-
-const cropImage = () => {
-	cropImg.value = cropper.value.getCroppedCanvas().toDataURL();
-};
-
-const saveAvatar = () => {
-	avatarImg.value = cropImg.value;
-	dialogVisible.value = false;
-};
-</script>
-
-<style scoped>
-.info {
-	text-align: center;
-	padding: 35px 0;
-}
-.info-image {
-	position: relative;
-	margin: auto;
-	width: 100px;
-	height: 100px;
-	background: #f8f8f8;
-	border: 1px solid #eee;
-	border-radius: 50px;
-	overflow: hidden;
-}
-
-.info-edit {
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	position: absolute;
-	left: 0;
-	top: 0;
-	width: 100%;
-	height: 100%;
-	background: rgba(0, 0, 0, 0.5);
-	opacity: 0;
-	transition: opacity 0.3s ease;
-}
-.info-edit i {
-	color: #eee;
-	font-size: 25px;
-}
-.info-image:hover .info-edit {
-	opacity: 1;
-}
-.info-name {
-	margin: 15px 0 10px;
-	font-size: 24px;
-	font-weight: 500;
-	color: #262626;
-}
-.crop-demo-btn {
-	position: relative;
-}
-.crop-input {
-	position: absolute;
-	width: 100px;
-	height: 40px;
-	left: 0;
-	top: 0;
-	opacity: 0;
-	cursor: pointer;
-}
-</style>
diff --git a/frontend/src/views/equipment-setting.vue b/frontend/src/views/equipment-setting.vue
deleted file mode 100644
index 49359c0..0000000
--- a/frontend/src/views/equipment-setting.vue
+++ /dev/null
@@ -1,389 +0,0 @@
-<template>
-	<div>
-		<div class="container">
-			<!-- 筛选 -->
-			<div class="handle-box">
-				<el-select v-model="query.params.deviceType" placeholder="设备类型" class="handle-select mr10"
-					style="width: 160px;">
-					<el-option :key="''" label="全部设备类型" :value="''"></el-option>
-					<el-option v-for="opt in deviceTypeOption" :key="opt.id" :label="opt.typeName"
-						:value="opt.id"></el-option>
-				</el-select>
-				<!-- <el-input v-model="query.params.name" placeholder="设备名" class="handle-input mr10"></el-input>
-				<el-button type="primary" :icon="Search" @click="handleSearch">搜索</el-button> -->
-				<el-button type="primary" :icon="Plus" @click="handleNew">新增设备</el-button>
-				<el-button type="primary" :icon="Plus" @click="exportExcel">导出设备列表</el-button>
-			</div>
-			<!-- 表格 -->
-			<el-table :data="tableData" border class="table" ref="multipleTable" header-cell-class-name="table-header">
-				<el-table-column prop="id" label="ID" width="55" align="center"></el-table-column>
-				<el-table-column prop="name" label="设备名称" align="center"></el-table-column>
-				<el-table-column prop="type" label="设备类型" align="center"></el-table-column>
-				<el-table-column prop="deviceName" label="设备ID" align="center"></el-table-column>
-				<el-table-column prop="location" label="设备位置" align="center"></el-table-column>
-				<el-table-column prop="contractor" label="承建商" align="center"></el-table-column>
-				<el-table-column prop="manufacturer" label="生产商" align="center"></el-table-column>
-				<el-table-column label="状态" align="center">
-					<template #default="scope">
-						<el-tag :type="scope.row.state === '在线' ? 'success' : (scope.row.state === '离线' ? 'danger' : '')">
-							{{ scope.row.state }}
-						</el-tag>
-					</template>
-				</el-table-column>
-				<el-table-column label="操作" width="220" align="center">
-					<template #default="scope">
-						<el-button text :icon="Edit" @click="handleEdit(scope.$index, scope.row)"
-							v-permiss="'equipment-setting-manage'">
-							编辑
-						</el-button>
-						<el-button text :icon="Delete" class="red" @click="handleDelete(scope.$index, scope.row)"
-							v-permiss="'equipment-setting-manage'">
-							删除
-						</el-button>
-					</template>
-				</el-table-column>
-			</el-table>
-			<!-- 分页 -->
-			<div class="pagination">
-				<el-pagination background layout="total, prev, pager, next" :current-page="query.pageIndex"
-					:page-size="query.pageSize" :total="pageTotal" @current-change="handlePageChange"></el-pagination>
-			</div>
-		</div>
-
-		<!-- 编辑弹出框 -->
-		<el-dialog :title="formId > 0 ? '编辑' : '新增'" v-model="editVisible" style="width: 30%; min-width: 280px;">
-			<el-form ref="editForm" label-width="80px" :rules="rules" :model="form">
-				<el-form-item label="设备名称" prop="name">
-					<el-input class="popup-item" v-model="form.name"></el-input>
-				</el-form-item>
-				<el-form-item label="设备类型" prop="typeId">
-					<el-select class="popup-item" v-model="form.typeId" placeholder="设备类型">
-						<el-option :key="''" label="请选择设备类型" :value="''"></el-option>
-						<el-option v-for="opt in deviceTypeOption" :key="opt.id" :label="opt.typeName"
-							:value="opt.id"></el-option>
-					</el-select>
-				</el-form-item>
-				<el-form-item label="设备ID" prop="deviceName">
-					<el-input class="popup-item" v-model="form.deviceName"></el-input>
-				</el-form-item>
-				<el-form-item label="设备位置">
-					<el-input class="popup-item" v-model="form.location"></el-input>
-				</el-form-item>
-				<el-form-item label="承建商">
-					<el-input class="popup-item" v-model="form.contractor"></el-input>
-				</el-form-item>
-				<el-form-item label="生产商">
-					<el-input class="popup-item" v-model="form.manufacturer"></el-input>
-				</el-form-item>
-			</el-form>
-			<template #footer>
-				<span class="dialog-footer">
-					<el-button @click="editVisible = false">取 消</el-button>
-					<el-button type="primary" @click="saveEdit(editForm)">确 定</el-button>
-				</span>
-			</template>
-		</el-dialog>
-	</div>
-</template>
-
-<script setup lang="ts">
-import { ref, reactive, watch } from 'vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-import type { FormInstance, FormRules } from 'element-plus';
-import { ElLoading } from 'element-plus';
-import { Delete, Edit, Search, Plus } from '@element-plus/icons-vue';
-import send_request from '../utils/send_request';
-import * as XLSX from 'xlsx';
-
-// 筛选条件
-const query = reactive({
-	params: {
-		deviceType: '',
-		name: '',
-	},
-	pageIndex: 1,
-	pageSize: 10
-});
-
-// 下拉框数据
-const deviceTypeOption = ref<[{ id: any, typeName: any }]>()
-
-// 表格数据
-const tableData: any = ref([]);
-const pageTotal = ref(0);
-const deviceTypeDict: any = ref({});
-// 获取表格&下拉框数据
-const getData = async () => {
-	const loading = ElLoading.service({
-		lock: true,
-		text: '请稍候',
-		background: 'rgba(0, 0, 0, 0.7)',
-	});
-	await send_request('v1/device/list', "GET", {
-		...query.params,
-		pageIndex: query.pageIndex,
-		pageSize: query.pageSize,
-		page: query.pageIndex,
-	}, (data: any) => {
-
-		let deviceList = data.list;
-		let deviceTypeList = data.optionDeviceType;
-
-		//生成"设备类型"数据字典
-		console.log("deviceList/deviceTypeList:", deviceList, deviceTypeList)
-		deviceTypeList.forEach((item: any) => deviceTypeDict.value[item.id] = item.typeName)
-
-		// 渲染表格
-		tableData.value = deviceList.list.map((i: any) => {
-			i.state = "在线"
-			i.type = deviceTypeDict.value[i.typeId]
-			return i
-		});
-		// console.log("tableData", tableData);
-		pageTotal.value = deviceList.total;
-		// 渲染下拉框
-		deviceTypeOption.value = deviceTypeList;
-	});
-	loading.close();
-};
-getData();
-
-// 查询操作
-const handleSearch = () => {
-	query.pageIndex = 1;
-	getData();
-};
-
-// 筛选条件变化自动搜索
-watch(() => query.params, function (newVal, oldVal, ...args) {
-	console.log("watch query.params newVal", JSON.stringify(newVal))
-	console.log("watch query.params oldVal", JSON.stringify(oldVal))
-	console.log("watch query.params args", args)
-	handleSearch();
-}, { deep: true });
-
-// 分页导航
-const handlePageChange = (val: number) => {
-	query.pageIndex = val;
-	getData();
-};
-
-// 删除操作
-const handleDelete = (index: number, row: any) => {
-	// 二次确认删除
-	ElMessageBox.confirm('确定要删除吗？', '提示', {
-		type: 'warning'
-	})
-		.then(() => send_request('v1/device/delete', "POST", {
-			deviceId: row.id
-		}, (data: any) => {
-			// console.log(data);
-			ElMessage.success('删除成功');
-			tableData.value.splice(index, 1);
-		}))
-		.catch(() => {
-			ElMessage.success('删除失败');
-		});
-};
-
-// 添加/修改记录时表单验证
-const editForm = ref<FormInstance>();
-const rules: FormRules = {
-	name: [
-		{
-			required: true,
-			message: '请输入设备名称',
-			trigger: 'blur'
-		},
-		{
-			min: 2,
-			message: '设备名称过短',
-			trigger: 'blur'
-		},
-		{
-			max: 52,
-			message: '设备名称过长',
-			trigger: 'blur'
-		}
-	],
-	typeId: [
-		{
-			required: true,
-			message: '请选择设备类型',
-			trigger: 'blur'
-		}
-	],
-	deviceName: [
-		{
-			required: true,
-			message: '请输入设备ID',
-			trigger: 'blur'
-		},
-		{
-			min: 2,
-			message: '设备ID过短',
-			trigger: 'blur'
-		},
-		{
-			max: 52,
-			message: '设备ID过长',
-			trigger: 'blur'
-		}
-	],
-};
-// 表格编辑时弹窗和保存
-const editVisible = ref(false);
-let form = reactive({
-	name: '',
-	typeId: '',
-	deviceName: '',
-	location: '',
-	contractor: '',
-	manufacturer: '',
-});
-let idx: number = -1;
-let formId: number = -1;
-const handleEdit = (index: number, row: any) => {
-	idx = index;
-	formId = row.id;
-	form.name = row.name;
-	form.typeId = row.typeId;
-	form.deviceName = row.deviceName;
-	form.location = row.location;
-	form.contractor = row.contractor;
-	form.manufacturer = row.manufacturer;
-	editVisible.value = true;
-};
-// 新增弹窗
-const handleNew = () => {
-	formId = -1;
-	for (let formKeys of Object.keys(form)) {
-		form[formKeys] = ''
-	}
-	editVisible.value = true;
-};
-
-const saveEdit = async (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	// console.log("formEl", formEl);
-	formEl.validate(async (valid: boolean, invalidFields: any) => {
-		if (!valid) {
-			// console.log("invalidFields", invalidFields);
-			// 对表单中的每一个不合法输入框进行遍历
-			Object.values(invalidFields).forEach((input: any) => {
-				// 对该不合法输入框的提示信息进行遍历
-				input.forEach((element: any) => {
-					ElMessage.error({ message: element.message, grouping: true });
-				});
-			});
-			return;
-		}
-
-		if (formId > 0) {
-			// 更新表格中数据
-			tableData.value[idx].name = form.name;
-			tableData.value[idx].typeId = form.typeId;
-			tableData.value[idx].deviceName = form.deviceName;
-			tableData.value[idx].location = form.location;
-			tableData.value[idx].contractor = form.contractor;
-			tableData.value[idx].manufacturer = form.manufacturer;
-			// 修改记录
-			await send_request('v1/device/edit', "POST", {
-				id: formId,
-				contractor: form.contractor,
-				deviceName: form.deviceName,
-				name: form.name,
-				location: form.location,
-				manufacturer: form.manufacturer,
-				typeId: form.typeId
-			}, (data: any) => {
-				// console.log(data)
-				// 关闭弹窗
-				editVisible.value = false;
-				ElMessage.success(`修改成功`);
-			});
-		} else {
-			// 新增记录
-			await send_request('v1/device/add', "POST", {
-				contractor: form.contractor,
-				deviceName: form.deviceName,
-				name: form.name,
-				location: form.location,
-				manufacturer: form.manufacturer,
-				typeId: form.typeId
-			}, (data: any) => {
-				// console.log(data)
-				// 关闭弹窗
-				editVisible.value = false;
-				ElMessage.success(`添加成功`);
-				query.pageIndex = Math.ceil((pageTotal.value + 1) / query.pageSize);
-				getData();
-			});
-		}
-	});
-};
-
-// 导出设备到Excel列表
-const exportExcel = async () => {
-	const loading = ElLoading.service({
-		lock: true,
-		text: '请稍候',
-		background: 'rgba(0, 0, 0, 0.7)',
-	});
-
-	let list = [['序号', '设备名称', '设备类型', '设备ID', '设备位置', '承建商', '生产商']];
-	await send_request('v1/device/listAll', "GET", {
-	}, (data: any) => {
-		data.list.map((item: any, i: number) => {
-			const arr: any[] = [i + 1];
-			// console.log("-----------------", arr);
-			arr.push(...[item.name, deviceTypeDict.value[item.typeId], item.deviceName, item.location, item.manufacturer, item.contractor]);
-			list.push(arr);
-		});
-		let WorkSheet = XLSX.utils.aoa_to_sheet(list);
-		let new_workbook = XLSX.utils.book_new();
-		XLSX.utils.book_append_sheet(new_workbook, WorkSheet, '第一页');
-		XLSX.writeFile(new_workbook, `表格.xlsx`);
-	});
-	loading.close();
-}
-
-</script>
-
-<style scoped>
-.handle-box {
-	margin-bottom: 20px;
-}
-
-.handle-select {
-	width: 120px;
-}
-
-.handle-input {
-	width: 300px;
-}
-
-.table {
-	width: 100%;
-	font-size: 14px;
-}
-
-.red {
-	color: #F56C6C;
-}
-
-.mr10 {
-	margin-right: 10px;
-}
-
-.table-td-thumb {
-	display: block;
-	margin: auto;
-	width: 40px;
-	height: 40px;
-}
-
-.popup-item {
-	width: 100%;
-}
-</style>
diff --git a/frontend/src/views/monitor-data-view.vue b/frontend/src/views/monitor-data-view.vue
deleted file mode 100644
index 75ef051..0000000
--- a/frontend/src/views/monitor-data-view.vue
+++ /dev/null
@@ -1,182 +0,0 @@
-<template>
-	<div>
-		<div class="container">
-			<div class="handle-box">
-				<el-select v-model="query.address" placeholder="地址" class="handle-select mr10">
-					<el-option key="1" label="广东省" value="广东省"></el-option>
-					<el-option key="2" label="湖南省" value="湖南省"></el-option>
-				</el-select>
-				<el-input v-model="query.name" placeholder="用户名" class="handle-input mr10"></el-input>
-				<el-button type="primary" :icon="Search" @click="handleSearch">搜索</el-button>
-				<el-button type="primary" :icon="Plus">新增</el-button>
-			</div>
-			<el-table :data="tableData" border class="table" ref="multipleTable" header-cell-class-name="table-header">
-				<el-table-column prop="id" label="ID" width="55" align="center"></el-table-column>
-				<el-table-column prop="name" label="用户名"></el-table-column>
-				<el-table-column label="账户余额">
-					<template #default="scope">￥{{ scope.row.money }}</template>
-				</el-table-column>
-				<el-table-column label="头像(查看大图)" align="center">
-					<template #default="scope">
-						<el-image class="table-td-thumb" :src="scope.row.thumb" :z-index="10"
-							:preview-src-list="[scope.row.thumb]" preview-teleported>
-						</el-image>
-					</template>
-				</el-table-column>
-				<el-table-column prop="address" label="地址"></el-table-column>
-				<el-table-column label="状态" align="center">
-					<template #default="scope">
-						<el-tag :type="scope.row.state === '成功' ? 'success' : scope.row.state === '失败' ? 'danger' : ''">
-							{{ scope.row.state }}
-						</el-tag>
-					</template>
-				</el-table-column>
-
-				<el-table-column prop="date" label="注册时间"></el-table-column>
-				<el-table-column label="操作" width="220" align="center">
-					<template #default="scope">
-						<el-button text :icon="Edit" @click="handleEdit(scope.$index, scope.row)" v-permiss="15">
-							编辑
-						</el-button>
-						<el-button text :icon="Delete" class="red" @click="handleDelete(scope.$index)" v-permiss="16">
-							删除
-						</el-button>
-					</template>
-				</el-table-column>
-			</el-table>
-			<div class="pagination">
-				<el-pagination background layout="total, prev, pager, next" :current-page="query.pageIndex"
-					:page-size="query.pageSize" :total="pageTotal" @current-change="handlePageChange"></el-pagination>
-			</div>
-		</div>
-
-		<!-- 编辑弹出框 -->
-		<el-dialog title="编辑" v-model="editVisible" width="30%">
-			<el-form label-width="70px">
-				<el-form-item label="用户名">
-					<el-input v-model="form.name"></el-input>
-				</el-form-item>
-				<el-form-item label="地址">
-					<el-input v-model="form.address"></el-input>
-				</el-form-item>
-			</el-form>
-			<template #footer>
-				<span class="dialog-footer">
-					<el-button @click="editVisible = false">取 消</el-button>
-					<el-button type="primary" @click="saveEdit">确 定</el-button>
-				</span>
-			</template>
-		</el-dialog>
-	</div>
-</template>
-
-<script setup lang="ts">
-import { ref, reactive } from 'vue';
-import { ElMessage, ElMessageBox } from 'element-plus';
-import { Delete, Edit, Search, Plus } from '@element-plus/icons-vue';
-import { fetchData } from '../api/index';
-
-interface TableItem {
-	id: number;
-	name: string;
-	money: string;
-	state: string;
-	date: string;
-	address: string;
-}
-
-const query = reactive({
-	address: '',
-	name: '',
-	pageIndex: 1,
-	pageSize: 10
-});
-const tableData = ref<TableItem[]>([]);
-const pageTotal = ref(0);
-// 获取表格数据
-const getData = () => {
-	fetchData().then(res => {
-		tableData.value = res.data.list;
-		pageTotal.value = res.data.pageTotal || 50;
-	});
-};
-getData();
-
-// 查询操作
-const handleSearch = () => {
-	query.pageIndex = 1;
-	getData();
-};
-// 分页导航
-const handlePageChange = (val: number) => {
-	query.pageIndex = val;
-	getData();
-};
-
-// 删除操作
-const handleDelete = (index: number) => {
-	// 二次确认删除
-	ElMessageBox.confirm('确定要删除吗？', '提示', {
-		type: 'warning'
-	})
-		.then(() => {
-			ElMessage.success('删除成功');
-			tableData.value.splice(index, 1);
-		})
-		.catch(() => { });
-};
-
-// 表格编辑时弹窗和保存
-const editVisible = ref(false);
-let form = reactive({
-	name: '',
-	address: ''
-});
-let idx: number = -1;
-const handleEdit = (index: number, row: any) => {
-	idx = index;
-	form.name = row.name;
-	form.address = row.address;
-	editVisible.value = true;
-};
-const saveEdit = () => {
-	editVisible.value = false;
-	ElMessage.success(`修改第 ${idx + 1} 行成功`);
-	tableData.value[idx].name = form.name;
-	tableData.value[idx].address = form.address;
-};
-</script>
-
-<style scoped>
-.handle-box {
-	margin-bottom: 20px;
-}
-
-.handle-select {
-	width: 120px;
-}
-
-.handle-input {
-	width: 300px;
-}
-
-.table {
-	width: 100%;
-	font-size: 14px;
-}
-
-.red {
-	color: #F56C6C;
-}
-
-.mr10 {
-	margin-right: 10px;
-}
-
-.table-td-thumb {
-	display: block;
-	margin: auto;
-	width: 40px;
-	height: 40px;
-}
-</style>
diff --git a/frontend/src/views/privilege-role-setting.vue b/frontend/src/views/privilege-role-setting.vue
deleted file mode 100644
index 3ba9c46..0000000
--- a/frontend/src/views/privilege-role-setting.vue
+++ /dev/null
@@ -1,286 +0,0 @@
-<template>
-	<div class="container">
-		<div class="plugins-tips">角色及其对应的权限</div>
-		<!-- <div>
-			<span class="label">角色：</span>
-			<el-button type="primary" :icon="Search" @click="handleNew">增加</el-button>
-			<el-button type="primary" :icon="Search" @click="handleNew">修改</el-button>
-			<el-button type="primary" :icon="Search" @click="handleNew">删除</el-button>
-		</div> -->
-
-		<div style="display: grid; grid-template-columns: 1fr 3fr;">
-			<div style="margin-top: 40px;">
-
-				<div class="mgb20">
-					<span class="label">角色：</span>
-				</div>
-
-				<div>
-					<el-radio-group v-model="selectRoleId" style="display: block;">
-						<el-radio :label="role.id" size="large" v-for="role in roleList" style="display: block;"
-							@click="() => { }">
-							{{ role.roleName }}
-						</el-radio>
-					</el-radio-group>
-				</div>
-			</div>
-			<div>
-				<div class="mgb20">
-					<span class="label">角色对应权限：</span>
-					<!-- <el-select v-model="role" @change="() => { }/*handleChange*/">
-						<el-option label="超级管理员" value="admin"></el-option>
-						<el-option label="普通用户" value="user"></el-option>
-					</el-select> -->
-				</div>
-
-				<div class="mgb20 tree-wrapper">
-					<el-tree ref="tree" :data="data" node-key="id" default-expand-all show-checkbox
-						:default-checked-keys="checkedKeys" />
-				</div>
-				<!-- <el-button type="primary" @click="onSubmit">保存权限</el-button> -->
-			</div>
-		</div>
-
-		<!-- 编辑弹出框 -->
-		<el-dialog :title="formId > 0 ? '编辑' : '新增'" v-model="editVisible" style="width: 30%; min-width: 280px;">
-			<el-form ref="editForm" label-width="80px" :rules="rules" :model="form">
-				<el-form-item label="角色名称" prop="roleName">
-					<el-input class="popup-item" v-model="form.roleName"></el-input>
-				</el-form-item>
-				<el-form-item label="备注">
-					<el-input class="popup-item" v-model="form.comment"></el-input>
-				</el-form-item>
-			</el-form>
-			<template #footer>
-				<span class="dialog-footer">
-					<el-button @click="editVisible = false">取 消</el-button>
-					<el-button type="primary" @click="addRole(editForm)">确 定</el-button>
-				</span>
-			</template>
-		</el-dialog>
-	</div>
-</template>
-
-<script setup lang="ts">
-import { ref, reactive, watch } from 'vue';
-import { ElTree } from 'element-plus';
-import { ElMessage, ElMessageBox } from 'element-plus';
-import type { FormInstance, FormRules } from 'element-plus';
-import { ElLoading } from 'element-plus';
-import { Delete, Edit, Search, Plus } from '@element-plus/icons-vue';
-import send_request from '../utils/send_request';
-
-const editForm = ref<FormInstance>();
-console.log("editForm:", editForm)
-
-const rules: FormRules = {
-	deviceName: [
-		{
-			required: true,
-			message: '请输入设备名称',
-			trigger: 'blur'
-		},
-		{
-			min: 2,
-			message: '设备名称过短',
-			trigger: 'blur'
-		},
-		{
-			max: 52,
-			message: '设备名称过长',
-			trigger: 'blur'
-		}
-	],
-	type: [
-		{
-			required: true,
-			message: '请选择设备类型',
-			trigger: 'blur'
-		}
-	],
-	deviceId: [
-		{
-			required: true,
-			message: '请输入设备ID',
-			trigger: 'blur'
-		},
-		{
-			min: 2,
-			message: '设备ID过短',
-			trigger: 'blur'
-		},
-		{
-			max: 52,
-			message: '设备ID过长',
-			trigger: 'blur'
-		}
-	],
-};
-
-let formId: number = -1;
-const editVisible = ref(false);
-let form = reactive({
-	roleName: '',
-	comment: '',
-});
-
-
-const role = ref<string>('admin');
-
-interface Tree {
-	id: string;
-	label: string;
-	children?: Tree[];
-}
-
-const data: Tree[] = [
-	{
-		id: 'dashboard',
-		label: '系统首页',
-	},
-	{
-		id: '3dmodel',
-		label: '智慧矿山'
-	},
-	{
-		id: 'equipment',
-		label: '设备信息',
-		children: [
-			{
-				id: 'equipment-setting-manage',
-				label: '设备管理'
-			},
-		]
-	},
-	{
-		id: 'monitor-data',
-		label: '监测数据',
-		children: [
-			{
-				id: 'monitor-data-view',
-				label: '查看数据'
-			},
-		]
-	},
-	{
-		id: 'warning',
-		label: '预警信息',
-		children: [
-			{
-				id: 'warning-view',
-				label: '总览(预警信息)'
-			},
-			{
-				id: 'warning-setting',
-				label: '预警设置'
-			},
-		]
-	},
-];
-
-// 获取当前权限
-const checkedKeys = ref<string[]>([]);
-// const getPremission = () => {
-// 	// 请求接口返回权限
-// 	checkedKeys.value = permiss.defaultList[role.value];
-// };
-// getPremission();
-
-// 保存权限
-const tree = ref<InstanceType<typeof ElTree>>();
-const onSubmit = () => {
-	// 获取选中的权限
-	console.log(tree.value!.getCheckedKeys(false));
-};
-
-const roleList = ref<any[]>();
-const selectRoleId = ref(-1);
-
-// 获取表格&下拉框数据
-const getData = async () => {
-	// const loading = ElLoading.service({
-	// 	lock: true,
-	// 	text: '请稍候',
-	// 	background: 'rgba(0, 0, 0, 0.7)',
-	// });
-	await send_request('v1/role/list', "GET", {
-		// ...query.params,
-		// pageIndex: query.pageIndex,
-		// pageSize: query.pageSize,
-		// page: query.pageIndex,
-	}, (data: any) => {
-		// let deviceTypeOpt = data.optionDeviceType;
-		console.log("role/list", data)
-		roleList.value = data;
-		selectRoleId.value = data && data.length > 0 ? data[0].id : -1;
-
-
-		// 渲染表格
-		// tableData.value = deviceList.list.map((i: any) => {
-		// 	i.state = "在线"
-		// 	return i
-		// });
-		// pageTotal.value = deviceList.total;
-		// // 渲染下拉框
-		// deviceTypeOption.value = deviceTypeOpt;
-	});
-	// loading.close();
-};
-getData();
-
-// const handleChange = (val: string[]) => {
-// 	tree.value!.setCheckedKeys(permiss.defaultList[role.value]);
-// };
-
-// 新增弹窗
-const handleNew = () => {
-	formId = -1;
-	for (let formKeys of Object.keys(form)) {
-		form[formKeys] = ''
-	}
-	editVisible.value = true;
-};
-
-// 添加角色
-const addRole = async (formEl: FormInstance | undefined) => {
-	if (!formEl) return;
-	console.log("addRole：formEl", formEl);
-
-	// formEl.validate(async (valid: boolean, invalidFields: any) => {
-	// 	if (!valid) {
-	// 		console.log("invalidFields", invalidFields);
-
-	// 		// 对表单中的每一个不合法输入框进行遍历
-	// 		Object.values(invalidFields).forEach((input: any) => {
-
-	// 			// 对该不合法输入框的提示信息进行遍历
-	// 			input.forEach((element: any) => {
-	// 				ElMessage.error({
-	// 					message: element.message, grouping: true
-	// 				});
-	// 			});
-	// 		});
-	// 		return;
-	// 	}
-	// 新增记录
-	await send_request('v1/role/add', "POST", {
-		roleName: form.roleName,
-		comment: form.comment,
-	}, (data: any) => {
-		console.log(data);
-		// editVisible.value = false;
-		// ElMessage.success("添加成功");
-	});
-	// }
-}
-</script>
-
-<style scoped>
-.tree-wrapper {
-	max-width: 500px;
-}
-
-.label {
-	font-size: 14px;
-}
-</style>
diff --git a/frontend/src/views/privilege-user-setting.vue b/frontend/src/views/privilege-user-setting.vue
index c5dac64..0861e4d 100644
--- a/frontend/src/views/privilege-user-setting.vue
+++ b/frontend/src/views/privilege-user-setting.vue
@@ -1,12 +1,11 @@
 <template>
     <div class="container">
         <manageList :list-func="userApi.getUserList" :add-func="userApi.editUser" :edit-func="userApi.editUser"
-            :delete-func="userApi.deleteUser" edit-permiss="privilege-user-setting" />
+            :delete-func="userApi.deleteUser" :export-func="userApi.exportUserList" edit-permiss="privilege-user-setting" />
     </div>
 </template>
 
 <script setup lang="ts">
-import { ref, reactive } from 'vue';
 import manageList from '../components/manage-list.vue';
 import * as userApi from '../api/user';
 </script>
diff --git a/frontend/src/views/shop-good-setting.vue b/frontend/src/views/shop-good-setting.vue
new file mode 100644
index 0000000..0861e4d
--- /dev/null
+++ b/frontend/src/views/shop-good-setting.vue
@@ -0,0 +1,11 @@
+<template>
+    <div class="container">
+        <manageList :list-func="userApi.getUserList" :add-func="userApi.editUser" :edit-func="userApi.editUser"
+            :delete-func="userApi.deleteUser" :export-func="userApi.exportUserList" edit-permiss="privilege-user-setting" />
+    </div>
+</template>
+
+<script setup lang="ts">
+import manageList from '../components/manage-list.vue';
+import * as userApi from '../api/user';
+</script>
diff --git a/frontend/src/views/warning-setting.vue b/frontend/src/views/warning-setting.vue
deleted file mode 100644
index 7d518fd..0000000
--- a/frontend/src/views/warning-setting.vue
+++ /dev/null
@@ -1,302 +0,0 @@
-<template>
-    <div class="container">
-
-        <!-- 调试用 -->
-        <div v-if="false" style="background-color: lightgrey;">
-            <p>treeSelectItem: {{ treeSelectItem }}</p>
-            <p>monitorCodeList: {{ monitorCodeList }}</p>
-            <p>selectIndex: {{ selectIndex }}</p>
-            <p>form: {{ form }}</p>
-        </div>
-
-        <div style="display: grid; grid-template-columns: 250px 2fr;">
-            <!-- 左侧 -->
-            <div>
-                <!-- 树状结构 -->
-                <el-input v-model="treeFilterText" placeholder="输入关键字以搜索..." style="margin-bottom: 10px;" />
-                <el-tree ref="treeRef" :data="treeData" :props="defaultProps" :filter-node-method="treeFilterNode"
-                    @node-click="handleNodeClick" default-expand-all highlight-current :expand-on-click-node="false" />
-            </div>
-
-            <!-- 右侧 -->
-            <div v-if="treeSelectItem">
-
-                <div style="text-align: center;">
-                    <el-radio-group v-model="selectIndex" size="large" style="margin: 10px 0;">
-                        <el-radio-button v-for="monitorCode in monitorCodeList" :label="monitorCode" />
-                    </el-radio-group>
-                </div>
-
-                <el-divider border-style="dotted">
-                    <p>
-                        <!-- <el-icon style="vertical-align: text-top;"><star-filled /></el-icon> -->
-                        您正在配置{{ treeSelectItem.displayMsg }}
-                    </p>
-                </el-divider>
-
-                <!-- form表单 -->
-                <el-form :model="form" label-width="120px">
-
-                    <template v-for="i in form">
-                        <el-form-item :label="i._title">
-                            <el-switch v-model="i.Enable" />
-                        </el-form-item>
-
-                        <!-- v-if="i.Enable" -->
-                        <el-form-item label="预警范围">
-                            <el-col :span="10">
-                                <el-input-number v-model="i.Lower" :disabled="!i.Enable" style="width: 100%" />
-                            </el-col>
-                            <el-col :span="2" style="text-align: center;">
-                                <span class="text-gray-500">-</span>
-                            </el-col>
-                            <el-col :span="10">
-                                <el-input-number v-model="i.Upper" :disabled="!i.Enable" style="width: 100%" />
-                            </el-col>
-                            <el-col :span="2" style="text-align: center;">
-                                <el-button v-if="i.Lower || i.Upper" type="danger" :icon="Delete" circle
-                                    :disabled="!i.Enable" @click="i.Enable = false; i.Lower = null; i.Upper = null;" />
-                            </el-col>
-                        </el-form-item>
-                    </template>
-
-                    <el-form-item>
-                        <el-button type="primary" @click="onSubmit">保存</el-button>
-                    </el-form-item>
-                </el-form>
-            </div>
-            <div v-else style="padding-top: 11vh;">
-                <el-empty description="请在左侧选择设备" />
-            </div>
-        </div>
-    </div>
-</template>
-
-
-
-<script lang="ts" setup>
-import { ref, watch, computed, reactive } from 'vue'
-import { ElTree, ElLoading, ElMessage } from 'element-plus'
-import send_request from '../utils/send_request';
-import { Delete } from '@element-plus/icons-vue'
-
-// 树状结构
-interface Tree {
-    id: number
-    label: string
-    children?: Tree[]
-    detail?: any
-}
-
-// 树 上方搜索框中的字
-const treeFilterText = ref('')
-// 树 数据
-const treeData: any = ref([]);
-// 树 选择的结点
-const treeSelectItem: any = ref(null);
-// 树
-const treeRef = ref<InstanceType<typeof ElTree>>()
-
-// 单选 所有选项
-const allMonitorCodeMap: any = ref({});
-// 单选 当前显示的选项
-const monitorCodeList: any = computed(() => {
-    if (treeSelectItem.value) {
-        console.log("monitorCodeList computed", allMonitorCodeMap.value, treeSelectItem.value.typeId)
-        let newRadioGroupList = allMonitorCodeMap.value[`${treeSelectItem.value.typeId}`]
-        if (newRadioGroupList.length > 0 && newRadioGroupList.indexOf(selectIndex.value) == -1) {
-            // 如果 newRadioGroupList 中不为空，且当前选择项的 monitorCode 不在 newRadioGroupList 中才更新
-            selectIndex.value = newRadioGroupList[0]
-        }
-        return newRadioGroupList
-    } else {
-        return [];
-    }
-});
-// 单选 选择项
-const selectIndex: any = ref('');
-
-// 树 搜索框文字改变事件
-watch(treeFilterText, (val) => {
-    treeRef.value!.filter(val)
-})
-
-// 树 输入搜索文字过滤节点事件
-const treeFilterNode = (value: string, data: Tree) => {
-    if (!value) return true
-    return data.label.includes(value) // || data.id === -1
-}
-
-const handleNodeClick = (data: Tree) => {
-    console.log("handleNodeClick", data)
-    treeSelectItem.value = data.detail ? data.detail : null;
-}
-
-const getTreeData = async () => {
-    const loading = ElLoading.service({
-        lock: true,
-        text: '请稍候',
-        background: 'rgba(0, 0, 0, 0.7)',
-    });
-    await send_request('v1/device/listAll', "GET", {
-    }, (data: any) => {
-        console.log("device/listAll", data)
-        let deviceTypeList = data.deviceType;
-        let deviceList = data.list;
-
-        let transData = []
-        for (let deviceType of deviceTypeList) {
-            transData.push({
-                id: deviceType.id,
-                label: deviceType.typeName,
-                children: [
-                    {
-                        id: `${deviceType.id}_0`,
-                        label: "(默认)",
-                        detail: {
-                            deviceId: -1,
-                            typeId: deviceType.id,
-                            deviceName: `(默认)`,
-                            displayMsg: ` ${deviceType.typeName}设备 默认设置`,
-                        },
-                    },
-                    ...deviceList.filter((device: any) => device.typeId === deviceType.id)
-                        .map((device: any) => {
-                            return {
-                                id: `${deviceType.id}_${device.id}`,
-                                label: device.name,
-                                detail: {
-                                    deviceId: device.id,
-                                    typeId: device.typeId,
-                                    deviceName: device.name,
-                                    displayMsg: ` ${deviceType.typeName}设备：${device.name}`,
-                                },
-                            }
-                        })
-                ],
-            })
-        }
-        treeData.value = transData;
-    });
-    await send_request('v1/alert-model/getDeviceTypeToMonitorCodeMap', "GET", {
-    }, (data: any) => {
-        console.log("alert-model/getDeviceTypeToMonitorCodeMap", data)
-        allMonitorCodeMap.value = data;
-    });
-    loading.close();
-};
-getTreeData();
-
-// Tree渲染所使用属性
-const defaultProps = {
-    children: 'children',
-    label: 'label',
-}
-
-watch([treeSelectItem, selectIndex], ([foo, bar], [prevFoo, prevBar]) => {
-    if (!treeSelectItem.value) {
-        return;
-    }
-    console.log("所选模型发生改变，需要重新获取AlertModel")
-    getAlertModel()
-})
-
-const getAlertModel = async () => {
-    const loading = ElLoading.service({
-        lock: true,
-        text: '请稍候',
-        background: 'rgba(0, 0, 0, 0.7)',
-    });
-
-    // isDefault -> true 默认模型; -> false 指定设备的模型
-    const isDefault = treeSelectItem.value.deviceId < 0;
-    const postParams = {
-        modelType: isDefault ? "default" : "specific",
-        deviceId: isDefault ? undefined : treeSelectItem.value.deviceId,
-        deviceTypeId: isDefault ? treeSelectItem.value.typeId : undefined,
-        monitorCode: selectIndex.value,
-    };
-    console.log("getAlertModel -> postParams", postParams);
-    await send_request('v1/alert-model/getAlertModel', "POST", postParams, (data: any) => {
-        console.log("alert-model/getAlertModel", data)
-        form.y.Enable = !!data.yellowIsAlert;
-        form.y.Lower = data.yellowLowerBound;
-        form.y.Upper = data.yellowUpperBound;
-        form.o.Enable = !!data.orangeIsAlert;
-        form.o.Lower = data.orangeLowerBound;
-        form.o.Upper = data.orangeUpperBound;
-        form.r.Enable = !!data.redIsAlert;
-        form.r.Lower = data.redLowerBound;
-        form.r.Upper = data.redUpperBound;
-
-    });
-    loading.close();
-}
-
-// Form 表单
-const form = reactive({
-    y: {
-        _title: "黄色预警",
-        Enable: false,
-        Lower: null,
-        Upper: null,
-    },
-    o: {
-        _title: "橙色预警",
-        Enable: false,
-        Lower: null,
-        Upper: null,
-    },
-    r: {
-        _title: "红色预警",
-        Enable: false,
-        Lower: null,
-        Upper: null,
-    }
-})
-
-const onSubmit = async () => {
-    console.log('submit!')
-    const loading = ElLoading.service({
-        lock: true,
-        text: '请稍候',
-        background: 'rgba(0, 0, 0, 0.7)',
-    });
-
-    // isDefault -> true 默认模型; -> false 指定设备的模型
-    const isDefault = treeSelectItem.value.deviceId < 0;
-    const postParams = {
-        modelType: isDefault ? "default" : "specific",
-        deviceId: isDefault ? undefined : treeSelectItem.value.deviceId,
-        deviceTypeId: isDefault ? treeSelectItem.value.typeId : undefined,
-        monitorCode: selectIndex.value,
-        yLower: form.y.Lower,
-        yUpper: form.y.Upper,
-        yEnable: form.y.Enable,
-        oLower: form.o.Lower,
-        oUpper: form.o.Upper,
-        oEnable: form.o.Enable,
-        rLower: form.r.Lower,
-        rUpper: form.r.Upper,
-        rEnable: form.r.Enable,
-    };
-    console.log("setAlertModel -> postParams", postParams);
-    await send_request('v1/alert-model/setAlertModel', "POST", postParams, (data: any) => {
-        console.log("v1/alert-model/setAlertModel", data)
-        if (data) {
-            ElMessage.success('保存成功');
-        } else {
-            ElMessage.error('保存失败');
-        }
-    });
-    loading.close();
-}
-</script>
-
-<style>
-.el-tree-node__content {
-    height: 36px !important;
-}
-</style>
-
-<style scoped></style>
\ No newline at end of file
diff --git a/frontend/src/views/warning-view.vue b/frontend/src/views/warning-view.vue
deleted file mode 100644
index c91bc52..0000000
--- a/frontend/src/views/warning-view.vue
+++ /dev/null
@@ -1,396 +0,0 @@
-<template>
-	<div class="container">
-		<el-row :gutter="20">
-			<el-col :span="18">
-				<el-row :gutter="20" class="mgb20">
-					<el-col :span="6">
-						<el-card shadow="hover" :body-style="{ padding: '0px' }">
-							<div class="grid-content grid-con-0">
-								<el-icon class="grid-con-icon">
-									<Odometer />
-								</el-icon>
-								<div class="grid-cont-right">
-									<div class="grid-num">{{ levelCount?.today_total }}</div>
-									<div>今日累计预警</div>
-								</div>
-							</div>
-						</el-card>
-					</el-col>
-					<el-col :span="6">
-						<el-card shadow="hover" :body-style="{ padding: '0px' }">
-							<div class="grid-content grid-con-1">
-								<el-icon class="grid-con-icon">
-									<User />
-								</el-icon>
-								<div class="grid-cont-right">
-									<div class="grid-num">{{ levelCount?.today_y }}</div>
-									<div>黄色预警</div>
-								</div>
-							</div>
-						</el-card>
-					</el-col>
-					<el-col :span="6">
-						<el-card shadow="hover" :body-style="{ padding: '0px' }">
-							<div class="grid-content grid-con-2">
-								<el-icon class="grid-con-icon">
-									<ChatDotRound />
-								</el-icon>
-								<div class="grid-cont-right">
-									<div class="grid-num">{{ levelCount?.today_o }}</div>
-									<div>橙色预警</div>
-								</div>
-							</div>
-						</el-card>
-					</el-col>
-					<el-col :span="6">
-						<el-card shadow="hover" :body-style="{ padding: '0px' }">
-							<div class="grid-content grid-con-3">
-								<el-icon class="grid-con-icon">
-									<Goods />
-								</el-icon>
-								<div class="grid-cont-right">
-									<div class="grid-num">{{ levelCount?.today_r }}</div>
-									<div>红色预警</div>
-								</div>
-							</div>
-						</el-card>
-					</el-col>
-				</el-row>
-				<el-card shadow="hover" style="min-height: 403px">
-					<template #header>
-						<div class="clearfix">
-							<span>预警列表</span>
-							<el-button style="float: right; padding: 3px 0" text>查看全部</el-button>
-						</div>
-					</template>
-
-
-					<!-- 表格 -->
-					<el-table :data="tableData" border class="table" ref="multipleTable"
-						header-cell-class-name="table-header">
-						<el-table-column prop="id" label="ID" width="55" align="center" v-if="false"></el-table-column>
-						<el-table-column prop="createTime" label="报警时间" align="center"></el-table-column>
-						<el-table-column prop="deviceName" label="报警设备" align="center"></el-table-column>
-						<el-table-column prop="alertLevel" label="报警等级" align="center"></el-table-column>
-						<el-table-column prop="monitorCode" label="监测项" align="center"></el-table-column>
-						<el-table-column prop="monitorValue" label="监测值" align="center"></el-table-column>
-						<el-table-column prop="threshold" label="阈值" align="center"></el-table-column>
-						<el-table-column prop="deviceId" label="" align="center" v-if="false"></el-table-column>
-						<!-- <el-table-column label="操作" width="220" align="center"> -->
-						<!-- <template #default="scope">
-								<el-button text :icon="Edit" @click="handleEdit(scope.$index, scope.row)"
-									v-permiss="'user-setting'">
-									编辑
-								</el-button>
-								<el-button text :icon="Delete" class="red" @click="handleDelete(scope.$index, scope.row)"
-									v-permiss="'user-setting'">
-									删除
-								</el-button>
-							</template> -->
-						<!-- </el-table-column> -->
-					</el-table>
-					<!-- 分页 -->
-					<div class="pagination">
-						<el-pagination background layout="total, prev, pager, next" :current-page="query.pageIndex"
-							:page-size="query.pageSize" :total="pageTotal"
-							@current-change="handlePageChange"></el-pagination>
-					</div>
-					<!-- <el-table :show-header="false" :data="todoList" style="width: 100%">
-						<el-table-column width="40">
-							<template #default="scope">
-								<el-checkbox v-model="scope.row.status"></el-checkbox>
-							</template>
-						</el-table-column>
-						<el-table-column>
-							<template #default="scope">
-								<div
-									class="todo-item"
-									:class="{
-										'todo-item-del': scope.row.status
-									}"
-								>
-									{{ scope.row.title }}
-								</div>
-							</template>
-						</el-table-column>
-					</el-table> -->
-				</el-card>
-			</el-col>
-			<el-col :span="6">
-				<el-card shadow="hover" class="mgb20">
-					<p>
-						监测预警总览
-					</p>
-					<div class="alert-image-container">
-						<img class="alert-image" :class="isAlerting ? 'alert-ing' : []"
-							:src="isAlerting ? '/assets/image/svg/alert_warning.svg' : '/assets/image/svg/alert_default.svg'"
-							@click="isAlerting = !isAlerting">
-					</div>
-
-					<!-- 表格 -->
-					<el-table :data="alertLogCountTableData" style="width: 100%">
-						<el-table-column prop="timeRange" label="" />
-						<el-table-column prop="yellow" label="黄色预警" />
-						<el-table-column prop="orange" label="橙色预警" />
-						<el-table-column prop="red" label="红色预警" />
-						<el-table-column prop="total" label="总计" />
-					</el-table>
-				</el-card>
-			</el-col>
-		</el-row>
-	</div>
-</template>
-
-<script setup lang="ts" name="dashboard">
-import { ref, reactive } from 'vue';
-import send_request from '../utils/send_request';
-
-const name = localStorage.getItem('ms_username');
-const role: string = name === 'admin' ? '超级管理员' : '普通用户';
-
-
-// 筛选条件
-const query = reactive({
-	params: {
-		deviceType: '',
-		name: '',
-	},
-	pageIndex: 1,
-	pageSize: 10
-});
-
-// 展示的铃铛是否处于报警状态
-const isAlerting = ref(false);
-
-const alertLevel = {
-	"1": "黄色预警",
-	"2": "橙色预警",
-	"3": "红色预警",
-}
-const tableData: any = ref([]);
-const pageTotal = ref(0);
-const levelCount = ref({
-	'today_y': '',
-	'today_o': '',
-	'today_r': '',
-	'today_total': '',
-});
-
-// 统计表格的数据
-const alertLogCountTableData = ref([]);
-
-const getData = async () => {
-	// const loading = ElLoading.service({
-	// 	lock: true,
-	// 	text: '请稍候',
-	// 	background: 'rgba(0, 0, 0, 0.7)',
-	// });
-	await send_request('v1/alert/list', "GET", {
-		...query.params,
-		pageIndex: query.pageIndex,
-		pageSize: query.pageSize,
-		page: query.pageIndex,
-	}, (data: any) => {
-		let alertList = data;
-
-		//生成"设备类型"数据字典
-		//console.log("deviceList/deviceTypeList:", deviceList, deviceTypeList)
-		// deviceTypeList.forEach((item: any) => deviceTypeDict.value[item.id] = item.type)
-
-		// 渲染表格
-		tableData.value = alertList.list.map((i: any) => {
-			i.state = "在线"
-			i.alertLevel = alertLevel[i.alertLevel]
-			i.createTime = new Date(new Date(i.createTime).getTime() + 8 * 3600 * 1000).toISOString().substring(0, 19).replace('T', ' ')
-			return i
-		});
-		pageTotal.value = alertList.total;
-		// // 渲染下拉框
-		// deviceTypeOption.value = deviceTypeList;
-	});
-
-	// 各种预警的数量
-	await send_request('v1/chart-data/levelCount', "GET", {
-	}, (data: any) => {
-		console.log("v1/chart-data/levelCount:", data);
-
-		let timeRangeDict = {
-			"day": "今日",
-			"week": "本周",
-			"month": "本月",
-			"year": "今年",
-			"total": "累计",
-		}
-		alertLogCountTableData.value = data.map((row: any) => {
-			row.total = row.yellow + row.orange + row.red;
-			if (row.timeRange == "day") {
-				levelCount.value.today_y = row.yellow;
-				levelCount.value.today_o = row.orange;
-				levelCount.value.today_r = row.red;
-				levelCount.value.today_total = row.total;
-				console.log(levelCount.value)
-			}
-			row.timeRange = timeRangeDict[row.timeRange]
-			return row
-		})
-		console.log("alertLogCountTableData.value", alertLogCountTableData.value);
-	});
-
-	// loading.close();
-};
-getData();
-// 分页导航
-const handlePageChange = (val: number) => {
-	query.pageIndex = val;
-	getData();
-};
-
-
-</script>
-
-<style scoped>
-/* 警铃抖动样式 */
-@keyframes shaking {
-	0% {
-		transform: rotate(0deg);
-	}
-
-	35% {
-		transform: rotate(20deg);
-	}
-
-	65% {
-		transform: rotate(-20deg);
-	}
-
-	100% {
-		transform: rotate(0deg);
-	}
-}
-
-.alert-image-container {
-	text-align: center;
-}
-
-.alert-image {
-	width: 60%;
-}
-
-.alert-ing {
-	animation-duration: 1s;
-	animation-name: shaking;
-	animation-direction: normal;
-	animation-iteration-count: infinite;
-	animation-timing-function: cubic-bezier(0.76, 0.44, 0.33, 0.75);
-	animation-delay: 0.8s;
-}
-
-/* ############ */
-
-.el-row {
-	margin-bottom: 20px;
-}
-
-.grid-content {
-	display: flex;
-	align-items: center;
-	--grid-content-height: min(150px, 6vw);
-	height: var(--grid-content-height);
-}
-
-.grid-cont-right {
-	flex: 1;
-	text-align: center;
-	font-size: 14px;
-	color: #999;
-}
-
-.grid-num {
-	font-size: min(70px, 4vw);
-	font-weight: bold;
-}
-
-.grid-con-icon {
-	font-size: min(50px, 2.8vw);
-	width: min(150px, 5vw);
-	height: var(--grid-content-height);
-	text-align: center;
-	line-height: 100px;
-	color: #fff;
-}
-
-.grid-con-0 .grid-con-icon {
-	background: rgb(43 157 255);
-}
-
-.grid-con-0 .grid-num {
-	color: rgb(43 157 255);
-}
-
-.grid-con-1 .grid-con-icon {
-	background: rgb(255 223 43);
-}
-
-.grid-con-1 .grid-num {
-	color: rgb(255 223 43);
-}
-
-.grid-con-2 .grid-con-icon {
-	background: rgb(255, 135, 0);
-}
-
-.grid-con-2 .grid-num {
-	color: rgb(255, 135, 0);
-}
-
-.grid-con-3 .grid-con-icon {
-	background: rgb(242, 94, 67);
-}
-
-.grid-con-3 .grid-num {
-	color: rgb(242, 94, 67);
-}
-
-.user-info {
-	display: flex;
-	align-items: center;
-	padding-bottom: 20px;
-	border-bottom: 2px solid #ccc;
-	margin-bottom: 20px;
-}
-
-.user-info-cont {
-	padding-left: 50px;
-	flex: 1;
-	font-size: 14px;
-	color: #999;
-}
-
-.user-info-cont div:first-child {
-	font-size: 30px;
-	color: #222;
-}
-
-.user-info-list {
-	font-size: 14px;
-	color: #999;
-	line-height: 25px;
-}
-
-.user-info-list span {
-	margin-left: 70px;
-}
-
-.mgb20 {
-	margin-bottom: 20px;
-}
-
-.todo-item {
-	font-size: 14px;
-}
-
-.todo-item-del {
-	text-decoration: line-through;
-	color: #999;
-}
-</style>