From 2b7a638c1c8c4bc7e234afc6b694a0362b480092 Mon Sep 17 00:00:00 2001
From: ailanyin <ailanyin4j@163.com>
Date: Fri, 31 Mar 2023 10:03:07 +0800
Subject: [PATCH] assign device

---
 src/api/device/group.js               |  60 ++++
 src/assets/icons/svg/group.svg        |   1 +
 src/components/TableSelect/index.vue  | 140 ++++++--
 src/constant/dict.js                  |  23 +-
 src/views/device/group/index.vue      | 462 ++++++++++++++++++++++++++
 src/views/iot/device/index.vue        |  28 +-
 src/views/product/alertRule/index.vue |  16 +-
 src/views/system/tenant/index.vue     |   4 +-
 8 files changed, 673 insertions(+), 61 deletions(-)
 create mode 100644 src/api/device/group.js
 create mode 100644 src/assets/icons/svg/group.svg
 create mode 100644 src/views/device/group/index.vue

diff --git a/src/api/device/group.js b/src/api/device/group.js
new file mode 100644
index 0000000..a82107f
--- /dev/null
+++ b/src/api/device/group.js
@@ -0,0 +1,60 @@
+import request from "@/utils/request";
+
+// 查询设备分组列表
+export function listGroup(query) {
+  return request({
+    url: "/device/group/list",
+    method: "get",
+    params: query,
+  });
+}
+
+// 查询设备分组详细
+export function getGroup(groupId) {
+  return request({
+    url: "/device/group/" + groupId,
+    method: "get",
+  });
+}
+
+// 新增设备分组
+export function addGroup(data) {
+  return request({
+    url: "/device/group",
+    method: "post",
+    data: data,
+  });
+}
+
+// 修改设备分组
+export function updateGroup(data) {
+  return request({
+    url: "/device/group",
+    method: "put",
+    data: data,
+  });
+}
+
+// 删除设备分组
+export function delGroup(groupId) {
+  return request({
+    url: "/device/group/" + groupId,
+    method: "delete",
+  });
+}
+
+// 分配设备
+export function assignDevice(groupId, deviceIds) {
+  return request({
+    url: `/device/group/allot/${groupId}/${deviceIds}`,
+    method: "post",
+  });
+}
+
+// 分配设备
+export function unAssignDevice(deviceIds) {
+  return request({
+    url: `/device/group/deleteAllot/${deviceIds}`,
+    method: "delete",
+  });
+}
diff --git a/src/assets/icons/svg/group.svg b/src/assets/icons/svg/group.svg
new file mode 100644
index 0000000..0c145b6
--- /dev/null
+++ b/src/assets/icons/svg/group.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1680138704972" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2963" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M1004.746372 945.311261v-51.273248c0-10.882485-4.813407-21.137135-13.184549-28.043327-46.459841-38.088698-96.477417-63.411404-106.732066-68.434089-1.046393-0.627836-1.883507-1.674228-1.883507-2.9299v-72.201104c8.998978-6.069078 15.068056-16.323728 15.068056-28.043327V619.464541c0-37.251584-30.136113-67.596975-67.596975-67.596975H814.093603c-37.251584 0-67.596975 30.136113-67.596975 67.596975v74.503168c0 11.719599 6.069078 21.974249 15.068056 28.043327v72.410382c0 1.255671-0.627836 2.511343-1.883507 2.9299-10.254649 5.022685-60.272226 30.345391-106.732066 68.43409-8.371142 6.906193-13.184549 17.160842-13.184549 28.043327v51.273247" fill="#A7A9AC" p-id="2964"></path><path d="M383.189046 945.311261v-51.273248c0-10.882485-4.813407-21.137135-13.18455-28.043327-46.459841-38.088698-96.477417-63.411404-106.732066-68.434089-1.046393-0.627836-1.883507-1.674228-1.883507-2.9299v-72.201104c8.998978-6.069078 15.068056-16.323728 15.068056-28.043327V619.464541c0-37.251584-30.136113-67.596975-67.596975-67.596975H192.536276c-37.251584 0-67.596975 30.136113-67.596975 67.596975v74.503168c0 11.719599 6.069078 21.974249 15.068056 28.043327v72.410382c0 1.255671-0.627836 2.511343-1.883507 2.9299-10.254649 5.022685-60.272226 30.345391-106.732066 68.43409-8.371142 6.906193-13.184549 17.160842-13.184549 28.043327v51.273247" fill="#3C92CA" p-id="2965"></path><path d="M513.360311 492.432455c-10.463928 0-19.044349 8.580421-19.044349 19.044349v120.125894l-104.011445 60.062947c-8.998978 5.231964-12.138157 16.742285-6.906193 25.950541 3.557736 6.069078 9.836092 9.417535 16.533006 9.417536 3.139178 0 6.487635-0.837114 9.417536-2.511343l104.011445-60.062947 104.011445 60.062947c2.9299 1.674228 6.278357 2.511343 9.417535 2.511343 6.487635 0 12.975271-3.348457 16.533006-9.417536 5.231964-8.998978 2.092786-20.718578-6.906192-25.950541l-104.011445-60.062947v-120.125894c-0.209279-10.463928-8.580421-19.044349-19.044349-19.044349zM432.160229 311.825056c-19.253628 10.045371-61.737176 33.693848-101.709381 66.341304-12.765992 10.463928-20.090742 26.15982-20.090742 42.692827v51.273247c0 10.463928 8.580421 19.044349 19.044349 19.044349s19.044349-8.580421 19.044349-19.044349v-51.273247c0-5.231964 2.302064-10.045371 6.278357-13.393828 44.994891-36.833027 93.756795-61.527897 102.965052-66.132026 7.743307-3.767014 12.556714-11.510321 12.556714-20.090742V249.041488c0-6.278357-3.139178-12.347435-8.371142-15.695892-4.185571-2.720621-6.696914-7.32475-6.696914-12.347435V146.076436c0-26.787656 21.76497-48.552626 48.552626-48.552626h16.114449c26.787656 0 48.552626 21.76497 48.552626 48.552626v74.921725c0 5.022685-2.511343 9.626814-6.696914 12.347435-5.231964 3.557736-8.371142 9.417535-8.371142 15.695892v72.410382c0 8.580421 4.813407 16.323728 12.556714 20.090742 9.417535 4.604128 57.970161 29.08972 102.965052 66.132025 3.976293 3.348457 6.278357 8.161864 6.278356 13.393828v51.273248c0 10.463928 8.580421 19.044349 19.04435 19.044349s19.044349-8.580421 19.044349-19.044349v-51.273248c0-16.533006-7.32475-32.228898-20.090742-42.692826-39.762927-32.647456-82.455753-56.505212-101.709381-66.341304v-53.993869c9.626814-9.836092 15.068056-23.020642 15.068056-36.833027V146.076436c0-47.715512-38.716534-86.432046-86.432045-86.432046h-16.11445c-47.715512 0-86.432046 38.716534-86.432045 86.432046v74.921725c0 14.021664 5.441243 27.206213 15.068056 36.833026V311.825056h-0.418557zM192.954833 570.493358h16.11445c26.787656 0 48.552626 21.76497 48.552626 48.552626v74.921725c0 5.022685-2.511343 9.626814-6.696914 12.347435-5.231964 3.557736-8.371142 9.417535-8.371143 15.695892v72.410382c0 8.580421 4.813407 16.323728 12.556714 20.090742 9.417535 4.604128 57.970161 29.08972 102.965052 66.132026 3.976293 3.348457 6.278357 8.161864 6.278357 13.393827v51.273248c0 10.463928 8.580421 19.044349 19.044349 19.044349s19.044349-8.580421 19.044349-19.044349v-51.273248c0-16.533006-7.32475-32.228898-20.090742-42.692826-39.762927-32.647456-82.455753-56.505212-101.70938-66.341304v-53.993869c9.626814-9.836092 15.068056-23.020642 15.068056-36.833026v-74.921725c0-47.715512-38.716534-86.432046-86.432046-86.432046h-16.114449c-47.715512 0-86.432046 38.716534-86.432046 86.432046v74.712446c0 14.021664 5.441243 27.206213 15.068057 36.833027V784.794605c-19.253628 10.045371-61.737176 33.693848-101.709381 66.341303-12.765992 10.463928-20.090742 26.15982-20.090742 42.692827v51.273247c0 10.463928 8.580421 19.044349 19.044349 19.044349s19.044349-8.580421 19.044349-19.044349v-51.273247c0-5.231964 2.302064-10.045371 6.278357-13.393828 44.994891-36.833027 93.756795-61.527897 102.965052-66.132025 7.743307-3.767014 12.556714-11.510321 12.556714-20.090742V722.011036c0-6.278357-3.139178-12.347435-8.371143-15.695892-4.185571-2.720621-6.696914-7.32475-6.696914-12.347435v-74.921725c-0.418557-26.787656 21.346413-48.552626 48.134069-48.552626zM641.229512 851.135908c-12.765992 10.463928-20.090742 26.15982-20.090742 42.692827v51.273247c0 10.463928 8.580421 19.044349 19.044349 19.044349s19.044349-8.580421 19.044349-19.044349v-51.273247c0-5.231964 2.302064-10.045371 6.278357-13.393828 44.994891-36.833027 93.756795-61.527897 102.965052-66.132025 7.743307-3.767014 12.556714-11.510321 12.556713-20.090742V722.011036c0-6.278357-3.139178-12.347435-8.371142-15.695892-4.185571-2.720621-6.696914-7.32475-6.696914-12.347435v-74.921725c0-26.787656 21.76497-48.552626 48.552626-48.552626h16.114449c26.787656 0 48.552626 21.76497 48.552627 48.552626v74.921725c0 5.022685-2.511343 9.626814-6.696914 12.347435-5.231964 3.557736-8.371142 9.417535-8.371143 15.695892v72.410382c0 8.580421 4.813407 16.323728 12.556714 20.090742 9.417535 4.604128 57.970161 29.08972 102.965052 66.132026 3.976293 3.348457 6.278357 8.161864 6.278357 13.393827v51.273248c0 10.463928 8.580421 19.044349 19.044349 19.044349s19.044349-8.580421 19.044349-19.044349v-51.273248c0-16.533006-7.32475-32.228898-20.090742-42.692826-39.762927-32.647456-82.455753-56.505212-101.709381-66.341304v-53.993869c9.626814-9.836092 15.068056-23.020642 15.068057-36.833026v-74.921725c0-47.715512-38.716534-86.432046-86.432046-86.432046h-16.114449c-47.715512 0-86.432046 38.716534-86.432046 86.432046v74.712446c0 14.021664 5.441243 27.206213 15.068056 36.833027V784.794605c-19.672185 10.045371-62.155733 33.693848-102.127937 66.341303z" fill="" p-id="2966"></path></svg>
\ No newline at end of file
diff --git a/src/components/TableSelect/index.vue b/src/components/TableSelect/index.vue
index 20ca3a2..7b6a0e6 100644
--- a/src/components/TableSelect/index.vue
+++ b/src/components/TableSelect/index.vue
@@ -1,10 +1,45 @@
 <template>
-  <el-dialog :model-value="modelValue" @close="cancel" @open="handleOpen">
+  <el-dialog
+    :model-value="modelValue"
+    append-to-body
+    @close="cancel"
+    @open="handleOpen"
+  >
     <el-row>
-      <el-table ref="tableRef" :data="dataList" @select="handleSelect">
-        <el-table-column align="center" type="selection" width="55" />
-        <el-table-column prop="deviceId" />
-        <el-table-column label="设备名称" prop="deviceName" />
+      <el-table
+        ref="tableRef"
+        v-loading="loading"
+        :data="dataList"
+        @select="handleSelect"
+        @select-all="handleSelectAll"
+      >
+        <el-table-column
+          v-if="!readonly"
+          align="center"
+          type="selection"
+          width="55"
+        />
+        <el-table-column
+          v-for="item in tableStruct"
+          :key="item.label || item.prop"
+          :label="item.label"
+          :prop="item.prop"
+          align="center"
+        >
+          <template v-if="item.operate" #default="{ row }">
+            <el-button
+              v-for="button in item.operate"
+              :key="button.label"
+              :icon="button.icon"
+              :type="button.type"
+              link
+              size="small"
+              @click="button.onClick(row)"
+            >
+              {{ button.label }}
+            </el-button>
+          </template>
+        </el-table-column>
       </el-table>
       <pagination
         v-show="total > 0"
@@ -14,15 +49,19 @@
         @pagination="getList"
       />
     </el-row>
-    <el-row>
-      <el-col>
-        <el-button type="primary" @click="confirmSelect">确认</el-button>
-      </el-col>
-    </el-row>
+
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button v-if="!readonly" type="primary" @click="confirmSelect"
+          >确认</el-button
+        >
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </template>
   </el-dialog>
 </template>
 
-<script setup>
+<script name="TableSelect" setup>
 import { nextTick, reactive, ref, toRefs, watchEffect } from "vue";
 import { cloneDeep } from "lodash-es";
 import Pagination from "@/components/Pagination/index.vue";
@@ -30,14 +69,15 @@ import Pagination from "@/components/Pagination/index.vue";
 const props = defineProps({
   list: {
     type: Array,
-    default: [
-      {
-        deviceId: 40,
-      },
-      {
-        deviceId: 38,
-      },
-    ],
+    default: [],
+  },
+  tableStruct: {
+    type: Array,
+    default: [],
+  },
+  readonly: {
+    type: Boolean,
+    default: false,
   },
   requestMethod: {
     type: Function,
@@ -52,7 +92,7 @@ const props = defineProps({
 });
 const { list } = toRefs(props);
 
-const emit = defineEmits(["select-add", "select-remove", "update:modelValue"]);
+const emit = defineEmits(["update:modelValue", "confirm-select"]);
 
 const loading = ref(false);
 const dataList = ref([]);
@@ -69,8 +109,17 @@ const data = reactive({
 
 const { queryParams } = toRefs(data);
 const tableRef = ref();
+
+watchEffect(() => {
+  ids.value = selectedProperties.value.map((el) => el[props.selectKey]);
+});
+
 const handleOpen = () => {
-  selectedProperties.value = cloneDeep(list.value);
+  console.log("open");
+  if (list.value) {
+    selectedProperties.value = cloneDeep(list.value);
+  }
+  getList();
 };
 
 function getList() {
@@ -83,15 +132,13 @@ function getList() {
   });
 }
 
-watchEffect(() => {
-  ids.value = selectedProperties.value.map((el) => el[props.selectKey]);
-});
-
 const cancel = () => {
+  console.log("cancel");
   selectedProperties.value = [];
   emit("update:modelValue", false);
 };
 
+/*监听单选事件*/
 const handleSelect = (selection, row) => {
   const isCheck =
     selection.findIndex((el) => el[props.selectKey] === row[props.selectKey]) >
@@ -99,7 +146,7 @@ const handleSelect = (selection, row) => {
   if (isCheck) {
     /*添加选中*/
     const isIdNotExist =
-      list.value.findIndex(
+      selectedProperties.value.findIndex(
         (el) => el[props.selectKey] === row[props.selectKey]
       ) === -1;
     if (isIdNotExist) {
@@ -113,6 +160,31 @@ const handleSelect = (selection, row) => {
   }
 };
 
+/*监听全选事件*/
+const handleSelectAll = (selection) => {
+  if (selection.length > 0) {
+    /*全选*/
+    for (const selectionElement of selection) {
+      /*添加选中*/
+      const isIdNotExist =
+        selectedProperties.value.findIndex(
+          (el) => el[props.selectKey] === selectionElement[props.selectKey]
+        ) === -1;
+      if (isIdNotExist) {
+        selectedProperties.value.push(selectionElement);
+      }
+    }
+  } else {
+    /*全不选*/
+    for (const dataElement of dataList.value) {
+      /*移除选中*/
+      selectedProperties.value = selectedProperties.value.filter(
+        (el) => el[props.selectKey] !== dataElement[props.selectKey]
+      );
+    }
+  }
+};
+
 /*选择模式下, 将选过的设为选中状态*/
 const setRowSelected = () => {
   nextTick(() => {
@@ -129,10 +201,20 @@ const setRowSelected = () => {
 };
 
 const confirmSelect = () => {
-  console.log(selectedProperties.value);
+  emit("confirm-select", selectedProperties.value);
 };
 
-getList();
+defineExpose({
+  getList,
+});
 </script>
 
-<style scoped></style>
+<style lang="scss" scoped>
+:deep(.el-table__header) {
+  .el-table-column--selection {
+    .el-checkbox {
+      //visibility: hidden;
+    }
+  }
+}
+</style>
diff --git a/src/constant/dict.js b/src/constant/dict.js
index c5c8809..e5c2365 100644
--- a/src/constant/dict.js
+++ b/src/constant/dict.js
@@ -86,13 +86,11 @@ export const firmwareLatestTypeOptions = [
   {
     label: "否",
     value: 0,
-    tag: "danger",
     elTagType: "danger",
   },
   {
     label: "是",
     value: 1,
-    tag: "success",
     elTagType: "success",
   },
 ];
@@ -117,25 +115,21 @@ export const deviceStatusMap = [
   {
     label: "未激活",
     value: 1,
-    tag: "info",
     elTagType: "info",
   },
   {
     label: "禁用",
     value: 2,
-    tag: "danger",
     elTagType: "danger",
   },
   {
     label: "在线",
     value: 3,
-    tag: "success",
     elTagType: "success",
   },
   {
     label: "离线",
     value: 4,
-    tag: "warning",
     elTagType: "warning",
   },
 ];
@@ -178,17 +172,28 @@ export const isShadowDict = [
     elTagType: "success",
   },
 ];
-export const statusOptions = [
+export const tenantStatusOptions = [
+  {
+    label: "正常",
+    value: "0",
+    elTagType: "success",
+  },
+  {
+    label: "禁用",
+    value: "1",
+    elTagType: "danger",
+  },
+];
+
+export const deviceGroupStatusDict = [
   {
     label: "正常",
     value: "0",
-    tag: "success",
     elTagType: "success",
   },
   {
     label: "禁用",
     value: "1",
-    tag: "danger",
     elTagType: "danger",
   },
 ];
diff --git a/src/views/device/group/index.vue b/src/views/device/group/index.vue
new file mode 100644
index 0000000..e2caaac
--- /dev/null
+++ b/src/views/device/group/index.vue
@@ -0,0 +1,462 @@
+<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="groupName">
+        <el-input
+          v-model="queryParams.groupName"
+          clearable
+          placeholder="请输入设备分组名称"
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <!--      <el-form-item label="排序" prop="sort">-->
+      <!--        <el-input-->
+      <!--          v-model="queryParams.sort"-->
+      <!--          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>
+        <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:group:add']"
+          icon="Plus"
+          plain
+          type="primary"
+          @click="handleAdd"
+          >新增
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['device:group:edit']"
+          :disabled="single"
+          icon="Edit"
+          plain
+          type="success"
+          @click="handleUpdate"
+          >修改
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['device:group:remove']"
+          :disabled="multiple"
+          icon="Delete"
+          plain
+          type="danger"
+          @click="handleDelete"
+          >删除
+        </el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          v-hasPermi="['device:group: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="groupList"
+      @selection-change="handleSelectionChange"
+    >
+      <el-table-column align="center" type="selection" width="55" />
+      <el-table-column align="center" label="设备分组ID" prop="groupId" />
+      <el-table-column align="center" label="设备分组名称" prop="groupName" />
+      <!--      <el-table-column align="center" label="排序" prop="sort" />-->
+      <el-table-column align="center" label="备注" prop="remark" />
+      <el-table-column align="center" label="状态" prop="status">
+        <template #default="{ row }">
+          <dict-tag
+            :options="deviceGroupStatusDict"
+            :value="[row.status]"
+            effect="dark"
+            size="small"
+          />
+        </template>
+      </el-table-column>
+      <!--      <el-table-column align="center" label="租户ID" prop="tenantId" />-->
+      <el-table-column
+        align="center"
+        class-name="small-padding fixed-width"
+        label="操作"
+      >
+        <template #default="{ row }">
+          <el-button
+            v-hasPermi="['device:group:edit']"
+            icon="Edit"
+            link
+            type="primary"
+            @click="handleUpdate(row)"
+            >修改
+          </el-button>
+          <el-button
+            v-hasPermi="['device:group:remove']"
+            icon="Delete"
+            link
+            type="primary"
+            @click="handleDelete(row)"
+            >删除
+          </el-button>
+          <el-button
+            icon="pointer"
+            link
+            type="primary"
+            @click="
+              () => {
+                activeGroupId = row.groupId;
+                showSelectDevice = true;
+              }
+            "
+            >分配设备
+          </el-button>
+          <el-button
+            icon="list"
+            link
+            type="primary"
+            @click="
+              () => {
+                activeGroupId = row.groupId;
+                showAssignedDevice = true;
+              }
+            "
+          >
+            已分配设备
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!--    已分配设备列表-->
+    <table-select
+      ref="assignedDeviceRef"
+      v-model="showAssignedDevice"
+      :request-method="listAssignedDevice(activeGroupId)"
+      :table-struct="[
+        {
+          label: 'ID',
+          prop: 'deviceId',
+        },
+        { label: '设备名称', prop: 'deviceName' },
+        {
+          label: '操作',
+          operate: [
+            {
+              label: '取消分配',
+              type: 'danger',
+              icon: 'delete',
+              onClick: async (row) => {
+                unAssignDevice(row.deviceId).then((resp) => {
+                  ElMessage.success('已取消分配');
+                  assignedDeviceRef.getList();
+                });
+              },
+            },
+          ],
+        },
+      ]"
+      select-key="deviceId"
+      @confirm-select="confirmUnassignedDevice"
+    />
+
+    <!--    选择要分配的设备-->
+    <table-select
+      v-model="showSelectDevice"
+      :request-method="listUnassignedDevice(activeGroupId)"
+      :table-struct="[
+        {
+          label: 'ID',
+          prop: 'deviceId',
+        },
+        {
+          label: '设备名称',
+          prop: 'deviceName',
+        },
+      ]"
+      select-key="deviceId"
+      @confirm-select="handleAssignDevice"
+    />
+
+    <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="groupRef"
+        :model="form"
+        :rules="rules"
+        label-position="left"
+        label-width="120px"
+      >
+        <el-form-item label="设备分组名称" prop="groupName">
+          <el-input v-model="form.groupName" 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="租户ID" prop="tenantId">-->
+        <!--          <el-input v-model="form.tenantId" placeholder="请输入租户ID" />-->
+        <!--        </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="Group" setup>
+import {
+  addGroup,
+  assignDevice,
+  delGroup,
+  getGroup,
+  listGroup,
+  unAssignDevice,
+  updateGroup,
+} from "@/api/device/group";
+import DictTag from "@/components/DictTag/index.vue";
+import { deviceGroupStatusDict } from "@/constant/dict";
+import { getCurrentInstance, reactive, ref, toRefs } from "vue";
+import TableSelect from "@/components/TableSelect/index.vue";
+import { listDevice } from "@/api/iot/device";
+import { ElMessage } from "element-plus";
+
+const { proxy } = getCurrentInstance();
+
+const groupList = 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 showAssignedDevice = ref(false); /*显示已分配的设备列表*/
+const showSelectDevice = ref(false); /*显示选择设备窗口*/
+const assignedDeviceRef = ref();
+const activeGroupId = ref();
+const data = reactive({
+  form: {},
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    groupName: null,
+    sort: null,
+    status: null,
+    tenantId: null,
+  },
+  rules: {
+    groupName: [
+      {
+        required: true,
+        message: "请输入分组名称",
+        trigger: "blur",
+      },
+    ],
+  },
+});
+
+const { queryParams, form, rules } = toRefs(data);
+
+/** 查询设备分组列表 */
+function getList() {
+  loading.value = true;
+  listGroup(queryParams.value).then((response) => {
+    groupList.value = response.rows;
+    total.value = response.total;
+    loading.value = false;
+  });
+}
+
+// 取消按钮
+function cancel() {
+  open.value = false;
+  reset();
+}
+
+// 表单重置
+function reset() {
+  form.value = {
+    groupId: null,
+    groupName: null,
+    sort: null,
+    remark: null,
+    createTime: null,
+    createBy: null,
+    status: null,
+    tenantId: null,
+  };
+  proxy.resetForm("groupRef");
+}
+
+/** 搜索按钮操作 */
+function handleQuery() {
+  queryParams.value.pageNum = 1;
+  getList();
+}
+
+/** 重置按钮操作 */
+function resetQuery() {
+  proxy.resetForm("queryRef");
+  handleQuery();
+}
+
+// 多选框选中数据
+function handleSelectionChange(selection) {
+  ids.value = selection.map((item) => item.groupId);
+  single.value = selection.length !== 1;
+  multiple.value = !selection.length;
+}
+
+/** 新增按钮操作 */
+function handleAdd() {
+  reset();
+  open.value = true;
+  title.value = "添加设备分组";
+}
+
+/** 修改按钮操作 */
+function handleUpdate(row) {
+  reset();
+  const _groupId = row.groupId || ids.value;
+  getGroup(_groupId).then((response) => {
+    form.value = response.data;
+    open.value = true;
+    title.value = "修改设备分组";
+  });
+}
+
+const listUnassignedDevice = (groupId) => (queryParams) =>
+  listDevice({
+    ...queryParams,
+    searchValue: 1,
+    groupId,
+  });
+
+const listAssignedDevice = (groupId) => (queryParams) =>
+  listDevice({
+    ...queryParams,
+    groupId,
+  });
+
+/*确认取消分配设备*/
+const confirmUnassignedDevice = async (data) => {
+  if (data.length) {
+    const _ids = data.map((el) => el.deviceId).join(",");
+    await unAssignDevice(_ids);
+    showAssignedDevice.value = false;
+    ElMessage.success("取消分配设备成功");
+  } else {
+    ElMessage.error("清选择要取消分配的设备");
+  }
+};
+
+/** 提交按钮 */
+function submitForm() {
+  proxy.$refs["groupRef"].validate((valid) => {
+    if (valid) {
+      if (form.value.groupId != null) {
+        updateGroup(form.value).then((response) => {
+          proxy.$modal.msgSuccess("修改成功");
+          open.value = false;
+          getList();
+        });
+      } else {
+        addGroup(form.value).then((response) => {
+          proxy.$modal.msgSuccess("新增成功");
+          open.value = false;
+          getList();
+        });
+      }
+    }
+  });
+}
+
+/** 删除按钮操作 */
+function handleDelete(row) {
+  const _groupIds = row.groupId || ids.value;
+  proxy.$modal
+    .confirm('是否确认删除设备分组编号为"' + _groupIds + '"的数据项？')
+    .then(function () {
+      return delGroup(_groupIds);
+    })
+    .then(() => {
+      getList();
+      proxy.$modal.msgSuccess("删除成功");
+    })
+    .catch(() => {});
+}
+
+/** 导出按钮操作 */
+function handleExport() {
+  proxy.download(
+    "device/group/export",
+    {
+      ...queryParams.value,
+    },
+    `group_${new Date().getTime()}.xlsx`
+  );
+}
+
+const handleAssignDevice = async (data) => {
+  if (data.length) {
+    const _ids = data.map((el) => el.deviceId).join(",");
+    await assignDevice(activeGroupId.value, _ids);
+    ElMessage.success("成功");
+    showSelectDevice.value = false;
+  } else {
+    ElMessage.error("清选择要分配的设备");
+  }
+};
+
+getList();
+</script>
diff --git a/src/views/iot/device/index.vue b/src/views/iot/device/index.vue
index 16bfeff..dba50b2 100644
--- a/src/views/iot/device/index.vue
+++ b/src/views/iot/device/index.vue
@@ -33,13 +33,13 @@
           />
         </el-select>
       </el-form-item>
-      <el-form-item label="设备状态" prop="status">
-        <el-switch
-          v-model="queryParams.status"
-          :active-value="1"
-          :inactive-value="0"
-        />
-      </el-form-item>
+      <!--      <el-form-item label="设备状态" prop="status">-->
+      <!--        <el-switch-->
+      <!--          v-model="queryParams.status"-->
+      <!--          :active-value="1"-->
+      <!--          :inactive-value="0"-->
+      <!--        />-->
+      <!--      </el-form-item>-->
       <!--      <el-form-item label="用户ID" prop="userId">-->
       <!--        <el-input-->
       <!--          v-model="queryParams.userId"-->
@@ -146,8 +146,8 @@
       <!--      </el-form-item>-->
       <el-form-item>
         <el-button icon="Search" type="primary" @click="handleQuery"
-          >搜索</el-button
-        >
+          >搜索
+        </el-button>
         <el-button icon="Refresh" @click="resetQuery">重置</el-button>
       </el-form-item>
     </el-form>
@@ -256,7 +256,14 @@
       </el-table-column>
       <!--      <el-table-column align="center" label="设备摘要" prop="summary" />-->
       <!--      <el-table-column align="center" label="图片地址" prop="imgUrl" />-->
-      <el-table-column align="center" label="描述" prop="remark" />
+      <el-table-column align="center" label="分组名称" prop="groupName">
+        <template #default="{ row }">
+          <el-tag v-if="row.groupName" type="primary">
+            {{ row.groupName }}
+          </el-tag>
+        </template>
+      </el-table-column>
+
       <el-table-column
         align="center"
         class-name="small-padding fixed-width"
@@ -491,6 +498,7 @@ import { deviceStatusMap, isShadowDict, locationWayMap } from "@/constant/dict";
 import UserTreeSelect from "@/components/UserTreeSelect/index.vue";
 import { getCurrentInstance, reactive, ref, toRefs } from "vue";
 import DictTag from "@/components/DictTag/index.vue";
+import { parseTime } from "@/utils/ruoyi";
 
 const { proxy } = getCurrentInstance();
 
diff --git a/src/views/product/alertRule/index.vue b/src/views/product/alertRule/index.vue
index 3fbe6bf..213678e 100644
--- a/src/views/product/alertRule/index.vue
+++ b/src/views/product/alertRule/index.vue
@@ -312,8 +312,8 @@
                   size="small"
                   type="danger"
                   @click="removeTriggerItem(index)"
-                  >删除</el-button
-                >
+                  >删除
+                </el-button>
               </el-col>
             </el-row>
 
@@ -578,13 +578,7 @@
               </el-button>
             </el-col>
           </el-row>
-          <el-button
-            icon="
-              "
-            link
-            size="small"
-            type="primary"
-            @click="addActionItem"
+          <el-button link size="small" type="primary" @click="addActionItem"
             >添加执行动作
           </el-button>
         </el-form-item>
@@ -592,8 +586,8 @@
       <template #footer>
         <div class="dialog-footer">
           <el-button v-if="productId" type="primary" @click="submitForm"
-            >确 定</el-button
-          >
+            >确 定
+          </el-button>
           <el-button @click="cancel">取 消</el-button>
         </div>
       </template>
diff --git a/src/views/system/tenant/index.vue b/src/views/system/tenant/index.vue
index cfdfc38..64378d7 100644
--- a/src/views/system/tenant/index.vue
+++ b/src/views/system/tenant/index.vue
@@ -127,7 +127,7 @@
       <el-table-column align="center" label="状态" prop="status">
         <template #default="{ row }">
           <dict-tag
-            :options="statusOptions"
+            :options="tenantStatusOptions"
             :value="[row.status]"
             size="small"
           />
@@ -331,7 +331,7 @@ import {
   updateTenant,
 } from "@/api/system/tenant";
 import { resetUserPwd } from "@/api/system/user";
-import { statusOptions } from "@/constant/dict";
+import { tenantStatusOptions } from "@/constant/dict";
 import DictTag from "@/components/DictTag/index.vue";
 
 const { proxy } = getCurrentInstance();