diff --git a/src/api/device/alert.js b/src/api/device/alert.js
new file mode 100644
index 0000000..ead6e93
--- /dev/null
+++ b/src/api/device/alert.js
@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询设备告警列表
+export function listAlert(query) {
+  return request({
+    url: "/device/alert/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询设备告警详细
+export function getAlert(alertId) {
+  return request({
+    url: "/device/alert/" + alertId,
+    method: "get",
+  });
+}
+
+// 新增设备告警
+export function addAlert(data) {
+  return request({
+    url: "/device/alert",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改设备告警
+export function updateAlert(data) {
+  return request({
+    url: "/device/alert",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除设备告警
+export function delAlert(alertId) {
+  return request({
+    url: "/device/alert/" + alertId,
+    method: "delete",
+  });
+}
diff --git a/src/api/product/alertRule.js b/src/api/product/alertRule.js
new file mode 100644
index 0000000..f941fbe
--- /dev/null
+++ b/src/api/product/alertRule.js
@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询设备告警列表
+export function listAlertRule(query) {
+  return request({
+    url: "/product/alertRule/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询设备告警详细
+export function getAlertRule(alertId) {
+  return request({
+    url: "/product/alertRule/" + alertId,
+    method: "get",
+  });
+}
+
+// 新增设备告警
+export function addAlertRule(data) {
+  return request({
+    url: "/product/alertRule",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改设备告警
+export function updateAlertRule(data) {
+  return request({
+    url: "/product/alertRule",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除设备告警
+export function delAlertRule(alertId) {
+  return request({
+    url: "/product/alertRule/" + alertId,
+    method: "delete",
+  });
+}
diff --git a/src/api/thingsmodel/model.js b/src/api/thingsmodel/model.js
new file mode 100644
index 0000000..f09f1a9
--- /dev/null
+++ b/src/api/thingsmodel/model.js
@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询物模型列表
+export function listModel(query) {
+  return request({
+    url: "/thingsmodel/model/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询物模型详细
+export function getModel(modelId) {
+  return request({
+    url: "/thingsmodel/model/" + modelId,
+    method: "get",
+  });
+}
+
+// 新增物模型
+export function addModel(data) {
+  return request({
+    url: "/thingsmodel/model",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改物模型
+export function updateModel(data) {
+  return request({
+    url: "/thingsmodel/model",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除物模型
+export function delModel(modelId) {
+  return request({
+    url: "/thingsmodel/model/" + modelId,
+    method: "delete",
+  });
+}
diff --git a/src/api/thingsmodel/template.js b/src/api/thingsmodel/template.js
new file mode 100644
index 0000000..c53bfb2
--- /dev/null
+++ b/src/api/thingsmodel/template.js
@@ -0,0 +1,44 @@
+import request from "@/utils/request";
+
+// 查询物模型模板列表
+export function listTemplate(query) {
+  return request({
+    url: "/thingsmodel/template/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询物模型模板详细
+export function getTemplate(templateId) {
+  return request({
+    url: "/thingsmodel/template/" + templateId,
+    method: "get",
+  });
+}
+
+// 新增物模型模板
+export function addTemplate(data) {
+  return request({
+    url: "/thingsmodel/template",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改物模型模板
+export function updateTemplate(data) {
+  return request({
+    url: "/thingsmodel/template",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除物模型模板
+export function delTemplate(templateId) {
+  return request({
+    url: "/thingsmodel/template/" + templateId,
+    method: "delete",
+  });
+}
diff --git a/src/constant/dict.js b/src/constant/dict.js
index 8402846..6eff47b 100644
--- a/src/constant/dict.js
+++ b/src/constant/dict.js
@@ -13,16 +13,25 @@ export const vertificateMethodOptions = new Map([
   [2, "加密认证"],
   [3, "简单+加密"],
 ]);
-
-export const isTopMap = new Map([
-  [0, "是"],
-  [1, "否"],
+export const dataTypeMap = new Map([
+  ["integer", "整数"],
+  ["decimal", "小数"],
+  ["bool", "布尔"],
+  ["enum", "枚举"],
+  ["string", "字符串"],
+  ["array", "数组"],
 ]);
-
-export const isMonitor = new Map([
-  [0, "是"],
-  [1, "否"],
+// export const isTopMap = new Map([[0, "是"], [1, "否"]]);
+export const isSysMap = new Map([
+  [0, "否"],
+  [1, "是"],
 ]);
+export const modelType = new Map([
+  [1, "属性"],
+  [2, "功能"],
+  [3, "事件"],
+]);
+// export const isMonitor = new Map([[0, "是"], [1, "否"]]);
 
 export const productStatusMap = [
   {
diff --git a/src/utils/thingsmodel.js b/src/utils/thingsmodel.js
new file mode 100644
index 0000000..d11f1db
--- /dev/null
+++ b/src/utils/thingsmodel.js
@@ -0,0 +1,49 @@
+/** 格式化显示数据定义 */
+export const formatSpecsDisplay = (json) => {
+  let specs = JSON.parse(json);
+  if (!specs) {
+    return;
+  }
+  if (specs.type === "integer" || specs.type === "decimal") {
+    return (
+      "<span style='width:50%;display:inline-block;'>最大值：<span style=\"color:#F56C6C\">" +
+      specs.max +
+      '</span></span>最小值：<span style="color:#F56C6C">' +
+      specs.min +
+      "</span><br /><span style='width:50%;display:inline-block;'>步长：<span style=\"color:#F56C6C\">" +
+      specs.step +
+      '</span></span>单位：<span style="color:#F56C6C">' +
+      specs.unit
+    );
+  } else if (specs.type === "string") {
+    return (
+      '最大长度：<span style="color:#F56C6C">' + specs.maxLength + "</span>"
+    );
+  } else if (specs.type === "array") {
+    return (
+      '数组类型：<span style="color:#F56C6C">' + specs.arrayType + "</span>"
+    );
+  } else if (specs.type === "enum") {
+    let items = "";
+    for (let i = 0; i < specs.enumList.length; i++) {
+      items =
+        items +
+        "<span style='width:50%;display:inline-block;'>" +
+        specs.enumList[i].value +
+        "：<span style='color:#F56C6C'>" +
+        specs.enumList[i].text +
+        "</span></span>";
+      if (i > 0 && i % 2 !== 0) {
+        items = items + "<br />";
+      }
+    }
+    return items;
+  } else if (specs.type === "bool") {
+    return (
+      "<span style='width:50%;display:inline-block;'>0：<span style=\"color:#F56C6C\">" +
+      specs.falseText +
+      '</span></span>1：<span style="color:#F56C6C">' +
+      specs.trueText
+    );
+  }
+};
diff --git a/src/views/components/model-type-tags/index.vue b/src/views/components/model-type-tags/index.vue
new file mode 100644
index 0000000..f3ff386
--- /dev/null
+++ b/src/views/components/model-type-tags/index.vue
@@ -0,0 +1,21 @@
+<template>
+  <el-tag v-if="type === 1" effect="dark" size="small" type="success">
+    属性
+  </el-tag>
+  <el-tag v-else-if="type === 2" effect="dark" size="small" type="warning">
+    功能
+  </el-tag>
+  <el-tag v-else-if="type === 3" effect="dark" size="small"> 事件 </el-tag>
+  <el-tag v-else effect="dark" size="small" type="info"> 未知 </el-tag>
+</template>
+
+<script setup>
+const props = defineProps({
+  type: {
+    type: Number,
+    required: true,
+  },
+});
+</script>
+
+<style scoped></style>
diff --git a/src/views/product/device/alert/index.vue b/src/views/product/device/alert/index.vue
new file mode 100644
index 0000000..b8dd120
--- /dev/null
+++ b/src/views/product/device/alert/index.vue
@@ -0,0 +1,349 @@
+<template>
+  <div class="app-container">
+    <el-form
+      v-show="showSearch"
+      ref="queryRef"
+      :inline="true"
+      :model="queryParams"
+      label-width="68px"
+    >
+      <el-form-item label="" prop="tenantId">
+        <el-input
+          v-model="queryParams.tenantId"
+          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="alertLevel">
+        <el-input
+          v-model="queryParams.alertLevel"
+          clearable
+          placeholder="请输入告警级别"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="产品ID" prop="productId">
+        <el-input
+          v-model="queryParams.productId"
+          clearable
+          placeholder="请输入产品ID"
+          @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="['device:alert:add']"
+          icon="Plus"
+          plain
+          type="primary"
+          @click="handleAdd"
+          >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['device:alert:edit']"
+          :disabled="single"
+          icon="Edit"
+          plain
+          type="success"
+          @click="handleUpdate"
+          >修改
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['device:alert:remove']"
+          :disabled="multiple"
+          icon="Delete"
+          plain
+          type="danger"
+          @click="handleDelete"
+          >删除
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['device:alert: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="alertList"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column align="center" type="selection" width="55" />
+      <el-table-column align="center" label="告警ID" prop="alertId" />
+      <el-table-column align="center" label="" prop="tenantId" />
+      <el-table-column align="center" label="告警名称" prop="alertName" />
+      <el-table-column align="center" label="告警级别" prop="alertLevel" />
+      <el-table-column align="center" label="产品ID" prop="productId" />
+      <el-table-column align="center" label="触发器" prop="triggers" />
+      <el-table-column align="center" label="执行动作" prop="actions" />
+      <el-table-column align="center" label="告警状态" prop="status" />
+      <el-table-column align="center" label="备注" prop="remark" />
+      <el-table-column
+        align="center"
+        class-name="small-padding fixed-width"
+        label="操作"
+      >
+        <template #default="scope">
+          <el-button
+            v-hasPermi="['device:alert:edit']"
+            icon="Edit"
+            link
+            type="primary"
+            @click="handleUpdate(scope.row)"
+            >修改
+          </el-button>
+          <el-button
+            v-hasPermi="['device:alert:remove']"
+            icon="Delete"
+            link
+            type="primary"
+            @click="handleDelete(scope.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="alertRef" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="" prop="tenantId">
+          <el-input v-model="form.tenantId" placeholder="请输入" />
+        </el-form-item>
+        <el-form-item label="告警名称" prop="alertName">
+          <el-input v-model="form.alertName" placeholder="请输入告警名称" />
+        </el-form-item>
+        <el-form-item label="告警级别" prop="alertLevel">
+          <el-input v-model="form.alertLevel" placeholder="请输入告警级别" />
+        </el-form-item>
+        <el-form-item label="产品ID" prop="productId">
+          <el-input v-model="form.productId" placeholder="请输入产品ID" />
+        </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="Alert" setup>
+import {
+  addAlert,
+  delAlert,
+  getAlert,
+  listAlert,
+  updateAlert,
+} from "@/api/device/alert";
+
+const { proxy } = getCurrentInstance();
+
+const alertList = 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,
+    tenantId: null,
+    alertName: null,
+    alertLevel: null,
+    productId: null,
+    triggers: null,
+    actions: null,
+    status: null,
+  },
+  rules: {
+    alertName: [
+      { required: true, message: "告警名称不能为空", trigger: "blur" },
+    ],
+    alertLevel: [
+      { required: true, message: "告警级别不能为空", trigger: "blur" },
+    ],
+    productId: [{ required: true, message: "产品ID不能为空", trigger: "blur" }],
+    triggers: [{ required: true, message: "触发器不能为空", trigger: "blur" }],
+    actions: [{ required: true, message: "执行动作不能为空", trigger: "blur" }],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询设备告警列表 */
+function getList() {
+  loading.value = true;
+  listAlert(queryParams.value).then((response) => {
+    alertList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    alertId: null,
+    tenantId: null,
+    alertName: null,
+    alertLevel: null,
+    productId: null,
+    triggers: null,
+    actions: null,
+    status: null,
+    createBy: null,
+    createTime: null,
+    remark: null,
+  };
+  proxy.resetForm("alertRef");
+}
+
+/** 搜索按钮操作 */
+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;
+  getAlert(_alertId).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改设备告警";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["alertRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.alertId != null) {
+        updateAlert(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addAlert(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 delAlert(_alertIds);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "device/alert/export",
+    {
+      ...queryParams.value,
+    },
+    `alert_${new Date().getTime()}.xlsx`
+  );
+}
+
+getList();
+</script>
diff --git a/src/views/product/firmware/index.vue b/src/views/product/firmware/index.vue
index 7c0f9c7..571e8a4 100644
--- a/src/views/product/firmware/index.vue
+++ b/src/views/product/firmware/index.vue
@@ -5,6 +5,7 @@
       ref="queryRef"
       :inline="true"
       :model="queryParams"
+      :size="productId ? 'small' : 'default'"
       label-position="left"
       label-width="100px"
     >
@@ -89,6 +90,7 @@
       <el-col :span="1.5">
         <el-button
           v-hasPermi="['product:firmware:add']"
+          :size="productId ? 'small' : 'default'"
           icon="Plus"
           plain
           type="primary"
@@ -100,6 +102,7 @@
         <el-button
           v-hasPermi="['product:firmware:edit']"
           :disabled="single"
+          :size="productId ? 'small' : 'default'"
           icon="Edit"
           plain
           type="success"
@@ -111,6 +114,7 @@
         <el-button
           v-hasPermi="['product:firmware:remove']"
           :disabled="multiple"
+          :size="productId ? 'small' : 'default'"
           icon="Delete"
           plain
           type="danger"
@@ -121,6 +125,7 @@
       <el-col :span="1.5">
         <el-button
           v-hasPermi="['product:firmware:export']"
+          :size="productId ? 'small' : 'default'"
           icon="Download"
           plain
           type="warning"
@@ -136,6 +141,7 @@
 
     <el-table
       v-loading="loading"
+      :border="!!productId"
       :data="firmwareList"
       @selection-change="handleSelectionChange"
     >
@@ -234,7 +240,7 @@
         <el-form-item label="产品" prop="productId">
           <el-select
             v-model="form.productId"
-            :disabled="productId"
+            :disabled="!!productId"
             :remote-method="getProductOptions"
             filterable
             placeholder="请选择产品"
diff --git a/src/views/product/product/edit.vue b/src/views/product/product/edit.vue
index 9164289..23a7fff 100644
--- a/src/views/product/product/edit.vue
+++ b/src/views/product/product/edit.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="app-container">
-    <el-tabs tab-position="left">
+    <el-tabs tab-position="top">
       <el-tab-pane label="基本信息">
         <el-form
           ref="productRef"
@@ -8,117 +8,78 @@
           :rules="rules"
           label-width="120px"
         >
-          <el-row :gutter="100">
-            <el-col :lg="12" :md="24" :sm="24" :xl="8" :xs="24">
-              <el-form-item label="产品名称" prop="productName">
-                <el-input
-                  v-model="form.productName"
-                  placeholder="请输入产品名称"
-                />
-              </el-form-item>
-              <el-form-item label="选择产品分类" prop="categoryId">
-                <el-tree-select
-                  v-model="form.categoryId"
-                  :data="categoryOptions"
-                  :props="{
-                    value: 'categoryId',
-                    label: 'name',
-                    children: 'children',
-                  }"
-                  check-strictly
-                  placeholder="请选择产品分类"
-                  value-key="categoryId"
-                />
-              </el-form-item>
-
-              <el-form-item label="租户ID" prop="tenantId">
-                <el-select
-                  v-model="form.tenantId"
-                  :remote-method="getTenantList"
-                  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="remark">
-                <el-input
-                  v-model="form.remark"
-                  placeholder="请输入内容"
-                  type="textarea"
-                />
-              </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>
-              <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-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-col>
-          </el-row>
-          <el-col :span="20">
+          <!--          <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',
+              marginTop: '20px',
+            }"
+          >
+            <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>
+            <el-form-item label="产品名称" prop="productName">
+              <el-input
+                v-model="form.productName"
+                placeholder="请输入产品名称"
+              />
+            </el-form-item>
+            <el-form-item label="产品分类" prop="categoryId">
+              <el-tree-select
+                v-model="form.categoryId"
+                :data="categoryOptions"
+                :props="{
+                  value: 'categoryId',
+                  label: 'name',
+                  children: 'children',
+                }"
+                check-strictly
+                clearable
+                placeholder="请选择产品分类"
+                value-key="categoryId"
+              />
+            </el-form-item>
+            <el-form-item label="设备类型" prop="deviceType">
+              <el-select v-model="form.deviceType" clearable>
+                <el-option :value="1" label="直连设备" />
+                <el-option :value="2" label="网关子设备" />
+                <el-option :value="3" label="网关设备" />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="厂商" prop="companyName">
+              <el-input
+                v-model="form.companyName"
+                placeholder="请输入厂商名称"
+              />
+            </el-form-item>
+            <el-form-item label="型号" prop="model">
+              <el-input v-model="form.model" placeholder="请输入型号" />
+            </el-form-item>
+            <el-form-item label="描述" prop="remark">
+              <el-input
+                v-model="form.remark"
+                placeholder="请输入描述"
+                type="textarea"
+              />
+            </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">
               <el-button
                 v-if="form.status !== 2"
@@ -127,14 +88,140 @@
                 >提交
               </el-button>
             </el-form-item>
-          </el-col>
+          </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="产品模型">
         <model
+          v-if="form.productId"
           ref="modelRef"
           :model-json="form.thingsModelsJson"
           :product="form"
+          :product-id="form.productId"
           @model-updated="getData"
         />
       </el-tab-pane>
@@ -142,7 +229,9 @@
         <firmware v-if="form.productId" :product-id="form.productId" />
       </el-tab-pane>
       <el-tab-pane :disabled="!form.productId" label="设备授权"></el-tab-pane>
-      <el-tab-pane :disabled="!form.productId" label="告警配置"></el-tab-pane>
+      <el-tab-pane :disabled="!form.productId" label="告警配置">
+        <alert :product="form" :product-id="form.productId" />
+      </el-tab-pane>
       <el-tab-pane :disabled="!form.productId" label="控制界面"></el-tab-pane>
     </el-tabs>
   </div>
@@ -151,7 +240,7 @@
 <script setup>
 import Firmware from "@/views/product/firmware/index.vue";
 import { onMounted, reactive, ref, toRefs } from "vue";
-import Model from "@/views/product/product/components/model.vue";
+import Model from "@/views/product/product/panes/model.vue";
 import { useRoute } from "vue-router";
 import {
   addProduct,
@@ -164,8 +253,8 @@ import { listTenant } from "@/api/system/tenant";
 import ImageUpload from "@/components/ImageUpload/index.vue";
 import { ElMessage } from "element-plus";
 import tab from "@/plugins/tab";
-import { vertificateMethodOptions } from "@/constant/dict";
 import { debounce } from "lodash-es";
+import Alert from "@/views/product/product/panes/alert.vue";
 
 const checkProductSnUnique = debounce((rule, value, callback) => {
   if (!value) {
@@ -217,6 +306,7 @@ const productRef = ref();
 const categoryOptions = ref([]); // 产品分类树形选择
 const tenantOptions = ref([]);
 const isProductSnUnique = ref();
+const showTenantTip = ref(false);
 
 // 表单重置
 function reset() {
@@ -233,6 +323,8 @@ function reset() {
     thingsModelsJson: null,
     deviceType: null,
     vertificateMethod: null,
+    model: null,
+    companyName: null,
     imgUrl: null,
     createBy: null,
     createTime: null,
@@ -301,7 +393,14 @@ onMounted(() => {
 });
 
 getCategoryList();
-getTenantList();
+// getTenantList();
 </script>
 
-<style scoped></style>
+<style lang="scss" scoped>
+:deep(.el-tabs__nav-wrap) {
+  .el-tabs__nav-scroll {
+    display: flex;
+    justify-content: center;
+  }
+}
+</style>
diff --git a/src/views/product/product/index.vue b/src/views/product/product/index.vue
index bc975f8..1ec2523 100644
--- a/src/views/product/product/index.vue
+++ b/src/views/product/product/index.vue
@@ -28,6 +28,7 @@
         <el-tree-select
           v-model="queryParams.categoryId"
           :data="categoryOptions"
+          clearable
           :props="{
             value: 'categoryId',
             label: 'name',
@@ -149,10 +150,10 @@
       @selection-change="handleSelectionChange"
     >
       <el-table-column align="center" type="selection" width="55" />
-      <el-table-column align="center" label="产品ID" prop="productId" />
+      <!--      <el-table-column align="center" label="产品ID" prop="productId" />-->
       <el-table-column align="center" label="产品编码SN" prop="productSn" />
       <el-table-column align="center" label="产品名称" prop="productName" />
-      <el-table-column align="center" label="产品分类ID" prop="categoryId">
+      <el-table-column align="center" label="产品分类" prop="categoryId">
         <template #default="{ row }">
           {{ findNode(categoryOptions, row.categoryId)?.name }}
         </template>
@@ -196,7 +197,10 @@
       </el-table-column>
       <el-table-column align="center" label="产品图片" prop="imgUrl">
         <template #default="{ row }">
-          <el-image :src="`/dev-api/${row.imgUrl}`"></el-image>
+          <el-image
+            :preview-src-list="[`${baseUrl}/${row.imgUrl}`]"
+            :src="`${baseUrl}/${row.imgUrl}`"
+          ></el-image>
         </template>
       </el-table-column>
       <el-table-column align="center" label="备注" prop="remark" />
@@ -212,7 +216,7 @@
             link
             type="primary"
             @click="handleUpdate(scope.row)"
-            >修改
+            >{{ scope.row.status === 2 ? "查看" : "修改" }}
           </el-button>
           <el-button
             v-hasPermi="['product:product:remove']"
diff --git a/src/views/product/product/panes/alert.vue b/src/views/product/product/panes/alert.vue
new file mode 100644
index 0000000..fbc4a5c
--- /dev/null
+++ b/src/views/product/product/panes/alert.vue
@@ -0,0 +1,942 @@
+<template>
+  <div class="app-container">
+    <el-form
+      v-show="showSearch"
+      ref="queryRef"
+      :inline="true"
+      :model="queryParams"
+      label-width="68px"
+    >
+      <el-form-item label="" prop="tenantId">
+        <el-input
+          v-model="queryParams.tenantId"
+          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="alertLevel">
+        <el-input
+          v-model="queryParams.alertLevel"
+          clearable
+          placeholder="请输入告警级别"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="产品ID" prop="productId">
+        <el-input
+          v-model="queryParams.productId"
+          clearable
+          placeholder="请输入产品ID"
+          @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">
+        <!--  TODO:        v-hasPermi="['device:alert:add']"-->
+        <el-button
+          icon="Plus"
+          plain
+          size="small"
+          type="primary"
+          @click="handleAdd"
+          >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          icon="refresh"
+          plain
+          size="small"
+          type="success"
+          @click="getList"
+          >刷新
+        </el-button>
+      </el-col>
+      <!--      <el-col :span="1.5">-->
+      <!--        <el-button-->
+      <!--          v-hasPermi="['device:alert:edit']"-->
+      <!--          :disabled="single"-->
+      <!--          icon="Edit"-->
+      <!--          plain-->
+      <!--          type="success"-->
+      <!--          @click="handleUpdate"-->
+      <!--        >修改-->
+      <!--        </el-button>-->
+      <!--      </el-col>-->
+      <!--      <el-col :span="1.5">-->
+      <!--        <el-button-->
+      <!--          v-hasPermi="['device:alert:remove']"-->
+      <!--          :disabled="multiple"-->
+      <!--          icon="Delete"-->
+      <!--          plain-->
+      <!--          type="danger"-->
+      <!--          @click="handleDelete"-->
+      <!--        >删除-->
+      <!--        </el-button>-->
+      <!--      </el-col>-->
+      <!--      <el-col :span="1.5">-->
+      <!--        <el-button-->
+      <!--          v-hasPermi="['device:alert: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="alertList"
+      border
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column align="center" type="selection" width="55" />
+      <!--      <el-table-column align="center" label="告警ID" prop="alertId" />-->
+      <!--      <el-table-column align="center" label="" prop="tenantId" />-->
+      <el-table-column align="center" label="告警名称" prop="alertName" />
+      <el-table-column align="center" label="告警级别" prop="alertLevel" />
+      <el-table-column align="center" label="产品" prop="productId" />
+      <el-table-column align="center" label="触发器" prop="triggers" />
+      <el-table-column align="center" label="执行动作" prop="actions" />
+      <el-table-column align="center" label="告警状态" prop="status" />
+      <el-table-column align="center" label="备注" prop="remark" />
+      <el-table-column
+        align="center"
+        class-name="small-padding fixed-width"
+        label="操作"
+      >
+        <template #default="{ row }">
+          <el-button
+            v-hasPermi="['device:alert:edit']"
+            icon="Edit"
+            link
+            type="primary"
+            @click="handleUpdate(row)"
+            >修改
+          </el-button>
+          <el-button
+            v-hasPermi="['device:alert: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="800px">
+      <div
+        class="el-divider el-divider--horizontal"
+        style="margin-top: -25px"
+      ></div>
+      <el-form ref="alertRef" :model="form" :rules="rules" label-width="80px">
+        <el-row :gutter="50">
+          <el-col :span="12">
+            <el-form-item label="告警名称" prop="alertName">
+              <el-input v-model="form.alertName" placeholder="请输入告警名称" />
+            </el-form-item>
+            <el-form-item label="告警级别" prop="alertLevel">
+              <el-select
+                v-model="form.alertLevel"
+                placeholder="请选择告警级别"
+                style="width: 100%"
+              >
+                <el-option
+                  v-for="dict in iot_alert_level"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="parseInt(dict.value)"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="告警状态">
+              <el-switch
+                v-model="form.status"
+                :active-value="1"
+                :inactive-value="0"
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="备注" prop="remark">
+              <el-input
+                v-model="form.remark"
+                placeholder="请输入内容"
+                rows="6"
+                type="textarea"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+
+        <el-divider></el-divider>
+        <el-form-item label="触发器" prop="triggers">
+          <el-select
+            v-model="form.condition"
+            placeholder="请选择"
+            style="margin-bottom: 10px; width: 100%"
+          >
+            <el-option
+              v-for="item in triggerConditions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+          <div
+            v-for="(item, index) in form.triggers"
+            :key="index"
+            style="margin-bottom: 15px; border: 1px solid #ddd; padding: 10px"
+          >
+            <el-row>
+              <el-col :span="4">
+                <el-select
+                  v-model="item.source"
+                  placeholder="请选择"
+                  size="small"
+                  @change="changeTriggerSource"
+                >
+                  <el-option
+                    v-for="subItem in triggerSource"
+                    :key="subItem.value"
+                    :label="subItem.label"
+                    :value="subItem.value"
+                  >
+                  </el-option>
+                </el-select>
+              </el-col>
+              <el-col v-if="item.source === 2" :offset="1" :span="16">
+                <el-time-picker
+                  v-model="timerTimeValue"
+                  :disabled="item.isAdvance === 1"
+                  placeholder="选择执行时间"
+                  size="small"
+                  value-format="HH:mm"
+                  @change="timeChange"
+                ></el-time-picker>
+              </el-col>
+              <el-col
+                v-if="index !== 0"
+                :offset="item.source === 1 ? 17 : 1"
+                :span="2"
+                ><a style="color: #f56c6c" @click="removeTriggerItem(index)"
+                  >删除</a
+                >
+              </el-col>
+            </el-row>
+
+            <!--定时-->
+            <el-row v-if="item.source === 2">
+              <el-col :span="24">
+                <el-row style="margin-bottom: 5px">
+                  <el-col :span="4">
+                    <el-select
+                      v-model="timerWeekRepeatValue"
+                      :disabled="item.isAdvance === 1"
+                      placeholder="请选择"
+                      size="small"
+                      @change="repeatChange"
+                    >
+                      <el-option
+                        v-for="item in timerWeekRepeats"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value"
+                      >
+                      </el-option>
+                    </el-select>
+                  </el-col>
+                  <el-col
+                    v-if="timerWeekRepeatValue === 3"
+                    :offset="1"
+                    :span="15"
+                  >
+                    <el-select
+                      v-model="timerWeekValue"
+                      :disabled="item.isAdvance === 1"
+                      multiple
+                      placeholder="请选择"
+                      size="small"
+                      style="width: 485px"
+                      @change="weekChange"
+                    >
+                      <el-option
+                        v-for="item in timerWeeks"
+                        :key="item.value"
+                        :label="item.label"
+                        :value="item.value"
+                      >
+                      </el-option>
+                    </el-select>
+                  </el-col>
+                </el-row>
+              </el-col>
+              <el-col :span="24">
+                <el-row>
+                  <el-col :span="18">
+                    <el-input
+                      v-model="item.cronExpression"
+                      :disabled="item.isAdvance === 0"
+                      placeholder="cron执行表达式"
+                      size="small"
+                    >
+                      <template slot="append">
+                        <el-button
+                          :disabled="item.isAdvance === 0"
+                          type="primary"
+                          @click="handleShowCron(item, index)"
+                        >
+                          生成表达式
+                          <i class="el-icon-time el-icon--right"></i>
+                        </el-button>
+                      </template>
+                    </el-input>
+                  </el-col>
+                  <el-col :offset="1" :span="4">
+                    <el-checkbox
+                      v-model="item.isAdvance"
+                      :false-label="0"
+                      :true-label="1"
+                      @change="customerCronChange"
+                    >
+                      自定义表达式
+                    </el-checkbox>
+                  </el-col>
+                </el-row>
+              </el-col>
+            </el-row>
+            <!--设备-->
+            <el-row>
+              <el-col :span="4">
+                <el-select
+                  v-model="item.modelType"
+                  placeholder="请选择"
+                  size="small"
+                >
+                  <el-option
+                    v-for="subItem in modelTypes"
+                    :key="subItem.value"
+                    :label="subItem.label"
+                    :value="subItem.value"
+                  >
+                  </el-option>
+                </el-select>
+              </el-col>
+              <el-col :offset="1" :span="4">
+                <el-select
+                  v-model="item.modelType"
+                  placeholder="请选择"
+                  size="small"
+                >
+                  <el-option
+                    v-for="subItem in modelTypes"
+                    :key="subItem.value"
+                    :label="subItem.label"
+                    :value="subItem.value"
+                  >
+                  </el-option>
+                </el-select>
+              </el-col>
+              <el-col :offset="1" :span="5">
+                <el-select
+                  v-model="item.operator"
+                  placeholder="请选择操作符"
+                  size="small"
+                >
+                  <el-option key="=" label="等于(=)" value="=" />
+                  <el-option key="!=" label="不等于(!=)" value="!=" />
+                  <el-option key=">" label="大于(>)" value=">" />
+                  <el-option key="<" label="小于(<)" value="<" />
+                  <el-option key=">=" label="大于等于(>=)" value=">=" />
+                  <el-option key="<=" label="小于等于(<=)" value="<=" />
+                  <el-option
+                    key="contain"
+                    label="包含(contain)"
+                    value="contain"
+                  />
+                  <el-option
+                    key="notcontain"
+                    label="不包含(not contain)"
+                    value="notcontain"
+                  />
+                </el-select>
+              </el-col>
+              <el-col :offset="1" :span="5">
+                <el-input v-model="item.value" placeholder="值" size="small" />
+              </el-col>
+            </el-row>
+          </div>
+          <div>
+            + <a style="color: #409eff" @click="addTriggerItem()">添加触发器</a>
+          </div>
+        </el-form-item>
+
+        <el-divider></el-divider>
+        <el-form-item label="执行动作">
+          <el-row
+            v-for="(item, index) in form.actions"
+            :key="index"
+            style="margin-bottom: 10px"
+          >
+            <el-col :span="4">
+              <el-select v-model="item.modelType" placeholder="请选择">
+                <el-option
+                  v-for="subItem in modelTypes"
+                  :key="subItem.value"
+                  :label="subItem.label"
+                  :value="subItem.value"
+                >
+                </el-option>
+              </el-select>
+            </el-col>
+            <el-col :offset="1" :span="4">
+              <el-select v-model="item.modelType" placeholder="请选择">
+                <el-option
+                  v-for="subItem in modelTypes"
+                  :key="subItem.value"
+                  :label="subItem.label"
+                  :value="subItem.value"
+                >
+                </el-option>
+              </el-select>
+            </el-col>
+            <el-col :offset="1" :span="11">
+              <el-input v-model="item.value" placeholder="值" />
+            </el-col>
+            <el-col v-if="index !== 0" :offset="1" :span="2"
+              ><a style="color: #f56c6c" @click="removeActionItem(index)"
+                >删除</a
+              ></el-col
+            >
+          </el-row>
+          <div>
+            +
+            <a style="color: #409eff" @click="addActionItem()">添加执行动作</a>
+          </div>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog
+      v-model="openCron"
+      append-to-body
+      class="scrollbar"
+      destroy-on-close
+      title="Cron表达式生成器"
+    >
+      <crontab
+        :expression="expression"
+        style="padding-bottom: 80px"
+        @fill="crontabFill"
+        @hide="openCron = false"
+      ></crontab>
+    </el-dialog>
+
+    <!-- 添加或修改设备告警对话框 -->
+    <!--    <el-dialog v-model="open" :title="title" append-to-body width="500px">-->
+    <!--      <el-form ref="alertRef" :model="form" :rules="rules" label-width="80px">-->
+    <!--        <el-form-item label="" prop="tenantId">-->
+    <!--          <el-input v-model="form.tenantId" placeholder="请输入" />-->
+    <!--        </el-form-item>-->
+    <!--        <el-form-item label="告警名称" prop="alertName">-->
+    <!--          <el-input v-model="form.alertName" placeholder="请输入告警名称" />-->
+    <!--        </el-form-item>-->
+    <!--        <el-form-item label="告警级别" prop="alertLevel">-->
+    <!--          <el-input v-model="form.alertLevel" placeholder="请输入告警级别" />-->
+    <!--        </el-form-item>-->
+    <!--        <el-form-item label="产品ID" prop="productId">-->
+    <!--          <el-input v-model="form.productId" placeholder="请输入产品ID" />-->
+    <!--        </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="Alert" setup>
+import Crontab from "@/components/Crontab/index.vue";
+import {
+  addAlertRule,
+  delAlertRule,
+  getAlertRule,
+  listAlertRule,
+  updateAlertRule,
+} from "@/api/product/alertRule";
+import { getCurrentInstance, reactive, ref, toRefs, watch } from "vue";
+import { useDict } from "@/utils/dict";
+
+const { proxy } = getCurrentInstance();
+const props = defineProps({
+  product: {
+    type: Object,
+    default: null,
+  },
+});
+
+const { product } = toRefs(props);
+
+const timerWeeks = [
+  {
+    value: 1,
+    label: "周一",
+  },
+  {
+    value: 2,
+    label: "周二",
+  },
+  {
+    value: 3,
+    label: "周三",
+  },
+  {
+    value: 4,
+    label: "周四",
+  },
+  {
+    value: 5,
+    label: "周五",
+  },
+  {
+    value: 6,
+    label: "周六",
+  },
+  {
+    value: 7,
+    label: "周日",
+  },
+];
+
+// 执行动作源
+const actionSource = [
+  {
+    value: 1,
+    label: "设备",
+  },
+  {
+    value: 3,
+    label: "告警输出",
+  },
+];
+// 物模型类别
+const modelTypes = [
+  {
+    value: 1,
+    label: "属性",
+  },
+  {
+    value: 2,
+    label: "功能",
+  },
+];
+// 触发器条件
+const triggerConditions = [
+  {
+    value: "all",
+    label: "满足所有条件",
+  },
+  {
+    value: "any",
+    label: "满足任一条件",
+  },
+];
+// 告警状态
+const alertType = [
+  {
+    value: 1,
+    label: "启动",
+  },
+  {
+    value: 2,
+    label: "停止",
+  },
+];
+
+const alertList = ref([]);
+const open = ref(false);
+const openCron = 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 expression = ref(""); // 传入的表达式
+const triggerIndex = ref(0); // 触发器的索引，用于接收传入的表达式
+const timerWeekRepeatValue = ref("1");
+const timerWeekValue = ref([1, 2, 3, 4, 5, 6, 7]);
+const triggerSource = ref([
+  {
+    value: 1,
+    label: "设备",
+  },
+  {
+    value: 2,
+    label: "定时",
+  },
+]);
+
+const { iot_alert_level, sys_job_status } = useDict(
+  "iot_alert_level",
+  "sys_job_status"
+);
+const data = reactive({
+  form: {
+    condition: "all", // 触发器条件
+    triggers: [],
+    actions: [],
+  },
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    tenantId: null,
+    alertName: null,
+    alertLevel: null,
+    productId: null,
+    triggers: null,
+    actions: null,
+    status: null,
+  },
+  rules: {
+    alertName: [
+      { required: true, message: "告警名称不能为空", trigger: "blur" },
+    ],
+    alertLevel: [
+      { required: true, message: "告警级别不能为空", trigger: "blur" },
+    ],
+    productId: [{ required: true, message: "产品ID不能为空", trigger: "blur" }],
+    triggers: [{ required: true, message: "触发器不能为空", trigger: "blur" }],
+    actions: [{ required: true, message: "执行动作不能为空", trigger: "blur" }],
+  },
+  // 产品
+  productInfo: {},
+  thingsModel: {},
+});
+
+const { queryParams, form, rules, productInfo } = toRefs(data);
+
+watch(product, (val) => {
+  productInfo.value = val;
+  if (productInfo.value && productInfo.value.productId !== 0) {
+    queryParams.value.productId = productInfo.value.productId;
+    getList();
+    // TODO:获取缓存的Json物模型
+    // getModel(val.productId).then(response => {
+    // thingsModel.value = JSON.parse(response.data);
+    // });
+  }
+});
+
+/** 查询设备告警列表 */
+function getList() {
+  loading.value = true;
+  listAlertRule(queryParams.value).then((response) => {
+    alertList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    alertId: null,
+    tenantId: null,
+    alertName: null,
+    alertLevel: null,
+    productId: null,
+    // triggers: null,
+    // actions: null,
+    status: null,
+    createBy: null,
+    createTime: null,
+    remark: null,
+    condition: "all", // 触发器条件
+    triggers: [
+      {
+        id: "",
+        name: "",
+        value: "",
+        deviceId: 0,
+        deviceName: "请选择一个设备",
+        source: 1, //1=设备，2=定时，3=告警输出
+        modelType: 1, // 1=属性，2=功能
+        jobId: 0,
+        cronExpression: "",
+        isAdvance: 0,
+      },
+    ],
+    actions: [
+      {
+        id: "",
+        name: "",
+        value: "",
+        deviceId: 0,
+        deviceName: "请选择一个设备",
+        source: 1, //1=设备，2=定时，3=告警输出
+        modelType: 1, // 1=属性，2=功能
+      },
+    ],
+  };
+  proxy.resetForm("alertRef");
+}
+
+/** 搜索按钮操作 */
+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;
+  getAlertRule(_alertId).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改设备告警";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["alertRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.alertId != null) {
+        updateAlertRule(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addAlertRule(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 delAlertRule(_alertIds);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "device/alert/export",
+    {
+      ...queryParams.value,
+    },
+    `alert_${new Date().getTime()}.xlsx`
+  );
+}
+
+/** 添加动作 */
+const addActionItem = () => {
+  form.value.actions.push({
+    id: "",
+    name: "",
+    value: "",
+  });
+};
+/** 删除动作 */
+const removeActionItem = (index) => {
+  form.value.actions.splice(index, 1);
+};
+/** 触发器源改变事件 **/
+const changeTriggerSource = () => {
+  setTriggerSource();
+};
+/** 设置触发器源 **/
+const setTriggerSource = () => {
+  // 触发器智能包含一个定时
+  let hasTimer = false;
+  for (let i = 0; i < form.value.triggers.length; i++) {
+    if (form.value.triggers[i].source === 2) {
+      hasTimer = true;
+    }
+  }
+  if (hasTimer) {
+    triggerSource.value = [
+      {
+        value: 1,
+        label: "设备",
+      },
+    ];
+  } else {
+    //定时
+    triggerSource.value = [
+      {
+        value: 1,
+        label: "设备",
+      },
+      {
+        value: 2,
+        label: "定时",
+      },
+    ];
+  }
+};
+/** 添加触发器 */
+const addTriggerItem = () => {
+  setTriggerSource();
+  form.value.triggers.push({
+    id: "",
+    name: "",
+    value: "",
+    deviceId: 0,
+    deviceName: "请选择一个设备",
+    source: 1, //1=设备，2=定时，3=告警输出
+    modelType: 1, // 1=属性，2=功能
+    jobId: 0,
+    cronExpression: "",
+    isAdvance: 0,
+  });
+};
+/** 删除触发器 */
+const removeTriggerItem = (index) => {
+  form.value.triggers.splice(index, 1);
+  setTriggerSource();
+};
+/** cron表达式按钮操作 */
+const handleShowCron = (item, index) => {
+  expression.value = item.cronExpression;
+  triggerIndex.value = index;
+  openCron.value = true;
+};
+/** 确定后回传值 */
+const crontabFill = (value) => {
+  form.value.triggers[triggerIndex.value].cronExpression = value;
+};
+/** 修改重复事件 **/
+const repeatChange = (data) => {
+  if (timerWeekRepeatValue.value === 1) {
+    // 每天
+    timerWeekValue.value = [1, 2, 3, 4, 5, 6, 7];
+    form.value.repeat = 1;
+  } else if (timerWeekRepeatValue.value === 2) {
+    // 仅此一次
+    timerWeekValue.value = [];
+    form.value.isRepeat = 0;
+  } else {
+    // 指定
+    form.value.isRepeat = 1;
+  }
+  gentCronExpression();
+};
+/** 星期改变事件 **/
+const weekChange = (data) => {
+  gentCronExpression();
+};
+/** 时间改变事件 **/
+const timeChange = (data) => {
+  gentCronExpression();
+};
+/**自定义cron表达式选项改变事件 */
+const customerCronChange = (data) => {
+  gentCronExpression();
+};
+/** 生成cron表达式**/
+const gentCronExpression = () => {
+  if (timerTimeValue.value === "") {
+    proxy.$modal.alertError("执行时间不能为空");
+  }
+  let minute = timerTimeValue.value.substring(0, 2);
+  let hour = timerTimeValue.value.substring(3);
+  let week = "*";
+  if (timerWeekValue.value.length > 0) {
+    week = timerWeekValue.value;
+  }
+  form.value.triggers[triggerIndex.value].cronExpression =
+    "0 " + minute + " " + hour + " ? * " + week;
+};
+
+getList();
+</script>
diff --git a/src/views/product/product/components/firmware.vue b/src/views/product/product/panes/firmware.vue
similarity index 100%
rename from src/views/product/product/components/firmware.vue
rename to src/views/product/product/panes/firmware.vue
diff --git a/src/views/product/product/components/model.vue b/src/views/product/product/panes/model.vue
similarity index 60%
rename from src/views/product/product/components/model.vue
rename to src/views/product/product/panes/model.vue
index 6dc4262..13da348 100644
--- a/src/views/product/product/components/model.vue
+++ b/src/views/product/product/panes/model.vue
@@ -12,7 +12,12 @@
         </el-button>
       </el-col>
       <el-col :span="1.5">
-        <el-button icon="upload" plain size="small" type="success" @click=""
+        <el-button
+          icon="upload"
+          plain
+          size="small"
+          type="success"
+          @click="handleImport"
           >导入
         </el-button>
       </el-col>
@@ -22,7 +27,7 @@
           plain
           size="small"
           type="warning"
-          @click="emits('model-updated')"
+          @click="getList"
           >刷新
         </el-button>
       </el-col>
@@ -32,14 +37,24 @@
           plain
           size="small"
           type="info"
-          @click="openJsonViewer = true"
+          @click="handleOpenThingsModel"
           >预览
         </el-button>
       </el-col>
+      <el-col :span="1.5">
+        <el-button
+          icon="download"
+          plain
+          size="small"
+          type="success"
+          @click="handleExport"
+          >导出
+        </el-button>
+      </el-col>
     </el-row>
     <el-table :data="modelList" border size="small">
-      <el-table-column align="center" label="名称" prop="name" />
-      <el-table-column align="center" label="标识符" prop="id" />
+      <el-table-column align="center" label="名称" prop="modelName" />
+      <el-table-column align="center" label="标识符" prop="identifier" />
 
       <!--      <el-table-column align="center" label="首页显示" prop="isTop">-->
       <!--        <template #default="{row}">-->
@@ -53,41 +68,44 @@
       <!--      </el-table-column>-->
       <el-table-column align="center" label="物模型类别" prop="type">
         <template #default="{ row }">
-          <el-tag v-if="row.type === 3" size="small">事件</el-tag>
-          <el-tag v-else-if="row.type === 2" size="small">功能</el-tag>
-          <el-tag v-else-if="row.type === 1" size="small">属性</el-tag>
-          <el-tag v-else size="small">未知</el-tag>
+          <model-type-tags :type="row.type" />
+          <!--          <el-tag v-if="row.type === 3" size="small" type="danger">事件</el-tag>-->
+          <!--          <el-tag v-else-if="row.type === 2" size="small" type="success">功能</el-tag>-->
+          <!--          <el-tag v-else-if="row.type === 1" size="small">属性</el-tag>-->
+          <!--          <el-tag v-else size="small">未知</el-tag>-->
         </template>
       </el-table-column>
       <el-table-column align="center" label="数据类型" prop="datatype">
         <template #default="{ row }">
           <el-tag v-if="row.datatype === 'integer'" size="small">整数</el-tag>
           <el-tag v-else-if="row.datatype === 'decimal'" size="small"
-            >小数</el-tag
-          >
+            >小数
+          </el-tag>
           <el-tag v-else-if="row.datatype === 'bool'" size="small">布尔</el-tag>
           <el-tag v-else-if="row.datatype === 'enum'" size="small">枚举</el-tag>
           <el-tag v-else-if="row.datatype === 'string'" size="small"
-            >字符串</el-tag
-          >
+            >字符串
+          </el-tag>
           <el-tag v-else-if="row.datatype === 'array'" size="small"
-            >数组</el-tag
-          >
+            >数组
+          </el-tag>
           <el-tag v-else size="small">未知</el-tag>
         </template>
       </el-table-column>
-      <el-table-column align="center" label="是否只读" prop="isReadonly">
+      <el-table-column align="center" label="只读数据" prop="isOnlyRead">
         <template #default="{ row }">
           <el-tag
             :type="
-              row.isReadonly === 0
+              row.isOnlyRead === 0
                 ? 'success'
-                : row.isReadonly === 1
+                : row.isOnlyRead === 1
                 ? 'warning'
                 : ''
             "
           >
-            {{ row.isReadonly === 0 ? "否" : row.isReadonly === 1 ? "是" : "" }}
+            {{
+              row.isOnlyRead === 0 ? "否" : row.isOnlyRead === 1 ? "是" : "未知"
+            }}
           </el-tag>
         </template>
       </el-table-column>
@@ -128,16 +146,16 @@
     <!-- 添加或修改物模型对话框 -->
     <el-dialog v-model="open" :title="title" append-to-body width="600px">
       <el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
-        <el-form-item label="模型名称" prop="name">
+        <el-form-item label="模型名称" prop="modelName">
           <el-input
-            v-model="form.name"
+            v-model="form.modelName"
             placeholder="请输入物模型名称，例如：温度"
             style="width: 385px"
           />
         </el-form-item>
-        <el-form-item label="标识符" prop="id">
+        <el-form-item label="标识符" prop="identifier">
           <el-input
-            v-model="form.id"
+            v-model="form.identifier"
             placeholder="请输入标识符，例如：temperature"
             style="width: 385px"
           />
@@ -149,9 +167,9 @@
             <el-radio-button :label="3">事件</el-radio-button>
           </el-radio-group>
         </el-form-item>
-        <el-form-item label="是否只读" prop="isReadonly">
+        <el-form-item label="只读数据" prop="isOnlyRead">
           <el-switch
-            v-model="form.isReadonly"
+            v-model="form.isOnlyRead"
             :active-value="1"
             :inactive-value="0"
             active-color="#13ce66"
@@ -336,10 +354,74 @@
       </template>
     </el-dialog>
 
-    <el-dialog v-model="openJsonViewer" append-to-body width="600px">
-      <json-viewer :value="JSON.parse(modelJson)" copyable>
-        <template #copy>复制</template>
-      </json-viewer>
+    <el-dialog
+      v-model="openJsonViewer"
+      :title="title"
+      append-to-body
+      width="600px"
+    >
+      <div
+        :style="{
+          height: '60vh',
+          overflowY: 'scroll',
+          overflowX: 'hidden',
+        }"
+      >
+        <json-viewer :expandDepth="4" :value="thingsModel" copyable expanded>
+          <template #copy>复制</template>
+        </json-viewer>
+      </div>
+    </el-dialog>
+
+    <!-- 用户导入对话框 -->
+    <el-dialog
+      v-model="upload.open"
+      :title="upload.title"
+      append-to-body
+      width="400px"
+    >
+      <el-upload
+        ref="uploadRef"
+        :action="upload.url"
+        :auto-upload="false"
+        :disabled="upload.isUploading"
+        :headers="upload.headers"
+        :limit="1"
+        :on-progress="handleFileUploadProgress"
+        :on-success="handleFileSuccess"
+        accept=".json"
+        drag
+      >
+        <el-icon class="el-icon--upload">
+          <upload-filled />
+        </el-icon>
+        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+        <template #tip>
+          <div class="el-upload__tip text-center">
+            <!--            <div class="el-upload__tip">-->
+            <!--              <el-checkbox-->
+            <!--                v-model="upload.updateSupport"-->
+            <!--              />-->
+            <!--              是否更新已经存在的用户数据-->
+            <!--            </div>-->
+            <!--            <span>仅允许导入xls、xlsx格式文件。</span>-->
+            <!--            <el-link-->
+            <!--              :underline="false"-->
+            <!--              style="font-size: 12px; vertical-align: baseline"-->
+            <!--              type="primary"-->
+            <!--              @click="importTemplate"-->
+            <!--            >下载模板-->
+            <!--            </el-link-->
+            <!--            >-->
+          </div>
+        </template>
+      </el-upload>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" @click="submitFileForm">确 定</el-button>
+          <el-button @click="upload.open = false">取 消</el-button>
+        </div>
+      </template>
     </el-dialog>
   </div>
 </template>
@@ -347,12 +429,18 @@
 <script setup>
 import { useRoute } from "vue-router";
 import { reactive, ref, toRefs, watch } from "vue";
-import { updateProduct } from "@/api/product/product";
 import "vue3-json-viewer/dist/index.css";
 import { JsonViewer } from "vue3-json-viewer";
 import { ElMessage, ElMessageBox } from "element-plus";
-import { v4 as uuidv4 } from "uuid";
-import { cloneDeep } from "lodash-es";
+import {
+  addModel,
+  delModel,
+  getModel,
+  listModel,
+  updateModel,
+} from "@/api/thingsmodel/model";
+import ModelTypeTags from "@/views/components/model-type-tags";
+import { getToken } from "@/utils/auth";
 
 const emits = defineEmits(["model-updated"]);
 
@@ -361,13 +449,17 @@ const props = defineProps({
     type: Object,
     required: true,
   },
+  productId: {
+    type: Number,
+    required: true,
+  },
   modelJson: {
     type: String,
   },
 });
-const { product, modelJson } = toRefs(props);
+const { product, modelJson, productId } = toRefs(props);
 const formRef = ref();
-
+const uploadRef = ref();
 const route = useRoute();
 /**
  * 检查标识符唯一性
@@ -375,25 +467,40 @@ const route = useRoute();
 const checkIdIsUnique = (rule, value, callback) => {
   if (
     modelList.value.findIndex(
-      (el) => el.id === value && el.modelId !== form.value.modelId
+      (el) => el.identifier === value && el.modelId !== form.value.modelId
     ) > -1
   ) {
-    callback(new Error("标识符不可重复"));
+    callback(new Error("同一产品下,标识符必须唯一"));
   }
   callback();
 };
 const data = reactive({
+  // 物模型
+  thingsModel: {},
+  queryParams: {
+    // pageNum: 1,
+    // pageSize: 100,
+    modelName: null,
+    productId: null,
+    tenantId: null,
+    identifier: null,
+    type: null,
+    datatype: null,
+    specs: null,
+    isTop: null,
+    isMonitor: null,
+  },
   form: {},
   rules: {
     // TODO: 标识符 id 不可重复
-    name: [
+    modelName: [
       {
         required: true,
         message: "物模型名称不能为空",
         trigger: "blur",
       },
     ],
-    id: [
+    identifier: [
       {
         required: true,
         message: "标识符，产品下唯一不能为空",
@@ -403,6 +510,10 @@ const data = reactive({
         validator: checkIdIsUnique,
         trigger: "change",
       },
+      {
+        validator: checkIdIsUnique,
+        trigger: "blur",
+      },
     ],
     datatype: [
       {
@@ -421,7 +532,69 @@ const data = reactive({
   },
 });
 const modelList = ref([]);
-const { form, rules } = toRefs(data);
+const { form, rules, queryParams, thingsModel } = toRefs(data);
+
+/*** 用户导入参数 */
+const upload = reactive({
+  // 是否显示弹出层（用户导入）
+  open: false,
+  // 弹出层标题（用户导入）
+  title: "",
+  // 是否禁用上传
+  isUploading: false,
+  // 是否更新已经存在的用户数据
+  updateSupport: 0,
+  // 设置上传的请求头部
+  headers: { Authorization: "Bearer " + getToken() },
+  // 上传的地址
+  url:
+    import.meta.env.VITE_APP_BASE_API +
+    "/thingsmodel/model/importData/" +
+    productId.value,
+});
+
+/** 下载模板操作 */
+function importTemplate() {
+  proxy.download(
+    "system/user/importTemplate",
+    {},
+    `user_template_${new Date().getTime()}.xlsx`
+  );
+}
+
+/** 导入按钮操作 */
+function handleImport() {
+  upload.title = "用户导入";
+  upload.open = true;
+}
+
+/**文件上传中处理 */
+const handleFileUploadProgress = (event, file, fileList) => {
+  upload.isUploading = true;
+};
+/** 文件上传成功处理 */
+const handleFileSuccess = (response, file, fileList) => {
+  upload.open = false;
+  upload.isUploading = false;
+  uploadRef.value.handleRemove(file);
+  if (response.code === 200) {
+    ElMessageBox.alert(
+      "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
+        response.msg +
+        "</div>",
+      "导入结果",
+      { dangerouslyUseHTMLString: true }
+    );
+    getList();
+  } else {
+    ElMessage.error(response.msg ?? "导入失败");
+  }
+};
+
+/** 提交上传文件 */
+function submitFileForm() {
+  uploadRef.value.submit();
+}
 
 const open = ref(false); // 是否显示编辑对话框
 const openJsonViewer = ref(false);
@@ -432,36 +605,55 @@ const modelTypeMap = new Map([
   [2, "functions"],
   [3, "events"],
 ]);
-watch(modelJson, (value) => {
-  if (value) {
-    try {
-      const { functions, events, properties } = JSON.parse(value);
-      modelList.value = [
-        ...properties.map((el) => ({
-          ...el,
-          modelType: "properties",
-          type: 1,
-        })),
-        ...functions.map((el) => ({
-          ...el,
-          modelType: "functions",
-          type: 2,
-        })),
-        ...events.map((el) => ({
-          ...el,
-          modelType: "events",
-          type: 3,
-        })),
-      ];
-      modelList.value = modelList.value.sort(
-        (a, b) => b.createTime - a.createTime
-      );
-    } catch (e) {
-      console.log(e);
-    }
-  }
-});
+// watch(modelJson, (value) => {
+//   if (value) {
+//     try {
+//       const { functions, events, properties } = JSON.parse(value);
+//       modelList.value = [
+//         ...properties.map((el) => ({
+//           ...el,
+//           modelType: "properties",
+//           type: 1
+//         })),
+//         ...functions.map((el) => ({
+//           ...el,
+//           modelType: "functions",
+//           type: 2
+//         })),
+//         ...events.map((el) => ({
+//           ...el,
+//           modelType: "events",
+//           type: 3
+//         }))
+//       ];
+//       modelList.value = modelList.value.sort(
+//         (a, b) => b.createTime - a.createTime
+//       );
+//     } catch (e) {
+//       console.log(e);
+//     }
+//   }
+// });
 
+const getList = () => {
+  listModel(queryParams.value).then((response) => {
+    modelList.value = response.rows;
+  });
+};
+
+watch(
+  productId,
+  (value) => {
+    if (!value) {
+      return;
+    }
+    queryParams.value.productId = value;
+    getList();
+  },
+  {
+    immediate: true,
+  }
+);
 const reset = () => {
   form.value = {
     templateId: null,
@@ -470,13 +662,13 @@ const reset = () => {
     userName: null,
     tenantId: null,
     tenantName: null,
-    id: null,
+    identifier: null,
     type: 1,
     datatype: "integer",
     isSys: null,
     isTop: null,
     isMonitor: null,
-    isReadonly: 0,
+    isOnlyRead: 0,
     delFlag: null,
     createBy: null,
     createTime: null,
@@ -509,9 +701,41 @@ const handleAdd = () => {
 };
 
 const handleUpdate = (row) => {
-  form.value = cloneDeep(row);
-  open.value = true;
-  title.value = "修改物模型";
+  reset();
+  getModel(row.modelId).then((response) => {
+    let tempForm = response.data;
+    open.value = true;
+    title.value = "修改物模型";
+    // Json转对象
+    tempForm.specs = JSON.parse(tempForm.specs);
+    if (!tempForm.specs.enumList) {
+      tempForm.specs.enumList = [
+        {
+          value: "",
+          text: "",
+        },
+      ];
+    }
+    if (!tempForm.specs.arrayType) {
+      tempForm.specs.arrayType = "int";
+    }
+    form.value = tempForm;
+  });
+};
+
+/**
+ * 导出物模型json
+ */
+const handleExport = () => {
+  ElMessageBox.confirm(`是否确认导出物模型json?`)
+    .then(() => {
+      makeThingsModelObject();
+      const jsonBlob = new Blob([JSON.stringify(thingsModel.value)], {
+        type: "text/plain;charset=utf-8",
+      });
+      saveAs(jsonBlob, `things-model-${productId.value}.json`);
+    })
+    .catch(() => {});
 };
 
 /**
@@ -521,19 +745,16 @@ const handleUpdate = (row) => {
 const handleDelete = (row) => {
   ElMessageBox.confirm(`是否确认删除`)
     .then(() => {
-      const _model = JSON.parse(modelJson.value);
-      const modelType = modelTypeMap.get(row.type);
-      _model[modelType] = _model[modelType].filter(
-        (el) => el.modelId !== row.modelId
-      );
-      return updateProduct({
-        productId: product.value.productId,
-        thingsModelsJson: JSON.stringify(_model),
-      });
+      // const _model = JSON.parse(modelJson.value);
+      // const modelType = modelTypeMap.get(row.type);
+      // _model[modelType] = _model[modelType].filter(
+      //   (el) => el.modelId !== row.modelId
+      // );
+      return delModel(row.modelId);
     })
     .then(() => {
+      getList();
       ElMessage.success("删除成功");
-      emits("model-updated");
     });
 };
 // 类型改变
@@ -549,7 +770,9 @@ const typeChange = (label) => {
     form.value.datatype = "integer";
   }
 };
+
 const dataTypeChange = () => {};
+
 // 实时监测改变
 const changeMonitor = (isMonitor) => {
   if (
@@ -561,6 +784,57 @@ const changeMonitor = (isMonitor) => {
   }
 };
 
+/**
+ * 生成物模型json对象
+ */
+const makeThingsModelObject = () => {
+  // 生成物模型
+  thingsModel.value = {
+    properties: [],
+    functions: [],
+    events: [],
+  };
+  for (let i = 0; i < modelList.value.length; i++) {
+    let thingsItem = {};
+    thingsItem.id = modelList.value[i].identifier;
+    thingsItem.name = modelList.value[i].modelName;
+
+    thingsItem.isTop = modelList.value[i].isTop;
+    thingsItem.isMonitor = modelList.value[i].isMonitor;
+    thingsItem.isOnlyRead = modelList.value[i].isOnlyRead;
+    thingsItem.datatype = JSON.parse(modelList.value[i].specs);
+    if (modelList.value[i].type === 1) {
+      //属性
+      // thingsItem.isTop = modelList.value[i].isTop;
+      // thingsItem.isMonitor = modelList.value[i].isMonitor;
+      // thingsItem.isOnlyRead = modelList.value[i].isOnlyRead;
+      // 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;
+      // thingsItem.datatype = JSON.parse(modelList.value[i].specs);
+      thingsModel.value.functions.push(thingsItem);
+    } else if (modelList.value[i].type === 3) {
+      // 事件
+      // thingsItem.isTop = modelList.value[i].isTop;
+      // thingsItem.isMonitor = modelList.value[i].isMonitor;
+      // thingsItem.isOnlyRead = modelList.value[i].isOnlyRead;
+      // thingsItem.datatype = JSON.parse(modelList.value[i].specs);
+      thingsModel.value.events.push(thingsItem);
+    }
+  }
+};
+
+/**查看物模型 */
+const handleOpenThingsModel = () => {
+  makeThingsModelObject();
+  title.value = "物模型";
+  openJsonViewer.value = true;
+};
+
 /** 添加枚举项 */
 const addEnumItem = () => {
   form.value.specs.enumList.push({
@@ -583,47 +857,54 @@ const submitForm = () => {
         form.value.specs = formatThingsSpecs();
         form.value.productId = product.value.productId;
         form.value.productName = product.value.productName;
-        form.value.updateTime = Date.now();
-        const _modelJson = JSON.parse(modelJson.value);
-        const modelType = modelTypeMap.get(form.value.type);
-        _modelJson[modelType].forEach((el, index) => {
-          if (el.modelId === form.value.modelId) {
-            _modelJson[modelType][index] = form.value;
-          }
-        });
-        updateProduct({
-          productId: product.value.productId,
-          thingsModelsJson: JSON.stringify(_modelJson),
-        }).then((resp) => {
-          ElMessage.success("修改成功");
-          open.value = false;
-          emits("model-updated");
-        });
+        form.value.tenantId = product.value.tenantId;
+        // form.value.updateTime = Date.now();
+        // const _modelJson = JSON.parse(modelJson.value);
+        // const modelType = modelTypeMap.get(form.value.type);
+        // _modelJson[modelType].forEach((el, index) => {
+        //   if (el.modelId === form.value.modelId) {
+        //     _modelJson[modelType][index] = form.value;
+        //   }
+        // });
+        // updateProduct({
+        //   productId: product.value.productId,
+        //   thingsModelsJson: JSON.stringify(_modelJson)
+        // }).then((resp) => {
+        //   ElMessage.success("修改成功");
+        //   open.value = false;
+        //   emits("model-updated");
+        // });
         // if (this.form.type == 2) {
         //   this.form.isMonitor = 0;
         // } else if (this.form.type == 3) {
         //   this.form.isMonitor = 0;
         //   this.form.isTop = 0;
         // }
-        // updateModel(this.form).then((response) => {
-        //   this.$modal.msgSuccess("修改成功");
-        //   this.open = false;
-        //   this.getList();
-        // });
+        updateModel(form.value).then((response) => {
+          ElMessage.success("修改成功");
+          open.value = false;
+          getList();
+        });
       } else {
         // 格式化specs
-        form.value.modelId = uuidv4();
+        // form.value.modelId = uuidv4();
         form.value.specs = formatThingsSpecs();
-        form.value.createTime = Date.now();
+        // form.value.createTime = Date.now();
         form.value.productId = product.value.productId;
         form.value.productName = product.value.productName;
+        form.value.tenantId = product.value.tenantId;
         // if (form.value.type === 2) {
         //   form.value.isMonitor = 0;
         // } else if (form.value.type === 3) {
         //   form.value.isMonitor = 0;
         //   form.value.isTop = 0;
         // }
-        const _modelJson = JSON.parse(modelJson.value);
+        addModel(form.value).then((response) => {
+          ElMessage.success("新增成功");
+          open.value = false;
+          getList();
+        });
+        // const _modelJson = JSON.parse(modelJson.value);
         // _modelJson.properties.forEach((el, idx) => {
         //   _modelJson.properties[idx] = {
         //     ...el, modelId: uuidv4()
@@ -639,31 +920,31 @@ const submitForm = () => {
         //     ...el, modelId: uuidv4()
         //   };
         // });
-        if (form.value.type === 1) {
-          _modelJson.properties.push(form.value);
-        } else if (form.value.type === 2) {
-          _modelJson.functions.push(form.value);
-        } else if (form.value.type === 3) {
-          _modelJson.events.push(form.value);
-        } else {
-          return;
-        }
-        updateProduct({
-          productId: product.value.productId,
-          thingsModelsJson: JSON.stringify(_modelJson),
-        }).then((resp) => {
-          emits("model-updated");
-          ElMessage.success("新增成功");
-          open.value = false;
-        });
+        // if (form.value.type === 1) {
+        //   _modelJson.properties.push(form.value);
+        // } else if (form.value.type === 2) {
+        //   _modelJson.functions.push(form.value);
+        // } else if (form.value.type === 3) {
+        //   _modelJson.events.push(form.value);
+        // } else {
+        //   return;
+        // }
+        // updateProduct({
+        //   productId: product.value.productId,
+        //   thingsModelsJson: JSON.stringify(_modelJson)
+        // }).then((resp) => {
+        //   emits("model-updated");
+        //   ElMessage.success("新增成功");
+        //   open.value = false;
+        // });
       }
     }
   });
 };
 
 /** 格式化显示数据定义 */
-const formatSpecsDisplay = (specs) => {
-  // let specs = JSON.parse(json);
+const formatSpecsDisplay = (json) => {
+  let specs = JSON.parse(json);
   if (!specs) {
     return;
   }
@@ -730,11 +1011,14 @@ const formatThingsSpecs = () => {
   } else if (form.value.datatype === "enum") {
     _data.enumList = form.value.specs.enumList;
   }
-  // return JSON.stringify(data);
-  return _data;
+  console.log(_data);
+  return JSON.stringify(_data);
+  // return _data;
 };
 
 function getModelData() {}
+
+// getList();
 </script>
 
 <style scoped></style>
diff --git a/src/views/thingsmodel/model/index.vue b/src/views/thingsmodel/model/index.vue
new file mode 100644
index 0000000..9aa57c5
--- /dev/null
+++ b/src/views/thingsmodel/model/index.vue
@@ -0,0 +1,730 @@
+<template>
+  <div class="app-container">
+    <el-form
+      v-show="showSearch"
+      ref="queryRef"
+      :inline="true"
+      :model="queryParams"
+      label-position="left"
+      label-width="100px"
+    >
+      <el-form-item label="物模型名称" prop="modelName">
+        <el-input
+          v-model="queryParams.modelName"
+          clearable
+          placeholder="请输入物模型名称"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="产品" prop="productId">
+        <el-select
+          v-model="queryParams.productId"
+          :remote-method="getProductOptions"
+          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="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-input
+          v-model="queryParams.identifier"
+          clearable
+          placeholder="请输入标识符，产品下唯一"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!--      <el-form-item label="是否首页显示" prop="isTop">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.isTop"-->
+      <!--          clearable-->
+      <!--          placeholder="请输入是否首页显示"-->
+      <!--          @keyup.enter="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="是否实时监测" prop="isMonitor">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.isMonitor"-->
+      <!--          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="['thingsmodel:model:add']"
+          icon="Plus"
+          plain
+          type="primary"
+          @click="handleAdd"
+          >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['thingsmodel:model:edit']"
+          :disabled="single"
+          icon="Edit"
+          plain
+          type="success"
+          @click="handleUpdate"
+          >修改
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['thingsmodel:model:remove']"
+          :disabled="multiple"
+          icon="Delete"
+          plain
+          type="danger"
+          @click="handleDelete"
+          >删除
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['thingsmodel:model: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="modelList"
+      @selection-change="handleSelectionChange"
+    >
+      <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="type">
+        <template #default="{ row }">
+          <model-type-tags :type="row.type" />
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="数据类型" prop="datatype">
+        <template #default="{ row }">
+          {{ dataTypeMap.get(row.datatype) ?? "未知" }}
+        </template>
+      </el-table-column>
+      <el-table-column
+        align="center"
+        header-align="center"
+        label="数据定义"
+        min-width="150"
+        prop="specs"
+      >
+        <template #default="{ row }">
+          <!--          {{ formatSpecsDisplay(row.specs) }}-->
+          <div v-html="formatSpecsDisplay(row.specs)"></div>
+        </template>
+      </el-table-column>
+      <!--      <el-table-column align="center" label="是否首页显示" prop="isTop" />-->
+      <!--      <el-table-column align="center" label="是否实时监测" prop="isMonitor" />-->
+      <el-table-column align="center" label="备注" prop="remark" />
+      <el-table-column
+        align="center"
+        class-name="small-padding fixed-width"
+        label="操作"
+      >
+        <template #default="scope">
+          <el-button
+            v-hasPermi="['thingsmodel:model:edit']"
+            icon="Edit"
+            link
+            type="primary"
+            @click="handleUpdate(scope.row)"
+            >修改
+          </el-button>
+          <el-button
+            v-hasPermi="['thingsmodel:model:remove']"
+            icon="Delete"
+            link
+            type="primary"
+            @click="handleDelete(scope.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="600px">
+      <el-form
+        ref="modelRef"
+        :model="form"
+        :rules="rules"
+        label-position="left"
+        label-width="160px"
+      >
+        <el-form-item label="物模型名称" prop="modelName">
+          <el-input v-model="form.modelName" placeholder="请输入物模型名称" />
+        </el-form-item>
+        <el-form-item label="产品" prop="productId">
+          <el-select
+            v-model="form.productId"
+            :remote-method="getProductOptions"
+            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-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-input
+            v-model="form.identifier"
+            placeholder="请输入标识符，产品下唯一"
+          />
+        </el-form-item>
+        <!--        <el-form-item label="是否首页显示" prop="isTop">-->
+        <!--          <el-input v-model="form.isTop" placeholder="请输入是否首页显示" />-->
+        <!--        </el-form-item>-->
+        <!--        <el-form-item label="是否实时监测" prop="isMonitor">-->
+        <!--          <el-input v-model="form.isMonitor" placeholder="请输入是否实时监测" />-->
+        <!--        </el-form-item>-->
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            v-model="form.remark"
+            placeholder="请输入内容"
+            type="textarea"
+          />
+        </el-form-item>
+        <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-group>
+        </el-form-item>
+        <el-divider />
+        <el-form-item label="数据类型" prop="datatype">
+          <el-select
+            v-model="form.datatype"
+            placeholder="请选择数据类型"
+            style="width: 175px"
+            @change="dataTypeChange"
+          >
+            <el-option key="integer" label="整数" value="integer"></el-option>
+            <el-option key="decimal" label="小数" value="decimal"></el-option>
+            <el-option
+              key="bool"
+              :disabled="form.type === 1"
+              label="布尔"
+              value="bool"
+            ></el-option>
+            <el-option
+              key="enum"
+              :disabled="form.type === 1"
+              label="枚举"
+              value="enum"
+            ></el-option>
+            <el-option
+              key="string"
+              :disabled="form.type === 1"
+              label="字符串"
+              value="string"
+            ></el-option>
+            <el-option
+              key="array"
+              :disabled="form.type === 1"
+              label="数组"
+              value="array"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <div v-if="form.datatype === 'integer' || form.datatype === 'decimal'">
+          <el-form-item label="取值范围">
+            <el-row>
+              <el-col :span="9">
+                <el-input
+                  v-model="form.specs.min"
+                  placeholder="最小值"
+                  type="number"
+                />
+              </el-col>
+              <el-col :span="2" align="center">到</el-col>
+              <el-col :span="9">
+                <el-input
+                  v-model="form.specs.max"
+                  placeholder="最大值"
+                  type="number"
+                />
+              </el-col>
+            </el-row>
+          </el-form-item>
+          <el-form-item label="单位">
+            <el-input
+              v-model="form.specs.unit"
+              placeholder="请输入单位，例如：℃"
+              style="width: 385px"
+            />
+          </el-form-item>
+          <el-form-item label="步长">
+            <el-input
+              v-model="form.specs.step"
+              placeholder="请输入步长，例如：1"
+              style="width: 385px"
+              type="number"
+            />
+          </el-form-item>
+        </div>
+        <div v-if="form.datatype === 'bool'">
+          <el-form-item label="布尔值" prop="">
+            <el-row style="margin-bottom: 10px">
+              <el-col :span="9">
+                <el-input
+                  v-model="form.specs.falseText"
+                  placeholder="例如：关闭"
+                />
+              </el-col>
+              <el-col :offset="1" :span="10"> （0 值对应文本）</el-col>
+            </el-row>
+            <el-row>
+              <el-col :span="9">
+                <el-input
+                  v-model="form.specs.trueText"
+                  placeholder="例如：打开"
+                />
+              </el-col>
+              <el-col :offset="1" :span="10"> （1 值对应文本）</el-col>
+            </el-row>
+          </el-form-item>
+        </div>
+        <div v-if="form.datatype === 'enum'">
+          <el-form-item label="枚举项" prop="">
+            <el-row
+              v-for="(item, index) in form.specs.enumList"
+              :key="'enum' + index"
+              style="margin-bottom: 10px"
+            >
+              <el-col :span="9">
+                <el-input
+                  v-model="item.value"
+                  placeholder="参数值，例如：0"
+                  type="number"
+                />
+              </el-col>
+              <el-col :offset="1" :span="11">
+                <el-input
+                  v-model="item.text"
+                  placeholder="参数描述，例如：中速档位"
+                />
+              </el-col>
+              <el-col v-if="index !== 0" :offset="1" :span="2"
+                ><a style="color: #f56c6c" @click="removeEnumItem(index)"
+                  >删除</a
+                ></el-col
+              >
+            </el-row>
+            <div>
+              + <a style="color: #409eff" @click="addEnumItem()">添加枚举项</a>
+            </div>
+          </el-form-item>
+        </div>
+        <div v-if="form.datatype === 'string'">
+          <el-form-item label="最大长度" prop="">
+            <el-row>
+              <el-col :span="9">
+                <el-input
+                  v-model="form.specs.maxLength"
+                  placeholder="例如：1024"
+                  type="number"
+                />
+              </el-col>
+              <el-col :offset="1" :span="14">（字符串的最大长度）</el-col>
+            </el-row>
+          </el-form-item>
+        </div>
+        <div v-if="form.datatype === 'array'">
+          <el-form-item label="数组类型" prop="">
+            <el-radio-group v-model="form.specs.arrayType">
+              <el-radio label="int">int（整数）</el-radio>
+              <el-radio label="double">double（小数）</el-radio>
+              <el-radio label="string">string（字符串）</el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </div>
+      </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="Model" setup>
+import {
+  addModel,
+  delModel,
+  getModel,
+  listModel,
+  updateModel,
+} from "@/api/thingsmodel/model";
+import { formatSpecsDisplay } from "@/utils/thingsmodel";
+import { listProduct } from "@/api/product/product";
+import { listTenant } from "@/api/system/tenant";
+import ModelTypeTags from "@/views/components/model-type-tags";
+import { dataTypeMap } from "../../../constant/dict";
+import { ref } from "vue";
+
+const { proxy } = getCurrentInstance();
+
+const modelList = 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 productOptions = ref([]);
+const tenantOptions = ref([]);
+
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    modelName: null,
+    productId: null,
+    tenantId: null,
+    identifier: null,
+    type: null,
+    datatype: null,
+    specs: null,
+    isTop: null,
+    isMonitor: null,
+  },
+  rules: {
+    modelName: [
+      { required: true, message: "物模型名称不能为空", trigger: "blur" },
+    ],
+    productId: [{ required: true, message: "产品ID不能为空", trigger: "blur" }],
+    tenantId: [{ required: true, message: "租户ID不能为空", trigger: "blur" }],
+    identifier: [
+      {
+        required: true,
+        message: "标识符，产品下唯一不能为空",
+        trigger: "blur",
+      },
+    ],
+    type: [{ required: true, message: "模型类别不能为空", trigger: "change" }],
+    datatype: [
+      { required: true, message: "数据类型不能为空", trigger: "change" },
+    ],
+    specs: [{ required: true, message: "数据定义不能为空", trigger: "blur" }],
+    isTop: [
+      { required: true, message: "是否首页显示不能为空", trigger: "blur" },
+    ],
+    isMonitor: [
+      { required: true, message: "是否实时监测不能为空", trigger: "blur" },
+    ],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询物模型列表 */
+function getList() {
+  loading.value = true;
+  listModel(queryParams.value).then((response) => {
+    modelList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    modelId: null,
+    modelName: null,
+    productId: null,
+    tenantId: null,
+    identifier: null,
+    type: 1,
+    datatype: "integer",
+    specs: {
+      enumList: [
+        {
+          value: "",
+          text: "",
+        },
+      ],
+      arrayType: "int",
+    },
+    isTop: 0,
+    isMonitor: 0,
+    createBy: null,
+    createTime: null,
+    remark: null,
+  };
+  proxy.resetForm("modelRef");
+}
+
+const dataTypeChange = () => {};
+
+// 类型改变
+const typeChange = (label) => {
+  // if (label === 2 || label === 3) {
+  //   form.value.isMonitor = 0;
+  // }
+  if (
+    label === 1 &&
+    form.value.datatype !== "integer" &&
+    form.value.datatype !== "decimal"
+  ) {
+    form.value.datatype = "integer";
+  }
+};
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.modelId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
+}
+
+// 格式化物模型
+const formatThingsSpecs = () => {
+  let _data = {};
+  _data.type = form.value.datatype;
+  if (form.value.datatype === "integer" || form.value.datatype === "decimal") {
+    _data.min = Number(form.value.specs.min);
+    _data.max = Number(form.value.specs.max);
+    _data.unit = form.value.specs.unit;
+    _data.step = Number(form.value.specs.step);
+  } else if (form.value.datatype === "string") {
+    _data.maxLength = Number(form.value.specs.maxLength);
+  } else if (form.value.datatype === "bool") {
+    _data.falseText = form.value.specs.falseText;
+    _data.trueText = form.value.specs.trueText;
+  } else if (form.value.datatype === "array") {
+    _data.arrayType = form.value.specs.arrayType;
+  } else if (form.value.datatype === "enum") {
+    _data.enumList = form.value.specs.enumList;
+  }
+  console.log(_data);
+  return JSON.stringify(_data);
+  // return _data;
+};
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加物模型";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _modelId = row.modelId || ids.value;
+  getModel(_modelId).then((response) => {
+    let tempForm = response.data;
+    open.value = true;
+    title.value = "修改物模型";
+    // Json转对象
+    tempForm.specs = JSON.parse(tempForm.specs);
+    if (!tempForm.specs.enumList) {
+      tempForm.specs.enumList = [
+        {
+          value: "",
+          text: "",
+        },
+      ];
+    }
+    if (!tempForm.specs.arrayType) {
+      tempForm.specs.arrayType = "int";
+    }
+    form.value = tempForm;
+    // form.value = response.data;
+    // open.value = true;
+    // title.value = "修改物模型";
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["modelRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.modelId != null) {
+        form.value.specs = formatThingsSpecs();
+        updateModel(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        form.value.specs = formatThingsSpecs();
+        addModel(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _modelIds = row.modelId || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除物模型编号为"' + _modelIds + '"的数据项？')
+    .then(function () {
+      return delModel(_modelIds);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "thingsmodel/model/export",
+    {
+      ...queryParams.value,
+    },
+    `model_${new Date().getTime()}.xlsx`
+  );
+}
+
+const productOptionsLoading = ref(true);
+
+function getProductOptions(keyword) {
+  productOptionsLoading.value = true;
+  listProduct({
+    productName: keyword,
+    pageNum: 1,
+    pageSize: 20,
+  }).then((resp) => {
+    productOptions.value = resp.rows;
+    productOptionsLoading.value = false;
+  });
+}
+
+const getTenantOptions = async (keyword) => {
+  const response = await listTenant({
+    pageNum: 1,
+    pageSize: 20,
+    tenantName: keyword,
+  });
+  tenantOptions.value = response.rows;
+};
+getTenantOptions();
+getProductOptions();
+getList();
+</script>
diff --git a/src/views/thingsmodel/template/index.vue b/src/views/thingsmodel/template/index.vue
new file mode 100644
index 0000000..5ebda08
--- /dev/null
+++ b/src/views/thingsmodel/template/index.vue
@@ -0,0 +1,688 @@
+<template>
+  <div class="app-container">
+    <el-form
+      v-show="showSearch"
+      ref="queryRef"
+      :inline="true"
+      :model="queryParams"
+      label-position="left"
+      label-width="100px"
+    >
+      <el-form-item label="物模型名称" prop="templateName">
+        <el-input
+          v-model="queryParams.templateName"
+          clearable
+          placeholder="请输入物模型名称"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="租户ID" prop="tenantId">
+        <el-input
+          v-model="queryParams.tenantId"
+          clearable
+          placeholder="请输入租户ID"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="标识符，产品下唯一" prop="identifier">
+        <el-input
+          v-model="queryParams.identifier"
+          clearable
+          placeholder="请输入标识符，产品下唯一"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="是否系统通用" prop="isSys">
+        <el-input
+          v-model="queryParams.isSys"
+          clearable
+          placeholder="请输入是否系统通用"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!--      <el-form-item label="是否首页显示" prop="isTop">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.isTop"-->
+      <!--          clearable-->
+      <!--          placeholder="请输入是否首页显示"-->
+      <!--          @keyup.enter="handleQuery"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
+      <!--      <el-form-item label="是否实时监测" prop="isMonitor">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.isMonitor"-->
+      <!--          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="['thingsmodel:template:add']"
+          icon="Plus"
+          plain
+          type="primary"
+          @click="handleAdd"
+          >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['thingsmodel:template:edit']"
+          :disabled="single"
+          icon="Edit"
+          plain
+          type="success"
+          @click="handleUpdate"
+          >修改
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['thingsmodel:template:remove']"
+          :disabled="multiple"
+          icon="Delete"
+          plain
+          type="danger"
+          @click="handleDelete"
+          >删除
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['thingsmodel: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"
+      border
+      @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="templateName" />
+      <el-table-column align="center" label="租户ID" prop="tenantId" />
+      <el-table-column
+        align="center"
+        label="标识符，产品下唯一"
+        prop="identifier"
+      />
+      <el-table-column align="center" label="模型类别" prop="type">
+        <template #default="{ row }">
+          <el-tag size="small">
+            {{ modelType.get(row.type) ?? "未知" }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="数据类型">
+        <template #default="{ row }">
+          {{ dataTypeMap.get(row.datatype) ?? "未知" }}
+        </template>
+      </el-table-column>
+      <el-table-column
+        align="center"
+        header-align="center"
+        label="数据定义"
+        min-width="150"
+        prop="specs"
+      >
+        <template #default="{ row }">
+          <div v-html="formatSpecsDisplay(row.specs)"></div>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="是否系统通用" prop="isSys">
+        <template #default="{ row }">
+          {{ isSysMap.get(row.isSys) ?? "未知" }}
+        </template>
+      </el-table-column>
+      <!--      <el-table-column align="center" label="是否首页显示" prop="isTop" />-->
+      <!--      <el-table-column align="center" label="是否实时监测" prop="isMonitor" />-->
+      <el-table-column align="center" label="备注" prop="remark" />
+      <el-table-column align="center" label="状态" prop="status" />
+      <el-table-column
+        align="center"
+        class-name="small-padding fixed-width"
+        label="操作"
+      >
+        <template #default="scope">
+          <el-button
+            v-hasPermi="['thingsmodel:template:edit']"
+            icon="Edit"
+            link
+            type="primary"
+            @click="handleUpdate(scope.row)"
+            >修改
+          </el-button>
+          <el-button
+            v-hasPermi="['thingsmodel:template:remove']"
+            icon="Delete"
+            link
+            type="primary"
+            @click="handleDelete(scope.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-position="left"
+        label-width="120px"
+      >
+        <el-form-item label="物模型名称" prop="templateName">
+          <el-input
+            v-model="form.templateName"
+            placeholder="请输入物模型名称"
+          />
+        </el-form-item>
+        <el-form-item label="租户ID" prop="tenantId">
+          <el-input v-model="form.tenantId" placeholder="请输入租户ID" />
+        </el-form-item>
+        <el-form-item label="标识符，产品下唯一" prop="identifier">
+          <el-input
+            v-model="form.identifier"
+            placeholder="请输入标识符，产品下唯一"
+          />
+        </el-form-item>
+        <el-form-item label="是否系统通用" prop="isSys">
+          <!--          <el-input v-model="form.isSys" placeholder="请输入是否系统通用" />-->
+          <el-switch
+            v-model="form.isSys"
+            :active-value="1"
+            :inactive-value="0"
+          ></el-switch>
+        </el-form-item>
+        <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-group>
+        </el-form-item>
+        <!--        <el-form-item label="是否首页显示" prop="isTop">-->
+        <!--          <el-input v-model="form.isTop" placeholder="请输入是否首页显示" />-->
+        <!--        </el-form-item>-->
+        <!--        <el-form-item label="是否实时监测" prop="isMonitor">-->
+        <!--          <el-input v-model="form.isMonitor" placeholder="请输入是否实时监测" />-->
+        <!--        </el-form-item>-->
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            v-model="form.remark"
+            placeholder="请输入内容"
+            type="textarea"
+          />
+        </el-form-item>
+        <el-divider />
+        <el-form-item label="数据类型" prop="datatype">
+          <el-select
+            v-model="form.datatype"
+            placeholder="请选择数据类型"
+            style="width: 175px"
+            @change="dataTypeChange"
+          >
+            <el-option key="integer" label="整数" value="integer"></el-option>
+            <el-option key="decimal" label="小数" value="decimal"></el-option>
+            <el-option
+              key="bool"
+              :disabled="form.type === 1"
+              label="布尔"
+              value="bool"
+            ></el-option>
+            <el-option
+              key="enum"
+              :disabled="form.type === 1"
+              label="枚举"
+              value="enum"
+            ></el-option>
+            <el-option
+              key="string"
+              :disabled="form.type === 1"
+              label="字符串"
+              value="string"
+            ></el-option>
+            <el-option
+              key="array"
+              :disabled="form.type === 1"
+              label="数组"
+              value="array"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <div v-if="form.datatype === 'integer' || form.datatype === 'decimal'">
+          <el-form-item label="取值范围">
+            <el-row>
+              <el-col :span="9">
+                <el-input
+                  v-model="form.specs.min"
+                  placeholder="最小值"
+                  type="number"
+                />
+              </el-col>
+              <el-col :span="2" align="center">到</el-col>
+              <el-col :span="9">
+                <el-input
+                  v-model="form.specs.max"
+                  placeholder="最大值"
+                  type="number"
+                />
+              </el-col>
+            </el-row>
+          </el-form-item>
+          <el-form-item label="单位">
+            <el-input
+              v-model="form.specs.unit"
+              placeholder="请输入单位，例如：℃"
+              style="width: 385px"
+            />
+          </el-form-item>
+          <el-form-item label="步长">
+            <el-input
+              v-model="form.specs.step"
+              placeholder="请输入步长，例如：1"
+              style="width: 385px"
+              type="number"
+            />
+          </el-form-item>
+        </div>
+        <div v-if="form.datatype === 'bool'">
+          <el-form-item label="布尔值" prop="">
+            <el-row style="margin-bottom: 10px">
+              <el-col :span="9">
+                <el-input
+                  v-model="form.specs.falseText"
+                  placeholder="例如：关闭"
+                />
+              </el-col>
+              <el-col :offset="1" :span="10"> （0 值对应文本）</el-col>
+            </el-row>
+            <el-row>
+              <el-col :span="9">
+                <el-input
+                  v-model="form.specs.trueText"
+                  placeholder="例如：打开"
+                />
+              </el-col>
+              <el-col :offset="1" :span="10"> （1 值对应文本）</el-col>
+            </el-row>
+          </el-form-item>
+        </div>
+        <div v-if="form.datatype === 'enum'">
+          <el-form-item label="枚举项" prop="">
+            <el-row
+              v-for="(item, index) in form.specs.enumList"
+              :key="'enum' + index"
+              style="margin-bottom: 10px"
+            >
+              <el-col :span="9">
+                <el-input
+                  v-model="item.value"
+                  placeholder="参数值，例如：0"
+                  type="number"
+                />
+              </el-col>
+              <el-col :offset="1" :span="11">
+                <el-input
+                  v-model="item.text"
+                  placeholder="参数描述，例如：中速档位"
+                />
+              </el-col>
+              <el-col v-if="index !== 0" :offset="1" :span="2"
+                ><a style="color: #f56c6c" @click="removeEnumItem(index)"
+                  >删除</a
+                ></el-col
+              >
+            </el-row>
+            <div>
+              + <a style="color: #409eff" @click="addEnumItem()">添加枚举项</a>
+            </div>
+          </el-form-item>
+        </div>
+        <div v-if="form.datatype === 'string'">
+          <el-form-item label="最大长度" prop="">
+            <el-row>
+              <el-col :span="9">
+                <el-input
+                  v-model="form.specs.maxLength"
+                  placeholder="例如：1024"
+                  type="number"
+                />
+              </el-col>
+              <el-col :offset="1" :span="14">（字符串的最大长度）</el-col>
+            </el-row>
+          </el-form-item>
+        </div>
+        <div v-if="form.datatype === 'array'">
+          <el-form-item label="数组类型" prop="">
+            <el-radio-group v-model="form.specs.arrayType">
+              <el-radio label="int">int（整数）</el-radio>
+              <el-radio label="double">double（小数）</el-radio>
+              <el-radio label="string">string（字符串）</el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </div>
+      </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/thingsmodel/template";
+import { getCurrentInstance, reactive, ref, toRefs } from "vue";
+import { dataTypeMap, isSysMap, modelType } from "@/constant/dict";
+import { formatSpecsDisplay } from "@/utils/thingsmodel";
+import { listTenant } from "@/api/system/tenant";
+
+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 tenantOptions = ref([]);
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    templateName: null,
+    tenantId: null,
+    identifier: null,
+    type: null,
+    datatype: null,
+    specs: null,
+    isSys: null,
+    isTop: null,
+    isMonitor: null,
+    status: null,
+  },
+  rules: {
+    templateName: [
+      { required: true, message: "物模型名称不能为空", trigger: "blur" },
+    ],
+    tenantId: [{ required: true, message: "租户ID不能为空", trigger: "blur" }],
+    identifier: [
+      {
+        required: true,
+        message: "标识符，产品下唯一不能为空",
+        trigger: "blur",
+      },
+    ],
+    type: [{ required: true, message: "模型类别不能为空", trigger: "change" }],
+    datatype: [
+      { required: true, message: "数据类型不能为空", trigger: "change" },
+    ],
+    specs: [{ required: true, message: "数据定义不能为空", trigger: "blur" }],
+    isSys: [
+      { required: true, message: "是否系统通用不能为空", trigger: "blur" },
+    ],
+    isTop: [
+      { required: true, message: "是否首页显示不能为空", trigger: "blur" },
+    ],
+    isMonitor: [
+      { required: true, message: "是否实时监测不能为空", trigger: "blur" },
+    ],
+  },
+});
+
+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,
+    templateName: null,
+    tenantId: null,
+    identifier: null,
+    type: 1,
+    datatype: "integer",
+    specs: {
+      enumList: [
+        {
+          value: "",
+          text: "",
+        },
+      ],
+      arrayType: "int",
+    },
+    isSys: null,
+    isTop: null,
+    isMonitor: null,
+    createBy: null,
+    createTime: null,
+    remark: null,
+    status: 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) => {
+    const tempForm = response.data;
+    open.value = true;
+    title.value = "修改物模型模板";
+    // Json转对象
+    tempForm.specs = JSON.parse(tempForm.specs);
+    if (!tempForm.specs.enumList) {
+      tempForm.specs.enumList = [
+        {
+          value: "",
+          text: "",
+        },
+      ];
+    }
+    if (!tempForm.specs.arrayType) {
+      tempForm.specs.arrayType = "int";
+    }
+    form.value = tempForm;
+  });
+}
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["templateRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.templateId != null) {
+        // 格式化specs
+        form.value.specs = formatThingsSpecs();
+        updateTemplate(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        // 格式化specs
+        form.value.specs = formatThingsSpecs();
+        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(
+    "thingsmodel/template/export",
+    {
+      ...queryParams.value,
+    },
+    `template_${new Date().getTime()}.xlsx`
+  );
+}
+
+// 类型改变
+const typeChange = (label) => {
+  // if (label === 2 || label === 3) {
+  //   form.value.isMonitor = 0;
+  // }
+  if (
+    label === 1 &&
+    form.value.datatype !== "integer" &&
+    form.value.datatype !== "decimal"
+  ) {
+    console.log(form.value);
+    form.value.datatype = "integer";
+  }
+};
+const dataTypeChange = () => {};
+
+/** 添加枚举项 */
+const addEnumItem = () => {
+  form.value.specs.enumList.push({
+    value: "",
+    text: "",
+  });
+};
+
+/** 删除枚举项 */
+const removeEnumItem = (index) => {
+  form.value.specs.enumList.splice(index, 1);
+};
+
+// 格式化物模型
+const formatThingsSpecs = () => {
+  const data = {};
+  data.type = form.value.datatype;
+  if (form.value.datatype === "integer" || form.value.datatype === "decimal") {
+    data.min = Number(form.value.specs.min);
+    data.max = Number(form.value.specs.max);
+    data.unit = form.value.specs.unit;
+    data.step = Number(form.value.specs.step);
+  } else if (form.value.datatype === "string") {
+    data.maxLength = Number(form.value.specs.maxLength);
+  } else if (form.value.datatype === "bool") {
+    data.falseText = form.value.specs.falseText;
+    data.trueText = form.value.specs.trueText;
+  } else if (form.value.datatype === "array") {
+    data.arrayType = form.value.specs.arrayType;
+  } else if (form.value.datatype === "enum") {
+    data.enumList = form.value.specs.enumList;
+  }
+  return JSON.stringify(data);
+};
+
+const getTenantList = async (keyword) => {
+  const response = await listTenant({
+    pageNum: 1,
+    pageSize: 20,
+    tenantName: keyword,
+  });
+  tenantOptions.value = response.rows;
+};
+getList();
+getTenantList();
+</script>
diff --git a/vite.config.js b/vite.config.js
index 804e73b..72e5d13 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.5:1616",
+          target: "http://192.168.1.6:1616",
           changeOrigin: true,
           rewrite: (p) => p.replace(/^\/dev-api/, ""),
         },