diff --git a/Caddyfile b/Caddyfile
new file mode 100644
index 0000000..79cfd95
--- /dev/null
+++ b/Caddyfile
@@ -0,0 +1,10 @@
+:4173 {
+	handle_path /prod-api/* {
+		reverse_proxy 192.168.1.201:1616
+	}
+	handle {
+		root * /Users/ailanyin/WebstormProjects/qiaoba-ui/dist
+		file_server
+		try_files {path} /
+	}
+}
diff --git a/env.d.ts b/env.d.ts
new file mode 100644
index 0000000..151aa68
--- /dev/null
+++ b/env.d.ts
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
\ No newline at end of file
diff --git a/package.json b/package.json
index e35b4ef..119e3b7 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,11 @@
     "@amap/amap-jsapi-loader": "^1.0.1",
     "@element-plus/icons-vue": "2.0.10",
     "@vueuse/core": "9.5.0",
+    "@wangeditor/editor": "^5.1.23",
+    "@wangeditor/editor-for-vue": "^5.1.12",
     "axios": "0.27.2",
+    "chart.js": "^4.2.1",
+    "dayjs": "^1.11.7",
     "echarts": "5.4.0",
     "element-plus": "2.2.27",
     "file-saver": "2.0.5",
@@ -29,9 +33,14 @@
     "jsencrypt": "3.3.1",
     "lodash-es": "^4.17.21",
     "nprogress": "0.2.0",
+    "patternomaly": "^1.3.2",
     "pinia": "2.0.22",
+    "pinia-plugin-persistedstate": "^3.1.0",
+    "reconnecting-websocket": "^4.4.0",
     "uuid": "^9.0.0",
+    "v3-infinite-loading": "^1.2.2",
     "vue": "3.2.45",
+    "vue-chartjs": "^5.2.0",
     "vue-cropper": "1.0.3",
     "vue-router": "4.1.4",
     "vue3-json-viewer": "^2.2.2"
@@ -39,8 +48,10 @@
   "devDependencies": {
     "@vitejs/plugin-vue": "3.1.0",
     "@vue/compiler-sfc": "3.2.45",
+    "@vue/tsconfig": "^0.1.3",
     "prettier": "^2.8.4",
     "sass": "1.56.1",
+    "typescript": "^5.0.4",
     "unplugin-auto-import": "0.11.4",
     "vite": "3.2.3",
     "vite-plugin-compression": "0.5.1",
diff --git a/src/api/alert/log.js b/src/api/alert/log.js
new file mode 100644
index 0000000..9ece5dc
--- /dev/null
+++ b/src/api/alert/log.js
@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询设备告警日志列表
+export function listLog(query) {
+  return request({
+    url: "/alert/log/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询设备告警日志详细
+export function getLog(alertId) {
+  return request({
+    url: "/alert/log/" + alertId,
+    method: "get",
+  });
+}
+
+// 新增设备告警日志
+export function addLog(data) {
+  return request({
+    url: "/alert/log",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改设备告警日志
+export function updateLog(data) {
+  return request({
+    url: "/alert/log",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除设备告警日志
+export function delLog(alertId) {
+  return request({
+    url: "/alert/log/" + alertId,
+    method: "delete",
+  });
+}
diff --git a/src/api/iot/device.js b/src/api/iot/device.js
index 299e75e..26aba66 100644
--- a/src/api/iot/device.js
+++ b/src/api/iot/device.js
@@ -50,13 +50,77 @@ export function fetchOperatingStatus(deviceSn) {
   });
 }
 
+/**
+ * 查询设备物模型某一指标历史
+ * @param params
+ * @return {*}
+ */
 export function selectIdentifierHistory(params) {
+  let start_time = null;
+  let end_time = null;
+  if (params.startTime) start_time = new Date(params.startTime).getTime();
+  if (params.endTime) end_time = new Date(params.endTime).getTime();
   return request({
-    url: `/iot/device/selectIdentifierHistory/${params.deviceSn}/${params.identifier}`,
+    url: `/iot/device/selectIdentifierHistory/${params.deviceSn}`,
     method: "GET",
     params: {
       pageNum: params.pageNum,
       pageSize: params.pageSize,
+      identifier: params.identifier,
+      type: params.type,
+      startTime: start_time,
+      endTime: end_time,
+      sort: params.sort,
     },
   });
 }
+
+export function setDeviceAttr(data) {
+  const { version, method, params } = data;
+  return request({
+    url: `/iot/device/set/${data.productSn}/${data.deviceSn}`,
+    method: "post",
+    data: {
+      version,
+      method,
+      params,
+    },
+  });
+}
+
+export function setDeviceInvoke(data) {
+  const { version, method, params } = data;
+  return request({
+    url: `/iot/device/invoke/${data.productSn}/${data.deviceSn}`,
+    method: "post",
+    data: {
+      version,
+      method,
+      params,
+    },
+  });
+}
+
+/**
+ * 属性设置日志列表
+ * @param params
+ * @return {*}
+ */
+export function setPropertyLog(params) {
+  return request({
+    url: `/device/setPropertyLog/list`,
+    params,
+  });
+}
+
+/**
+ * 服务调用日志列表
+ * @return {*}
+ * @param params
+ */
+export function setFunctionLog(params) {
+  return request({
+    url: `/device/setFunctionLog/list`,
+    params,
+  });
+}
diff --git a/src/api/msg/msg.js b/src/api/msg/msg.js
new file mode 100644
index 0000000..5e741ff
--- /dev/null
+++ b/src/api/msg/msg.js
@@ -0,0 +1,29 @@
+import request from "@/utils/request";
+
+// 查询消息列表
+export function listMsg(query) {
+  return request({
+    url: "/msg/msg/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 修改消息
+export function updateMsg(msgIds, status) {
+  return request({
+    url: `/msg/msg/${msgIds}/status`,
+    method: "put",
+    params: {
+      status,
+    },
+  });
+}
+
+// 删除消息
+export function delMsg(msgIds) {
+  return request({
+    url: "/msg/msg/" + msgIds,
+    method: "delete",
+  });
+}
diff --git a/src/api/notice/config.js b/src/api/notice/config.js
new file mode 100644
index 0000000..cd06e62
--- /dev/null
+++ b/src/api/notice/config.js
@@ -0,0 +1,14 @@
+import request from "@/utils/request";
+
+export const msgConfig = () =>
+  request({
+    url: `/msg/config/getInfo`,
+    method: "GET",
+  });
+
+export const saveConfig = (data) =>
+  request({
+    url: "/msg/config",
+    method: "POST",
+    data,
+  });
diff --git a/src/api/notice/template.js b/src/api/notice/template.js
new file mode 100644
index 0000000..89f9c75
--- /dev/null
+++ b/src/api/notice/template.js
@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询通知模板列表
+export function listTemplate(query) {
+  return request({
+    url: "/notice/template/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询通知模板详细
+export function getTemplate(templateId) {
+  return request({
+    url: "/notice/template/" + templateId,
+    method: "get",
+  });
+}
+
+// 新增通知模板
+export function addTemplate(data) {
+  return request({
+    url: "/notice/template",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改通知模板
+export function updateTemplate(data) {
+  return request({
+    url: "/notice/template",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除通知模板
+export function delTemplate(templateId) {
+  return request({
+    url: "/notice/template/" + templateId,
+    method: "delete",
+  });
+}
diff --git a/src/api/product/noticeConfig.js b/src/api/product/noticeConfig.js
new file mode 100644
index 0000000..8c1e257
--- /dev/null
+++ b/src/api/product/noticeConfig.js
@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询告警消息配置列表
+export function listNoticeConfig(query) {
+  return request({
+    url: "/product/noticeConfig/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询告警消息配置详细
+export function getNoticeConfig(configId) {
+  return request({
+    url: "/product/noticeConfig/" + configId,
+    method: "get",
+  });
+}
+
+// 新增告警消息配置
+export function addNoticeConfig(data) {
+  return request({
+    url: "/product/noticeConfig",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改告警消息配置
+export function updateNoticeConfig(data) {
+  return request({
+    url: "/product/noticeConfig",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除告警消息配置
+export function delNoticeConfig(configId) {
+  return request({
+    url: "/product/noticeConfig/" + configId,
+    method: "delete",
+  });
+}
diff --git a/src/assets/styles/element-ui.scss b/src/assets/styles/element-ui.scss
index 3ac74c2..d3109df 100644
--- a/src/assets/styles/element-ui.scss
+++ b/src/assets/styles/element-ui.scss
@@ -101,6 +101,12 @@
   border-radius: 6px;
 
   .el-radio-button {
+    &:first-child {
+    }
+
+    &:last-child {
+    }
+
     .el-radio-button__inner {
       background-color: transparent;
       border: none;
@@ -118,3 +124,29 @@
     }
   }
 }
+
+.custom-table-style {
+  box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  border-radius: 8px;
+  //border: 1px solid rgb(226 232 240);
+  border: none;
+
+  .el-table__inner-wrapper {
+    //overflow: hidden;
+    //box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+
+    &::before {
+      display: none;
+    }
+
+    .el-table__header-wrapper th {
+      background-color: #fbfbfb !important;
+    }
+
+    .el-table__row:last-child {
+      td.el-table__cell {
+        border-bottom: none;
+      }
+    }
+  }
+}
diff --git a/src/assets/styles/sidebar.scss b/src/assets/styles/sidebar.scss
index c3d14a2..769e104 100644
--- a/src/assets/styles/sidebar.scss
+++ b/src/assets/styles/sidebar.scss
@@ -111,6 +111,7 @@
       }
     }
 
+    /* rounded menu indicator */
     & .router-link-active:not(.sidebar-logo-link) {
       position: relative;
 
@@ -136,10 +137,8 @@
         top: 50%;
         border-radius: 28px;
         box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1),
-          0 2px 4px -2px rgb(0 0 0 / 0.1), inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
+          0 2px 4px -2px rgb(0 0 0 / 0.1);
       }
-
-      //background-color: aliceblue;
     }
   }
 
diff --git a/src/components/Editor/index.vue b/src/components/Editor/index.vue
new file mode 100644
index 0000000..29d2e01
--- /dev/null
+++ b/src/components/Editor/index.vue
@@ -0,0 +1,168 @@
+<template>
+  <div
+    :class="{
+      disabled: readOnly,
+    }"
+    :style="`border: 1px solid #ccc; width: ${width}px`"
+  >
+    <Toolbar
+      :defaultConfig="toolbarConfig"
+      :editor="editorRef"
+      :mode="mode"
+      style="border-bottom: 1px solid #ccc"
+    />
+    <Editor
+      v-model="valueHtml"
+      :defaultConfig="editorConfig"
+      :mode="mode"
+      :style="`min-height: ${minHeight}px; height: ${height}px;
+    overflow-y: hidden`"
+      @onBlur="emitBlur"
+      @onChange="handleChange"
+      @onCreated="handleCreated"
+    />
+  </div>
+</template>
+
+<script>
+import "@wangeditor/editor/dist/css/style.css"; // 引入 css
+import { getToken } from "@/utils/auth";
+import { onBeforeUnmount, ref, shallowRef, toRefs, watch } from "vue";
+import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
+
+const baseUrl = import.meta.env.VITE_APP_BASE_API;
+export default {
+  components: { Editor, Toolbar },
+  props: {
+    readOnly: {
+      type: Boolean,
+      default: false,
+    },
+    modelValue: {
+      type: String,
+      default: "",
+    },
+    placeholder: {
+      type: String,
+      default: "请输入内容",
+    },
+    minHeight: {
+      type: [String, Number],
+      default: 300,
+    },
+    height: {
+      type: [String, Number],
+      default: 300,
+    },
+    width: {
+      type: [String, Number],
+      default: 820,
+    },
+    mode: {
+      type: String,
+      default: "default", // or 'simple'
+    },
+  },
+  setup(props, context) {
+    // 编辑器实例，必须用 shallowRef
+    const editorRef = shallowRef();
+
+    // 内容 HTML
+    const valueHtml = ref("");
+    watch(
+      () => props.modelValue,
+      (val) => {
+        valueHtml.value = val;
+      },
+      { immediate: true }
+    );
+    const { height } = toRefs(props);
+
+    const toolbarConfig = {
+      excludeKeys: [],
+    };
+    // onBlur: (editor) => {
+    //   console.log("onBlur");
+    // },
+    const editorConfig = {
+      placeholder: props.placeholder,
+      readOnly: props.readOnly,
+      MENU_CONF: {
+        uploadImage: {
+          server: `${baseUrl}/common/upload`,
+          // 自定义增加 http  header
+          fieldName: "file",
+          headers: {
+            Authorization: `Bearer ${getToken()}`,
+          },
+          customInsert(res, insertFn) {
+            // res 即服务端的返回结果
+            // console.log(res);
+            // 从 res 中找到 url alt href ，然后插图图片
+            insertFn(res.url, null, null);
+          },
+        },
+      },
+    };
+
+    const isEmpty = () => {
+      return editorRef.value.isEmpty();
+    };
+
+    // 组件销毁时，也及时销毁编辑器
+    onBeforeUnmount(() => {
+      const editor = editorRef.value;
+      if (editor == null) return;
+      editor.destroy();
+    });
+
+    const handleCreated = (editor) => {
+      editorRef.value = editor; // 记录 editor 实例，重要！
+    };
+    const handleChange = (editor) => {
+      if (editor.isEmpty()) {
+        context.emit("update:modelValue", "");
+      } else {
+        context.emit("update:modelValue", editor.getHtml());
+      }
+    };
+    context.expose({ isEmpty });
+
+    const emitBlur = () => {
+      context.emit("blur", editorRef.value);
+      // editorRef.value.emit("blur");
+    };
+
+    return {
+      editorRef,
+      valueHtml,
+      mode: "default", // 或 'simple'
+      toolbarConfig,
+      editorConfig,
+      height,
+      handleCreated,
+      handleChange,
+      // isEmpty,
+      emitBlur,
+    };
+  },
+};
+</script>
+<style lang="scss" scoped>
+.disabled {
+  background-color: #f5f7fa;
+  cursor: not-allowed;
+
+  :deep(.w-e-text-container) {
+    background-color: inherit;
+    // color: green;
+    opacity: 0.5;
+  }
+
+  :deep(.w-e-toolbar) {
+    user-select: none;
+    pointer-events: none;
+    background-color: inherit;
+  }
+}
+</style>
diff --git a/src/components/MapSelect/index.vue b/src/components/MapSelect/index.vue
index a1993fe..0079bbe 100644
--- a/src/components/MapSelect/index.vue
+++ b/src/components/MapSelect/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div id="map-container">
+  <div class="main-wrap">
     <div class="search-bar">
       <el-input
         v-model="keyword"
@@ -14,12 +14,13 @@
         </template>
       </el-input>
     </div>
+    <div id="map-container"></div>
   </div>
 </template>
 
 <script setup>
 import { loadMap } from "@/utils/amap";
-import { onMounted, ref, shallowRef, toRefs } from "vue";
+import { onMounted, ref, shallowRef, toRefs, watchEffect } from "vue";
 import markBsPng from "@/assets/images/mark_bs.png";
 import { Search } from "@element-plus/icons-vue";
 
@@ -33,22 +34,29 @@ const emit = defineEmits(["selected"]);
 const AMap = shallowRef();
 const map = shallowRef();
 const placeSearch = shallowRef(null);
+const geocoder = shallowRef(null);
 const searchResultMarkers = shallowRef([]); // 搜索结果表笔列表
 const resultInfoWindow = shallowRef(null);
 
-const handleMapClick = (event) => {
+const handleMapClick = async (event) => {
   map.value.clearMap();
   const { lnglat } = event;
   const marker = new AMap.value.Marker({
     position: lnglat,
   });
   map.value.add(marker);
-  emit("selected", lnglat);
+  let address;
+  try {
+    const resp = await getAddressByLnglat(lnglat);
+    address = resp.regeocode.formattedAddress;
+  } catch (e) {
+    console.log(e);
+  }
+  emit("selected", { lnglat, address });
 };
 
 // 鼠标悬停搜索结果标记
 const handleResultHover = (ev) => {
-  console.log(ev);
   resultInfoWindow.value.setContent(`
     <div>
     ${ev.target.getExtData().name}</div>
@@ -61,14 +69,14 @@ const handleResultClick = async (ev) => {
   map.value.clearMap();
   searchResultMarkers.value = [];
   const lnglat = ev.target.getExtData()?.location;
-  // if (!lnglat) return ElMessage.error("获取经纬度失败");
-  // addFencePath(lnglat);
-  const marker = new AMap.value.Marker({
-    position: lnglat,
-  });
-  map.value.add(marker);
-  map.value.setFitView([marker]);
-  emit("selected", lnglat);
+  let address;
+  try {
+    const resp = await getAddressByLnglat(lnglat);
+    address = resp.regeocode.formattedAddress;
+  } catch (e) {
+    console.log(e);
+  }
+  emit("selected", { lnglat, address });
 };
 
 // 根据名称搜索地图标点
@@ -78,7 +86,6 @@ const searchPoint = (val /** 搜索建议选项 */, type) => {
   placeSearch.value.search(keyword.value, (status, result) => {
     // TODO: 添加搜索结果标记
     if (status === "complete") {
-      console.log(status, result);
       searchResultMarkers.value = result.poiList.pois.map((el, index) => {
         const marker = new AMap.value.Marker({
           map: map.value,
@@ -116,8 +123,29 @@ const searchPoint = (val /** 搜索建议选项 */, type) => {
   });
 };
 
+/**
+ * 地理逆编码
+ * @return {Promise<unknown>}
+ * @param pos
+ */
+const getAddressByLnglat = (pos) =>
+  new Promise((resolve, reject) => {
+    if (geocoder.value) {
+      geocoder.value.getAddress(pos, function (status, result) {
+        if (status === "complete" && result.info === "OK") {
+          // result为对应的地理位置详细信息
+          resolve(result);
+        } else {
+          reject(new Error("获取失败"));
+        }
+      });
+    } else {
+      reject(new Error("geocoder 未加载"));
+    }
+  });
+
 onMounted(async () => {
-  AMap.value = await loadMap(["AMap.PlaceSearch"]);
+  AMap.value = await loadMap(["AMap.PlaceSearch", "AMap.Geocoder"]);
   map.value = new AMap.value.Map("map-container", { zoom: 11 });
   map.value.on("click", handleMapClick);
   // 地点搜索插件
@@ -125,35 +153,41 @@ onMounted(async () => {
     // map: map.value
     // city: "0551"
   });
+  geocoder.value = new AMap.value.Geocoder();
   resultInfoWindow.value = new AMap.value.InfoWindow({
     anchor: "bottom-center",
     offset: new AMap.value.Pixel(0, -31),
   });
-  if (lnglat.value.length === 2) {
-    const marker = new AMap.value.Marker({
-      position: lnglat.value,
-    });
-    map.value.add(marker);
-    map.value.setFitView([marker]);
-  }
+  watchEffect(() => {
+    if (lnglat.value.length === 2 && lnglat.value.every((el) => !!el)) {
+      const marker = new AMap.value.Marker({
+        position: lnglat.value,
+      });
+      map.value.add(marker);
+      map.value.setFitView([marker]);
+    }
+  });
 });
 </script>
 
 <style lang="scss" scoped>
-#map-container {
+.main-wrap {
   width: 100%;
-  height: 300px;
-  //margin-left: 140px;
-  //margin-bottom: 18px;
-  position: relative;
+
+  #map-container {
+    width: 100%;
+    height: 300px;
+    //margin-left: 140px;
+    //margin-bottom: 18px;
+    position: relative;
+  }
 
   .search-bar {
-    //display: none;
     position: absolute;
     left: 0;
     top: 10px;
     padding: 0 10px;
-    z-index: 2023;
+    z-index: 202333;
   }
 }
 </style>
diff --git a/src/components/NotificationCenter/index.vue b/src/components/NotificationCenter/index.vue
new file mode 100644
index 0000000..0874dc4
--- /dev/null
+++ b/src/components/NotificationCenter/index.vue
@@ -0,0 +1,465 @@
+<template>
+  <div>
+    <div class="notification-center">
+      <el-popover
+        :visible="visible"
+        placement="bottom-end"
+        popper-style="border-radius: 12px"
+        width="320"
+      >
+        <template #reference>
+          <el-badge
+            :hidden="unreadCount === 0"
+            :value="unreadCount"
+          >
+            <el-icon class="notification-icon" @click="visible = !visible">
+              <Bell />
+            </el-icon>
+          </el-badge>
+        </template>
+        <template #default>
+          <div class="close-button">
+            <el-button circle icon="close" @click="visible = false" />
+          </div>
+          <div class="notification-content">
+            <div class="status-tab">
+              <el-radio-group
+                v-model="status"
+                class="ios-style-radio"
+                size="small"
+              >
+                <el-radio-button :label="1">未读</el-radio-button>
+                <el-radio-button :label="2">已读</el-radio-button>
+              </el-radio-group>
+            </div>
+            <div style="display: flex">
+              <el-button
+                link
+                size="small"
+                type="primary"
+                @click="selectMulti = !selectMulti"
+              >
+                {{ selectMulti ? "取消" : "选择" }}
+              </el-button>
+              <el-button
+                v-if="ids.length && status === 2"
+                link
+                size="small"
+                type="danger"
+                @click="deleteReadMsg"
+              >删除
+              </el-button>
+              <el-button
+                v-if="ids.length && status === 1"
+                link
+                size="small"
+                type="danger"
+                @click="markAsRead"
+              >标为已读
+              </el-button>
+              <el-button
+                link
+                size="small"
+                type="primary"
+                @click="refreshList"
+              >刷新
+              </el-button>
+            </div>
+            <el-scrollbar class="notification-list" height="480">
+              <el-checkbox-group v-model="ids">
+                <template #default>
+                  <!--                  v-for="item in status === 0-->
+                  <!--                  ? notificationStore.unreadList-->
+                  <!--                  : notificationList"-->
+                  <div
+                    v-for="item in notificationList"
+                    :key="item.msgId"
+                    class="notification-item"
+                  >
+                    <el-checkbox v-if="selectMulti" :label="item.msgId">
+                      {{ "" }}
+                    </el-checkbox>
+                    <div
+                      :style="{ width: selectMulti ? '95%' : '100%' }"
+                      class="notification-wrap"
+                      @click="openMsgDetail(item)"
+                    >
+                      <span class="notification-title">{{
+                          item.msgTitle
+                        }}</span>
+                      <span class="notification-time">{{ dayjs(item.sendTime).format("YYYY-MM-DD HH:mm:ss") }}</span>
+                    </div>
+                  </div>
+                </template>
+              </el-checkbox-group>
+              <InfiniteLoading :identifier="loadKey" @infinite="loadMore">
+                <template #complete>
+                  <div style="text-align: center; margin-top: 6px">
+                    没有更多
+                  </div>
+                </template>
+              </InfiniteLoading>
+            </el-scrollbar>
+          </div>
+        </template>
+      </el-popover>
+    </div>
+    <el-dialog
+      v-model="showMsgDetail"
+      :title="msgDetail.msgTitle"
+      align-center
+      title="消息详情"
+      width="500"
+    >
+      <!--      <template #header>-->
+      <!--        <h1>{{ msgDetail.msgTitle }}</h1>-->
+      <!--      </template>-->
+      {{ msgDetail.msgContent }}
+    </el-dialog>
+    <el-dialog v-model="showOfflineNotice"
+               title="下线通知"></el-dialog>
+  </div>
+</template>
+
+<script setup>
+import InfiniteLoading from "v3-infinite-loading";
+import "v3-infinite-loading/lib/style.css"; //required if you're not going to override default slots
+import { Bell } from "@element-plus/icons-vue";
+import { onMounted, reactive, ref, toRefs, watch } from "vue";
+import { delMsg, listMsg, updateMsg } from "@/api/msg/msg";
+import useNotificationStore from "@/store/modules/notification";
+import { storeToRefs } from "pinia";
+import { cloneDeep } from "lodash-es";
+import { ElMessage, ElMessageBox } from "element-plus";
+import useUserStore from "@/store/modules/user";
+import ReconnectingWebSocket from "reconnecting-websocket";
+import { useRouter } from "vue-router";
+import dayjs from "dayjs";
+
+const userStore = useUserStore();
+
+const notificationStore = useNotificationStore();
+const { getList } = storeToRefs(notificationStore);
+const visible = ref(false);
+const showOfflineNotice = ref(false); /*显示下线通知*/
+const data = reactive({
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    status: 1
+  },
+  msgDetail: {}
+});
+const router = useRouter();
+const loadKey = ref(0);
+const baseUrl = import.meta.env.VITE_APP_BASE_API;
+const { queryParams, msgDetail } = toRefs(data);
+const loading = ref(false);
+const total = ref(0);
+const unreadCount = ref(0);
+const status = ref(1);
+const notificationList = ref([]);
+const showMsgDetail = ref(false);
+const selectMulti = ref(false); /*是否处于编辑状态*/
+const ids = ref([]); //选中的列表
+
+const refreshList = () => {
+  ids.value = [];
+  selectMulti.value = false;
+  queryParams.value.status = status.value;
+  queryParams.value.pageNum = 1;
+  // if (status.value === 2) {
+  notificationList.value = [];
+  // }
+  loadKey.value += 1;
+};
+watch(status, (value) => {
+  ids.value = [];
+  selectMulti.value = false;
+  queryParams.value.status = value;
+  queryParams.value.pageNum = 1;
+  // if (value === 2) {
+  notificationList.value = [];
+  // }
+  loadKey.value += 1;
+});
+const loadMore = async ($state) => {
+  // console.log($state);
+  try {
+    loading.value = true;
+    const resp = await listMsg(queryParams.value);
+    // if (queryParams.value.status === 0) {
+    //   notificationStore.pushItems(resp.rows);
+    // } else if (queryParams.value.status === 2) {
+    notificationList.value.push(...resp.rows);
+    // }
+    // queryParams.value.status === 0 &&
+    // resp.rows.length &&
+    // updateMsg(resp.rows.map((el) => el.msgId).join(","), 1);
+    total.value = resp.total;
+    if (queryParams.value.status === 1) {
+      unreadCount.value = resp.total;
+    }
+    /*TODO:计算是否还有下一页*/
+    if (resp.rows.length < queryParams.value.pageSize) {
+      $state.complete();
+    } else {
+      $state.loaded();
+      queryParams.value.pageNum++;
+    }
+    loading.value = false;
+  } catch (e) {
+    console.error(e);
+    $state.error();
+    loading.value = false;
+  }
+};
+
+/**
+ * 删除选中的已读消息
+ * @return {Promise<void>}
+ */
+const deleteReadMsg = async () => {
+  await delMsg(ids.value.join(","));
+  ElMessage.success("删除成功");
+  notificationList.value = [];
+  queryParams.value.pageNum = 1;
+  ids.value = [];
+  selectMulti.value = false;
+  loadKey.value++;
+};
+
+const markAsRead = async () => {
+  await updateMsg(ids.value.join(","), 2);
+  refreshList();
+  /*  for (const id of ids.value) {
+      notificationStore.removeItem(id);
+    }*/
+  ids.value = [];
+  selectMulti.value = false;
+};
+
+const openMsgDetail = async (row) => {
+  const _row = cloneDeep(row);
+  showMsgDetail.value = true;
+  msgDetail.value = _row;
+  if (_row.status !== "2") {
+    await updateMsg(_row.msgId, 2);
+    refreshList();
+    // notificationStore.removeItem(_row.msgId);
+  }
+};
+
+function logout() {
+  ElMessageBox.confirm("您已被挤下线!", "提示", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    showCancelButton: false,
+    showClose: false,
+    type: "warning"
+  })
+    .then(() => {
+      userStore.logOut().then(() => {
+        location.href = "/index";
+        // router.go("/index")
+      });
+    })
+    .catch(() => {
+      userStore.logOut().then(() => {
+        location.href = "/index";
+        // router.go("/index")
+      });
+    });
+}
+
+watch(visible, (value) => {
+  if (value) {
+    notificationList.value = [];
+    queryParams.value.pageNum = 1;
+    queryParams.value.status = 1;
+    status.value = 1;
+    loadKey.value++;
+  }
+});
+
+
+const getUnreadCount = async () => {
+  // loading.value = true;
+  // notificationList.value = [];
+  // queryParams.value.pageNum = 1;
+  // queryParams.value.status = 1;
+  // status.value = 1;
+  const resp = await listMsg({
+    pageSize: 10, pageNum: 1, status: 1
+  });
+  // if (queryParams.value.status === 0) {
+  //   notificationStore.pushItems(resp.rows);
+  // } else if (queryParams.value.status === 2) {
+
+  // notificationList.value.push(...resp.rows);
+  // }
+  // queryParams.value.status === 0 &&
+  // resp.rows.length &&
+  // updateMsg(resp.rows.map((el) => el.msgId).join(","), 1);
+  unreadCount.value = resp.total;
+  // queryParams.value.pageNum++;
+  // loading.value = false;
+};
+onMounted(() => {
+  getUnreadCount();
+  if (userStore.userId) {
+    let wsUrl;
+    if (import.meta.env.VITE_APP_ENV === "development") {
+      wsUrl = `ws://192.168.1.201:1616/ws-msg/${userStore.uniqueId}/${userStore.userId}`;
+    } else {
+      let protocol;
+      if (window.location.protocol === "https:") {
+        protocol = "wss:";
+      } else {
+        protocol = "ws:";
+      }
+      // TODO:
+      // wsUrl = `${protocol}//${window.location.host}/ws-msg/${userStore.userId}`;
+      wsUrl = `ws://192.168.1.201:1616/ws-msg/${userStore.uniqueId}/${userStore.userId}`;
+    }
+    const rws = new ReconnectingWebSocket(wsUrl);
+    rws.addEventListener("open", () => {
+      console.log("websocket 已连接");
+    });
+
+    rws.addEventListener("close", () => {
+      console.log("websocket 已断开");
+    });
+    rws.addEventListener("error", () => {
+      console.log("websocket error");
+    });
+    rws.addEventListener("message", (event) => {
+      console.log(event.data);
+      const wsData = JSON.parse(event.data);
+      if (wsData.type === "msg") {
+        // if (visible.value) {
+        //   refreshList();
+        // } else {
+        if (visible.value && queryParams.value.status === 1) {
+          refreshList();
+        } else {
+          getUnreadCount();
+        }
+        // }
+        // const msg = wsData.data;
+        // updateMsg(msg.msgId, 1);
+        // notificationStore.pushItem(msg);
+      } else if (wsData.type === "offline") {
+        // showOfflineNotice.value = true;
+        logout();
+      }
+    });
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+.notification-center {
+  font-size: 0 !important;
+
+  :deep(.el-badge) {
+    width: 18px;
+    height: 18px;
+  }
+
+  .notification-icon {
+    //width: 18px;
+    //height: 18px;
+    cursor: pointer;
+    font-size: 18px;
+    vertical-align: middle;
+    position: absolute;
+    left: 0;
+    top: 0;
+  }
+}
+
+.close-button {
+  :deep(.el-button) {
+    border: none;
+  }
+}
+
+.notification-content {
+  width: 100%;
+
+  .status-tab {
+    text-align: center;
+  }
+
+  .notification-list {
+    margin-top: 16px;
+
+    .notification-item {
+
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      //box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+
+      .check-circle {
+        cursor: pointer;
+        width: 18px;
+        height: 18px;
+        border-radius: 50%;
+        border: 1px solid #000;
+        flex-shrink: 0;
+      }
+
+      :deep(.el-checkbox__inner) {
+        border-radius: 50%;
+      }
+
+      .notification-wrap {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        height: 60px;
+        padding: 8px;
+        //border-radius: 12px;
+        cursor: pointer;
+        //background-color: #eeefef;
+        //transition: all 0.1s linear;
+        //flex-grow: 1;
+        //flex-shrink: 1;
+        //flex-basis: 0;
+
+        .notification-title {
+          font-size: 16px;
+          line-height: 1;
+          font-weight: 500;
+        }
+
+        .notification-time {
+          font-size: 12px;
+          line-height: 1;
+        }
+      }
+
+      //&:last-child
+      &:not(:first-child) {
+        border-top: 1px solid #eeefef;
+        //margin-top: 8px;
+      }
+
+      &:last-child {
+        border-bottom: 1px solid #eeefef;
+
+      }
+    }
+  }
+}
+
+:deep(.el-dialog.is-align-center) {
+  margin-top: auto !important;
+}
+
+:deep(.el-popover.el-popper) {
+  border-radius: 12px;
+}
+</style>
diff --git a/src/components/Pagination/index.vue b/src/components/Pagination/index.vue
index 8200733..ffd46f0 100644
--- a/src/components/Pagination/index.vue
+++ b/src/components/Pagination/index.vue
@@ -1,12 +1,13 @@
 <template>
   <div :class="{ hidden: hidden }" class="pagination-container">
     <el-pagination
-      :background="background"
       v-model:current-page="currentPage"
       v-model:page-size="pageSize"
+      :background="background"
       :layout="layout"
       :page-sizes="pageSizes"
       :pager-count="pagerCount"
+      :small="small"
       :total="total"
       @size-change="handleSizeChange"
       @current-change="handleCurrentChange"
@@ -18,6 +19,9 @@
 import { scrollTo } from "@/utils/scroll-to";
 
 const props = defineProps({
+  small: {
+    type: Boolean,
+  },
   total: {
     required: true,
     type: Number,
@@ -76,6 +80,7 @@ const pageSize = computed({
     emit("update:limit", val);
   },
 });
+
 function handleSizeChange(val) {
   if (currentPage.value * val > props.total) {
     currentPage.value = 1;
@@ -85,6 +90,7 @@ function handleSizeChange(val) {
     scrollTo(0, 800);
   }
 }
+
 function handleCurrentChange(val) {
   emit("pagination", { page: val, limit: pageSize.value });
   if (props.autoScroll) {
@@ -98,6 +104,7 @@ function handleCurrentChange(val) {
   background: #fff;
   padding: 32px 16px;
 }
+
 .pagination-container.hidden {
   display: none;
 }
diff --git a/src/constant/dict.js b/src/constant/dict.js
index 1a75237..4223c2d 100644
--- a/src/constant/dict.js
+++ b/src/constant/dict.js
@@ -58,7 +58,7 @@ export const modelTypeDict = [
     elTagType: "success",
   },
   {
-    label: "功能",
+    label: "服务",
     value: 2,
     elTagType: "warning",
   },
@@ -113,9 +113,9 @@ export const locationWayMap = [
 // 1-未激活，2-禁用，3-在线，4-离线
 export const deviceStatusMap = [
   {
-    label: "未激活",
+    label: "启用",
     value: 1,
-    elTagType: "info",
+    elTagType: "success",
   },
   {
     label: "禁用",
@@ -210,8 +210,116 @@ export const setFunctionLogStatusDict = [
     elTagType: "success",
   },
   {
-    label: "未知",
+    label: "失败",
     value: "2",
     elTagType: "danger",
   },
 ];
+
+export const setPropertyLogStatusDict = [
+  {
+    label: "未回复",
+    value: "0",
+    elTagType: "info",
+  },
+  {
+    label: "成功",
+    value: "1",
+    elTagType: "success",
+  },
+  {
+    label: "失败",
+    value: "2",
+    elTagType: "danger",
+  },
+];
+
+export const deviceOnlineStatusDict = [
+  {
+    label: "上线",
+    value: "4",
+    elTagType: "success",
+  },
+  {
+    label: "下线",
+    value: "5",
+    elTagType: "danger",
+  },
+];
+
+export const notificationTemplateState = [
+  {
+    label: "停用",
+    value: "0",
+    elTagType: "danger",
+  },
+  {
+    label: "正常",
+    value: "1",
+    elTagType: "success",
+  },
+];
+
+export const noticeTypeDict = [
+  {
+    label: "站内",
+    value: "1",
+    elTagType: "danger",
+  },
+  {
+    label: "短信",
+    value: "2",
+    elTagType: "success",
+  },
+  {
+    label: "邮件",
+    value: "3",
+    elTagType: "warning",
+  },
+];
+
+export const msgTypeDict = [
+  {
+    label: "阿里云",
+    value: "1",
+    fieldPrefix: "a",
+    elTagType: "danger",
+  },
+  {
+    label: "腾讯云",
+    value: "2",
+    fieldPrefix: "b",
+    elTagType: "success",
+  },
+];
+
+export const deviceAlertLogDict = [
+  {
+    label: "待处理",
+    value: "0",
+    elTagType: "warning",
+  },
+  {
+    label: "处理成功",
+    value: "1",
+    elTagType: "success",
+  },
+  {
+    label: "处理失败",
+    value: "2",
+    elTagType: "danger",
+  },
+];
+
+export const noticeStatusDict = [
+  {
+    label: "停用",
+    value: "1",
+    elTagType: "danger",
+  },
+  {
+    label: "正常",
+    value: "0",
+    elTagType: "success",
+  },
+];
diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index 59ac6bf..f7d7538 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -7,18 +7,19 @@
       @toggleClick="toggleSideBar"
     />
     <breadcrumb
+      v-if="!settingsStore.topNav"
       id="breadcrumb-container"
       class="breadcrumb-container"
-      v-if="!settingsStore.topNav"
     />
     <top-nav
+      v-if="settingsStore.topNav"
       id="topmenu-container"
       class="topmenu-container"
-      v-if="settingsStore.topNav"
     />
 
     <div class="right-menu">
       <template v-if="appStore.device !== 'mobile'">
+        <notification-center class="right-menu-item" />
         <header-search id="header-search" class="right-menu-item" />
 
         <screenfull id="screenfull" class="right-menu-item hover-effect" />
@@ -29,13 +30,15 @@
       </template>
       <div class="avatar-container">
         <el-dropdown
-          @command="handleCommand"
           class="right-menu-item hover-effect"
           trigger="click"
+          @command="handleCommand"
         >
           <div class="avatar-wrapper">
             <img :src="userStore.avatar" class="user-avatar" />
-            <el-icon><caret-bottom /></el-icon>
+            <el-icon>
+              <caret-bottom />
+            </el-icon>
           </div>
           <template #dropdown>
             <el-dropdown-menu>
@@ -45,7 +48,7 @@
               <el-dropdown-item command="setLayout">
                 <span>布局设置</span>
               </el-dropdown-item>
-              <el-dropdown-item divided command="logout">
+              <el-dropdown-item command="logout" divided>
                 <span>退出登录</span>
               </el-dropdown-item>
             </el-dropdown-menu>
@@ -64,11 +67,10 @@ import Hamburger from "@/components/Hamburger";
 import Screenfull from "@/components/Screenfull";
 import SizeSelect from "@/components/SizeSelect";
 import HeaderSearch from "@/components/HeaderSearch";
-import RuoYiGit from "@/components/RuoYi/Git";
-import RuoYiDoc from "@/components/RuoYi/Doc";
 import useAppStore from "@/store/modules/app";
 import useUserStore from "@/store/modules/user";
 import useSettingsStore from "@/store/modules/settings";
+import NotificationCenter from "@/components/NotificationCenter";
 
 const appStore = useAppStore();
 const userStore = useUserStore();
@@ -106,6 +108,7 @@ function logout() {
 }
 
 const emits = defineEmits(["setLayout"]);
+
 function setLayout() {
   emits("setLayout");
 }
diff --git a/src/main.js b/src/main.js
index 6b60ea1..8f00b3b 100644
--- a/src/main.js
+++ b/src/main.js
@@ -46,6 +46,10 @@ import TreeSelect from "@/components/TreeSelect";
 // 字典标签组件
 import DictTag from "@/components/DictTag";
 
+// import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
+
+// pinia.use(piniaPluginPersistedstate)
+
 window._AMapSecurityConfig = {
   securityJsCode: "2b65e7751cb17e4605f4c4cdccf885f6",
 };
diff --git a/src/store/index.js b/src/store/index.js
index 069d54e..f65df8b 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1,3 +1,6 @@
+import piniaPluginPersistedstate from "pinia-plugin-persistedstate";
+
 const store = createPinia();
 
+store.use(piniaPluginPersistedstate);
 export default store;
diff --git a/src/store/modules/notification.js b/src/store/modules/notification.js
new file mode 100644
index 0000000..e7a5b51
--- /dev/null
+++ b/src/store/modules/notification.js
@@ -0,0 +1,46 @@
+import { defineStore } from "pinia";
+import { cloneDeep } from "lodash-es";
+
+const useNotificationStore = defineStore("notification", {
+  state: () => ({
+    unreadList: [],
+  }),
+  actions: {
+    pushItem(row) {
+      const _row = cloneDeep(row);
+      const isNotExisted = this.unreadList.every(
+        (el) => el.msgId !== _row.msgId
+      );
+      if (isNotExisted) {
+        this.unreadList.unshift(_row);
+      }
+    },
+    pushItems(rows) {
+      for (const row of rows) {
+        const _row = cloneDeep(row);
+        const isNotExisted = this.unreadList.every(
+          (el) => el.msgId !== _row.msgId
+        );
+        if (isNotExisted) {
+          this.unreadList.push(_row);
+        }
+      }
+    },
+    removeItem(id) {
+      this.unreadList = this.unreadList.filter((el) => el.msgId !== id);
+    },
+  },
+  getters: {
+    getList: (state) => {
+      return (params) =>
+        state.unreadList.slice(
+          (params.pageNum - 1) * params.pageSize + 1,
+          (params.pageNum - 1) * params.pageSize + 1 + params.pageSize
+        );
+    },
+    unreadCount: (state) => state.unreadList.length,
+  },
+  persist: true,
+});
+
+export default useNotificationStore;
diff --git a/src/store/modules/user.js b/src/store/modules/user.js
index 43a4e5d..58ecee4 100644
--- a/src/store/modules/user.js
+++ b/src/store/modules/user.js
@@ -1,6 +1,7 @@
-import { login, logout, getInfo } from "@/api/login";
-import { getToken, setToken, removeToken } from "@/utils/auth";
+import { getInfo, login, logout } from "@/api/login";
+import { getToken, removeToken, setToken } from "@/utils/auth";
 import defAva from "@/assets/images/profile.jpg";
+import { v4 as uuidv4 } from "uuid";
 
 const useUserStore = defineStore("user", {
   state: () => ({
@@ -8,7 +9,9 @@ const useUserStore = defineStore("user", {
     name: "",
     avatar: "",
     roles: [],
+    userId: null,
     permissions: [],
+    uniqueId: ""
   }),
   actions: {
     // 登录
@@ -47,8 +50,11 @@ const useUserStore = defineStore("user", {
             } else {
               this.roles = ["ROLE_DEFAULT"];
             }
+            this.userId = user.userId;
             this.name = user.userName;
             this.avatar = avatar;
+            const uniqueId = uuidv4();
+            this.uniqueId = uniqueId;
             resolve(res);
           })
           .catch((error) => {
@@ -71,8 +77,11 @@ const useUserStore = defineStore("user", {
             reject(error);
           });
       });
-    },
+    }
   },
+  persist: {
+    paths: ["uniqueId"]
+  }
 });
 
 export default useUserStore;
diff --git a/src/utils/index.js b/src/utils/index.js
index 4490f41..c6812d3 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -392,3 +392,18 @@ export function camelCase(str) {
 export function isNumberStr(str) {
   return /^[+-]?(0|([1-9]\d*))(\.\d+)?$/g.test(str);
 }
+
+/**
+ * 生成随机字符串
+ * @param length
+ * @return {string}
+ */
+export const generateRandomString = (length) => {
+  const characters =
+    "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let result = "";
+  for (let i = 0; i < length; i++) {
+    result += characters.charAt(Math.floor(Math.random() * characters.length));
+  }
+  return result;
+};
diff --git a/src/utils/test.js b/src/utils/test.js
new file mode 100644
index 0000000..c9d2295
--- /dev/null
+++ b/src/utils/test.js
@@ -0,0 +1,6 @@
+const parseStr = (str) =>
+  str.split(",").map((el) => ({
+    type: el.split(":")[0],
+    template: el.split(":")[1],
+    user: el.split(":")[2],
+  }));
diff --git a/src/views/alert/log/index.vue b/src/views/alert/log/index.vue
new file mode 100644
index 0000000..d55d67a
--- /dev/null
+++ b/src/views/alert/log/index.vue
@@ -0,0 +1,453 @@
+<template>
+  <div class="app-container">
+    <el-form
+      v-show="showSearch"
+      ref="queryRef"
+      :inline="true"
+      :model="queryParams"
+      label-width="68px"
+    >
+      <el-form-item label="产品Sn" prop="productSn">
+        <el-input
+          v-model="queryParams.productSn"
+          clearable
+          placeholder="请输入产品Sn"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!--      <el-form-item label="产品名称" prop="productName">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.productName"-->
+      <!--          clearable-->
+      <!--          placeholder="请输入产品名称"-->
+      <!--          @keyup.enter="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <el-form-item label="设备Sn" prop="deviceSn">
+        <el-input
+          v-model="queryParams.deviceSn"
+          clearable
+          placeholder="请输入设备Sn"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="告警级别" prop="alertLevel">
+        <el-select
+          v-model="queryParams.alertLevel"
+          placeholder="请选择告警级别"
+        >
+          <el-option
+            v-for="item in iot_alert_level"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="状态" prop="status">
+        <el-select v-model="queryParams.status" placeholder="请选择状态">
+          <el-option
+            v-for="item in deviceAlertLogDict"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+      </el-form-item>
+      <!--      <el-form-item label="设备名称" prop="deviceName">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.deviceName"-->
+      <!--          clearable-->
+      <!--          placeholder="请输入设备名称"-->
+      <!--          @keyup.enter="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="${comment}" prop="triggerId">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.triggerId"-->
+      <!--          clearable-->
+      <!--          placeholder="请输入${comment}"-->
+      <!--          @keyup.enter="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="告警级别" prop="alertLevel">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.alertLevel"-->
+      <!--          clearable-->
+      <!--          placeholder="请输入告警级别"-->
+      <!--          @keyup.enter="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="告警名称" prop="alertName">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.alertName"-->
+      <!--          clearable-->
+      <!--          placeholder="请输入告警名称"-->
+      <!--          @keyup.enter="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="发生时间" prop="happenTime">-->
+      <!--        <el-date-picker v-model="queryParams.happenTime"-->
+      <!--                        clearable-->
+      <!--                        placeholder="请选择发生时间"-->
+      <!--                        type="date"-->
+      <!--                        value-format="YYYY-MM-DD">-->
+      <!--        </el-date-picker>-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="处理时间" prop="handleTime">-->
+      <!--        <el-date-picker v-model="queryParams.handleTime"-->
+      <!--                        clearable-->
+      <!--                        placeholder="请选择处理时间"-->
+      <!--                        type="date"-->
+      <!--                        value-format="YYYY-MM-DD">-->
+      <!--        </el-date-picker>-->
+      <!--      </el-form-item>-->
+      <el-form-item>
+        <el-button icon="Search" type="primary" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <!--      <el-col :span="1.5">-->
+      <!--        <el-button-->
+      <!--          v-hasPermi="['alert:log:add']"-->
+      <!--          icon="Plus"-->
+      <!--          plain-->
+      <!--          type="primary"-->
+      <!--          @click="handleAdd"-->
+      <!--        >新增-->
+      <!--        </el-button>-->
+      <!--      </el-col>-->
+      <!--      <el-col :span="1.5">-->
+      <!--        <el-button-->
+      <!--          v-hasPermi="['alert:log:edit']"-->
+      <!--          :disabled="single"-->
+      <!--          icon="Edit"-->
+      <!--          plain-->
+      <!--          type="success"-->
+      <!--          @click="handleUpdate"-->
+      <!--        >修改-->
+      <!--        </el-button>-->
+      <!--      </el-col>-->
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['alert:log:remove']"
+          :disabled="multiple"
+          icon="Delete"
+          plain
+          type="danger"
+          @click="handleDelete"
+          >删除
+        </el-button>
+      </el-col>
+      <!--      <el-col :span="1.5">-->
+      <!--        <el-button-->
+      <!--          v-hasPermi="['alert:log:export']"-->
+      <!--          icon="Download"-->
+      <!--          plain-->
+      <!--          type="warning"-->
+      <!--          @click="handleExport"-->
+      <!--        >导出-->
+      <!--        </el-button>-->
+      <!--      </el-col>-->
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="logList"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column align="center" type="selection" width="55" />
+      <!--      <el-table-column align="center" label="${comment}" prop="alertId" />-->
+      <el-table-column align="center" label="产品Sn" prop="productSn" />
+      <el-table-column align="center" label="产品名称" prop="productName" />
+      <el-table-column align="center" label="设备Sn" prop="deviceSn" />
+      <el-table-column align="center" label="设备名称" prop="deviceName" />
+      <el-table-column align="center" label="告警级别" prop="alertLevel">
+        <template #default="{ row }">
+          <dict-tag
+            :options="iot_alert_level"
+            :value="row.alertLevel"
+            size="small"
+          />
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="异常内容" prop="alertContent" />
+      <el-table-column align="center" label="告警名称" prop="alertName" />
+      <el-table-column
+        align="center"
+        label="发生时间"
+        prop="happenTime"
+        width="180"
+      >
+        <template #default="{ row }">
+          <span>{{ row.happenTime }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="状态" prop="status">
+        <template #default="{ row }">
+          <dict-tag
+            :options="deviceAlertLogDict"
+            :value="[row.status]"
+            effect="dark"
+            size="small"
+          />
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="处理意见" prop="remark" />
+      <el-table-column
+        align="center"
+        label="处理时间"
+        prop="handleTime"
+        width="180"
+      >
+        <template #default="{ row }">
+          <span>{{ row.handleTime }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        align="center"
+        class-name="small-padding fixed-width"
+        label="操作"
+        width="180"
+      >
+        <template #default="{ row }">
+          <el-button
+            v-hasPermi="['alert:log:edit']"
+            icon="Edit"
+            link
+            type="primary"
+            @click="handleUpdate(row)"
+          >
+            处理
+          </el-button>
+          <el-button
+            v-hasPermi="['alert:log:remove']"
+            icon="Delete"
+            link
+            type="primary"
+            @click="handleDelete(row)"
+            >删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      v-model:limit="queryParams.pageSize"
+      v-model:page="queryParams.pageNum"
+      :total="total"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改设备告警日志对话框 -->
+    <el-dialog v-model="open" :title="title" append-to-body width="500px">
+      <el-form
+        ref="logRef"
+        :model="form"
+        :rules="rules"
+        label-position="left"
+        label-width="120px"
+      >
+        <el-form-item label="处理结果" prop="status">
+          <el-select v-model="form.status">
+            <el-option label="成功" value="1" />
+            <el-option label="失败" value="2" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="处理意见" prop="remark">
+          <el-input
+            v-model="form.remark"
+            placeholder="请输入内容"
+            type="textarea"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script name="Log" setup>
+import { addLog, delLog, getLog, listLog, updateLog } from "@/api/alert/log";
+import DictTag from "@/components/DictTag/index.vue";
+import { deviceAlertLogDict } from "@/constant/dict";
+import { useDict } from "@/utils/dict";
+import { getCurrentInstance, reactive, ref, toRefs } from "vue";
+
+const { proxy } = getCurrentInstance();
+
+const logList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const { iot_alert_level } = useDict("iot_alert_level");
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    productSn: null,
+    productName: null,
+    deviceSn: null,
+    deviceName: null,
+    triggerId: null,
+    alertLevel: null,
+    alertContent: null,
+    alertName: null,
+    happenTime: null,
+    status: null,
+    handleTime: null,
+  },
+  rules: {
+    remark: [{ required: true, message: "请输入处理意见", trigger: "blur" }],
+    status: [{ required: true, message: "请选择处理结果", trigger: "change" }],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询设备告警日志列表 */
+function getList() {
+  loading.value = true;
+  listLog(queryParams.value).then((response) => {
+    logList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    alertId: null,
+    productSn: null,
+    productName: null,
+    deviceSn: null,
+    deviceName: null,
+    triggerId: null,
+    alertLevel: null,
+    alertContent: null,
+    alertName: null,
+    happenTime: null,
+    status: null,
+    remark: null,
+    handleTime: null,
+  };
+  proxy.resetForm("logRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.alertId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加设备告警日志";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _alertId = row.alertId || ids.value;
+
+  getLog(_alertId).then((response) => {
+    form.value = response.data;
+    if (form.value.status === "0") {
+      form.value.status = null;
+    }
+    open.value = true;
+    title.value = "修改设备告警日志";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["logRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.alertId != null) {
+        updateLog(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addLog(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _alertIds = row.alertId || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除设备告警日志编号为"' + _alertIds + '"的数据项？')
+    .then(function () {
+      return delLog(_alertIds);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "alert/log/export",
+    {
+      ...queryParams.value,
+    },
+    `log_${new Date().getTime()}.xlsx`
+  );
+}
+
+getList();
+</script>
diff --git a/src/views/device/group/index.vue b/src/views/device/group/index.vue
index e2caaac..cd32b10 100644
--- a/src/views/device/group/index.vue
+++ b/src/views/device/group/index.vue
@@ -92,6 +92,7 @@
     <el-table
       v-loading="loading"
       :data="groupList"
+      class="custom-table-style"
       @selection-change="handleSelectionChange"
     >
       <el-table-column align="center" type="selection" width="55" />
diff --git a/src/views/iforgot.vue b/src/views/iforgot.vue
index 7ba30eb..ff691a9 100644
--- a/src/views/iforgot.vue
+++ b/src/views/iforgot.vue
@@ -18,15 +18,15 @@
         style="width: 50%; margin-top: 20px"
         type="primary"
         @click="activeIndex = 1"
-        >下一步</el-button
-      >
+        >下一步
+      </el-button>
     </div>
     <div v-else-if="activeIndex === 1">验证身份</div>
     <div v-else-if="activeIndex === 2">第三部</div>
   </div>
 </template>
 
-<script setup>
+<script lang="ts" setup>
 import { ref } from "vue";
 
 const activeIndex = ref(0);
diff --git a/src/views/iot/device/detail-panes/DeviceLog.vue b/src/views/iot/device/detail-panes/DeviceLog.vue
index fa6d8c8..4677387 100644
--- a/src/views/iot/device/detail-panes/DeviceLog.vue
+++ b/src/views/iot/device/detail-panes/DeviceLog.vue
@@ -1,7 +1,246 @@
 <template>
-  <div class="app-container"></div>
+  <div class="app-container">
+    <div class="toolbar">
+      <div class="left">
+        <el-radio-group
+          v-model="modelType"
+          :style="{
+            marginBottom: '8px',
+          }"
+          class="ios-style-radio"
+          size="small"
+        >
+          <el-radio-button :label="1">属性</el-radio-button>
+          <el-radio-button :label="3">事件</el-radio-button>
+          <el-radio-button :label="4">设备上下线</el-radio-button>
+          <!--          <el-radio-button :label="5">设备下线</el-radio-button>-->
+        </el-radio-group>
+      </div>
+      <div class="right">
+        <el-date-picker
+          v-model="queryParams.startTime"
+          :disabled-date="isAfterThanEndTime"
+          placeholder="开始时间"
+          size="small"
+          type="datetime"
+          value-format="YYYY-MM-DD HH:mm:ss"
+          @change="getList"
+        ></el-date-picker>
+        <el-icon>
+          <SemiSelect />
+        </el-icon>
+        <el-date-picker
+          v-model="queryParams.endTime"
+          :disabled-date="isBeforeThanStartTime"
+          placeholder="结束时间"
+          size="small"
+          type="datetime"
+          value-format="YYYY-MM-DD HH:mm:ss"
+          @change="getList"
+        ></el-date-picker>
+        <div class="sort-control">
+          <el-icon
+            :style="`color: ${queryParams.sort === 1 ? '#409eff' : ''}`"
+            @click="
+              queryParams.sort = 1;
+              getList();
+            "
+          >
+            <CaretTop />
+          </el-icon>
+          <el-icon
+            :style="`color: ${queryParams.sort === 2 ? '#409eff' : ''}`"
+            @click="
+              queryParams.sort = 2;
+              getList();
+            "
+          >
+            <CaretBottom />
+          </el-icon>
+        </div>
+        <!--        <el-tooltip class="item" content="刷新" effect="dark" placement="top">-->
+        <!--          <el-button circle icon="Refresh" size="small" @click="resetQuery" />-->
+        <!--        </el-tooltip>-->
+      </div>
+    </div>
+
+    <el-table :data="dataList" class="custom-table-style">
+      <el-table-column v-if="modelType !== 4" align="center" label="物模型名称">
+        <template #default="{ row }"
+          >{{
+            modelList.find((el) => el.identifier === row.identifier)
+              ?.modelName ?? "-"
+          }}
+        </template>
+      </el-table-column>
+      <el-table-column v-if="modelType === 4" align="center" label="上下线状态">
+        <template #default="{ row }">
+          <dict-tag
+            :options="deviceOnlineStatusDict"
+            :value="[row.type]"
+            effect="dark"
+            size="small"
+          />
+        </template>
+      </el-table-column>
+      <el-table-column
+        v-if="modelType !== 4"
+        align="center"
+        label="标识"
+        prop="identifier"
+      >
+        <template #default="{ row }">{{ row.identifier ?? "-" }} </template>
+      </el-table-column>
+      <el-table-column
+        v-if="modelType !== 4"
+        align="center"
+        label="值"
+        prop="value"
+      >
+        <template #default="{ row }">{{ row.value ?? "-" }} </template>
+      </el-table-column>
+      <el-table-column align="center" label="更新时间" prop="createTime">
+        <template #default="{ row }">{{ row.createTime ?? "-" }} </template>
+      </el-table-column>
+    </el-table>
+    <!--    <el-timeline v-if="modelType===4" style="margin-top: 20px">-->
+    <!--      <el-timeline-item v-for="(item,index) in dataList " :key="index"-->
+    <!--                        :color="item.type==='5'?'tomato':item.type==='4'?'springgreen':''"-->
+    <!--                        :timestamp="item.createTime">-->
+    <!--        设备{{ deviceOnlineStatusDict.find(el => el.value === item.type)?.label }}-->
+    <!--      </el-timeline-item>-->
+    <!--    </el-timeline>-->
+    <pagination
+      v-show="total > 0"
+      v-model:limit="queryParams.pageSize"
+      v-model:page="queryParams.pageNum"
+      :total="total"
+      small
+      @pagination="getList"
+    />
+  </div>
 </template>
 
-<script setup></script>
+<script setup>
+import { reactive, ref, toRefs, watch } from "vue";
+import { selectIdentifierHistory } from "@/api/iot/device";
+import { CaretBottom, CaretTop, SemiSelect } from "@element-plus/icons-vue";
+import DictTag from "@/components/DictTag/index.vue";
+import { deviceOnlineStatusDict } from "@/constant/dict";
 
-<style scoped></style>
+const props = defineProps({
+  deviceSn: {
+    type: String,
+    required: true,
+  },
+  modelList: {
+    type: Array,
+    required: true,
+  },
+});
+const { deviceSn } = toRefs(props);
+const modelType = ref(1);
+const dataList = ref([]);
+const loading = ref(false);
+const total = ref(0);
+const data = reactive({
+  queryParams: {
+    pageSize: 10,
+    pageNum: 1,
+    deviceSn: null,
+    type: 1,
+    startTime: null,
+    endTime: null,
+    sort: 2,
+  },
+});
+const { queryParams } = toRefs(data);
+
+const isAfterThanEndTime = (date) => {
+  const date_str = `${date.getFullYear()}-${
+    date.getMonth() + 1
+  }-${date.getDate()} 00:00:00`;
+  const _date = new Date(date_str).getTime();
+  return (
+    queryParams.value.endTime &&
+    _date >
+      new Date(queryParams.value.endTime.split(" ")[0] + " 00:00:00").getTime()
+  );
+};
+const isBeforeThanStartTime = (date) => {
+  const date_str = `${date.getFullYear()}-${
+    date.getMonth() + 1
+  }-${date.getDate()} 00:00:00`;
+  const _date = new Date(date_str).getTime();
+  return (
+    queryParams.value.startTime &&
+    _date <
+      new Date(
+        queryParams.value.startTime.split(" ")[0] + " 00:00:00"
+      ).getTime()
+  );
+};
+const getList = () => {
+  loading.value = true;
+  selectIdentifierHistory(queryParams.value)
+    .then((resp) => {
+      dataList.value = resp.data.list;
+      loading.value = false;
+      total.value = resp.data.total;
+    })
+    .catch(() => {
+      loading.value = false;
+    });
+};
+const resetQuery = () => {
+  queryParams.value.pageNum = 1;
+  getList();
+};
+watch(
+  deviceSn,
+  (val) => {
+    if (!val) return;
+    queryParams.value.deviceSn = val;
+    getList();
+  },
+  { immediate: true }
+);
+
+watch(modelType, (value) => {
+  queryParams.value.type = value;
+  getList();
+});
+</script>
+
+<style lang="scss" scoped>
+.toolbar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  .right {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    & > *:nth-child(2) {
+      margin: 0 6px;
+    }
+
+    .sort-control {
+      margin-left: 6px;
+      cursor: pointer;
+      transition: all 0.3s linear;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+
+      :hover {
+        background-color: #eeefef;
+        border-radius: 4px;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/iot/device/detail-panes/OperatingStatus.vue b/src/views/iot/device/detail-panes/OperatingStatus.vue
index 55e2043..0639458 100644
--- a/src/views/iot/device/detail-panes/OperatingStatus.vue
+++ b/src/views/iot/device/detail-panes/OperatingStatus.vue
@@ -1,17 +1,27 @@
 <template>
   <div class="app-container">
-    <el-radio-group
-      v-model="modelType"
-      :style="{
-        marginBottom: '8px',
-      }"
-      class="ios-style-radio"
-      size="small"
+    <el-row justify="space-between">
+      <el-radio-group
+        v-model="modelType"
+        :style="{
+          marginBottom: '8px',
+        }"
+        class="ios-style-radio"
+        size="small"
+      >
+        <el-radio-button :label="1">属性</el-radio-button>
+        <el-radio-button :label="3">事件</el-radio-button>
+        <el-radio-button :label="2">服务</el-radio-button>
+      </el-radio-group>
+      <!--      <el-tooltip class="item" content="刷新" effect="dark" placement="top">-->
+      <!--        <el-button circle icon="Refresh" @click="" />-->
+      <!--      </el-tooltip>-->
+    </el-row>
+    <el-table
+      v-loading="loading"
+      :data="modelList.filter((el) => el.type === modelType)"
+      class="custom-table-style"
     >
-      <el-radio-button :label="1">属性</el-radio-button>
-      <el-radio-button :label="3">事件</el-radio-button>
-    </el-radio-group>
-    <el-table :data="modelList.filter((el) => el.type === modelType)">
       <el-table-column
         align="center"
         label="物模型名称"
@@ -36,33 +46,294 @@
       <el-table-column align="center" label="操作">
         <template #default="{ row }">
           <el-button
+            v-if="modelType !== 2"
+            :disabled="!dataList.find((el) => el.identifier === row.identifier)"
             icon="list"
             link
             size="small"
             type="primary"
-            @click="handleShowHistory(row.identifier)"
+            @click="handleShowHistory(row)"
             >历史
           </el-button>
-          <el-button icon="plus" link size="small" type="primary"
-            >下发</el-button
-          >
+          <el-button
+            v-if="modelType === 1"
+            icon="plus"
+            link
+            size="small"
+            type="primary"
+            @click="handleSetDeviceAttr(row.identifier)"
+            >下发
+          </el-button>
+          <el-button
+            v-else-if="modelType === 2"
+            icon="plus"
+            link
+            size="small"
+            type="primary"
+            @click="handleSetDeviceInvoke(row.identifier)"
+            >调用
+          </el-button>
+          <el-button
+            v-if="modelType === 1"
+            link
+            size="small"
+            type="primary"
+            @click="openPropertyLog(row)"
+            >下发日志
+            <template #icon>
+              <svg-icon icon-class="log" />
+            </template>
+          </el-button>
+          <el-button
+            v-else-if="modelType === 2"
+            link
+            size="small"
+            type="primary"
+            @click="openInvokeLog(row)"
+            >调用日志
+            <template #icon>
+              <svg-icon icon-class="log" />
+            </template>
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
+    <!--历史记录-->
+    <el-dialog v-model="showHistoryDialog" :width="980" title="历史记录">
+      <div class="history-toolbar">
+        <div class="left">
+          <el-radio-group
+            v-if="
+              activeRow.datatype === 'integer' ||
+              activeRow.datatype === 'decimal'
+            "
+            v-model="historyType"
+            :style="{
+              marginBottom: '8px',
+            }"
+            class="ios-style-radio"
+            size="small"
+          >
+            <el-radio-button label="chart">图表</el-radio-button>
+            <el-radio-button label="list">列表</el-radio-button>
+          </el-radio-group>
+        </div>
+        <div class="right">
+          <!--TODO:  :disabled-date="isAfterThanEndTime"-->
+          <el-date-picker
+            v-model="historyQueryParams.startTime"
+            :disabled-date="isAfterThanEndTime"
+            placeholder="开始时间"
+            size="small"
+            type="datetime"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            @change="getHistoryList"
+          ></el-date-picker>
+          <el-icon>
+            <SemiSelect />
+          </el-icon>
+          <!--TODO:  :disabled-date="isBeforeThanStartTime"-->
+          <el-date-picker
+            v-model="historyQueryParams.endTime"
+            :disabled-date="isBeforeThanStartTime"
+            placeholder="结束时间"
+            size="small"
+            type="datetime"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            @change="getHistoryList"
+          ></el-date-picker>
+          <div class="sort-control">
+            <el-icon
+              :style="`color: ${
+                historyQueryParams.sort === 1 ? '#409eff' : ''
+              }`"
+              @click="
+                historyQueryParams.sort = 1;
+                getHistoryList();
+              "
+            >
+              <CaretTop />
+            </el-icon>
+            <el-icon
+              :style="`color: ${
+                historyQueryParams.sort === 2 ? '#409eff' : ''
+              }`"
+              @click="
+                historyQueryParams.sort = 2;
+                getHistoryList();
+              "
+            >
+              <CaretBottom />
+            </el-icon>
+          </div>
+        </div>
+      </div>
 
-    <el-dialog v-model="showHistoryDialog" :width="500" title="历史记录">
-      <el-table v-loading="historyLoading" :data="historyList">
-        <el-table-column align="center" label="值" prop="value" />
+      <Line
+        v-if="
+          historyType === 'chart' &&
+          (activeRow.datatype === 'integer' || activeRow.datatype === 'decimal')
+        "
+        id="history-bar-chart"
+        :data="{
+          labels: historyList.map((el) => el.createTime),
+          datasets: [
+            {
+              data: historyList.map((el) => parseFloat(el.value)),
+              backgroundColor: [
+                '#ff6384',
+                '#36a2eb',
+                '#cc65fe',
+                '#ffce56',
+                '#4bc0c0',
+              ],
+            },
+          ],
+        }"
+        :options="{
+          responsive: true,
+          plugins: {
+            legend: {
+              display: false,
+            },
+          },
+        }"
+      />
+      <el-table
+        v-else-if="historyType === 'list'"
+        v-loading="historyLoading"
+        :data="historyList"
+        class="custom-table-style"
+      >
+        <el-table-column align="center" label="值" prop="value">
+        </el-table-column>
         <el-table-column align="center" label="更新时间" prop="createTime" />
       </el-table>
       <pagination
         v-show="historyTotal > 0"
-        v-model:limit="queryParams.pageSize"
-        v-model:page="queryParams.pageNum"
+        v-model:limit="historyQueryParams.pageSize"
+        v-model:page="historyQueryParams.pageNum"
+        :pager-count="5"
         :total="historyTotal"
+        small
         @pagination="getHistoryList"
       />
     </el-dialog>
+
+    <!--  属性设置日志  -->
+    <el-dialog
+      v-model="showPropertyLog"
+      width="1020"
+      @open="getPropertyLogList"
+    >
+      <el-table
+        v-loading="propertyLoading"
+        :data="propertyList"
+        class="custom-table-style"
+      >
+        <el-table-column
+          align="center"
+          label="标识"
+          prop="setKey"
+          width="160"
+        />
+        <el-table-column align="center" label="值" prop="setValue" width="80" />
+        <el-table-column align="center" label="状态" width="80">
+          <template #default="{ row }">
+            <dict-tag
+              :options="setPropertyLogStatusDict"
+              :value="[row.status]"
+              effect="dark"
+              size="small"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="消息" prop="msg" width="300">
+          <template #default="{ row }">
+            {{ row.msg ?? "-" }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          align="center"
+          label="设置时间"
+          prop="setTime"
+          width="180"
+        />
+        <el-table-column
+          align="center"
+          label="回复时间"
+          prop="returnTime"
+          width="180"
+        >
+          <template #default="{ row }">
+            {{ row.returnTime ?? "-" }}
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="propertyLogTotal > 0"
+        v-model:limit="propertyLogQueryParams.pageSize"
+        v-model:page="propertyLogQueryParams.pageNum"
+        :total="propertyLogTotal"
+        small
+        @pagination="getPropertyLogList"
+      />
+    </el-dialog>
+    <!--  服务调用日志  -->
+    <el-dialog v-model="showInvokeLog" width="1020" @open="getInvokeLogList">
+      <el-table
+        v-loading="invokeLogLoading"
+        :data="invokeLogList"
+        class="custom-table-style"
+      >
+        <el-table-column
+          align="center"
+          label="标识"
+          prop="setKey"
+          width="160"
+        />
+        <el-table-column align="center" label="值" prop="setValue" width="80" />
+        <el-table-column align="center" label="状态" width="80">
+          <template #default="{ row }">
+            <dict-tag
+              :options="setFunctionLogStatusDict"
+              :value="[row.status]"
+              effect="dark"
+              size="small"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="消息" prop="msg" width="300">
+          <template #default="{ row }">
+            {{ row.msg ?? "-" }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          align="center"
+          label="设置时间"
+          prop="setTime"
+          width="180"
+        />
+        <el-table-column
+          align="center"
+          label="回复时间"
+          prop="returnTime"
+          width="180"
+        >
+          <template #default="{ row }">
+            {{ row.returnTime ?? "-" }}
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="invokeLogTotal > 0"
+        v-model:limit="invokeLogQueryParams.pageSize"
+        v-model:page="invokeLogQueryParams.pageNum"
+        :total="invokeLogTotal"
+        small
+        @pagination="getInvokeLogList"
+      />
+    </el-dialog>
   </div>
 </template>
 
@@ -71,52 +342,160 @@ import { reactive, ref, toRefs, watchEffect } from "vue";
 import {
   fetchOperatingStatus,
   selectIdentifierHistory,
+  setDeviceAttr,
+  setDeviceInvoke,
+  setFunctionLog,
+  setPropertyLog,
 } from "@/api/iot/device";
-import { listModel } from "@/api/thingsmodel/model";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { Line } from "vue-chartjs";
+import {
+  CategoryScale,
+  Chart as ChartJS,
+  Legend,
+  LinearScale,
+  LineElement,
+  PointElement,
+  Title,
+  Tooltip,
+} from "chart.js";
+import DictTag from "@/components/DictTag/index.vue";
+import {
+  setFunctionLogStatusDict,
+  setPropertyLogStatusDict,
+} from "@/constant/dict";
+import SvgIcon from "@/components/SvgIcon/index.vue";
+import { SemiSelect } from "@element-plus/icons-vue";
+
+ChartJS.register(
+  Title,
+  Tooltip,
+  PointElement,
+  Legend,
+  LineElement,
+  CategoryScale,
+  LinearScale
+);
 
 const props = defineProps({
   deviceSn: {
     type: String,
+    required: true,
   },
-  productId: {
-    type: Number,
+  productSn: {
+    type: String,
+    required: true,
+  },
+
+  modelList: {
+    type: Array,
+    required: true,
   },
 });
 
-const { deviceSn, productId } = toRefs(props);
+const { deviceSn, productSn, modelList } = toRefs(props);
 const modelType = ref(1);
+const historyType = ref("chart"); // chart || list
 const dataList = ref([]);
-const modelList = ref([]);
+// const modelList = ref([]);
 const showHistoryDialog = ref(false);
 const historyList = ref([]);
 const historyLoading = ref(false);
-const historyTotal = ref(0);
+const historyTotal = ref(0); /*历史记录总数*/
+const loading = ref(false);
+const activeRow = ref(); /*需要查看日志的行*/
+
+const showPropertyLog = ref(false); /*显示设备属性设置日志*/
+const propertyLoading = ref(false); /*设备属性设置日志列表是否正在加载*/
+const propertyList = ref([]); /*设备属性设置日志列表*/
+const propertyLogTotal = ref(0); /*设备属性设置日志总数*/
+
+const showInvokeLog = ref(false); /*是否显示调用日志*/
+const invokeLogLoading = ref(false); /*加载状态*/
+const invokeLogList = ref([]); /*服务调用日志列表*/
+const invokeLogTotal = ref(0);
+
 const data = reactive({
-  queryParams: {
+  historyQueryParams: {
     pageSize: 10,
     pageNum: 1,
     identifier: "",
     deviceSn: "",
+    sort: 2,
+  },
+  propertyLogQueryParams: {
+    pageSize: 10,
+    pageNum: 1,
+    // setPropertyLog: {
+    deviceSn: deviceSn.value,
+    productSn: productSn.value,
+    setKey: null,
+    // }
+  },
+  invokeLogQueryParams: {
+    pageSize: 10,
+    pageNum: 1,
+    // setFunctionLog: {
+    deviceSn: deviceSn.value,
+    productSn: productSn.value,
+    setKey: null,
+    // }
   },
 });
 
-const { queryParams } = toRefs(data);
+const { historyQueryParams, propertyLogQueryParams, invokeLogQueryParams } =
+  toRefs(data);
 
+/**
+ *
+ * @param date
+ */
+const isAfterThanEndTime = (date) => {
+  const date_str = `${date.getFullYear()}-${
+    date.getMonth() + 1
+  }-${date.getDate()} 00:00:00`;
+  const _date = new Date(date_str).getTime();
+  return (
+    historyQueryParams.value.endTime &&
+    _date >
+      new Date(
+        historyQueryParams.value.endTime.split(" ")[0] + " 00:00:00"
+      ).getTime()
+  );
+};
+const isBeforeThanStartTime = (date) => {
+  const date_str = `${date.getFullYear()}-${
+    date.getMonth() + 1
+  }-${date.getDate()} 00:00:00`;
+  const _date = new Date(date_str).getTime();
+  return (
+    historyQueryParams.value.startTime &&
+    _date <
+      new Date(
+        historyQueryParams.value.startTime.split(" ")[0] + " 00:00:00"
+      ).getTime()
+  );
+};
 const getHistoryList = () => {
   historyLoading.value = true;
-  selectIdentifierHistory(queryParams.value)
+  selectIdentifierHistory(historyQueryParams.value)
     .then((resp) => {
       historyList.value = resp.data.list;
       historyLoading.value = false;
+      historyTotal.value = resp.data.total;
     })
     .catch(() => {
       historyLoading.value = false;
     });
 };
-const handleShowHistory = (identifier) => {
+
+const handleShowHistory = (row) => {
+  activeRow.value = row;
   showHistoryDialog.value = true;
-  queryParams.value.identifier = identifier;
-  queryParams.value.deviceSn = deviceSn.value;
+  historyQueryParams.value.identifier = row.identifier;
+  historyQueryParams.value.deviceSn = deviceSn.value;
+  historyQueryParams.value.type = row.type;
+
   getHistoryList();
 };
 // 获取运行状态
@@ -131,18 +510,148 @@ watchEffect(() => {
   getOperatingStatus();
 });
 // 获取物模型列表
-const getThingsModel = () => {
-  if (productId.value) {
-    listModel({
-      productId: productId.value,
-    }).then((resp) => {
-      modelList.value = resp.rows?.filter((el) => el.type !== 2) ?? [];
+// const getThingsModel = () => {
+//   if (productId.value) {
+//     loading.value = true;
+//     listModel({
+//       productId: productId.value
+//     }).then((resp) => {
+//       modelList.value = resp.rows ?? [];
+//       loading.value = false;
+//     });
+//   }
+// };
+
+/**
+ *  设置单个设备属性
+ * @param identifier
+ */
+const handleSetDeviceAttr = (identifier) => {
+  ElMessageBox.prompt("请输入最新的值", "下发", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    inputPattern: /\S+/,
+  }).then(async ({ value }) => {
+    await setDeviceAttr({
+      deviceSn: deviceSn.value,
+      productSn: productSn.value,
+      version: "1.0",
+      method: "thing.property.set",
+      params: {
+        [identifier]: value,
+      },
     });
-  }
+    getOperatingStatus();
+    ElMessage.success("下发成功");
+  });
 };
+
+/**
+ * 调用单个设备服务
+ * @param identifier
+ */
+const handleSetDeviceInvoke = (identifier) => {
+  ElMessageBox.prompt("请输入最新的值", "下发", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    inputPattern: /\S+/,
+  }).then(async ({ value }) => {
+    await setDeviceInvoke({
+      deviceSn: deviceSn.value,
+      productSn: productSn.value,
+      version: "1.0",
+      method: "thing.property.set",
+      params: {
+        [identifier]: value,
+      },
+    });
+    getOperatingStatus();
+    ElMessage.success("下发成功");
+  });
+};
+
+/**
+ * 打开服务调用日志
+ * @param row
+ */
+const openInvokeLog = (row) => {
+  activeRow.value = row;
+  invokeLogQueryParams.value.setKey = row.identifier;
+  showInvokeLog.value = true;
+};
+
+/**
+ * 打开属性设置日志
+ * @param row
+ */
+const openPropertyLog = (row) => {
+  activeRow.value = row;
+  propertyLogQueryParams.value.setKey = row.identifier;
+  showPropertyLog.value = true;
+};
+
+/**
+ * 获取属性设置日志
+ * @return {Promise<void>}
+ */
+const getPropertyLogList = async () => {
+  propertyLoading.value = true;
+  const resp = await setPropertyLog(propertyLogQueryParams.value);
+  propertyList.value = resp.rows;
+  propertyLogTotal.value = resp.total;
+  propertyLoading.value = false;
+};
+
+/**
+ * 获取服务调用日志
+ * @return {Promise<void>}
+ */
+const getInvokeLogList = async () => {
+  invokeLogLoading.value = true;
+  const resp = await setFunctionLog(invokeLogQueryParams.value);
+  invokeLogList.value = resp.rows;
+  invokeLogTotal.value = resp.total;
+  invokeLogLoading.value = false;
+};
+
 watchEffect(() => {
-  getThingsModel();
+  // getThingsModel();
 });
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+:deep(.pagination-container) {
+  position: relative;
+}
+
+.history-toolbar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+
+  .right {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    & > *:nth-child(2) {
+      margin: 0 6px;
+    }
+
+    .sort-control {
+      margin-left: 6px;
+      cursor: pointer;
+      transition: all 0.3s linear;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+
+      :hover {
+        background-color: #eeefef;
+        border-radius: 4px;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/iot/device/detail-panes/UpgradeLog.vue b/src/views/iot/device/detail-panes/UpgradeLog.vue
index fa6d8c8..92c00fd 100644
--- a/src/views/iot/device/detail-panes/UpgradeLog.vue
+++ b/src/views/iot/device/detail-panes/UpgradeLog.vue
@@ -1,7 +1,19 @@
 <template>
-  <div class="app-container"></div>
+  <div class="app-container">
+    <el-table :data="dataList" class="custom-table-style">
+      <el-table-column></el-table-column>
+    </el-table>
+  </div>
 </template>
 
-<script setup></script>
+<script setup>
+import { ref } from "vue";
+
+const dataList = ref([]);
+const value2 = ref("");
+const getList = async () => {};
+
+getList();
+</script>
 
 <style scoped></style>
diff --git a/src/views/iot/device/detail.vue b/src/views/iot/device/detail.vue
index 59cf89c..d41bfc9 100644
--- a/src/views/iot/device/detail.vue
+++ b/src/views/iot/device/detail.vue
@@ -11,6 +11,22 @@
               label-position="left"
               label-width="140px"
             >
+              <el-form-item label="设备编号" prop="serialNumber">
+                <el-input
+                  v-model="form.serialNumber"
+                  :disabled="!!route.query.id"
+                  placeholder="请输入设备编号"
+                >
+                  <template #append>
+                    <el-button
+                      :disabled="!!route.query.id"
+                      @click="form.serialNumber = generateRandomString(11)"
+                    >
+                      自动生成
+                    </el-button>
+                  </template>
+                </el-input>
+              </el-form-item>
               <el-form-item label="设备名称" prop="deviceName">
                 <el-input
                   v-model="form.deviceName"
@@ -36,53 +52,31 @@
                   />
                 </el-select>
               </el-form-item>
-              <el-form-item label="设备编号" prop="serialNumber">
-                <el-input
-                  v-model="form.serialNumber"
-                  placeholder="请输入设备编号"
-                />
-              </el-form-item>
-              <el-form-item label="固件版本" prop="firmwareVersion">
-                <el-input
-                  v-model="form.firmwareVersion"
-                  placeholder="请输入固件版本"
-                />
-              </el-form-item>
-              <el-form-item label="激活时间" prop="activeTime">
-                <el-date-picker
-                  v-model="form.activeTime"
-                  clearable
-                  placeholder="请选择激活时间"
-                  type="datetime"
-                  value-format="YYYY-MM-DD HH:mm:ss"
-                >
-                </el-date-picker>
-              </el-form-item>
-              <el-form-item label="启用设备影子" prop="isShadow">
-                <el-switch
-                  v-model="form.isShadow"
-                  :active-value="1"
-                  :inactive-value="0"
-                />
-              </el-form-item>
-              <el-form-item label="定位方式" prop="locationWay">
-                <el-select
-                  v-model="form.locationWay"
-                  placeholder="请输入定位方式"
-                >
-                  <el-option :value="1" label="ip自动定位" />
-                  <el-option :value="2" label="设备定位" />
-                  <el-option :value="3" label="自定义" />
-                </el-select>
-              </el-form-item>
-              <el-form-item label="设备所在地址" prop="networkAddress">
-                <el-input
-                  v-model="form.networkAddress"
-                  placeholder="请输入设备所在地址"
-                />
-              </el-form-item>
               <el-row :gutter="20">
-                <el-col :span="10">
+                <el-col :span="12">
+                  <el-form-item label="MQTT账号" prop="mqttAccount">
+                    <el-input v-model="form.mqttAccount" disabled></el-input>
+                  </el-form-item>
+                </el-col>
+                <el-col :span="12">
+                  <el-form-item label="MQTT密码" prop="mqttPassword">
+                    <el-input v-model="form.mqttPassword" disabled></el-input>
+                  </el-form-item>
+                </el-col>
+              </el-row>
+              <!--              <el-form-item label="定位方式" prop="locationWay">-->
+              <!--                <el-select-->
+              <!--                  v-model="form.locationWay"-->
+              <!--                  placeholder="请输入定位方式"-->
+              <!--                >-->
+              <!--                  <el-option :value="1" label="ip自动定位" />-->
+              <!--                  <el-option :value="2" label="设备定位" />-->
+              <!--                  <el-option :value="3" label="自定义" />-->
+              <!--                </el-select>-->
+              <!--              </el-form-item>-->
+
+              <el-row :gutter="20">
+                <el-col :span="12">
                   <el-form-item label="设备经度" prop="longitude">
                     <el-input
                       v-model="form.longitude"
@@ -90,7 +84,7 @@
                     />
                   </el-form-item>
                 </el-col>
-                <el-col :span="10">
+                <el-col :span="12">
                   <el-form-item label="设备纬度" prop="latitude">
                     <el-input
                       v-model="form.latitude"
@@ -99,7 +93,13 @@
                   </el-form-item>
                 </el-col>
               </el-row>
-              <el-form-item>
+              <el-form-item label="设备所在地址" prop="networkAddress">
+                <el-input
+                  v-model="form.networkAddress"
+                  placeholder="请输入设备所在地址"
+                />
+              </el-form-item>
+              <el-form-item label="地图选点">
                 <map-select
                   :lat="form.latitude"
                   :lng="form.longitude"
@@ -107,43 +107,42 @@
                   @selected="handleMapSelected"
                 />
               </el-form-item>
-              <el-row :gutter="20">
-                <el-col :span="12">
-                  <el-form-item label="设备入网IP" prop="networkIp">
-                    <el-input
-                      v-model="form.networkIp"
-                      placeholder="请输入设备入网IP"
-                    />
-                  </el-form-item>
-                </el-col>
-              </el-row>
-              <el-form-item label="图片地址" prop="imgUrl">
-                <image-upload v-model="form.imgUrl" />
+              <el-form-item label="设备影子" prop="isShadow">
+                <el-switch
+                  v-model="form.isShadow"
+                  :active-value="1"
+                  :inactive-value="0"
+                />
               </el-form-item>
-              <el-form-item label="备注" prop="remark">
-                <el-input
-                  v-model="form.remark"
-                  placeholder="请输入内容"
-                  type="textarea"
+              <el-form-item label="启用状态" prop="status">
+                <el-switch
+                  v-model="form.status"
+                  :active-value="1"
+                  :inactive-value="2"
                 />
               </el-form-item>
             </el-form>
-          </el-col>
-          <el-col :span="6">
-            <el-button color="#010ef2" round type="primary" @click="submitForm"
-              >编辑</el-button
-            >
+            <el-row justify="center">
+              <el-button
+                color="#010ef2"
+                round
+                type="primary"
+                @click="submitForm"
+                >编辑
+              </el-button>
+            </el-row>
           </el-col>
         </el-row>
       </el-tab-pane>
       <el-tab-pane label="运行状态" lazy>
         <operating-status
           :device-sn="form.serialNumber"
-          :product-id="form.productId"
+          :model-list="modelList"
+          :product-sn="form.productSn"
         />
       </el-tab-pane>
       <el-tab-pane label="设备日志" lazy>
-        <device-log />
+        <device-log :device-sn="form.serialNumber" :model-list="modelList" />
       </el-tab-pane>
       <el-tab-pane label="升级日志" lazy>
         <upgrade-log />
@@ -153,7 +152,6 @@
 </template>
 
 <script setup>
-import ImageUpload from "@/components/ImageUpload/index.vue";
 import { onMounted, reactive, ref, toRefs } from "vue";
 import { listProduct } from "@/api/product/product";
 import OperatingStatus from "@/views/iot/device/detail-panes/OperatingStatus.vue";
@@ -163,6 +161,8 @@ import { ElMessage } from "element-plus";
 import DeviceLog from "@/views/iot/device/detail-panes/DeviceLog.vue";
 import UpgradeLog from "@/views/iot/device/detail-panes/UpgradeLog.vue";
 import MapSelect from "@/components/MapSelect/index.vue";
+import { generateRandomString } from "@/utils";
+import { listModel } from "@/api/thingsmodel/model";
 
 const route = useRoute();
 
@@ -174,6 +174,9 @@ const data = reactive({
     deviceName: [
       { required: true, message: "设备名称不能为空", trigger: "blur" },
     ],
+    serialNumber: [
+      { required: true, message: "设备编号不能为空", trigger: "blur" },
+    ],
     productId: [{ required: true, message: "产品ID不能为空", trigger: "blur" }],
   },
 });
@@ -239,19 +242,31 @@ function getProductOptions(keyword) {
 }
 
 /*获取设备详情*/
-function getDeviceDetail() {
-  getDevice(route.query.id).then((resp) => {
-    form.value = resp.data;
-  });
+async function getDeviceDetail() {
+  const resp = await getDevice(route.query.id);
+  form.value = resp.data;
 }
 
-const handleMapSelected = (lnglat) => {
+const handleMapSelected = ({ lnglat, address }) => {
   form.value.latitude = lnglat.lat;
   form.value.longitude = lnglat.lng;
+  if (address) form.value.networkAddress = address;
+};
+
+const modelList = ref([]);
+const getThingsModel = () => {
+  if (form.value.productId) {
+    listModel({
+      productId: form.value.productId,
+    }).then((resp) => {
+      modelList.value = resp.rows ?? [];
+    });
+  }
 };
 
 onMounted(async () => {
-  getDeviceDetail();
+  await getDeviceDetail();
+  getThingsModel();
   // AMap.value = await loadMap(["AMap.PlaceSearch"]);
   // map.value = new AMap.value.Map("map-container", { zoom: 11 });
   // map.value.on("click", handleMapClick);
@@ -264,8 +279,8 @@ onMounted(async () => {
   //   map.value.setFitView([marker]);
   // }
 });
-reset();
 
+reset();
 getProductOptions();
 </script>
 
diff --git a/src/views/iot/device/index.vue b/src/views/iot/device/index.vue
index 0fa0f45..9a370b0 100644
--- a/src/views/iot/device/index.vue
+++ b/src/views/iot/device/index.vue
@@ -189,17 +189,17 @@
           >删除
         </el-button>
       </el-col>
-      <el-col :span="1.5">
-        <el-button
-          v-hasPermi="['iot:device:export']"
-          :size="productId ? 'small' : 'default'"
-          icon="Download"
-          plain
-          type="warning"
-          @click="handleExport"
-          >导出
-        </el-button>
-      </el-col>
+      <!--      <el-col :span="1.5">-->
+      <!--        <el-button-->
+      <!--          v-hasPermi="['iot:device:export']"-->
+      <!--          :size="productId ? 'small' : 'default'"-->
+      <!--          icon="Download"-->
+      <!--          plain-->
+      <!--          type="warning"-->
+      <!--          @click="handleExport"-->
+      <!--          >导出-->
+      <!--        </el-button>-->
+      <!--      </el-col>-->
       <right-toolbar
         v-model:showSearch="showSearch"
         @queryTable="getList"
@@ -209,6 +209,7 @@
     <el-table
       v-loading="loading"
       :data="deviceList"
+      class="custom-table-style"
       @selection-change="handleSelectionChange"
     >
       <el-table-column align="center" type="selection" width="55" />
@@ -218,7 +219,7 @@
       <el-table-column align="center" label="产品" prop="productName" />
       <!--      <el-table-column align="center" label="用户" prop="userName" />-->
       <!--      <el-table-column align="center" label="租户" prop="tenantName" />-->
-      <el-table-column align="center" label="固件版本" prop="firmwareVersion" />
+      <!--      <el-table-column align="center" label="固件版本" prop="firmwareVersion" />-->
       <el-table-column align="center" label="设备状态" prop="status">
         <template #default="{ row }">
           <dict-tag
@@ -239,26 +240,36 @@
           />
         </template>
       </el-table-column>
-      <el-table-column align="center" label="定位方式" prop="locationWay">
-        <template #default="{ row }">
-          {{ locationWayMap.find((el) => el.value === row.locationWay)?.label }}
-        </template>
-      </el-table-column>
+      <!--      <el-table-column align="center" label="定位方式" prop="locationWay">-->
+      <!--        <template #default="{ row }">-->
+      <!--          {{ locationWayMap.find((el) => el.value === row.locationWay)?.label }}-->
+      <!--        </template>-->
+      <!--      </el-table-column>-->
+      <el-table-column
+        align="center"
+        label="MQTT账号"
+        prop="mqttAccount"
+      ></el-table-column>
+      <el-table-column
+        align="center"
+        label="MQTT密码"
+        prop="mqttPassword"
+      ></el-table-column>
       <!--      <el-table-column align="center" label="物模型值" prop="thingsModelValue" />-->
       <!--      <el-table-column align="center" label="设备所在地址" prop="networkAddress" />-->
       <!--      <el-table-column align="center" label="设备入网IP" prop="networkIp" />-->
       <!--      <el-table-column align="center" label="设备经度" prop="longitude" />-->
       <!--      <el-table-column align="center" label="设备纬度" prop="latitude" />-->
-      <el-table-column
-        align="center"
-        label="激活时间"
-        prop="activeTime"
-        width="180"
-      >
-        <template #default="scope">
-          <span>{{ parseTime(scope.row.activeTime, "{y}-{m}-{d}") }}</span>
-        </template>
-      </el-table-column>
+      <!--      <el-table-column-->
+      <!--        align="center"-->
+      <!--        label="激活时间"-->
+      <!--        prop="activeTime"-->
+      <!--        width="180"-->
+      <!--      >-->
+      <!--        <template #default="scope">-->
+      <!--          <span>{{ parseTime(scope.row.activeTime, "{y}-{m}-{d}") }}</span>-->
+      <!--        </template>-->
+      <!--      </el-table-column>-->
       <!--      <el-table-column align="center" label="设备摘要" prop="summary" />-->
       <!--      <el-table-column align="center" label="图片地址" prop="imgUrl" />-->
       <el-table-column align="center" label="分组名称" prop="groupName">
@@ -291,7 +302,7 @@
             type="primary"
             @click="handleDetail(scope.row)"
           >
-            修改
+            详情
           </el-button>
           <el-button
             v-hasPermi="['iot:device:remove']"
@@ -322,132 +333,72 @@
         label-position="left"
         label-width="140px"
       >
+        <el-form-item label="设备编号" prop="serialNumber">
+          <el-input v-model="form.serialNumber" placeholder="请输入设备编号">
+            <template #append>
+              <el-button @click="geneDeivceSn">自动生成</el-button>
+            </template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="设备名称" prop="deviceName">
+          <el-input v-model="form.deviceName" placeholder="请输入设备名称" />
+        </el-form-item>
+        <el-form-item label="产品" prop="productId">
+          <el-select
+            v-model="form.productId"
+            :disabled="productId"
+            :remote-method="getProductOptions"
+            clearable
+            filterable
+            placeholder="请选择产品"
+            remote
+            remote-show-suffix
+          >
+            <el-option
+              v-for="item in productOptions"
+              :key="item.productId"
+              :label="item.productName"
+              :value="item.productId"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="定位方式" prop="locationWay">
+          <el-select v-model="form.locationWay" placeholder="请输入定位方式">
+            <el-option :value="1" label="ip自动定位" />
+            <el-option :value="2" label="设备定位" />
+            <el-option :value="3" label="自定义" />
+          </el-select>
+        </el-form-item>
         <el-row :gutter="20">
+          <el-col :span="12"></el-col>
           <el-col :span="12">
-            <el-form-item label="设备名称" prop="deviceName">
-              <el-input
-                v-model="form.deviceName"
-                placeholder="请输入设备名称"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="产品" prop="productId">
-              <!--              <el-input v-model="form.productId" placeholder="请输入产品ID" />-->
-              <el-select
-                v-model="form.productId"
-                :disabled="productId"
-                :remote-method="getProductOptions"
-                clearable
-                filterable
-                placeholder="请选择产品"
-                remote
-                remote-show-suffix
-              >
-                <el-option
-                  v-for="item in productOptions"
-                  :key="item.productId"
-                  :label="item.productName"
-                  :value="item.productId"
-                />
-              </el-select>
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <!--            <el-form-item label="用户ID" prop="userId">-->
-            <!--              &lt;!&ndash;              <el-input v-model="form.userId" placeholder="请输入用户ID" />&ndash;&gt;-->
-            <!--              <el-tag-->
-            <!--                v-if="form.userId"-->
-            <!--                closable-->
-            <!--                @close="form.userId = undefined"-->
-            <!--              >{{ form.userName }}-->
-            <!--              </el-tag>-->
-            <!--              <el-button-->
-            <!--                v-else-->
-            <!--                icon="pointer"-->
-            <!--                size="small"-->
-            <!--                type="primary"-->
-            <!--                @click="userOpen=true"-->
-            <!--              >选择-->
-            <!--              </el-button>-->
-            <!--            </el-form-item>-->
-          </el-col>
-          <el-col :span="12">
-            <!--            <el-form-item label="租户ID" prop="tenantId">-->
-            <!--              <el-input v-model="form.tenantId" placeholder="请输入租户ID" />-->
+            <!--            <el-form-item label="固件版本" prop="firmwareVersion">-->
+            <!--              <el-input-->
+            <!--                v-model="form.firmwareVersion"-->
+            <!--                placeholder="请输入固件版本"-->
+            <!--              />-->
             <!--            </el-form-item>-->
           </el-col>
         </el-row>
-
         <el-row :gutter="20">
           <el-col :span="12">
-            <el-form-item label="设备编号" prop="serialNumber">
-              <el-input
-                v-model="form.serialNumber"
-                placeholder="请输入设备编号"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="固件版本" prop="firmwareVersion">
-              <el-input
-                v-model="form.firmwareVersion"
-                placeholder="请输入固件版本"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="激活时间" prop="activeTime">
-              <el-date-picker
-                v-model="form.activeTime"
-                clearable
-                placeholder="请选择激活时间"
-                type="datetime"
-                value-format="YYYY-MM-DD HH:mm:ss"
-              >
-              </el-date-picker>
-            </el-form-item>
+            <!--            <el-form-item label="激活时间" prop="activeTime">-->
+            <!--              <el-date-picker-->
+            <!--                v-model="form.activeTime"-->
+            <!--                clearable-->
+            <!--                placeholder="请选择激活时间"-->
+            <!--                type="datetime"-->
+            <!--                value-format="YYYY-MM-DD HH:mm:ss"-->
+            <!--              >-->
+            <!--              </el-date-picker>-->
+            <!--            </el-form-item>-->
           </el-col>
           <!--          <el-col :span="12">-->
           <!--            <el-form-item label="信号强度" prop="rssi">-->
           <!--              <el-input v-model="form.rssi" placeholder="请输入信号强度" />-->
           <!--            </el-form-item>-->
           <!--          </el-col>-->
-          <el-col :span="12">
-            <el-form-item label="是否启用设备影子" prop="isShadow">
-              <el-switch
-                v-model="form.isShadow"
-                :active-value="1"
-                :inactive-value="0"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="定位方式" prop="locationWay">
-              <el-select
-                v-model="form.locationWay"
-                placeholder="请输入定位方式"
-              >
-                <el-option :value="1" label="ip自动定位" />
-                <el-option :value="2" label="设备定位" />
-                <el-option :value="3" label="自定义" />
-              </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="设备所在地址" prop="networkAddress">
-              <el-input
-                v-model="form.networkAddress"
-                placeholder="请输入设备所在地址"
-              />
-            </el-form-item>
-          </el-col>
+          <el-col :span="12"></el-col>
         </el-row>
         <el-row :gutter="20">
           <el-col :span="12">
@@ -461,7 +412,13 @@
             </el-form-item>
           </el-col>
         </el-row>
-        <el-form-item>
+        <el-form-item label="设备所在地址" prop="networkAddress">
+          <el-input
+            v-model="form.networkAddress"
+            placeholder="请输入设备所在地址"
+          />
+        </el-form-item>
+        <el-form-item label="地图选点">
           <map-select
             :lat="form.latitude"
             :lng="form.longitude"
@@ -471,28 +428,41 @@
         </el-form-item>
         <!--        <div id="map-container"-->
         <!--             style="width: calc(100% - 140px);height: 300px;margin-left: 140px;margin-bottom: 18px"></div>-->
-        <el-row :gutter="20">
-          <el-col :span="12">
-            <el-form-item label="设备入网IP" prop="networkIp">
-              <el-input
-                v-model="form.networkIp"
-                placeholder="请输入设备入网IP"
-              />
-            </el-form-item>
-          </el-col>
-        </el-row>
-
-        <el-form-item label="图片地址" prop="imgUrl">
-          <!--          <el-input v-model="form.imgUrl" placeholder="请输入图片地址" />-->
-          <image-upload v-model="form.imgUrl" />
-        </el-form-item>
-        <el-form-item label="备注" prop="remark">
-          <el-input
-            v-model="form.remark"
-            placeholder="请输入内容"
-            type="textarea"
+        <!--        <el-row :gutter="20">-->
+        <!--          <el-col :span="12">-->
+        <!--            <el-form-item label="设备入网IP" prop="networkIp">-->
+        <!--              <el-input-->
+        <!--                v-model="form.networkIp"-->
+        <!--                placeholder="请输入设备入网IP"-->
+        <!--              />-->
+        <!--            </el-form-item>-->
+        <!--          </el-col>-->
+        <!--        </el-row>-->
+        <el-form-item label="设备影子" prop="isShadow">
+          <el-switch
+            v-model="form.isShadow"
+            :active-value="1"
+            :inactive-value="0"
           />
         </el-form-item>
+        <el-form-item label="启用状态" prop="status">
+          <el-switch
+            v-model="form.status"
+            :active-value="1"
+            :inactive-value="2"
+          />
+        </el-form-item>
+        <!--        <el-form-item label="图片地址" prop="imgUrl">-->
+        <!--          &lt;!&ndash;          <el-input v-model="form.imgUrl" placeholder="请输入图片地址" />&ndash;&gt;-->
+        <!--          <image-upload v-model="form.imgUrl" />-->
+        <!--        </el-form-item>-->
+        <!--        <el-form-item label="备注" prop="remark">-->
+        <!--          <el-input-->
+        <!--            v-model="form.remark"-->
+        <!--            placeholder="请输入内容"-->
+        <!--            type="textarea"-->
+        <!--          />-->
+        <!--        </el-form-item>-->
       </el-form>
       <template #footer>
         <div class="dialog-footer">
@@ -517,9 +487,8 @@ import {
   listDevice,
   updateDevice,
 } from "@/api/iot/device";
-import ImageUpload from "@/components/ImageUpload/index.vue";
 import { listProduct } from "@/api/product/product";
-import { deviceStatusMap, isShadowDict, locationWayMap } from "@/constant/dict";
+import { deviceStatusMap, isShadowDict } from "@/constant/dict";
 import UserTreeSelect from "@/components/UserTreeSelect/index.vue";
 import {
   getCurrentInstance,
@@ -530,10 +499,10 @@ import {
   watchEffect,
 } from "vue";
 import DictTag from "@/components/DictTag/index.vue";
-import { parseTime } from "@/utils/ruoyi";
 import { useRouter } from "vue-router";
 import { loadMap } from "@/utils/amap";
 import MapSelect from "@/components/MapSelect/index.vue";
+import { generateRandomString } from "@/utils";
 
 const router = useRouter();
 const { proxy } = getCurrentInstance();
@@ -585,6 +554,9 @@ const data = reactive({
     deviceName: [
       { required: true, message: "设备名称不能为空", trigger: "blur" },
     ],
+    serialNumber: [
+      { required: true, message: "设备编号不能为空", trigger: "blur" },
+    ],
     productId: [{ required: true, message: "产品ID不能为空", trigger: "blur" }],
   },
 });
@@ -647,6 +619,10 @@ function handleQuery() {
   getList();
 }
 
+const geneDeivceSn = () => {
+  form.value.serialNumber = generateRandomString(11);
+};
+
 /** 重置按钮操作 */
 function resetQuery() {
   proxy.resetForm("queryRef");
@@ -700,6 +676,8 @@ function submitForm() {
           getList();
         });
       } else {
+        form.value.mqttAccount = form.value.serialNumber;
+        form.value.mqttPassword = generateRandomString(11);
         addDevice(form.value).then((response) => {
           proxy.$modal.msgSuccess("新增成功");
           open.value = false;
@@ -765,9 +743,10 @@ const handleMapClick = (event) => {
   map.value.add(marker);
 };
 
-const handleMapSelected = (lnglat) => {
+const handleMapSelected = ({ lnglat, address }) => {
   form.value.latitude = lnglat.lat;
   form.value.longitude = lnglat.lng;
+  if (address) form.value.networkAddress = address;
 };
 
 getProductOptions();
diff --git a/src/views/notification/config/index.vue b/src/views/notification/config/index.vue
new file mode 100644
index 0000000..c0ff69d
--- /dev/null
+++ b/src/views/notification/config/index.vue
@@ -0,0 +1,367 @@
+<template>
+  <div class="app-container">
+    <div class="form-wrap">
+      <el-form ref="formRef" :model="form" :rules="rules" label-width="120px">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <h4 style="text-align: center">短信配置</h4>
+            <el-form-item label="短信类型" prop="msgType">
+              <el-select v-model="form.msgType" placeholder="短信类型">
+                <el-option
+                  v-for="item in msgTypeDict"
+                  :key="item.value"
+                  :label="item.label"
+                  :value="item.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item :prop="field('region')" label="region">
+              <el-input v-model="form[field('region')]"></el-input>
+            </el-form-item>
+            <el-form-item :prop="field('templateCode')" label="模版">
+              <!--              <el-input v-model="form[field('templateCode')]"></el-input>-->
+              <el-select
+                v-model="form[field('templateCode')]"
+                :remote-method="getTemplateOptions"
+                clearable
+                filterable
+                placeholder="请选择模版"
+                remote
+                remote-show-suffix
+              >
+                <el-option
+                  v-for="item in templateOptions"
+                  :key="item.templateId"
+                  :label="item.templateName"
+                  :value="item.templateId.toString()"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item :prop="field('accessKey')" label="accessKey">
+              <el-input v-model="form[field('accessKey')]"></el-input>
+            </el-form-item>
+            <el-form-item :prop="field('secretKey')" label="secretKey">
+              <el-input v-model="form[field('secretKey')]"></el-input>
+            </el-form-item>
+            <el-form-item :prop="field('signName')" label="signName">
+              <el-input v-model="form[field('signName')]"></el-input>
+            </el-form-item>
+            <el-form-item
+              v-if="form.msgType === '2'"
+              label="appId"
+              prop="bappId"
+            >
+              <el-input v-model="form.bappId"></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <h4 style="text-align: center">邮件配置</h4>
+            <el-form-item label="SMTP服务器" prop="emailSmtpHost">
+              <el-input v-model="form.emailSmtpHost"></el-input>
+            </el-form-item>
+            <el-form-item label="用户名" prop="emailUsername">
+              <el-input v-model="form.emailUsername"></el-input>
+            </el-form-item>
+            <el-form-item label="授权码" prop="emailAuthCode">
+              <el-input v-model="form.emailAuthCode"></el-input>
+            </el-form-item>
+            <el-form-item label="发件人邮箱" prop="emailSend">
+              <el-input v-model="form.emailSend"></el-input>
+            </el-form-item>
+            <el-form-item label="使用SSL" prop="emailIsSsl">
+              <el-switch
+                v-model="form.emailIsSsl"
+                :active-value="true"
+                :inactive-value="false"
+              ></el-switch>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <div class="submit">
+          <div class="left">
+            <el-button round type="primary" @click="submitForm('sms')"
+              >保存</el-button
+            >
+          </div>
+          <div class="right">
+            <el-button round type="primary" @click="submitForm('email')"
+              >保存</el-button
+            >
+          </div>
+        </div>
+      </el-form>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { onMounted, reactive, ref, toRefs } from "vue";
+import { msgTypeDict } from "@/constant/dict";
+import { msgConfig, saveConfig } from "@/api/notice/config";
+import { ElMessage } from "element-plus";
+import { listTemplate } from "@/api/notice/template";
+
+const data = reactive({
+  form: {
+    emailSmtpHost: null,
+    emailUsername: null,
+    emailAuthCode: null,
+    emailSend: null,
+    emailIsSsl: 0,
+    msgType: "1",
+    bsecretKey: null,
+    baccessKey: null,
+    aregion: null,
+    aaccessKey: null,
+    btemplateCode: null,
+    atemplateCode: null,
+    asecretKey: null,
+    asignName: null,
+    bappId: null,
+    bsignName: null,
+    bregion: null,
+  },
+  rules: {
+    emailSmtpHost: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    emailUsername: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    emailAuthCode: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    emailSend: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    emailIsSsl: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "change",
+      },
+    ],
+    msgType: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "change",
+      },
+    ],
+    bsecretKey: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    baccessKey: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    aregion: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    aaccessKey: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    btemplateCode: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    atemplateCode: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    asecretKey: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    asignName: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    bappId: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    bsignName: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    bregion: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+  },
+});
+
+const { form, rules } = toRefs(data);
+const field = (field_str) =>
+  `${
+    msgTypeDict.find((el) => el.value === form.value.msgType)?.fieldPrefix
+  }${field_str}`;
+const formRef = ref(null);
+const templateOptions = ref([]);
+
+const getTemplateOptions = (keyword) => {
+  listTemplate({
+    templateName: keyword,
+    pageNum: 1,
+    pageSize: 20,
+  }).then((resp) => {
+    templateOptions.value = resp.rows;
+  });
+};
+const getNotificationDetail = async () => {
+  const resp = await msgConfig();
+  if (resp.data) {
+    form.value = resp.data;
+  }
+};
+
+const reset = () => {
+  form.value = {
+    emailSmtpHost: null,
+    emailUsername: null,
+    emailAuthCode: null,
+    emailSend: null,
+    emailIsSsl: 0,
+    msgType: "1",
+    bsecretKey: null,
+    baccessKey: null,
+    aregion: "cn-hangzhou",
+    aaccessKey: null,
+    btemplateCode: null,
+    atemplateCode: null,
+    asecretKey: null,
+    asignName: null,
+    bappId: null,
+    bsignName: null,
+    bregion: "ap-guangzhou",
+  };
+  if (formRef.value) {
+    formRef.value.resetFields();
+  }
+};
+
+const validTest = () => {
+  formRef.value.validateField(["bappId"], (valid) => {
+    console.log(valid);
+  });
+};
+/**
+ * 提交表单
+ * @param mode 短信/邮件
+ */
+const submitForm = (mode) => {
+  if (!formRef.value) return;
+  formRef.value.clearValidate();
+  const validateFields = [];
+  if (mode === "email") {
+    validateFields.push(
+      "emailSmtpHost",
+      "emailUsername",
+      "emailAuthCode",
+      "emailSend",
+      "emailIsSsl"
+    );
+  } else if (mode === "sms") {
+    validateFields.push(
+      "msgType",
+      "bsecretKey",
+      "baccessKey",
+      "aregion",
+      "aaccessKey",
+      "btemplateCode",
+      "atemplateCode",
+      "asecretKey",
+      "asignName",
+      "bappId",
+      "bsignName",
+      "bregion"
+    );
+  }
+  formRef.value.validateField(validateFields, async (valid) => {
+    if (valid) {
+      await saveConfig(form.value);
+      ElMessage.success("保存配置成功");
+      getNotificationDetail();
+    } else {
+      console.error("error");
+    }
+  });
+};
+onMounted(() => {
+  reset();
+  getNotificationDetail();
+  getTemplateOptions();
+});
+</script>
+
+<style lang="scss" scoped>
+.form-wrap {
+  width: 60%;
+  margin: 0 auto;
+}
+
+.submit {
+  display: flex;
+  margin-top: 20px;
+  justify-content: center;
+
+  & > div {
+    width: 50%;
+    display: flex;
+    justify-content: center;
+  }
+}
+</style>
diff --git a/src/views/notification/template/index.vue b/src/views/notification/template/index.vue
new file mode 100644
index 0000000..f3e823d
--- /dev/null
+++ b/src/views/notification/template/index.vue
@@ -0,0 +1,382 @@
+<template>
+  <div class="app-container">
+    <el-form
+      v-show="showSearch"
+      ref="queryRef"
+      :inline="true"
+      :model="queryParams"
+      label-width="68px"
+    >
+      <el-form-item label="模板名称" prop="templateName">
+        <el-input
+          v-model="queryParams.templateName"
+          clearable
+          placeholder="请输入模板名称"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!--      <el-form-item label="消息标题" prop="msgTitle">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.msgTitle"-->
+      <!--          clearable-->
+      <!--          placeholder="请输入消息标题"-->
+      <!--          @keyup.enter="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <el-form-item>
+        <el-button icon="Search" type="primary" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['notice:template:add']"
+          icon="Plus"
+          plain
+          type="primary"
+          @click="handleAdd"
+          >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['notice:template:edit']"
+          :disabled="single"
+          icon="Edit"
+          plain
+          type="success"
+          @click="handleUpdate"
+          >修改
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['notice:template:remove']"
+          :disabled="multiple"
+          icon="Delete"
+          plain
+          type="danger"
+          @click="handleDelete"
+          >删除
+        </el-button>
+      </el-col>
+      <!--      <el-col :span="1.5">-->
+      <!--        <el-button-->
+      <!--          v-hasPermi="['notice:template:export']"-->
+      <!--          icon="Download"-->
+      <!--          plain-->
+      <!--          type="warning"-->
+      <!--          @click="handleExport"-->
+      <!--        >导出-->
+      <!--        </el-button>-->
+      <!--      </el-col>-->
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="templateList"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column align="center" type="selection" width="55" />
+      <!--      <el-table-column align="center" label="id" prop="templateId" />-->
+      <el-table-column align="center" label="类型" prop="noticeType">
+        <template #default="{ row }">
+          {{ noticeTypeDict.find((el) => el.value === row.noticeType)?.label }}
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="模板名称" prop="templateName" />
+      <el-table-column align="center" label="消息标题" prop="msgTitle" />
+      <el-table-column align="center" label="消息内容" prop="msgContent" />
+      <el-table-column align="center" label="状态" prop="status">
+        <template #default="{ row }">
+          <dict-tag
+            :options="notificationTemplateState"
+            :value="[row.status]"
+          />
+        </template>
+      </el-table-column>
+      <!--      <el-table-column align="center" label="" prop="tenantId" />-->
+      <el-table-column
+        align="center"
+        class-name="small-padding fixed-width"
+        label="操作"
+      >
+        <template #default="{ row }">
+          <el-button
+            v-hasPermi="['notice:template:edit']"
+            icon="Edit"
+            link
+            type="primary"
+            @click="handleUpdate(row)"
+            >修改
+          </el-button>
+          <el-button
+            v-hasPermi="['notice:template:remove']"
+            icon="Delete"
+            link
+            type="primary"
+            @click="handleDelete(row)"
+            >删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      v-model:limit="queryParams.pageSize"
+      v-model:page="queryParams.pageNum"
+      :total="total"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改通知模板对话框 -->
+    <el-dialog v-model="open" :title="title" append-to-body width="500px">
+      <el-form
+        ref="templateRef"
+        :model="form"
+        :rules="rules"
+        label-width="80px"
+      >
+        <el-form-item label="模板名称" prop="templateName">
+          <el-input v-model="form.templateName" placeholder="请输入模板名称" />
+        </el-form-item>
+        <el-form-item label="通知类型" prop="noticeType">
+          <el-select v-model="form.noticeType" placeholder="请输入模板名称">
+            <el-option
+              v-for="item in noticeTypeDict"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="消息标题" prop="msgTitle">
+          <el-input v-model="form.msgTitle" placeholder="请输入消息标题" />
+        </el-form-item>
+        <el-form-item label="消息内容" prop="msgContent">
+          <el-input v-model="form.msgContent" type="textarea"></el-input>
+          <!--          <editor />-->
+          <!--          <editor v-model="form.msgContent" :min-height="192" />-->
+        </el-form-item>
+        <el-form-item label="启用状态" prop="status">
+          <el-switch
+            v-model="form.status"
+            active-value="1"
+            inactive-value="0"
+          />
+        </el-form-item>
+
+        <!--        <el-form-item label="" prop="tenantId">-->
+        <!--          <el-input v-model="form.tenantId" placeholder="请输入" />-->
+        <!--        </el-form-item>-->
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script name="Template" setup>
+import {
+  addTemplate,
+  delTemplate,
+  getTemplate,
+  listTemplate,
+  updateTemplate,
+} from "@/api/notice/template";
+import { getCurrentInstance, reactive, ref, toRefs } from "vue";
+import DictTag from "@/components/DictTag/index.vue";
+import { noticeTypeDict, notificationTemplateState } from "@/constant/dict";
+
+const { proxy } = getCurrentInstance();
+
+const templateList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    noticeType: null,
+    templateName: null,
+    msgTitle: null,
+    msgContent: null,
+    status: null,
+    tenantId: null,
+  },
+  rules: {
+    noticeType: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "change",
+      },
+    ],
+    templateName: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    msgTitle: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    msgContent: [
+      {
+        required: true,
+        message: "必填",
+        trigger: "blur",
+      },
+    ],
+    // status: [{
+    //   required: true, message: "必填", trigger: "change"
+    // }]
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询通知模板列表 */
+function getList() {
+  loading.value = true;
+  listTemplate(queryParams.value).then((response) => {
+    templateList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    templateId: null,
+    noticeType: null,
+    templateName: null,
+    msgTitle: null,
+    msgContent: null,
+    createBy: null,
+    createTime: null,
+    status: "0",
+    tenantId: null,
+  };
+  proxy.resetForm("templateRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.templateId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加通知模板";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _templateId = row.templateId || ids.value;
+  getTemplate(_templateId).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改通知模板";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["templateRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.templateId != null) {
+        updateTemplate(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addTemplate(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _templateIds = row.templateId || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除通知模板编号为"' + _templateIds + '"的数据项？')
+    .then(function () {
+      return delTemplate(_templateIds);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "notice/template/export",
+    {
+      ...queryParams.value,
+    },
+    `template_${new Date().getTime()}.xlsx`
+  );
+}
+
+getList();
+</script>
diff --git a/src/views/product/alertRule/index.vue b/src/views/product/alertRule/index.vue
index 12dd153..5901c36 100644
--- a/src/views/product/alertRule/index.vue
+++ b/src/views/product/alertRule/index.vue
@@ -59,7 +59,7 @@
       </el-form-item>
       <el-form-item>
         <el-button icon="Search" type="primary" @click="handleQuery"
-          >搜索
+        >搜索
         </el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
@@ -75,7 +75,7 @@
           plain
           type="primary"
           @click="handleAdd"
-          >新增
+        >新增
         </el-button>
       </el-col>
       <el-col :span="1.5">
@@ -85,7 +85,7 @@
           plain
           type="success"
           @click="getList"
-          >刷新
+        >刷新
         </el-button>
       </el-col>
       <!--      <el-col :span="1.5">-->
@@ -146,6 +146,7 @@
       v-loading="loading"
       :data="alertList"
       border
+      class="custom-table-style"
       @selection-change="handleSelectionChange"
     >
       <el-table-column align="center" type="selection" width="55" />
@@ -177,7 +178,7 @@
             link
             type="warning"
             @click="handleUpdate(row)"
-            >{{ productId ? "修改" : "查看" }}
+          >{{ productId ? "修改" : "查看" }}
           </el-button>
           <el-button
             v-hasPermi="['product:alertRule:remove']"
@@ -185,7 +186,7 @@
             link
             type="danger"
             @click="handleDelete(row)"
-            >删除
+          >删除
           </el-button>
         </template>
       </el-table-column>
@@ -218,7 +219,9 @@
                 style="width: 100%"
               >
                 <el-option
-                  v-for="dict in iot_alert_level"
+                  v-for="dict in iot_alert_level.filter(
+                    (el) => el.value !== '1'
+                  )"
                   :key="dict.value"
                   :label="dict.label"
                   :value="parseInt(dict.value)"
@@ -232,6 +235,29 @@
                 :inactive-value="2"
               />
             </el-form-item>
+            <el-form-item label="告警通知" prop="noticeConfigId">
+              <el-select
+                v-model="form.noticeConfigId"
+                :remote-method="getNoticeConfigOption"
+                clearable
+                filterable
+                placeholder="请选择告警通知"
+                remote
+                remote-show-suffix
+                @change="
+                  form.noticeConfigName = noticeConfigOptions.find(
+                    (el) => el.configId === $event
+                  )?.configName
+                "
+              >
+                <el-option
+                  v-for="item in noticeConfigOptions"
+                  :key="item.configId"
+                  :label="item.configName"
+                  :value="item.configId"
+                />
+              </el-select>
+            </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item label="备注" prop="remark">
@@ -313,7 +339,7 @@
                   size="small"
                   type="danger"
                   @click="removeTriggerItem(index)"
-                  >删除
+                >删除
                 </el-button>
               </el-col>
             </el-row>
@@ -575,19 +601,19 @@
                 size="small"
                 type="danger"
                 @click="removeActionItem(index)"
-                >删除
+              >删除
               </el-button>
             </el-col>
           </el-row>
           <el-button link size="small" type="primary" @click="addActionItem"
-            >添加执行动作
+          >添加执行动作
           </el-button>
         </el-form-item>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
           <el-button v-if="productId" type="primary" @click="submitForm"
-            >确 定
+          >确 定
           </el-button>
           <el-button @click="cancel">取 消</el-button>
         </div>
@@ -640,13 +666,7 @@
 
 <script name="Alert" setup>
 import Crontab from "@/components/Crontab/index.vue";
-import {
-  addAlertRule,
-  delAlertRule,
-  getAlertRule,
-  listAlertRule,
-  updateAlertRule,
-} from "@/api/product/alertRule";
+import { addAlertRule, delAlertRule, getAlertRule, listAlertRule, updateAlertRule } from "@/api/product/alertRule";
 import { getCurrentInstance, reactive, ref, toRefs, watch } from "vue";
 import { useDict } from "@/utils/dict";
 import { listProduct } from "@/api/product/product";
@@ -654,123 +674,125 @@ import { listDevice } from "@/api/iot/device";
 import { listModel } from "@/api/thingsmodel/model";
 import DictTag from "@/components/DictTag/index.vue";
 import { alertStatusDict } from "@/constant/dict";
+import { listNoticeConfig } from "@/api/product/noticeConfig";
 
 const { proxy } = getCurrentInstance();
 const props = defineProps({
   product: {
     type: Object,
-    default: null,
+    default: null
   },
   productId: {
     type: Number,
-    default: null,
-  },
+    default: null
+  }
 });
 
 const { product, productId } = toRefs(props);
 const timerWeeks = [
   {
     value: 1,
-    label: "周一",
+    label: "周一"
   },
   {
     value: 2,
-    label: "周二",
+    label: "周二"
   },
   {
     value: 3,
-    label: "周三",
+    label: "周三"
   },
   {
     value: 4,
-    label: "周四",
+    label: "周四"
   },
   {
     value: 5,
-    label: "周五",
+    label: "周五"
   },
   {
     value: 6,
-    label: "周六",
+    label: "周六"
   },
   {
     value: 7,
-    label: "周日",
-  },
+    label: "周日"
+  }
 ];
 
 // 执行动作源
 const actionSource = [
   {
     value: 1,
-    label: "设备",
+    label: "设备"
   },
   {
     value: 3,
-    label: "告警输出",
-  },
+    label: "告警输出"
+  }
 ];
 // 物模型类别
 const modelTypes = [
   {
     value: "1",
-    label: "属性",
+    label: "属性"
   },
   {
     value: "2",
-    label: "功能",
+    label: "服务"
   },
   {
     value: "3",
-    label: "事件",
+    label: "事件"
   },
   {
     value: "4",
-    label: "设备上线",
+    label: "设备上线"
   },
   {
     value: "5",
-    label: "设备下线",
-  },
+    label: "设备下线"
+  }
 ];
 // 触发器条件
 const triggerConditions = [
   {
     value: "2",
-    label: "满足所有条件",
+    label: "满足所有条件"
   },
   {
     value: "1",
-    label: "满足任一条件",
-  },
+    label: "满足任一条件"
+  }
 ];
 // 告警状态
 const alertType = [
   {
     value: 1,
-    label: "启动",
+    label: "启动"
   },
   {
     value: 2,
-    label: "停止",
-  },
+    label: "停止"
+  }
 ];
 // 周
 const timerWeekRepeats = ref([
   {
     value: "1",
-    label: "每天",
+    label: "每天"
   },
   {
     value: "2",
-    label: "仅此一次",
+    label: "仅此一次"
   },
   {
     value: "3",
-    label: "指定",
-  },
+    label: "指定"
+  }
 ]);
 const productOptions = ref([]);
+const noticeConfigOptions = ref([]); /*通知配置选项*/
 const deviceOptions = ref([]);
 const alertList = ref([]);
 const open = ref(false);
@@ -791,12 +813,12 @@ const modelList = ref([]);
 const triggerSource = ref([
   {
     value: "1",
-    label: "设备触发",
+    label: "设备触发"
   },
   {
     value: "2",
-    label: "定时触发",
-  },
+    label: "定时触发"
+  }
 ]);
 
 const { iot_alert_level, sys_job_status } = useDict(
@@ -807,7 +829,7 @@ const data = reactive({
   form: {
     conditions: "1", // 触发器条件
     triggers: [],
-    actions: [],
+    actions: []
   },
   queryParams: {
     pageNum: 1,
@@ -818,25 +840,37 @@ const data = reactive({
     productId: null,
     triggers: null,
     actions: null,
-    status: null,
+    status: null
   },
   rules: {
+    noticeConfigId: [
+      { required: true, message: "告警通知不能为空", trigger: "change" }
+    ],
     alertName: [
-      { required: true, message: "告警名称不能为空", trigger: "blur" },
+      { required: true, message: "告警名称不能为空", trigger: "blur" }
     ],
     alertLevel: [
-      { required: true, message: "告警级别不能为空", trigger: "change" },
+      { required: true, message: "告警级别不能为空", trigger: "change" }
     ],
     productId: [{ required: true, message: "产品不能为空", trigger: "change" }],
     triggers: [{ required: true, message: "触发器不能为空", trigger: "blur" }],
-    actions: [{ required: true, message: "执行动作不能为空", trigger: "blur" }],
+    actions: [{ required: true, message: "执行动作不能为空", trigger: "blur" }]
   },
   // 产品
   productInfo: {},
-  thingsModel: {},
+  thingsModel: {}
 });
 
 const { queryParams, form, rules, productInfo } = toRefs(data);
+const getNoticeConfigOption = (keyword) => {
+  listNoticeConfig({
+    configName: keyword,
+    pageNum: 1,
+    pageSize: 100
+  }).then((resp) => {
+    noticeConfigOptions.value = resp.rows;
+  });
+};
 
 /** 查询设备告警列表 */
 function getList() {
@@ -868,6 +902,8 @@ function reset() {
     createBy: null,
     createTime: null,
     remark: null,
+    noticeConfigId: null,
+    noticeConfigName: null,
     conditions: "1", // 触发器条件
     triggers: [
       {
@@ -875,15 +911,15 @@ function reset() {
         productSn: product.value?.productSn,
         modelValue: null,
         triggerType: "1", //1=设备，2=定时，3=告警输出
-        modelType: "1", // 1=属性，2=功能
-        cronExpression: null,
+        modelType: "1", // 1=属性，2=服务
+        cronExpression: null
         // jobId: 0,
         // deviceId: 0,
         // deviceName: "请选择一个设备",
         // id: "",
         // name: "",
         // isAdvance: 1
-      },
+      }
     ],
     actions: [
       {
@@ -892,14 +928,14 @@ function reset() {
         modelValue: null,
         modelKey: null,
         operator: null,
-        modelType: "1", // 1=属性，2=功能
+        modelType: "1" // 1=属性，2=服务
         // id: "",
         // name: "",
         // deviceId: 0,
         // deviceName: "请选择一个设备",
         // triggerType: "1", //1=设备，2=定时，3=告警输出
-      },
-    ],
+      }
+    ]
   };
   proxy.resetForm("alertRef");
 }
@@ -985,15 +1021,16 @@ function submitForm() {
 function handleDelete(row) {
   const _alertIds = row.alertId || ids.value;
   proxy.$modal
-    .confirm('是否确认删除设备告警编号为"' + _alertIds + '"的数据项？')
-    .then(function () {
+    .confirm("是否确认删除设备告警编号为\"" + _alertIds + "\"的数据项？")
+    .then(function() {
       return delAlertRule(_alertIds);
     })
     .then(() => {
       getList();
       proxy.$modal.msgSuccess("删除成功");
     })
-    .catch(() => {});
+    .catch(() => {
+    });
 }
 
 /** 导出按钮操作 */
@@ -1001,7 +1038,7 @@ function handleExport() {
   proxy.download(
     "device/alert/export",
     {
-      ...queryParams.value,
+      ...queryParams.value
     },
     `alert_${new Date().getTime()}.xlsx`
   );
@@ -1015,7 +1052,7 @@ const addActionItem = () => {
     modelValue: "",
     modelKey: "",
     operator: "",
-    modelType: "1", // 1=属性，2=功能
+    modelType: "1" // 1=属性，2=服务
     // id: "",
     // name: "",
     // value: ""
@@ -1042,20 +1079,20 @@ const setTriggerSource = () => {
     triggerSource.value = [
       {
         value: "1",
-        label: "设备触发",
-      },
+        label: "设备触发"
+      }
     ];
   } else {
     //定时
     triggerSource.value = [
       {
         value: "1",
-        label: "设备触发",
+        label: "设备触发"
       },
       {
         value: "2",
-        label: "定时触发",
-      },
+        label: "定时触发"
+      }
     ];
   }
   /**/
@@ -1067,13 +1104,13 @@ const addTriggerItem = () => {
     productId: productId.value,
     productSn: product.value?.productSn,
     triggerType: "1", // 1=设备，2=定时，3=告警输出
-    modelType: "1", // 1=属性，2=功能
+    modelType: "1", // 1=属性，2=服务
     cronExpression: null,
     modelKey: null,
     modelValue: null,
     // conditions: "2",
     operator: null,
-    modelId: null,
+    modelId: null
     // value: "",
     // id: "",
     // name: "",
@@ -1148,7 +1185,7 @@ function getProductOptions(keyword) {
   listProduct({
     productName: keyword,
     pageNum: 1,
-    pageSize: 20,
+    pageSize: 20
   }).then((resp) => {
     productOptions.value = resp.rows;
   });
@@ -1158,7 +1195,7 @@ function getDeviceOptions(keyword) {
   listDevice({
     deviceName: keyword,
     pageNum: 1,
-    pageSize: 20,
+    pageSize: 20
   }).then((resp) => {
     deviceOptions.value = resp.rows;
   });
@@ -1166,7 +1203,7 @@ function getDeviceOptions(keyword) {
 
 const getThingsModelOptions = (productId) => {
   listModel({
-    productId,
+    productId
   }).then((resp) => {
     modelList.value = resp.rows;
   });
@@ -1190,7 +1227,7 @@ watch(
     getList();
   },
   {
-    immediate: true,
+    immediate: true
   }
 );
 
@@ -1200,4 +1237,5 @@ if (!productId.value) {
 if (productId.value) {
   getThingsModelOptions(productId.value);
 }
+getNoticeConfigOption();
 </script>
diff --git a/src/views/product/category/index.vue b/src/views/product/category/index.vue
index 7239b8f..2cb619e 100644
--- a/src/views/product/category/index.vue
+++ b/src/views/product/category/index.vue
@@ -103,6 +103,7 @@
       :data="categoryList"
       :tree-props="{ children: 'children' }"
       row-key="categoryId"
+      class="custom-table-style"
       @selection-change="handleSelectionChange"
     >
       <el-table-column align="center" type="selection" width="55" />
diff --git a/src/views/product/firmware/index.vue b/src/views/product/firmware/index.vue
index 83c30b1..66084d9 100644
--- a/src/views/product/firmware/index.vue
+++ b/src/views/product/firmware/index.vue
@@ -35,23 +35,23 @@
           />
         </el-select>
       </el-form-item>
-      <el-form-item label="租户" prop="tenantId">
-        <el-select
-          v-model="queryParams.tenantId"
-          :remote-method="getTenantOptions"
-          clearable
-          filterable
-          remote
-          remote-show-suffix
-        >
-          <el-option
-            v-for="item in tenantOptions"
-            :key="item.tenantId"
-            :label="item.tenantName"
-            :value="item.tenantId"
-          />
-        </el-select>
-      </el-form-item>
+      <!--      <el-form-item label="租户" prop="tenantId">-->
+      <!--        <el-select-->
+      <!--          v-model="queryParams.tenantId"-->
+      <!--          :remote-method="getTenantOptions"-->
+      <!--          clearable-->
+      <!--          filterable-->
+      <!--          remote-->
+      <!--          remote-show-suffix-->
+      <!--        >-->
+      <!--          <el-option-->
+      <!--            v-for="item in tenantOptions"-->
+      <!--            :key="item.tenantId"-->
+      <!--            :label="item.tenantName"-->
+      <!--            :value="item.tenantId"-->
+      <!--          />-->
+      <!--        </el-select>-->
+      <!--      </el-form-item>-->
       <el-form-item label="是否最新版本" prop="latestVersionFlag">
         <el-select
           v-model="queryParams.latestVersionFlag"
@@ -122,17 +122,17 @@
           >删除
         </el-button>
       </el-col>
-      <el-col :span="1.5">
-        <el-button
-          v-hasPermi="['product:firmware:export']"
-          :size="productId ? 'small' : 'default'"
-          icon="Download"
-          plain
-          type="warning"
-          @click="handleExport"
-          >导出
-        </el-button>
-      </el-col>
+      <!--      <el-col :span="1.5">-->
+      <!--        <el-button-->
+      <!--          v-hasPermi="['product:firmware:export']"-->
+      <!--          :size="productId ? 'small' : 'default'"-->
+      <!--          icon="Download"-->
+      <!--          plain-->
+      <!--          type="warning"-->
+      <!--          @click="handleExport"-->
+      <!--          >导出-->
+      <!--        </el-button>-->
+      <!--      </el-col>-->
       <right-toolbar
         v-model:showSearch="showSearch"
         @queryTable="getList"
@@ -143,6 +143,7 @@
       v-loading="loading"
       :border="!!productId"
       :data="firmwareList"
+      class="custom-table-style"
       @selection-change="handleSelectionChange"
     >
       <el-table-column align="center" type="selection" width="55" />
@@ -158,14 +159,14 @@
           }}
         </template>
       </el-table-column>
-      <el-table-column align="center" label="租户" prop="tenantId">
-        <template #default="{ row }">
-          {{
-            tenantOptions.find((el) => el.tenantId === row.tenantId)
-              ?.tenantName ?? "暂无"
-          }}
-        </template>
-      </el-table-column>
+      <!--      <el-table-column align="center" label="租户" prop="tenantId">-->
+      <!--        <template #default="{ row }">-->
+      <!--          {{-->
+      <!--            tenantOptions.find((el) => el.tenantId === row.tenantId)-->
+      <!--              ?.tenantName ?? "暂无"-->
+      <!--          }}-->
+      <!--        </template>-->
+      <!--      </el-table-column>-->
       <el-table-column
         align="center"
         label="是否最新版本"
@@ -245,23 +246,23 @@
             />
           </el-select>
         </el-form-item>
-        <el-form-item label="租户" prop="tenantId">
-          <!--          <el-input v-model="form.tenantId" placeholder="请输入租户ID" />-->
-          <el-select
-            v-model="form.tenantId"
-            :remote-method="getTenantOptions"
-            filterable
-            remote
-            remote-show-suffix
-          >
-            <el-option
-              v-for="item in tenantOptions"
-              :key="item.tenantId"
-              :label="item.tenantName"
-              :value="item.tenantId"
-            />
-          </el-select>
-        </el-form-item>
+        <!--        <el-form-item label="租户" prop="tenantId">-->
+        <!--          &lt;!&ndash;          <el-input v-model="form.tenantId" placeholder="请输入租户ID" />&ndash;&gt;-->
+        <!--          <el-select-->
+        <!--            v-model="form.tenantId"-->
+        <!--            :remote-method="getTenantOptions"-->
+        <!--            filterable-->
+        <!--            remote-->
+        <!--            remote-show-suffix-->
+        <!--          >-->
+        <!--            <el-option-->
+        <!--              v-for="item in tenantOptions"-->
+        <!--              :key="item.tenantId"-->
+        <!--              :label="item.tenantName"-->
+        <!--              :value="item.tenantId"-->
+        <!--            />-->
+        <!--          </el-select>-->
+        <!--        </el-form-item>-->
         <el-form-item label="是否最新版本" prop="latestVersionFlag">
           <!--          <el-input v-model="form.latestVersionFlag" placeholder="请输入是否最新版本" />-->
           <el-switch
@@ -499,5 +500,5 @@ const getTenantOptions = async (keyword) => {
 
 getList();
 getProductOptions();
-getTenantOptions();
+// getTenantOptions();
 </script>
diff --git a/src/views/product/noticeConfig/index.vue b/src/views/product/noticeConfig/index.vue
new file mode 100644
index 0000000..b5697ab
--- /dev/null
+++ b/src/views/product/noticeConfig/index.vue
@@ -0,0 +1,646 @@
+<template>
+  <div class="app-container">
+    <el-form
+      v-show="showSearch"
+      ref="queryRef"
+      :inline="true"
+      :model="queryParams"
+      label-width="68px"
+    >
+      <el-form-item label="场景名称" prop="configName">
+        <el-input
+          v-model="queryParams.configName"
+          clearable
+          placeholder="请输入场景名称"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button icon="Search" type="primary" @click="handleQuery"
+          >搜索</el-button
+        >
+        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['product:noticeConfig:add']"
+          icon="Plus"
+          plain
+          type="primary"
+          @click="handleAdd"
+          >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['product:noticeConfig:edit']"
+          :disabled="single"
+          icon="Edit"
+          plain
+          type="success"
+          @click="handleUpdate"
+          >修改
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['product:noticeConfig:remove']"
+          :disabled="multiple"
+          icon="Delete"
+          plain
+          type="danger"
+          @click="handleDelete"
+          >删除
+        </el-button>
+      </el-col>
+      <!--      <el-col :span="1.5">-->
+      <!--        <el-button-->
+      <!--          v-hasPermi="['product:noticeConfig:export']"-->
+      <!--          icon="Download"-->
+      <!--          plain-->
+      <!--          type="warning"-->
+      <!--          @click="handleExport"-->
+      <!--        >导出-->
+      <!--        </el-button>-->
+      <!--      </el-col>-->
+      <right-toolbar
+        v-model:showSearch="showSearch"
+        @queryTable="getList"
+      ></right-toolbar>
+    </el-row>
+
+    <el-table
+      v-loading="loading"
+      :data="noticeConfigList"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column align="center" type="selection" width="55" />
+      <!--      <el-table-column align="center" label="${comment}" prop="configId" />-->
+      <el-table-column align="center" label="场景名称" prop="configName" />
+      <el-table-column align="center" label="通知方式">
+        <template #default="{ row }">
+          <div class="notice-method-tags">
+            <dict-tag
+              v-for="item in row.details?.split(',') ?? []"
+              :key="item"
+              :options="noticeTypeDict"
+              :value="[item.split(':')[0]]"
+            />
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="通知用户" prop="noticeUserId">
+        <template #default="{ row }">
+          <el-tag
+            v-for="item in row.noticeUserId?.split(',') ?? []"
+            :key="item"
+            class="notice-user-tag"
+            >{{ item.split(":")[1] }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="模板">
+        <template #default="{ row }">
+          <el-tag
+            v-for="item in row.details?.split(',') ?? []"
+            :key="item"
+            :type="
+              noticeTypeDict.find((el) => el.value === item.split(':')[0])
+                ?.elTagType
+            "
+            class="notice-user-tag"
+            >{{ item.split(":")[2] }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="状态" prop="status">
+        <template #default="{ row }">
+          <dict-tag :options="noticeStatusDict" :value="[row.status]" />
+        </template>
+      </el-table-column>
+      <!--      <el-table-column align="center" label="${comment}" prop="tenantId" />-->
+      <el-table-column
+        align="center"
+        class-name="small-padding fixed-width"
+        label="操作"
+      >
+        <template #default="{ row }">
+          <el-button
+            v-hasPermi="['product:noticeConfig:edit']"
+            icon="Edit"
+            link
+            type="primary"
+            @click="handleUpdate(row)"
+            >修改
+          </el-button>
+          <el-button
+            v-hasPermi="['product:noticeConfig:remove']"
+            icon="Delete"
+            link
+            type="primary"
+            @click="handleDelete(row)"
+            >删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total > 0"
+      v-model:limit="queryParams.pageSize"
+      v-model:page="queryParams.pageNum"
+      :total="total"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改告警消息配置对话框 -->
+    <el-dialog v-model="open" :title="title" append-to-body width="500px">
+      <el-form
+        ref="noticeConfigRef"
+        :model="form"
+        :rules="rules"
+        label-width="120px"
+      >
+        <el-form-item label="场景名称" prop="configName">
+          <el-input
+            v-model="form.configName"
+            :disabled="form.configId"
+            placeholder="请输入场景名称"
+          />
+        </el-form-item>
+        <el-form-item label="通知用户" prop="noticeUsers">
+          <el-tag
+            v-for="item in form.noticeUsers"
+            :key="item"
+            class="notice-user-tag"
+            closable
+            @close="
+              form.noticeUsers = form.noticeUsers?.filter(
+                (el) => el.userId !== item.userId
+              )
+            "
+            >{{ item.nickName }}
+          </el-tag>
+          <el-button
+            v-if="form.noticeUsers.length <= 5"
+            icon="plus"
+            link
+            size="small"
+            style="margin-left: 5px"
+            type="primary"
+            @click="userOpen = true"
+            >选择
+          </el-button>
+        </el-form-item>
+        <el-form-item label="通知方式" prop="enableTypes">
+          <el-select
+            v-model="form.enableTypes"
+            multiple
+            @remove-tag="handleRemoveNoticeMethod"
+          >
+            <el-option
+              v-for="item in noticeTypeDict"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          v-if="form.enableTypes?.find((el) => el === '1')"
+          label="站内模版"
+          prop="stationTemplateId"
+        >
+          <el-select
+            v-model="form.stationTemplateId"
+            :remote-method="getTemplateOptions"
+            clearable
+            filterable
+            placeholder="请选择模版"
+            remote
+            remote-show-suffix
+            @change="
+              form.stationTemplateName = templateOptions.find(
+                (el) => el.templateId.toString() === $event
+              )?.templateName
+            "
+          >
+            <el-option
+              v-for="item in templateOptions.filter(
+                (el) => el.noticeType === '1'
+              )"
+              :key="item.templateId"
+              :label="item.templateName"
+              :value="item.templateId.toString()"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          v-if="form.enableTypes?.find((el) => el === '2')"
+          label="短信模版"
+          prop="smsTemplateId"
+        >
+          <el-select
+            v-model="form.smsTemplateId"
+            :remote-method="getTemplateOptions"
+            clearable
+            filterable
+            placeholder="请选择模版"
+            remote
+            remote-show-suffix
+            @change="
+              form.smsTemplateName = templateOptions.find(
+                (el) => el.templateId.toString() === $event
+              )?.templateName
+            "
+          >
+            <el-option
+              v-for="item in templateOptions.filter(
+                (el) => el.noticeType === '2'
+              )"
+              :key="item.templateId"
+              :label="item.templateName"
+              :value="item.templateId.toString()"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          v-if="form.enableTypes?.find((el) => el === '3')"
+          label="邮件模版"
+          prop="emailTemplateId"
+        >
+          <el-select
+            v-model="form.emailTemplateId"
+            :remote-method="getTemplateOptions"
+            clearable
+            filterable
+            placeholder="请选择模版"
+            remote
+            remote-show-suffix
+            @change="
+              form.emailTemplateName = templateOptions.find(
+                (el) => el.templateId.toString() === $event
+              )?.templateName
+            "
+          >
+            <el-option
+              v-for="item in templateOptions.filter(
+                (el) => el.noticeType === '3'
+              )"
+              :key="item.templateId"
+              :label="item.templateName"
+              :value="item.templateId.toString()"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="状态" prop="status">
+          <el-switch
+            v-model="form.status"
+            active-value="0"
+            inactive-value="1"
+          />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitForm">确 定</el-button>
+          <el-button @click="cancel">取 消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <user-tree-select
+      :user-open="userOpen"
+      @close="userOpen = false"
+      @user-selected="handleUserSelected"
+    />
+  </div>
+</template>
+
+<script name="NoticeConfig" setup>
+import {
+  addNoticeConfig,
+  delNoticeConfig,
+  getNoticeConfig,
+  listNoticeConfig,
+  updateNoticeConfig,
+} from "@/api/product/noticeConfig";
+import { getCurrentInstance, reactive, ref, toRefs } from "vue";
+import UserTreeSelect from "@/components/UserTreeSelect/index.vue";
+import { ElMessage } from "element-plus";
+import { omit } from "lodash-es";
+import { listTemplate } from "@/api/notice/template";
+import DictTag from "@/components/DictTag/index.vue";
+import { noticeStatusDict, noticeTypeDict } from "@/constant/dict";
+
+const { proxy } = getCurrentInstance();
+const userOpen = ref(false);
+const noticeConfigList = ref([]);
+const open = ref(false);
+const loading = ref(true);
+const showSearch = ref(true);
+const ids = ref([]);
+const single = ref(true);
+const multiple = ref(true);
+const total = ref(0);
+const title = ref("");
+const templateOptions = ref([]);
+
+const data = reactive({
+  form: { enableTypes: [] },
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    configName: null,
+    noticeUserId: null,
+    details: null,
+    status: null,
+    tenantId: null,
+  },
+  rules: {
+    configName: [
+      {
+        required: true,
+        message: "请填写场景名称",
+        trigger: "blur",
+      },
+    ],
+    noticeUsers: [
+      {
+        required: true,
+        message: "至少选择一个用户",
+        trigger: "change",
+      },
+    ],
+    status: [
+      {
+        required: true,
+        message: "请选择模版",
+        trigger: "change",
+      },
+    ],
+    enableTypes: [
+      {
+        required: true,
+        message: "至少选择一个通知方式",
+        trigger: "change",
+      },
+    ],
+    stationTemplateId: [
+      {
+        required: true,
+        message: "请选择模版",
+        trigger: "change",
+      },
+    ],
+    smsTemplateId: [
+      {
+        required: true,
+        message: "请选择模版",
+        trigger: "change",
+      },
+    ],
+    emailTemplateId: [
+      {
+        required: true,
+        message: "请选择模版",
+        trigger: "change",
+      },
+    ],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询告警消息配置列表 */
+function getList() {
+  loading.value = true;
+  listNoticeConfig(queryParams.value).then((response) => {
+    noticeConfigList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+/**
+ * 确认人员选择
+ * @param data
+ */
+const handleUserSelected = (data) => {
+  const { nickName, userId } = data;
+  if (
+    form.value.noticeUsers.find(
+      (el) => el.userId.toString() === userId.toString()
+    )
+  ) {
+    ElMessage.error("已选择该用户");
+    return;
+  }
+  form.value.noticeUsers.push({
+    nickName,
+    userId,
+  });
+  userOpen.value = false;
+};
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    configId: null,
+    configName: null,
+    noticeUserId: null,
+    noticeUsers: [],
+    details: null,
+    status: "1",
+    createTime: null,
+    tenantId: null,
+    stationTemplateId: null,
+    smsTemplateId: null,
+    emailTemplateId: null,
+    stationTemplateName: null,
+    smsTemplateName: null,
+    emailTemplateName: null,
+    enableTypes: [],
+  };
+  proxy.resetForm("noticeConfigRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.configId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+/**
+ * 移除选择的通知方式
+ * @param value
+ */
+const handleRemoveNoticeMethod = (value) => {
+  if (value === "1") {
+    form.value.stationTemplateId = null;
+    form.value.stationTemplateName = null;
+  } else if (value === "2") {
+    form.value.smsTemplateId = null;
+    form.value.smsTemplateName = null;
+  } else if (value === "3") {
+    form.value.emailTemplateId = null;
+    form.value.emailTemplateName = null;
+  }
+};
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加告警消息配置";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _configId = row.configId || ids.value;
+  getNoticeConfig(_configId).then((response) => {
+    form.value = response.data;
+    form.value.noticeUsers =
+      response.data.noticeUserId?.split(",")?.map((el) => ({
+        userId: el.split(":")[0],
+        nickName: el.split(":")[1],
+      })) ?? [];
+    const _details = response.data.details.split(",").map((el) => ({
+      type: el.split(":")[0],
+      id: el.split(":")[1],
+      name: el.split(":")[2],
+    }));
+    form.value.enableTypes = _details.map((el) => el.type);
+    form.value.stationTemplateId = _details.find((el) => el.type === "1")?.id;
+    form.value.smsTemplateId = _details.find((el) => el.type === "2")?.id;
+    form.value.emailTemplateId = _details.find((el) => el.type === "3")?.id;
+    form.value.stationTemplateName = _details.find(
+      (el) => el.type === "1"
+    )?.name;
+    form.value.smsTemplateName = _details.find((el) => el.type === "2")?.name;
+    form.value.emailTemplateName = _details.find((el) => el.type === "3")?.name;
+    open.value = true;
+    title.value = "修改告警消息配置";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["noticeConfigRef"].validate((valid) => {
+    if (valid) {
+      form.value.noticeUserId = form.value.noticeUsers
+        .map((el) => `${el.userId}:${el.nickName}`)
+        .join(",");
+      if (form.value.stationTemplateId) {
+        form.value.details = `1:${form.value.stationTemplateId}:${form.value.stationTemplateName}`;
+      } else {
+        form.value.details = "";
+      }
+      if (form.value.smsTemplateId)
+        form.value.details += `,2:${form.value.smsTemplateId}:${form.value.smsTemplateName}`;
+      if (form.value.emailTemplateId)
+        form.value.details += `,3:${form.value.emailTemplateId}:${form.value.emailTemplateName}`;
+      const submitForm = omit(form.value, [
+        "noticeUsers",
+        "stationTemplateId",
+        "smsTemplateId",
+        "emailTemplateId",
+        "stationTemplateName",
+        "smsTemplateName",
+        "emailTemplateName",
+        "enableTypes",
+      ]);
+      if (form.value.configId != null) {
+        updateNoticeConfig(submitForm).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addNoticeConfig(submitForm).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _configIds = row.configId || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除告警消息配置编号为"' + _configIds + '"的数据项？')
+    .then(function () {
+      return delNoticeConfig(_configIds);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "product/noticeConfig/export",
+    {
+      ...queryParams.value,
+    },
+    `noticeConfig_${new Date().getTime()}.xlsx`
+  );
+}
+
+const getTemplateOptions = (keyword) => {
+  listTemplate({
+    templateName: keyword,
+    pageNum: 1,
+    pageSize: 100,
+  }).then((resp) => {
+    templateOptions.value = resp.rows;
+  });
+};
+
+getTemplateOptions();
+getList();
+</script>
+<style lang="scss" scoped>
+.notice-user-tag {
+  &:not(:first-child) {
+    margin-left: 6px;
+  }
+}
+
+.notice-method-tags {
+  display: flex;
+  justify-content: center;
+
+  & > div:not(:first-child) {
+    margin-left: 5px;
+  }
+}
+</style>
diff --git a/src/views/product/product/edit.vue b/src/views/product/product/edit.vue
index 41fa5c7..bd2b9db 100644
--- a/src/views/product/product/edit.vue
+++ b/src/views/product/product/edit.vue
@@ -1,16 +1,13 @@
 <template>
   <div class="app-container">
-    <el-tabs tab-position="top">
-      <el-tab-pane label="基本信息">
+    <el-tabs v-model="activeTab" tab-position="top">
+      <el-tab-pane label="基本信息" name="base">
         <el-form
           ref="productRef"
           :model="form"
           :rules="rules"
           label-width="120px"
         >
-          <!--          <el-row :gutter="100">-->
-          <!--            <el-col :lg="12" :md="24" :sm="24" :xl="8" :xs="24">-->
-          <!--            <el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">-->
           <div
             :style="{
               padding: '0 200px',
@@ -18,7 +15,11 @@
             }"
           >
             <el-form-item label="编码SN" prop="productSn">
-              <el-input v-model="form.productSn" placeholder="请输入编码SN">
+              <el-input
+                v-model="form.productSn"
+                :disabled="!!route.query.productId"
+                placeholder="请输入编码SN"
+              >
                 <template #suffix>
                   <el-icon v-if="isProductSnUnique === true" color="green">
                     <SuccessFilled />
@@ -30,6 +31,13 @@
                     <InfoFilled />
                   </el-icon>
                 </template>
+                <template #append>
+                  <el-button
+                    :disabled="!!route.query.productId"
+                    @click="geneProductSn"
+                    >自动生成
+                  </el-button>
+                </template>
               </el-input>
             </el-form-item>
             <el-form-item label="名称" prop="productName">
@@ -74,7 +82,6 @@
               />
             </el-form-item>
             <el-form-item label="图片地址" prop="imgUrl">
-              <!--                <el-input v-model="form.imgUrl" placeholder="请输入图片地址" />-->
               <image-upload v-model="form.imgUrl" :limit="1"></image-upload>
             </el-form-item>
             <el-form-item style="text-align: center; margin: 40px 0px">
@@ -86,133 +93,14 @@
               </el-button>
             </el-form-item>
           </div>
-
-          <!--              <el-form-item label="租户" prop="tenantId">-->
-          <!--                <el-tooltip content="在此输入搜索关键字" effect="light" placement="right">-->
-          <!--                  <el-select-->
-          <!--                    v-model="form.tenantId"-->
-          <!--                    :remote-method="getTenantList"-->
-          <!--                    filterable-->
-          <!--                    placeholder="请选择租户"-->
-          <!--                    remote-->
-          <!--                    remote-show-suffix-->
-          <!--                  >-->
-          <!--&lt;!&ndash;                    @blur="showTenantTip=false"&ndash;&gt;-->
-          <!--                    &lt;!&ndash;                    @focus="showTenantTip=true"&ndash;&gt;-->
-          <!--                    <el-option-->
-          <!--                      v-for="item in tenantOptions"-->
-          <!--                      :key="item.tenantId"-->
-          <!--                      :label="item.tenantName"-->
-          <!--                      :value="item.tenantId"-->
-          <!--                    />-->
-          <!--                  </el-select>-->
-          <!--                </el-tooltip>-->
-
-          <!--              </el-form-item>-->
-
-          <!--            </el-col>-->
-          <!--            <el-col :lg="12" :md="24" :sm="24" :xl="8" :xs="24">-->
-          <!--              <el-form-item label="产品编码SN" prop="productSn">-->
-          <!--                <el-input-->
-          <!--                  v-model="form.productSn"-->
-          <!--                  placeholder="请输入产品编码SN"-->
-          <!--                >-->
-          <!--                  <template #suffix>-->
-          <!--                    <el-icon v-if="isProductSnUnique === true" color="green">-->
-          <!--                      <SuccessFilled />-->
-          <!--                    </el-icon>-->
-          <!--                    <el-icon-->
-          <!--                      v-else-if="isProductSnUnique === false"-->
-          <!--                      color="red"-->
-          <!--                    >-->
-          <!--                      <CircleCloseFilled />-->
-          <!--                    </el-icon>-->
-          <!--                    <el-icon v-else>-->
-          <!--                      <InfoFilled />-->
-          <!--                    </el-icon>-->
-          <!--                  </template>-->
-          <!--                </el-input>-->
-          <!--              </el-form-item>-->
-          <!--&lt;!&ndash;              <el-form-item label="mqtt账号" prop="mqttAccount">&ndash;&gt;-->
-          <!--&lt;!&ndash;                <el-input&ndash;&gt;-->
-          <!--&lt;!&ndash;                  v-model="form.mqttAccount"&ndash;&gt;-->
-          <!--&lt;!&ndash;                  placeholder="请输入mqtt账号"&ndash;&gt;-->
-          <!--&lt;!&ndash;                />&ndash;&gt;-->
-          <!--&lt;!&ndash;              </el-form-item>&ndash;&gt;-->
-          <!--&lt;!&ndash;              <el-form-item label="mqtt密码" prop="mqttPassword">&ndash;&gt;-->
-          <!--&lt;!&ndash;                <el-input&ndash;&gt;-->
-          <!--&lt;!&ndash;                  v-model="form.mqttPassword"&ndash;&gt;-->
-          <!--&lt;!&ndash;                  placeholder="请输入mqtt密码"&ndash;&gt;-->
-          <!--&lt;!&ndash;                  type="password"&ndash;&gt;-->
-          <!--&lt;!&ndash;                />&ndash;&gt;-->
-          <!--&lt;!&ndash;              </el-form-item>&ndash;&gt;-->
-          <!--&lt;!&ndash;              <el-form-item label="产品秘钥" prop="mqttSecret">&ndash;&gt;-->
-          <!--&lt;!&ndash;                <el-input&ndash;&gt;-->
-          <!--&lt;!&ndash;                  v-model="form.mqttSecret"&ndash;&gt;-->
-          <!--&lt;!&ndash;                  placeholder="请输入产品秘钥"&ndash;&gt;-->
-          <!--&lt;!&ndash;                  type="password"&ndash;&gt;-->
-          <!--&lt;!&ndash;                />&ndash;&gt;-->
-          <!--&lt;!&ndash;              </el-form-item>&ndash;&gt;-->
-          <!--&lt;!&ndash;              <el-form-item label="认证方式" prop="vertificateMethod">&ndash;&gt;-->
-          <!--&lt;!&ndash;                <el-select&ndash;&gt;-->
-          <!--&lt;!&ndash;                  v-model="form.vertificateMethod"&ndash;&gt;-->
-          <!--&lt;!&ndash;                  placeholder="请选择认证方式"&ndash;&gt;-->
-          <!--&lt;!&ndash;                >&ndash;&gt;-->
-          <!--&lt;!&ndash;                  <el-option&ndash;&gt;-->
-          <!--&lt;!&ndash;                    v-for="[value, key] in vertificateMethodOptions"&ndash;&gt;-->
-          <!--&lt;!&ndash;                    :key="value"&ndash;&gt;-->
-          <!--&lt;!&ndash;                    :label="key"&ndash;&gt;-->
-          <!--&lt;!&ndash;                    :value="value"&ndash;&gt;-->
-          <!--&lt;!&ndash;                  />&ndash;&gt;-->
-          <!--&lt;!&ndash;                </el-select>&ndash;&gt;-->
-          <!--&lt;!&ndash;              </el-form-item>&ndash;&gt;-->
-          <!--            </el-col>-->
-          <!--            <el-col :lg="24" :md="24" :sm="24" :xl="24" :xs="24">-->
-
-          <!--              <el-form-item label="mqtt账号" prop="mqttAccount">-->
-          <!--                <el-input-->
-          <!--                  v-model="form.mqttAccount"-->
-          <!--                  placeholder="请输入mqtt账号"-->
-          <!--                />-->
-          <!--              </el-form-item>-->
-          <!--              <el-form-item label="mqtt密码" prop="mqttPassword">-->
-          <!--                <el-input-->
-          <!--                  v-model="form.mqttPassword"-->
-          <!--                  placeholder="请输入mqtt密码"-->
-          <!--                  type="password"-->
-          <!--                />-->
-          <!--              </el-form-item>-->
-          <!--              <el-form-item label="产品秘钥" prop="mqttSecret">-->
-          <!--                <el-input-->
-          <!--                  v-model="form.mqttSecret"-->
-          <!--                  placeholder="请输入产品秘钥"-->
-          <!--                  type="password"-->
-          <!--                />-->
-          <!--              </el-form-item>-->
-          <!--              <el-form-item label="认证方式" prop="vertificateMethod">-->
-          <!--                <el-select-->
-          <!--                  v-model="form.vertificateMethod"-->
-          <!--                  placeholder="请选择认证方式"-->
-          <!--                >-->
-          <!--                  <el-option-->
-          <!--                    v-for="[value, key] in vertificateMethodOptions"-->
-          <!--                    :key="value"-->
-          <!--                    :label="key"-->
-          <!--                    :value="value"-->
-          <!--                  />-->
-          <!--                </el-select>-->
-          <!--              </el-form-item>-->
-          <!--            </el-col>-->
-          <!--            <el-col :lg="12" :md="24" :sm="24" :xl="8" :xs="24">-->
-
-          <!--            </el-col>-->
-          <!--          </el-row>-->
-          <!--          <el-col :span="20">-->
-
-          <!--          </el-col>-->
         </el-form>
       </el-tab-pane>
-      <el-tab-pane :disabled="!form.productId" label="产品模型" lazy>
+      <el-tab-pane
+        :disabled="!form.productId"
+        label="产品模型"
+        lazy
+        name="model"
+      >
         <model
           v-if="form.productId"
           ref="modelRef"
@@ -222,7 +110,12 @@
           @model-updated="getData"
         />
       </el-tab-pane>
-      <el-tab-pane :disabled="!form.productId" label="固件管理" lazy>
+      <el-tab-pane
+        :disabled="!form.productId"
+        label="固件管理"
+        lazy
+        name="firmware"
+      >
         <firmware v-if="form.productId" :product-id="form.productId" />
       </el-tab-pane>
       <el-tab-pane :disabled="!form.productId" label="告警配置" lazy>
@@ -232,7 +125,12 @@
           :product-id="form.productId"
         />
       </el-tab-pane>
-      <el-tab-pane :disabled="!form.productId" label="设备列表" lazy>
+      <el-tab-pane
+        :disabled="!form.productId"
+        label="设备列表"
+        lazy
+        name="device"
+      >
         <device v-if="form.productId" :product-id="form.productId"></device>
       </el-tab-pane>
     </el-tabs>
@@ -242,9 +140,14 @@
 <script setup>
 import Firmware from "@/views/product/firmware/index.vue";
 import Device from "@/views/iot/device/index.vue";
-import { onMounted, reactive, ref, toRefs } from "vue";
+import { onMounted, reactive, ref, toRefs, watch } from "vue";
 import Model from "@/views/product/product/panes/model.vue";
-import { useRoute } from "vue-router";
+import {
+  CircleCloseFilled,
+  InfoFilled,
+  SuccessFilled,
+} from "@element-plus/icons-vue";
+import { useRoute, useRouter } from "vue-router";
 import {
   addProduct,
   checkProductSn,
@@ -252,13 +155,13 @@ import {
   updateProduct,
 } from "@/api/product/product";
 import { listCategory } from "@/api/product/category";
-import { listTenant } from "@/api/system/tenant";
 import ImageUpload from "@/components/ImageUpload/index.vue";
 import { ElMessage } from "element-plus";
 import tab from "@/plugins/tab";
 import { debounce } from "lodash-es";
 import Alert from "@/views/product/alertRule/index.vue";
 
+const activeTab = ref("base");
 const checkProductSnUnique = debounce((rule, value, callback) => {
   if (!value) {
     callback();
@@ -285,6 +188,7 @@ const checkProductSnUnique = debounce((rule, value, callback) => {
     });
 }, 500);
 const route = useRoute();
+const router = useRouter();
 const data = reactive({
   form: {},
   rules: {
@@ -319,9 +223,9 @@ const data = reactive({
 const { form, rules } = toRefs(data);
 const productRef = ref();
 const categoryOptions = ref([]); // 产品分类树形选择
-const tenantOptions = ref([]);
+// const tenantOptions = ref([]);
 const isProductSnUnique = ref();
-const showTenantTip = ref(false);
+// const showTenantTip = ref(false);
 
 // 表单重置
 function reset() {
@@ -373,14 +277,27 @@ const getCategoryList = async () => {
   categoryOptions.value = response.data;
 };
 
-const getTenantList = async (keyword) => {
-  const response = await listTenant({
-    pageNum: 1,
-    pageSize: 20,
-    tenantName: keyword,
-  });
-  tenantOptions.value = response.rows;
+const geneProductSn = () => {
+  form.value.productSn = generateRandomString(11);
 };
+const generateRandomString = (length) => {
+  const characters =
+    "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let result = "";
+  for (let i = 0; i < length; i++) {
+    result += characters.charAt(Math.floor(Math.random() * characters.length));
+  }
+  return result;
+};
+
+// const getTenantList = async (keyword) => {
+//   const response = await listTenant({
+//     pageNum: 1,
+//     pageSize: 20,
+//     tenantName: keyword
+//   });
+//   tenantOptions.value = response.rows;
+// };
 const submitForm = () => {
   productRef.value.validate((valid) => {
     if (valid) {
@@ -392,11 +309,12 @@ const submitForm = () => {
         } else {
           addProduct(form.value).then((response) => {
             ElMessage.success("新增成功");
-            form.value = response.data;
-            // const tabObj = Object.assign({}, route, { title: "修改产品" });
-            // tab.updatePage(tabObj);
-            const tabObj = { path: "/produc/product" };
-            tab.closeOpenPage(tabObj);
+            router.push({
+              path: "/produc/product/edit",
+              query: {
+                productId: response.data,
+              },
+            });
           });
         }
       }
@@ -404,17 +322,29 @@ const submitForm = () => {
   });
 };
 onMounted(() => {
+  activeTab.value = route.query.initTab;
   getData();
 });
 
+watch(
+  () => route.query.productId,
+  () => {
+    getData();
+  },
+  { immediate: true }
+);
+
 getCategoryList();
-// getTenantList();
 </script>
 
 <style lang="scss" scoped>
 :deep(.el-tabs__nav-wrap) {
   overflow: unset;
 
+  &::after {
+    display: none;
+  }
+
   .el-tabs__nav-scroll {
     overflow: unset;
     display: flex;
@@ -428,7 +358,7 @@ getCategoryList();
   }
 
   &:hover::before {
-    content: "请先添加产品";
+    content: "请先保存基本信息";
     position: absolute;
     background-color: tomato;
     line-height: 1;
diff --git a/src/views/product/product/index.vue b/src/views/product/product/index.vue
index 035840c..e0a8ae5 100644
--- a/src/views/product/product/index.vue
+++ b/src/views/product/product/index.vue
@@ -129,16 +129,16 @@
           >删除
         </el-button>
       </el-col>
-      <el-col :span="1.5">
-        <el-button
-          v-hasPermi="['product:product:export']"
-          icon="Download"
-          plain
-          type="warning"
-          @click="handleExport"
-          >导出
-        </el-button>
-      </el-col>
+      <!--      <el-col :span="1.5">-->
+      <!--        <el-button-->
+      <!--          v-hasPermi="['product:product:export']"-->
+      <!--          icon="Download"-->
+      <!--          plain-->
+      <!--          type="warning"-->
+      <!--          @click="handleExport"-->
+      <!--          >导出-->
+      <!--        </el-button>-->
+      <!--      </el-col>-->
       <right-toolbar
         v-model:showSearch="showSearch"
         @queryTable="getList"
@@ -148,6 +148,7 @@
     <el-table
       v-loading="loading"
       :data="productList"
+      class="custom-table-style"
       @selection-change="handleSelectionChange"
     >
       <el-table-column align="center" type="selection" width="55" />
@@ -177,7 +178,8 @@
       <!--      <el-table-column align="center" label="mqtt账号" prop="mqttAccount" />-->
       <!--      <el-table-column align="center" label="mqtt密码" prop="mqttPassword" />-->
       <!--      <el-table-column align="center" label="产品秘钥" prop="mqttSecret" />-->
-      <el-table-column align="center" label="状态" prop="status">
+      <!--      TODO:-->
+      <el-table-column v-if="false" align="center" label="状态" prop="status">
         <template #default="{ row }">
           <dict-tag :options="productStatusMap" :value="[row.status]" />
         </template>
@@ -212,7 +214,9 @@
         width="190px"
       >
         <template #default="scope">
+          <!--          TODO:-->
           <el-button
+            v-if="false"
             v-hasPermi="['product:product:remove']"
             link
             type="success"
@@ -224,7 +228,12 @@
             link
             type="primary"
             @click="handleUpdate(scope.row)"
-            >{{ scope.row.status === 2 ? "查看" : "修改" }}
+            >详情
+            <!--            {{ scope.row.status === 2 ? "查看" : "" }}-->
+          </el-button>
+          <el-button link type="primary" @click="viewDeviceList(scope.row)"
+            >设备列表
+            <!--            {{ scope.row.status === 2 ? "查看" : "" }}-->
           </el-button>
           <el-button
             v-hasPermi="['product:product:remove']"
@@ -445,7 +454,6 @@ function handleUpdate(row) {
     path: "/produc/product/edit",
     query: {
       productId: _productId,
-      pageNum: queryParams.value.pageNum,
     },
   });
   // getProduct(_productId).then(response => {
@@ -455,6 +463,18 @@ function handleUpdate(row) {
   // });
 }
 
+const viewDeviceList = (row) => {
+  const _productId = row.productId;
+  router.push({
+    path: "/produc/product/edit",
+    query: {
+      productId: _productId,
+      pageNum: queryParams.value.pageNum,
+      initTab: "device",
+    },
+  });
+};
+
 /** 提交按钮 */
 function submitForm() {
   proxy.$refs["productRef"].validate((valid) => {
diff --git a/src/views/product/product/panes/model.vue b/src/views/product/product/panes/model.vue
index 210dac1..a263533 100644
--- a/src/views/product/product/panes/model.vue
+++ b/src/views/product/product/panes/model.vue
@@ -148,14 +148,10 @@
           />
         </el-form-item>
         <el-form-item label="模型类别" prop="type">
-          <el-radio-group
-            v-model="form.type"
-            class="ios-style-radio"
-            @change="typeChange(form.type)"
-          >
+          <el-radio-group v-model="form.type" @change="typeChange(form.type)">
             <el-radio-button :label="1">属性</el-radio-button>
-            <el-radio-button :label="2">功能</el-radio-button>
             <el-radio-button :label="3">事件</el-radio-button>
+            <el-radio-button :label="2">服务</el-radio-button>
           </el-radio-group>
         </el-form-item>
         <el-form-item label="只读数据" prop="isOnlyRead">
@@ -795,7 +791,7 @@ const makeThingsModelObject = () => {
       // thingsItem.datatype = JSON.parse(modelList.value[i].specs);
       thingsModel.value.properties.push(thingsItem);
     } else if (modelList.value[i].type === 2) {
-      // 功能
+      // 服务
       // thingsItem.isTop = modelList.value[i].isTop;
       // thingsItem.isMonitor = modelList.value[i].isMonitor;
       // thingsItem.isOnlyRead = modelList.value[i].isOnlyRead;
diff --git a/src/views/sign_in_with.vue b/src/views/sign_in_with.vue
index 465f047..2d961a0 100644
--- a/src/views/sign_in_with.vue
+++ b/src/views/sign_in_with.vue
@@ -1,5 +1,5 @@
 <template>第三方登录</template>
 
-<script setup></script>
+<script lang="ts" setup></script>
 
 <style scoped></style>
diff --git a/src/views/system/dept/index.vue b/src/views/system/dept/index.vue
index 7c5d490..344aece 100644
--- a/src/views/system/dept/index.vue
+++ b/src/views/system/dept/index.vue
@@ -65,6 +65,7 @@
       v-loading="loading"
       :data="deptList"
       row-key="deptId"
+      class="custom-table-style"
       :default-expand-all="isExpandAll"
       :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
     >
diff --git a/src/views/system/dict/index.vue b/src/views/system/dict/index.vue
index 919df84..c8f8d55 100644
--- a/src/views/system/dict/index.vue
+++ b/src/views/system/dict/index.vue
@@ -1,17 +1,17 @@
 <template>
   <div class="app-container">
     <el-form
-      :model="queryParams"
+      v-show="showSearch"
       ref="queryRef"
       :inline="true"
-      v-show="showSearch"
+      :model="queryParams"
       label-width="68px"
     >
       <el-form-item label="字典名称" prop="dictName">
         <el-input
           v-model="queryParams.dictName"
-          placeholder="请输入字典名称"
           clearable
+          placeholder="请输入字典名称"
           style="width: 240px"
           @keyup.enter="handleQuery"
         />
@@ -19,8 +19,8 @@
       <el-form-item label="字典类型" prop="dictType">
         <el-input
           v-model="queryParams.dictType"
-          placeholder="请输入字典类型"
           clearable
+          placeholder="请输入字典类型"
           style="width: 240px"
           @keyup.enter="handleQuery"
         />
@@ -28,8 +28,8 @@
       <el-form-item label="状态" prop="status">
         <el-select
           v-model="queryParams.status"
-          placeholder="字典状态"
           clearable
+          placeholder="字典状态"
           style="width: 240px"
         >
           <el-option
@@ -43,17 +43,17 @@
       <el-form-item label="创建时间" style="width: 308px">
         <el-date-picker
           v-model="dateRange"
-          value-format="YYYY-MM-DD"
-          type="daterange"
+          end-placeholder="结束日期"
           range-separator="-"
           start-placeholder="开始日期"
-          end-placeholder="结束日期"
+          type="daterange"
+          value-format="YYYY-MM-DD"
         ></el-date-picker>
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" icon="Search" @click="handleQuery"
-          >搜索</el-button
-        >
+        <el-button icon="Search" type="primary" @click="handleQuery"
+          >搜索
+        </el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -61,55 +61,55 @@
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
         <el-button
-          type="primary"
-          plain
-          icon="Plus"
-          @click="handleAdd"
           v-hasPermi="['system:dict:add']"
-          >新增</el-button
-        >
+          icon="Plus"
+          plain
+          type="primary"
+          @click="handleAdd"
+          >新增
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
-          type="success"
-          plain
-          icon="Edit"
-          :disabled="single"
-          @click="handleUpdate"
           v-hasPermi="['system:dict:edit']"
-          >修改</el-button
-        >
+          :disabled="single"
+          icon="Edit"
+          plain
+          type="success"
+          @click="handleUpdate"
+          >修改
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
-          type="danger"
-          plain
-          icon="Delete"
+          v-hasPermi="['system:dict:remove']"
           :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['system:dict:remove']"
-          >删除</el-button
-        >
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
+          icon="Delete"
           plain
-          icon="Download"
-          @click="handleExport"
-          v-hasPermi="['system:dict:export']"
-          >导出</el-button
-        >
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
           type="danger"
+          @click="handleDelete"
+          >删除
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['system:dict:export']"
+          icon="Download"
           plain
-          icon="Refresh"
-          @click="handleRefreshCache"
+          type="warning"
+          @click="handleExport"
+          >导出
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
           v-hasPermi="['system:dict:remove']"
-          >刷新缓存</el-button
-        >
+          icon="Refresh"
+          plain
+          type="danger"
+          @click="handleRefreshCache"
+          >刷新缓存
+        </el-button>
       </el-col>
       <right-toolbar
         v-model:showSearch="showSearch"
@@ -120,20 +120,21 @@
     <el-table
       v-loading="loading"
       :data="typeList"
+      class="custom-table-style"
       @selection-change="handleSelectionChange"
     >
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="字典编号" align="center" prop="dictId" />
+      <el-table-column align="center" type="selection" width="55" />
+      <el-table-column align="center" label="字典编号" prop="dictId" />
       <el-table-column
-        label="字典名称"
-        align="center"
-        prop="dictName"
         :show-overflow-tooltip="true"
+        align="center"
+        label="字典名称"
+        prop="dictName"
       />
       <el-table-column
-        label="字典类型"
-        align="center"
         :show-overflow-tooltip="true"
+        align="center"
+        label="字典类型"
       >
         <template #default="scope">
           <router-link
@@ -144,20 +145,20 @@
           </router-link>
         </template>
       </el-table-column>
-      <el-table-column label="状态" align="center" prop="status">
+      <el-table-column align="center" label="状态" prop="status">
         <template #default="scope">
           <dict-tag :options="sys_normal_disable" :value="scope.row.status" />
         </template>
       </el-table-column>
       <el-table-column
-        label="备注"
-        align="center"
-        prop="remark"
         :show-overflow-tooltip="true"
+        align="center"
+        label="备注"
+        prop="remark"
       />
       <el-table-column
-        label="创建时间"
         align="center"
+        label="创建时间"
         prop="createTime"
         width="180"
       >
@@ -166,42 +167,42 @@
         </template>
       </el-table-column>
       <el-table-column
-        label="操作"
         align="center"
-        width="160"
         class-name="small-padding fixed-width"
+        label="操作"
+        width="160"
       >
         <template #default="scope">
           <el-button
-            link
-            type="primary"
-            icon="Edit"
-            @click="handleUpdate(scope.row)"
             v-hasPermi="['system:dict:edit']"
-            >修改</el-button
-          >
-          <el-button
+            icon="Edit"
             link
             type="primary"
-            icon="Delete"
-            @click="handleDelete(scope.row)"
+            @click="handleUpdate(scope.row)"
+            >修改
+          </el-button>
+          <el-button
             v-hasPermi="['system:dict:remove']"
-            >删除</el-button
-          >
+            icon="Delete"
+            link
+            type="primary"
+            @click="handleDelete(scope.row)"
+            >删除
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
 
     <pagination
       v-show="total > 0"
-      :total="total"
-      v-model:page="queryParams.pageNum"
       v-model:limit="queryParams.pageSize"
+      v-model:page="queryParams.pageNum"
+      :total="total"
       @pagination="getList"
     />
 
     <!-- 添加或修改参数配置对话框 -->
-    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+    <el-dialog v-model="open" :title="title" append-to-body width="500px">
       <el-form ref="dictRef" :model="form" :rules="rules" label-width="80px">
         <el-form-item label="字典名称" prop="dictName">
           <el-input v-model="form.dictName" placeholder="请输入字典名称" />
@@ -215,15 +216,15 @@
               v-for="dict in sys_normal_disable"
               :key="dict.value"
               :label="dict.value"
-              >{{ dict.label }}</el-radio
-            >
+              >{{ dict.label }}
+            </el-radio>
           </el-radio-group>
         </el-form-item>
         <el-form-item label="备注" prop="remark">
           <el-input
             v-model="form.remark"
-            type="textarea"
             placeholder="请输入内容"
+            type="textarea"
           ></el-input>
         </el-form-item>
       </el-form>
@@ -237,15 +238,15 @@
   </div>
 </template>
 
-<script setup name="Dict">
+<script name="Dict" setup>
 import useDictStore from "@/store/modules/dict";
 import {
-  listType,
-  getType,
-  delType,
   addType,
-  updateType,
+  delType,
+  getType,
+  listType,
   refreshCache,
+  updateType,
 } from "@/api/system/dict/type";
 
 const { proxy } = getCurrentInstance();
@@ -294,11 +295,13 @@ function getList() {
     }
   );
 }
+
 /** 取消按钮 */
 function cancel() {
   open.value = false;
   reset();
 }
+
 /** 表单重置 */
 function reset() {
   form.value = {
@@ -310,29 +313,34 @@ function reset() {
   };
   proxy.resetForm("dictRef");
 }
+
 /** 搜索按钮操作 */
 function handleQuery() {
   queryParams.value.pageNum = 1;
   getList();
 }
+
 /** 重置按钮操作 */
 function resetQuery() {
   dateRange.value = [];
   proxy.resetForm("queryRef");
   handleQuery();
 }
+
 /** 新增按钮操作 */
 function handleAdd() {
   reset();
   open.value = true;
   title.value = "添加字典类型";
 }
+
 /** 多选框选中数据 */
 function handleSelectionChange(selection) {
   ids.value = selection.map((item) => item.dictId);
   single.value = selection.length != 1;
   multiple.value = !selection.length;
 }
+
 /** 修改按钮操作 */
 function handleUpdate(row) {
   reset();
@@ -343,6 +351,7 @@ function handleUpdate(row) {
     title.value = "修改字典类型";
   });
 }
+
 /** 提交按钮 */
 function submitForm() {
   proxy.$refs["dictRef"].validate((valid) => {
@@ -363,6 +372,7 @@ function submitForm() {
     }
   });
 }
+
 /** 删除按钮操作 */
 function handleDelete(row) {
   const dictIds = row.dictId || ids.value;
@@ -377,6 +387,7 @@ function handleDelete(row) {
     })
     .catch(() => {});
 }
+
 /** 导出按钮操作 */
 function handleExport() {
   proxy.download(
@@ -387,6 +398,7 @@ function handleExport() {
     `dict_${new Date().getTime()}.xlsx`
   );
 }
+
 /** 刷新缓存按钮操作 */
 function handleRefreshCache() {
   refreshCache().then(() => {
diff --git a/src/views/system/menu/index.vue b/src/views/system/menu/index.vue
index 24e1a5d..8242ba8 100644
--- a/src/views/system/menu/index.vue
+++ b/src/views/system/menu/index.vue
@@ -1,16 +1,16 @@
 <template>
   <div class="app-container">
     <el-form
-      :model="queryParams"
+      v-show="showSearch"
       ref="queryRef"
       :inline="true"
-      v-show="showSearch"
+      :model="queryParams"
     >
       <el-form-item label="菜单名称" prop="menuName">
         <el-input
           v-model="queryParams.menuName"
-          placeholder="请输入菜单名称"
           clearable
+          placeholder="请输入菜单名称"
           style="width: 200px"
           @keyup.enter="handleQuery"
         />
@@ -18,8 +18,8 @@
       <el-form-item label="状态" prop="status">
         <el-select
           v-model="queryParams.status"
-          placeholder="菜单状态"
           clearable
+          placeholder="菜单状态"
           style="width: 200px"
         >
           <el-option
@@ -31,9 +31,9 @@
         </el-select>
       </el-form-item>
       <el-form-item>
-        <el-button type="primary" icon="Search" @click="handleQuery"
-          >搜索</el-button
-        >
+        <el-button icon="Search" type="primary" @click="handleQuery"
+          >搜索
+        </el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -41,18 +41,18 @@
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
         <el-button
-          type="primary"
-          plain
-          icon="Plus"
-          @click="handleAdd"
           v-hasPermi="['system:menu:add']"
-          >新增</el-button
-        >
+          icon="Plus"
+          plain
+          type="primary"
+          @click="handleAdd"
+          >新增
+        </el-button>
       </el-col>
       <el-col :span="1.5">
-        <el-button type="info" plain icon="Sort" @click="toggleExpandAll"
-          >展开/折叠</el-button
-        >
+        <el-button icon="Sort" plain type="info" @click="toggleExpandAll"
+          >展开/折叠
+        </el-button>
       </el-col>
       <right-toolbar
         v-model:showSearch="showSearch"
@@ -64,88 +64,89 @@
       v-if="refreshTable"
       v-loading="loading"
       :data="menuList"
-      row-key="menuId"
       :default-expand-all="isExpandAll"
       :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
+      class="custom-table-style"
+      row-key="menuId"
     >
       <el-table-column
-        prop="menuName"
-        label="菜单名称"
         :show-overflow-tooltip="true"
+        label="菜单名称"
+        prop="menuName"
         width="160"
       ></el-table-column>
-      <el-table-column prop="icon" label="图标" align="center" width="100">
+      <el-table-column align="center" label="图标" prop="icon" width="100">
         <template #default="scope">
           <svg-icon :icon-class="scope.row.icon" />
         </template>
       </el-table-column>
       <el-table-column
-        prop="orderNum"
         label="排序"
+        prop="orderNum"
         width="60"
       ></el-table-column>
       <el-table-column
-        prop="perms"
-        label="权限标识"
         :show-overflow-tooltip="true"
+        label="权限标识"
+        prop="perms"
       ></el-table-column>
       <el-table-column
-        prop="component"
-        label="组件路径"
         :show-overflow-tooltip="true"
+        label="组件路径"
+        prop="component"
       ></el-table-column>
-      <el-table-column prop="status" label="状态" width="80">
+      <el-table-column label="状态" prop="status" width="80">
         <template #default="scope">
           <dict-tag :options="sys_normal_disable" :value="scope.row.status" />
         </template>
       </el-table-column>
       <el-table-column
-        label="创建时间"
         align="center"
-        width="160"
+        label="创建时间"
         prop="createTime"
+        width="160"
       >
         <template #default="scope">
           <span>{{ parseTime(scope.row.createTime) }}</span>
         </template>
       </el-table-column>
       <el-table-column
-        label="操作"
         align="center"
-        width="210"
         class-name="small-padding fixed-width"
+        label="操作"
+        width="210"
       >
         <template #default="scope">
           <el-button
-            link
-            type="primary"
-            icon="Edit"
-            @click="handleUpdate(scope.row)"
             v-hasPermi="['system:menu:edit']"
-            >修改</el-button
-          >
-          <el-button
+            icon="Edit"
             link
             type="primary"
-            icon="Plus"
-            @click="handleAdd(scope.row)"
+            @click="handleUpdate(scope.row)"
+            >修改
+          </el-button>
+          <el-button
             v-hasPermi="['system:menu:add']"
-            >新增</el-button
-          >
-          <el-button
+            icon="Plus"
             link
             type="primary"
-            icon="Delete"
-            @click="handleDelete(scope.row)"
+            @click="handleAdd(scope.row)"
+            >新增
+          </el-button>
+          <el-button
             v-hasPermi="['system:menu:remove']"
-            >删除</el-button
-          >
+            icon="Delete"
+            link
+            type="primary"
+            @click="handleDelete(scope.row)"
+            >删除
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
 
     <!-- 添加或修改菜单对话框 -->
-    <el-dialog :title="title" v-model="open" width="680px" append-to-body>
+    <el-dialog v-model="open" :title="title" append-to-body width="680px">
       <el-form ref="menuRef" :model="form" :rules="rules" label-width="100px">
         <el-row>
           <el-col :span="24">
@@ -158,9 +159,9 @@
                   label: 'menuName',
                   children: 'children',
                 }"
-                value-key="menuId"
-                placeholder="选择上级菜单"
                 check-strictly
+                placeholder="选择上级菜单"
+                value-key="menuId"
               />
             </el-form-item>
           </el-col>
@@ -173,22 +174,22 @@
               </el-radio-group>
             </el-form-item>
           </el-col>
-          <el-col :span="24" v-if="form.menuType != 'F'">
+          <el-col v-if="form.menuType != 'F'" :span="24">
             <el-form-item label="菜单图标" prop="icon">
               <el-popover
-                placement="bottom-start"
-                :width="540"
                 v-model:visible="showChooseIcon"
+                :width="540"
+                placement="bottom-start"
                 trigger="click"
                 @show="showSelectIcon"
               >
                 <template #reference>
                   <el-input
                     v-model="form.icon"
-                    placeholder="点击选择图标"
-                    @blur="showSelectIcon"
                     v-click-outside="hideSelectIcon"
+                    placeholder="点击选择图标"
                     readonly
+                    @blur="showSelectIcon"
                   >
                     <template #prefix>
                       <svg-icon
@@ -197,9 +198,9 @@
                         class="el-input__icon"
                         style="height: 32px; width: 16px"
                       />
-                      <el-icon v-else style="height: 32px; width: 16px"
-                        ><search
-                      /></el-icon>
+                      <el-icon v-else style="height: 32px; width: 16px">
+                        <search />
+                      </el-icon>
                     </template>
                   </el-input>
                 </template>
@@ -216,12 +217,12 @@
             <el-form-item label="显示排序" prop="orderNum">
               <el-input-number
                 v-model="form.orderNum"
-                controls-position="right"
                 :min="0"
+                controls-position="right"
               />
             </el-form-item>
           </el-col>
-          <el-col :span="12" v-if="form.menuType != 'F'">
+          <el-col v-if="form.menuType != 'F'" :span="12">
             <el-form-item>
               <template #label>
                 <span>
@@ -239,7 +240,7 @@
               </el-radio-group>
             </el-form-item>
           </el-col>
-          <el-col :span="12" v-if="form.menuType != 'F'">
+          <el-col v-if="form.menuType != 'F'" :span="12">
             <el-form-item prop="path">
               <template #label>
                 <span>
@@ -255,7 +256,7 @@
               <el-input v-model="form.path" placeholder="请输入路由地址" />
             </el-form-item>
           </el-col>
-          <el-col :span="12" v-if="form.menuType == 'C'">
+          <el-col v-if="form.menuType == 'C'" :span="12">
             <el-form-item prop="component">
               <template #label>
                 <span>
@@ -271,12 +272,12 @@
               <el-input v-model="form.component" placeholder="请输入组件路径" />
             </el-form-item>
           </el-col>
-          <el-col :span="12" v-if="form.menuType != 'M'">
+          <el-col v-if="form.menuType != 'M'" :span="12">
             <el-form-item>
               <el-input
                 v-model="form.perms"
-                placeholder="请输入权限标识"
                 maxlength="100"
+                placeholder="请输入权限标识"
               />
               <template #label>
                 <span>
@@ -291,12 +292,12 @@
               </template>
             </el-form-item>
           </el-col>
-          <el-col :span="12" v-if="form.menuType == 'C'">
+          <el-col v-if="form.menuType == 'C'" :span="12">
             <el-form-item>
               <el-input
                 v-model="form.query"
-                placeholder="请输入路由参数"
                 maxlength="255"
+                placeholder="请输入路由参数"
               />
               <template #label>
                 <span>
@@ -311,7 +312,7 @@
               </template>
             </el-form-item>
           </el-col>
-          <el-col :span="12" v-if="form.menuType == 'C'">
+          <el-col v-if="form.menuType == 'C'" :span="12">
             <el-form-item>
               <template #label>
                 <span>
@@ -330,7 +331,7 @@
               </el-radio-group>
             </el-form-item>
           </el-col>
-          <el-col :span="12" v-if="form.menuType != 'F'">
+          <el-col v-if="form.menuType != 'F'" :span="12">
             <el-form-item>
               <template #label>
                 <span>
@@ -348,12 +349,12 @@
                   v-for="dict in sys_show_hide"
                   :key="dict.value"
                   :label="dict.value"
-                  >{{ dict.label }}</el-radio
-                >
+                  >{{ dict.label }}
+                </el-radio>
               </el-radio-group>
             </el-form-item>
           </el-col>
-          <el-col :span="12" v-if="form.menuType != 'F'">
+          <el-col v-if="form.menuType != 'F'" :span="12">
             <el-form-item>
               <template #label>
                 <span>
@@ -371,8 +372,8 @@
                   v-for="dict in sys_normal_disable"
                   :key="dict.value"
                   :label="dict.value"
-                  >{{ dict.label }}</el-radio
-                >
+                  >{{ dict.label }}
+                </el-radio>
               </el-radio-group>
             </el-form-item>
           </el-col>
@@ -388,7 +389,7 @@
   </div>
 </template>
 
-<script setup name="Menu">
+<script name="Menu" setup>
 import {
   addMenu,
   delMenu,
@@ -444,6 +445,7 @@ function getList() {
     loading.value = false;
   });
 }
+
 /** 查询菜单下拉树结构 */
 function getTreeselect() {
   menuOptions.value = [];
@@ -453,11 +455,13 @@ function getTreeselect() {
     menuOptions.value.push(menu);
   });
 }
+
 /** 取消按钮 */
 function cancel() {
   open.value = false;
   reset();
 }
+
 /** 表单重置 */
 function reset() {
   form.value = {
@@ -474,16 +478,19 @@ function reset() {
   };
   proxy.resetForm("menuRef");
 }
+
 /** 展示下拉图标 */
 function showSelectIcon() {
   iconSelectRef.value.reset();
   showChooseIcon.value = true;
 }
+
 /** 选择图标 */
 function selected(name) {
   form.value.icon = name;
   showChooseIcon.value = false;
 }
+
 /** 图标外层点击隐藏下拉列表 */
 function hideSelectIcon(event) {
   var elem =
@@ -496,15 +503,18 @@ function hideSelectIcon(event) {
     showChooseIcon.value = false;
   }
 }
+
 /** 搜索按钮操作 */
 function handleQuery() {
   getList();
 }
+
 /** 重置按钮操作 */
 function resetQuery() {
   proxy.resetForm("queryRef");
   handleQuery();
 }
+
 /** 新增按钮操作 */
 function handleAdd(row) {
   reset();
@@ -517,6 +527,7 @@ function handleAdd(row) {
   open.value = true;
   title.value = "添加菜单";
 }
+
 /** 展开/折叠操作 */
 function toggleExpandAll() {
   refreshTable.value = false;
@@ -525,6 +536,7 @@ function toggleExpandAll() {
     refreshTable.value = true;
   });
 }
+
 /** 修改按钮操作 */
 async function handleUpdate(row) {
   reset();
@@ -535,6 +547,7 @@ async function handleUpdate(row) {
     title.value = "修改菜单";
   });
 }
+
 /** 提交按钮 */
 function submitForm() {
   proxy.$refs["menuRef"].validate((valid) => {
@@ -555,6 +568,7 @@ function submitForm() {
     }
   });
 }
+
 /** 删除按钮操作 */
 function handleDelete(row) {
   proxy.$modal
diff --git a/src/views/thingsmodel/model/index.vue b/src/views/thingsmodel/model/index.vue
index 7a8f677..759d414 100644
--- a/src/views/thingsmodel/model/index.vue
+++ b/src/views/thingsmodel/model/index.vue
@@ -33,33 +33,33 @@
           />
         </el-select>
       </el-form-item>
-      <el-form-item label="租户" prop="tenantId">
-        <!--        <el-input-->
-        <!--          v-model="queryParams.tenantId"-->
-        <!--          clearable-->
-        <!--          placeholder="请输入租户ID"-->
-        <!--          @keyup.enter="handleQuery"-->
-        <!--        />-->
-        <el-select
-          v-model="queryParams.tenantId"
-          :remote-method="getTenantOptions"
-          filterable
-          remote
-          remote-show-suffix
-        >
-          <el-option
-            v-for="item in tenantOptions"
-            :key="item.tenantId"
-            :label="item.tenantName"
-            :value="item.tenantId"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="标识符，产品下唯一" prop="identifier">
+      <!--      <el-form-item label="租户" prop="tenantId">-->
+      <!--        &lt;!&ndash;        <el-input&ndash;&gt;-->
+      <!--        &lt;!&ndash;          v-model="queryParams.tenantId"&ndash;&gt;-->
+      <!--        &lt;!&ndash;          clearable&ndash;&gt;-->
+      <!--        &lt;!&ndash;          placeholder="请输入租户ID"&ndash;&gt;-->
+      <!--        &lt;!&ndash;          @keyup.enter="handleQuery"&ndash;&gt;-->
+      <!--        &lt;!&ndash;        />&ndash;&gt;-->
+      <!--        <el-select-->
+      <!--          v-model="queryParams.tenantId"-->
+      <!--          :remote-method="getTenantOptions"-->
+      <!--          filterable-->
+      <!--          remote-->
+      <!--          remote-show-suffix-->
+      <!--        >-->
+      <!--          <el-option-->
+      <!--            v-for="item in tenantOptions"-->
+      <!--            :key="item.tenantId"-->
+      <!--            :label="item.tenantName"-->
+      <!--            :value="item.tenantId"-->
+      <!--          />-->
+      <!--        </el-select>-->
+      <!--      </el-form-item>-->
+      <el-form-item label="标识" prop="identifier">
         <el-input
           v-model="queryParams.identifier"
           clearable
-          placeholder="请输入标识符，产品下唯一"
+          placeholder="请输入标识，产品下唯一"
           @keyup.enter="handleQuery"
         />
       </el-form-item>
@@ -140,17 +140,14 @@
       v-loading="loading"
       :data="modelList"
       @selection-change="handleSelectionChange"
+      class="custom-table-style"
     >
       <el-table-column align="center" type="selection" width="55" />
       <el-table-column align="center" label="物模型ID" prop="modelId" />
       <el-table-column align="center" label="物模型名称" prop="modelName" />
       <el-table-column align="center" label="产品ID" prop="productId" />
       <!--      <el-table-column align="center" label="租户ID" prop="tenantId" />-->
-      <el-table-column
-        align="center"
-        label="标识符，产品下唯一"
-        prop="identifier"
-      />
+      <el-table-column align="center" label="标识" prop="identifier" />
       <el-table-column align="center" label="模型类别" prop="type">
         <template #default="{ row }">
           <dict-tag :options="modelTypeDict" :value="[row.type]"></dict-tag>
@@ -241,27 +238,27 @@
           </el-select>
           <!--          <el-input v-model="form.productId" placeholder="请输入产品ID" />-->
         </el-form-item>
-        <el-form-item label="租户" prop="tenantId">
-          <!--          <el-input v-model="form.tenantId" placeholder="请输入租户ID" />-->
-          <el-select
-            v-model="form.tenantId"
-            :remote-method="getTenantOptions"
-            filterable
-            remote
-            remote-show-suffix
-          >
-            <el-option
-              v-for="item in tenantOptions"
-              :key="item.tenantId"
-              :label="item.tenantName"
-              :value="item.tenantId"
-            />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="标识符，产品下唯一" prop="identifier">
+        <!--        <el-form-item label="租户" prop="tenantId">-->
+        <!--          &lt;!&ndash;          <el-input v-model="form.tenantId" placeholder="请输入租户ID" />&ndash;&gt;-->
+        <!--          <el-select-->
+        <!--            v-model="form.tenantId"-->
+        <!--            :remote-method="getTenantOptions"-->
+        <!--            filterable-->
+        <!--            remote-->
+        <!--            remote-show-suffix-->
+        <!--          >-->
+        <!--            <el-option-->
+        <!--              v-for="item in tenantOptions"-->
+        <!--              :key="item.tenantId"-->
+        <!--              :label="item.tenantName"-->
+        <!--              :value="item.tenantId"-->
+        <!--            />-->
+        <!--          </el-select>-->
+        <!--        </el-form-item>-->
+        <el-form-item label="标识" prop="identifier">
           <el-input
             v-model="form.identifier"
-            placeholder="请输入标识符，产品下唯一"
+            placeholder="请输入标识，产品下唯一"
           />
         </el-form-item>
         <!--        <el-form-item label="是否首页显示" prop="isTop">-->
@@ -280,8 +277,8 @@
         <el-form-item label="模型类别" prop="type">
           <el-radio-group v-model="form.type" @change="typeChange(form.type)">
             <el-radio-button :label="1">属性</el-radio-button>
-            <el-radio-button :label="2">功能</el-radio-button>
             <el-radio-button :label="3">事件</el-radio-button>
+            <el-radio-button :label="2">服务</el-radio-button>
           </el-radio-group>
         </el-form-item>
         <el-divider />
diff --git a/src/views/thingsmodel/template/index.vue b/src/views/thingsmodel/template/index.vue
index 98fa8aa..77f1375 100644
--- a/src/views/thingsmodel/template/index.vue
+++ b/src/views/thingsmodel/template/index.vue
@@ -117,6 +117,7 @@
       v-loading="loading"
       :data="templateList"
       border
+      class="custom-table-style"
       @selection-change="handleSelectionChange"
     >
       <el-table-column align="center" type="selection" width="55" />
@@ -236,8 +237,8 @@
         <el-form-item label="模型类别" prop="type">
           <el-radio-group v-model="form.type" @change="typeChange(form.type)">
             <el-radio-button :label="1">属性</el-radio-button>
-            <el-radio-button :label="2">功能</el-radio-button>
             <el-radio-button :label="3">事件</el-radio-button>
+            <el-radio-button :label="2">服务</el-radio-button>
           </el-radio-group>
         </el-form-item>
         <!--        <el-form-item label="是否首页显示" prop="isTop">-->
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 0000000..cb2043b
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,16 @@
+{
+  "extends": "@vue/tsconfig/tsconfig.web.json",
+  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+
+  "references": [
+    {
+      "path": "./tsconfig.node.json"
+    }
+  ]
+}
diff --git a/tsconfig.node.json b/tsconfig.node.json
new file mode 100644
index 0000000..424084a
--- /dev/null
+++ b/tsconfig.node.json
@@ -0,0 +1,8 @@
+{
+  "extends": "@vue/tsconfig/tsconfig.node.json",
+  "include": ["vite.config.*", "vitest.config.*", "cypress.config.*", "playwright.config.*"],
+  "compilerOptions": {
+    "composite": true,
+    "types": ["node"]
+  }
+}
diff --git a/vite.config.js b/vite.config.js
index 70193cd..9d2ce00 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -31,7 +31,7 @@ export default defineConfig(({ mode, command }) => {
       proxy: {
         // https://cn.vitejs.dev/config/#server-proxy
         "/dev-api": {
-          target: "http://192.168.1.3:1616",
+          target: "http://192.168.1.201:1616",
           changeOrigin: true,
           rewrite: (p) => p.replace(/^\/dev-api/, ""),
         },