物联设备设备管理优化

src/views/iot/weihu/index.vue

@@ -9,17 +9,20 @@
         <a-select ref="select"
                   placeholder="请选择机构"
                   v-model:value="model[field]"
-                  @change="handleChange">
+                  @change="handleChange" allow-clear >
           <a-select-option :value="item.orgCode" v-for="item in departInfos" :key="item.orgCode">{{item.departName}}</a-select-option>
         </a-select>
       </template>
       <template #form-nuArea="{model,field}">
         <a-select ref="select"
                   placeholder="请选择区域"
-                  v-model:value="model[field]">
+                  v-model:value="model[field]" allow-clear >
           <a-select-option :value="item.nuId" v-for="item in nuInfos" :key="item.nuId">{{item.nuId}}</a-select-option>
         </a-select>
       </template>
+      <template #form-deviceType="{model,field}">
+        <j-dict-select-tag v-model:value="model[field]" :showLabel="false" dictCode="tplink_device_type" placeholder="请选择设备类型"  allow-clear />
+      </template>
       <!--操作栏-->
       <template #action="{ record }">
         <TableAction :actions="getTableAction(record)"/>
@@ -39,6 +42,7 @@ import {onMounted, reactive, ref} from 'vue';
   import { useDrawer } from "@/components/Drawer";
   import SendOrgDrawer from './components/SendOrgDrawer.vue';
   import ReamrksListModal from './components/ReamrksListModal.vue'
+import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
   const [registerDrawer, { openDrawer }] = useDrawer();
   const queryParam = reactive<any>({});
   const selectedRows = ref<any[]>([]);

src/views/iot/weihu/weihu.data.ts

@@ -46,7 +46,7 @@ export const columns: BasicColumn[] = [
   {
     title: '设备类型',
     align: "center",
-    dataIndex: 'deviceType',
+    dataIndex: 'deviceType_dictText',
     width: 100,
   },
   {
@@ -76,7 +76,13 @@ export const columns: BasicColumn[] = [
     width: 100,
   },
   {
-    title: '时间戳',
+    title: '操作人',
+    align: "center",
+    dataIndex: 'updateBy',
+    width: 160,
+  },
+  {
+    title: '操作时间',
     align: "center",
     dataIndex: 'updateDate',
     width: 160,
@@ -110,19 +116,11 @@ export const searchFormSchema: FormSchema[] = [
     label: '设备类型',
     field: 'deviceType',
     component: 'JDictSelectTag',
-    componentProps: {
-      placeholder: '请选择类型',
-      options: [
-        { label: '录像机', value: '录像机' },
-        { label: '摄像头', value: '摄像头' },
-        { label: '路由器', value: '路由器' },
-        { label: '交换机', value: '交换机' },
-        { label: '无线AP', value: '无线AP' },
-        { label: '智能电表', value: '智能电表' },
-        { label: '智能水表', value: '智能水表' },
-        { label: '温湿度计', value: '温湿度计' },
-      ],
-    },
+    slot: 'deviceType',
+    // componentProps: {
+    //   placeholder: '请选择类型',
+    //   dictCode: 'tplink_device_type',
+    // },
     colProps: { span: 6 },
   },
   {
@@ -147,6 +145,7 @@ export const searchFormSchema: FormSchema[] = [
       options: [
         { label: '未分配', value: '未分配' },
         { label: '已分配', value: '已分配' },
+        { label: '释放', value: '释放' },
       ],
     },
     colProps: { span: 6 },
@@ -159,8 +158,7 @@ export const searchFormSchema: FormSchema[] = [
       placeholder: '请选择设备状态',
       options: [
         { label: '正常', value: '0' },
-        { label: '释放', value: '1' },
-        { label: '损坏', value: '2' },
+        { label: '损坏', value: '1' },
       ],
     },
     colProps: { span: 6 },
@@ -175,7 +173,13 @@ export const logColumns: BasicColumn[] = [
     dataIndex: 'remark'
   },
   {
-    title: '创建时间',
+    title: '操作人',
+    align:"center",
+    dataIndex: 'updateBy',
+    width: 160
+  },
+  {
+    title: '操作时间',
     align:"center",
     dataIndex: 'updateDate',
     width: 160

src/views/iotManager/components/AreaDeviceAddList.vue

@@ -37,7 +37,7 @@
       <BasicTable @register="registerTable" :rowSelection="rowSelection">
         <!--插槽:table标题-->
         <template #tableTitle>
-          <a-button v-if="selectedRowKeys.length > 0" type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 绑定设备</a-button>
+<!--          <a-button v-if="selectedRowKeys.length > 0" type="primary" preIcon="ant-design:plus-outlined" @click="submitForm"> 绑定设备</a-button>-->
         </template>
         <!--操作栏-->
         <template #action="{ record }">
@@ -70,6 +70,8 @@ import { deviceAddColumns } from '../manager.data';
 import { canAddList,addBatch } from '../manager.api';
 import { useUserStore } from '/@/store/modules/user';
 import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
+import { useMessage } from '/@/hooks/web/useMessage';
+const { createMessage } = useMessage();
 
 const formRef = ref();
 const confirmLoading = ref<boolean>(false);
@@ -80,6 +82,7 @@ const orgCode = ref<any>('');
 const remarks = ref<any>('');
 const visible = ref<any>();
 const userStore = useUserStore();
+const emit = defineEmits(['register', 'ok']);
 //注册table数据
 const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
   tableProps: {
@@ -149,7 +152,11 @@ function searchReset() {
   searchQuery();
 }
 
-function handleCreate(){
+function submitForm(){
+  if(!selectedRowKeys.value.length > 0){
+    createMessage.warning('请选择要添加的设备');
+    return;
+  }
   visible.value = true;
 }
 
@@ -164,7 +171,8 @@ function handleOk(){
   }
   addBatch(record)
     .then((res) => {
-      searchQuery();
+      // searchQuery();
+      emit('ok');
     }).catch(() =>{})
     .finally(() => {
       confirmLoading.value = false;
@@ -176,12 +184,13 @@ function handleOk(){
 function init(record) {
   departId.value = record.departId;
   nuId.value = record.nuId;
-  orgCode.value = record.orgCode;
+  orgCode.value = record.sysOrgCode;
   searchQuery();
 }
 
 defineExpose({
-  init
+  init,
+  submitForm
 });
 
 </script>

src/views/iotManager/components/AreaDeviceAddModal.vue

@@ -3,7 +3,7 @@
    :bodyStyle="{ padding: '14px' }" @close="handleCancel">
     <template #footer>
       <a-button type="primary" style="margin-right: 8px" @click="handleCancel">关闭</a-button>
-      <a-button type="primary" @click="handleOk" v-if="!disableSubmit">确认</a-button>
+      <a-button type="primary" @click="handleOk" v-if="!disableSubmit">添加设备</a-button>
     </template>
     <AreaDeviceAddList v-if="visible" ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit"
       :formBpm="false">

src/views/iotManager/components/AreaDeviceList.vue

@@ -81,6 +81,7 @@ const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
     canResize: false,
     useSearchForm: false,
     showIndexColumn: true,
+    showActionColumn: false,
     actionColumn: {
       width: 180,
       fixed: 'right',

src/views/iotManager/components/AreaList.vue

@@ -125,7 +125,7 @@ function getTableAction(record) {
  * 添加设备
  */
 function deviceManager(record: Recordable){
-  areaAddDrawer.value.disableSubmit = true;
+  areaAddDrawer.value.disableSubmit = false;
   areaAddDrawer.value.edit(record);
 }
 

src/views/iotManager/components/OrgDeviceAddList.vue

@@ -37,7 +37,7 @@
       <BasicTable @register="registerTable" :rowSelection="rowSelection">
         <!--插槽:table标题-->
         <template #tableTitle>
-          <a-button v-if="selectedRowKeys.length > 0" type="primary" preIcon="ant-design:plus-outlined" @click="handleCreate"> 绑定设备</a-button>
+<!--          <a-button v-if="selectedRowKeys.length > 0" type="primary" preIcon="ant-design:plus-outlined" @click="submitForm"> 绑定设备</a-button>-->
         </template>
         <!--操作栏-->
         <template #action="{ record }">
@@ -70,6 +70,8 @@ import { deviceAddColumns } from '../manager.data';
 import { canAddList,addOrgBatch } from '../manager.api';
 import { useUserStore } from '/@/store/modules/user';
 import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
+import { useMessage } from '/@/hooks/web/useMessage';
+const { createMessage } = useMessage();
 
 const formRef = ref();
 const confirmLoading = ref<boolean>(false);
@@ -79,6 +81,7 @@ const orgCode = ref<any>('');
 const remarks = ref<any>('');
 const visible = ref<any>();
 const userStore = useUserStore();
+const emit = defineEmits(['register', 'ok']);
 //注册table数据
 const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
   tableProps: {
@@ -148,7 +151,11 @@ function searchReset() {
   searchQuery();
 }
 
-function handleCreate(){
+function submitForm(){
+  if(!selectedRowKeys.value.length > 0){
+    createMessage.warning('请选择要添加的设备');
+    return;
+  }
   visible.value = true;
 }
 
@@ -162,7 +169,8 @@ function handleOk(){
   }
   addOrgBatch(record)
     .then((res) => {
-      searchQuery();
+      // searchQuery();
+      emit('ok');
     }).catch(() =>{})
     .finally(() => {
       confirmLoading.value = false;
@@ -178,7 +186,8 @@ function init(record) {
 }
 
 defineExpose({
-  init
+  init,
+  submitForm
 });
 
 </script>

src/views/iotManager/components/OrgDeviceAddModal.vue

@@ -3,7 +3,7 @@
    :bodyStyle="{ padding: '14px' }" @close="handleCancel">
     <template #footer>
       <a-button type="primary" style="margin-right: 8px" @click="handleCancel">关闭</a-button>
-      <a-button type="primary" @click="handleOk" v-if="!disableSubmit">确认</a-button>
+      <a-button type="primary" @click="handleOk" v-if="!disableSubmit">绑定设备</a-button>
     </template>
     <OrgDeviceAddList v-if="visible" ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit"
       :formBpm="false">

src/views/iotManager/components/PreviewList.vue

@@ -74,13 +74,15 @@
 </template>
 
 <script lang="ts" name="iotManager-previewList" setup>
-import {ref, reactive, defineExpose, nextTick} from 'vue';
+import {ref, reactive, defineExpose, nextTick, createVNode} from 'vue';
 import { BasicTable, useTable, TableAction } from '/@/components/Table';
 import { useListPage } from '/@/hooks/system/useListPage';
 import { orgDeviceColumns } from '../manager.data';
-import { previewList } from '../manager.api';
+import {previewList, releaseDevice, unbindDevice} from '../manager.api';
 import { useUserStore } from '/@/store/modules/user';
 import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
+import {Modal} from "ant-design-vue";
+import {ExclamationCircleOutlined} from "@ant-design/icons-vue";
 
 const formRef = ref();
 const confirmLoading = ref<boolean>(false);
@@ -135,19 +137,19 @@ function handleSuccess() {
 function getTableAction(record) {
   return [
     {
-      label: '更换',
-      // onClick: deviceOrgManager.bind(null, record),
+      label: '换绑',
+      onClick: deviceUpBindManager.bind(null, record),
     },
     {
       label: '释放',
-      // onClick: deviceManager.bind(null, record),
+      onClick: deviceReleaseManager.bind(null, record),
       ifShow: () => {
         return record.izAllocate == '已分配';
       },
     },
     {
-      label: '删除',
-      // onClick: devicePreview.bind(null, record),
+      label: '解绑',
+      onClick: deviceUnBindManager.bind(null, record),
       ifShow: () => {
         return record.izAllocate == '释放';
       },
@@ -155,6 +157,44 @@ function getTableAction(record) {
   ];
 }
 
+//换绑
+function deviceUpBindManager(record: Recordable){
+
+}
+
+//释放
+function deviceReleaseManager(record: Recordable){
+  Modal.confirm({
+    title: '设备释放',
+    width: '500px',
+    icon: createVNode(ExclamationCircleOutlined),
+    content: createVNode('div', { style: 'color:red;' }, '确定要释放该设备吗？'),
+    okText: '确定',
+    onOk() {
+      releaseDevice(record).then((res) => {}).catch(() =>{}).finally(() => {reload();});
+    },
+    onCancel() {
+    },
+    class: 'test',
+  });
+}
+
+function deviceUnBindManager(record: Recordable){
+  Modal.confirm({
+    title: '设备解绑',
+    width: '500px',
+    icon: createVNode(ExclamationCircleOutlined),
+    content: createVNode('div', { style: 'color:red;' }, '确定要解绑该设备吗？'),
+    okText: '确定',
+    onOk() {
+      unbindDevice(record).then((res) => {}).catch(() =>{}).finally(() => {reload();});
+    },
+    onCancel() {
+    },
+    class: 'test',
+  });
+}
+
 /**
  * 查询
  */

src/views/iotManager/index.vue

@@ -139,7 +139,7 @@ function getTableAction(record) {
  * 添加机构设备
  */
 function deviceOrgManager(record: Recordable){
-  orgModal.value.disableSubmit = true;
+  orgModal.value.disableSubmit = false;
   orgModal.value.edit(record);
 }
 /**

src/views/iotManager/manager.api.ts

@@ -9,6 +9,8 @@ enum Api {
   addBatch = '/iot/manager/device/addBatch',
   addOrgBatch = '/iot/manager/device/addOrgBatch',
   unbindOrg = '/iot/manager/device/unbindOrg',
+  releaseDevice = '/iot/manager/device/releaseDevice',
+  unbindDevice = '/iot/manager/device/unbindDevice',
   logList = '/iot/manager/log/list',
 }
 
@@ -53,3 +55,11 @@ export const unbindOrg = (params) => defHttp.post({ url: Api.unbindOrg, params }
  * @param params
  */
 export const logList = (params) => defHttp.get({ url: Api.logList, params });
+/**
+ * 释放设备
+ */
+export const releaseDevice = (params) => defHttp.post({ url: Api.releaseDevice, params });
+/**
+ * 解绑设备
+ */
+export const unbindDevice = (params) => defHttp.post({ url: Api.unbindDevice, params });

src/views/iotManager/manager.data.ts

@@ -196,7 +196,7 @@ export const deviceAddColumns: BasicColumn[] = [
 //列表数据
 export const logColumns: BasicColumn[] = [
   {
-    title: '维护类型',
+    title: '操作类型',
     align: "center",
     dataIndex: 'optType'
   },
@@ -206,7 +206,12 @@ export const logColumns: BasicColumn[] = [
     dataIndex: 'remark',
   },
   {
-    title: '时间',
+    title: '操作人',
+    align: "center",
+    dataIndex: 'updateBy',
+  },
+  {
+    title: '操作时间',
     align: "center",
     dataIndex: 'updateDate',
   }