物联设备管理-设备清单、设备日志

src/views/device/manager/DeviceManagerList.vue

@@ -42,6 +42,7 @@
     </BasicTable>
     <DepartPreviewModal ref="previewDrawer" @success="handleSuccess" />
     <DeviceIntegrationModal ref="registerDrawer" @success="handleSuccess" />
+    <DeviceLogModal ref="logDrawer" @success="handleSuccess" />
   </div>
 </template>
 
@@ -54,13 +55,15 @@
   import {list, save} from './manager.api';
   import { columns, searchFormSchema } from './manager.data';
   import {useModal} from "@/components/Modal";
-  import DepartPreviewModal from "./components/DepartPreviewModal.vue";
-  import DeviceIntegrationModal from "./components/DeviceIntegrationModal.vue";
+  import DepartPreviewModal from "./components/preview/DepartPreviewModal.vue";
+  import DeviceIntegrationModal from "./components/integration/DeviceIntegrationModal.vue";
+  import DeviceLogModal from "./components/log/DeviceLogModal.vue";
   import { defHttp } from '/@/utils/http/axios';
   const formRef = ref();
   const queryParam = reactive<any>({});
   const previewDrawer = ref();
   const registerDrawer = ref();
+  const logDrawer = ref();
   const tipVisible = ref(false);
   //注册model
   const [registerModal, {openModal}] = useModal();
@@ -175,8 +178,8 @@
    * 设备日志
    */
   function handleDeviceLog(record: Recordable) {
-    registerDrawer.value.disableSubmit = true;
-    registerDrawer.value.edit(record);
+    logDrawer.value.disableSubmit = true;
+    logDrawer.value.edit(record);
   }
 
 </script>

src/views/device/manager/components/integration/CameraList.vue

@@ -77,7 +77,6 @@ function handleSuccess() {
  * 查询
  */
 function searchQuery() {
-  console.log('searchQuery', queryParam);
   reload();
 }
 
@@ -117,7 +116,6 @@ function getTableAction(record) {
 }
 
 function init(record) {
-  console.log("🚀 ~ init ~ record:", record)
   queryParam.departId = record.id;
   reload();
 }

src/views/device/manager/components/integration/ElectricityList.vue

@@ -75,7 +75,6 @@ function handleSuccess() {
  * 查询
  */
 function searchQuery() {
-  console.log('searchQuery', queryParam);
   reload();
 }
 
@@ -98,7 +97,6 @@ function getTableAction(record) {
 }
 
 function init(record) {
-  console.log("🚀 ~ init ~ record:", record)
   queryParam.departId = record.id;
   reload();
 }

src/views/device/manager/components/integration/HumidList.vue

@@ -75,7 +75,6 @@ function handleSuccess() {
  * 查询
  */
 function searchQuery() {
-  console.log('searchQuery', queryParam);
   reload();
 }
 
@@ -98,7 +97,6 @@ function getTableAction(record) {
 }
 
 function init(record) {
-  console.log("🚀 ~ init ~ record:", record)
   queryParam.departId = record.id;
   reload();
 }

src/views/device/manager/components/integration/NetworkList.vue

@@ -75,7 +75,6 @@ function handleSuccess() {
  * 查询
  */
 function searchQuery() {
-  console.log('searchQuery', queryParam);
   reload();
 }
 
@@ -98,7 +97,6 @@ function getTableAction(record) {
 }
 
 function init(record) {
-  console.log("🚀 ~ init ~ record:", record)
   queryParam.departId = record.id;
   reload();
 }

src/views/device/manager/components/integration/WaterList.vue

@@ -75,7 +75,6 @@ function handleSuccess() {
  * 查询
  */
 function searchQuery() {
-  console.log('searchQuery', queryParam);
   reload();
 }
 
@@ -98,7 +97,6 @@ function getTableAction(record) {
 }
 
 function init(record) {
-  console.log("🚀 ~ init ~ record:", record)
   queryParam.departId = record.id;
   reload();
 }

src/views/device/manager/components/log/DeviceLogList.vue

@@ -0,0 +1,88 @@
+<template>
+  <div>
+    <!--引用表格-->
+    <BasicTable @register="registerTable">
+      <!--插槽:table标题-->
+      <template #tableTitle>
+      </template>
+      <!--操作栏-->
+      <template #action="{ record }">
+        <TableAction :actions="getTableAction(record)"/>
+      </template>
+    </BasicTable>
+  </div>
+</template>
+
+<script lang="ts" name="iot-weihu" setup>
+import {onMounted, reactive, ref} from 'vue';
+  import { BasicTable, TableAction } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { list } from './log.api';
+  import { columns} from './log.data';
+  import { useDrawer } from "@/components/Drawer";
+  const [registerDrawer, { openDrawer }] = useDrawer();
+  const queryParam = reactive<any>({});
+  const selectedRows = ref<any[]>([]);
+  const remarksModal = ref();
+  //注册table数据
+  const { prefixCls,tableContext } = useListPage({
+    tableProps:{
+      title: '设备日志',
+      api: list,
+      columns,
+      canResize:false,
+      showIndexColumn: true,
+      showActionColumn: false,
+      pagination: {
+        current: 1,
+        pageSize: 15,
+        pageSizeOptions: ['15', '50', '70', '100'],
+      },
+      actionColumn: {
+        width: 90,
+        fixed:'right'
+      },
+      beforeFetch: (params) => {
+        return Object.assign(params, queryParam);
+      },
+    },
+  })
+  const [registerTable, {reload},{ rowSelection, selectedRowKeys }] = tableContext
+
+  /**
+   * 成功回调
+   */
+  function handleSuccess() {
+    (selectedRowKeys.value = []) && reload();
+  }
+
+  /**
+   * 操作栏
+   */
+  function getTableAction(record){
+    return [
+    ];
+  }
+
+function init(record) {
+  console.log("🚀 ~ init ~ record:", record)
+  queryParam.orgCode = record.orgCode;
+  reload();
+}
+
+defineExpose({
+  init,
+});
+
+
+</script>
+
+<style lang="less" scoped>
+:deep(.selected-row) {
+  background-color: #e6f7ff !important;
+
+  &:hover td {
+    background-color: #e6f7ff !important;
+  }
+}
+</style>

src/views/device/manager/components/log/DeviceLogModal.vue

@@ -0,0 +1,82 @@
+<template>
+  <a-drawer :title="title" :width="width" :visible="visible" :closable="true" :footer-style="{ textAlign: 'right' }"
+   :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>
+    </template>
+    <DeviceLogList v-if="visible" ref="registerForm" @ok="submitCallback" :formDisabled="disableSubmit"
+      :formBpm="false">
+    </DeviceLogList>
+  </a-drawer>
+</template>
+
+<script lang="ts" setup>
+import { ref, nextTick, defineExpose } from 'vue';
+import DeviceLogList from './DeviceLogList.vue'
+
+const title = ref<string>('');
+const width = ref<number>(1200);
+const visible = ref<boolean>(false);
+const disableSubmit = ref<boolean>(false);
+const registerForm = ref();
+const emit = defineEmits(['register', 'success']);
+/**
+ * 新增
+ */
+function add() {
+  title.value = '新增';
+  visible.value = true;
+  nextTick(() => {
+    registerForm.value.add();
+  });
+}
+
+/**
+ * 编辑
+ * @param record
+ */
+function edit(record) {
+  title.value = disableSubmit.value ? '设备日志' : '编辑';
+  visible.value = true;
+  nextTick(() => {
+    registerForm.value.init(record);
+  });
+}
+
+/**
+ * 确定按钮点击事件
+ */
+function handleOk() {
+  registerForm.value.submitForm();
+}
+
+/**
+ * form保存回调事件
+ */
+function submitCallback() {
+  handleCancel();
+  emit('success');
+}
+
+/**
+ * 取消按钮回调事件
+ */
+function handleCancel() {
+  visible.value = false;
+}
+
+defineExpose({
+  add,
+  edit,
+  disableSubmit,
+});
+</script>
+
+<style lang="less">
+/**隐藏样式-modal确定按钮 */
+.jee-hidden {
+  display: none !important;
+}
+</style>
+<style lang="less" scoped></style>

src/views/device/manager/components/log/log.api.ts

@@ -0,0 +1,13 @@
+import { defHttp } from '/@/utils/http/axios';
+
+enum Api {
+  list = '/iot/device/manager/bingLogList',
+}
+
+/**
+ * 列表
+ * @param params
+ */
+export const list = (params) => defHttp.get({ url: Api.list, params });
+
+

src/views/device/manager/components/log/log.data.ts

@@ -0,0 +1,72 @@
+import {BasicColumn} from '/@/components/Table';
+import {FormSchema} from '/@/components/Table';
+
+//列表数据
+export const columns: BasicColumn[] = [
+  {
+    title: '区域编码',
+    align: "center",
+    dataIndex: 'nuId',
+    customRender:({record})=>{
+      if(record.nuId==null || record.nuId==''){
+        return "-";
+      }else{
+        return record.nuId;
+      }
+    },
+    width: 100
+  },
+  {
+    title: '区域名称',
+    align: "center",
+    dataIndex: 'nuName',
+    customRender:({record})=>{
+      if(record.nuName==null || record.nuName==''){
+        return "-";
+      }else{
+        return record.nuName;
+      }
+    },
+  },
+  {
+    title: '设备维度',
+    align: "center",
+    dataIndex: 'dimension',
+    width: 100
+  },
+  {
+    title: '设备类型',
+    align: "center",
+    dataIndex: 'deviceType_dictText',
+    width: 100
+  },
+  {
+    title: '设备型号',
+    align: "center",
+    dataIndex: 'deviceModel',
+  },
+  {
+    title: '设备标识',
+    align: "center",
+    dataIndex: 'sn',
+  },
+  {
+    title: '生产厂家',
+    align: "center",
+    dataIndex: 'factory',
+  },
+  {
+    title: '操作时间',
+    align: "center",
+    dataIndex: 'optDate',
+    width: 150
+  },
+  {
+    title: '操作类型',
+    align: "center",
+    dataIndex: 'optType',
+    width: 100
+  },
+];
+
+export const searchFormSchema: FormSchema[] = [];

src/views/device/manager/components/preview/AddDepartPreviewForm.vue

@@ -6,8 +6,8 @@
           <a-row>
             <a-col :span="24">
               <a-form-item label="规格型号" v-bind="validateInfos.deviceModel" id="departPreviewForm-deviceModel" name="deviceModel">
-                <a-select ref="select"
-                          placeholder="规格型号"
+                <a-select ref="select" :disabled="isUpdate"
+                          placeholder="请选择设备"
                           v-model:value="formData.deviceModel" @change="handleChange">
                   <a-select-option :value="item.deviceModel" v-for="item in deviceConfigs" :key="item.id">{{item.deviceModel}}</a-select-option>
                 </a-select>
@@ -49,7 +49,7 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive, defineExpose, nextTick, defineProps, computed, onMounted } from 'vue';
+import {ref, reactive, defineExpose, nextTick, defineProps, computed, onMounted, unref} from 'vue';
 import { defHttp } from '/@/utils/http/axios';
 import { useMessage } from '/@/hooks/web/useMessage';
 import { getValueType } from '/@/utils';
@@ -58,7 +58,7 @@ import { Form } from 'ant-design-vue';
 import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
 import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
 import {nulist} from "@/views/iotManager/manager.api";
-
+const isUpdate = ref<boolean>(false);
 const orgCode = ref<any>('');
 const deviceConfigs = ref([]);
 const props = defineProps({
@@ -108,6 +108,7 @@ function add(record) {
   getDeviceConfig();
   orgCode.value = record.orgCode;
   formData.orgCode = record.orgCode;
+  isUpdate.value = false;
 }
 
 /**
@@ -116,6 +117,7 @@ function add(record) {
 function edit(record) {
   getDeviceConfig();
   orgCode.value = record.orgCode;
+  isUpdate.value = true;
   nextTick(() => {
     resetFields();
     //赋值
@@ -147,12 +149,8 @@ async function submitForm() {
     return Promise.reject(errorFields);
   }
   confirmLoading.value = true;
-  const isUpdate = ref<boolean>(false);
   //时间格式化
   let model = formData;
-  if (model.id) {
-    isUpdate.value = true;
-  }
   //循环数据
   for (let data in model) {
     //如果该数据是数组并且是字符串类型
@@ -164,7 +162,8 @@ async function submitForm() {
       }
     }
   }
-  await savePreview(model)
+  let isUpdateVal = unref(isUpdate);
+  await savePreview(model,isUpdateVal)
     .then((res) => {
       emit('ok');
     })

src/views/device/manager/components/preview/AddNuPreviewForm.vue

@@ -6,7 +6,7 @@
           <a-row>
             <a-col :span="24">
               <a-form-item label="选择区域" v-bind="validateInfos.nuId" id="nuPreviewForm-nuId" name="nuId">
-                  <a-select ref="select"
+                  <a-select ref="select" :disabled="isUpdate"
                             placeholder="请选择区域"
                             v-model:value="formData.nuId">
                     <a-select-option :value="item.nuId" v-for="item in nuInfos" :key="item.nuId">{{item.nuName}}</a-select-option>
@@ -17,8 +17,8 @@
           <a-row>
             <a-col :span="24">
               <a-form-item label="规格型号" v-bind="validateInfos.deviceModel" id="nuPreviewForm-deviceModel" name="deviceModel">
-                <a-select ref="select"
-                          placeholder="规格型号"
+                <a-select ref="select" :disabled="isUpdate"
+                          placeholder="请选择设备"
                           v-model:value="formData.deviceModel" @change="handleChange">
                   <a-select-option :value="item.deviceModel" v-for="item in deviceConfigs" :key="item.id">{{item.deviceModel}}</a-select-option>
                 </a-select>
@@ -60,7 +60,7 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive, defineExpose, nextTick, defineProps, computed, onMounted } from 'vue';
+import {ref, reactive, defineExpose, nextTick, defineProps, computed, onMounted, unref} from 'vue';
 import { defHttp } from '/@/utils/http/axios';
 import { useMessage } from '/@/hooks/web/useMessage';
 import { getValueType } from '/@/utils';
@@ -68,7 +68,7 @@ import { nuList,configList,savePreview } from './preview.api';
 import { Form } from 'ant-design-vue';
 import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
 import JFormContainer from '/@/components/Form/src/container/JFormContainer.vue';
-
+const isUpdate = ref<boolean>(false);
 const orgCode = ref<any>('');
 const deviceConfigs = ref([]);
 const nuInfos = ref([]);
@@ -122,6 +122,7 @@ function add(record) {
   getDeviceConfig();
   orgCode.value = record.orgCode;
   formData.orgCode = record.orgCode;
+  isUpdate.value = false;
 }
 
 /**
@@ -131,6 +132,7 @@ function edit(record) {
   getNuInfos(record);
   getDeviceConfig();
   orgCode.value = record.orgCode;
+  isUpdate.value = true;
   nextTick(() => {
     resetFields();
     //赋值
@@ -162,12 +164,9 @@ async function submitForm() {
     return Promise.reject(errorFields);
   }
   confirmLoading.value = true;
-  const isUpdate = ref<boolean>(false);
   //时间格式化
   let model = formData;
-  if (model.id) {
-    isUpdate.value = true;
-  }
+
   //循环数据
   for (let data in model) {
     //如果该数据是数组并且是字符串类型
@@ -179,7 +178,8 @@ async function submitForm() {
       }
     }
   }
-  await savePreview(model)
+  let isUpdateVal = unref(isUpdate);
+  await savePreview(model,isUpdateVal)
     .then((res) => {
       emit('ok');
     })

src/views/device/manager/components/preview/NuPreviewList.vue

@@ -51,8 +51,8 @@
       </template>
     </BasicTable>
     <!-- 表单区域 -->
-<!--    <AreaDeviceAddModal ref="areaAddDrawer" @success="handleSuccess" />-->
-<!--    <AreaDeviceModal ref="areaDrawer" @success="handleSuccess" />-->
+    <AddDepartPreviewModal ref="addDepartPreviewDrawer" @success="handleSuccess" />
+    <AddNuPreviewModal ref="addNuPreviewDrawer" @success="handleSuccess" />
   </div>
 </template>
 
@@ -63,18 +63,17 @@ import { useListPage } from '/@/hooks/system/useListPage';
 import { nuColumns } from './preview.data';
 import { nuPreview,deletePreview } from './preview.api';
 import { useUserStore } from '/@/store/modules/user';
-// import AreaDeviceModal from './AreaDeviceModal.vue';
-// import AreaDeviceAddModal from './AreaDeviceAddModal.vue';
+import AddDepartPreviewModal from './AddDepartPreviewModal.vue';
+import AddNuPreviewModal from './AddNuPreviewModal.vue';
 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 queryParam = reactive<any>({});
-const areaAddDrawer = ref();
-const areaDrawer = ref();
+const addDepartPreviewDrawer = ref();
+const addNuPreviewDrawer = ref();
 const orgCode = ref<any>('');
-const departId = ref<any>('');
 const userStore = useUserStore();
 //注册table数据
 const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
@@ -123,9 +122,15 @@ function handleSuccess() {
 /**
  * 编辑
  */
-function handleEdit() {
-  // registerDrawer.value.disableSubmit = false;
-  // registerDrawer.value.add();
+function handleEdit(record) {
+  if(record.dimension =='机构维度'){
+    addDepartPreviewDrawer.value.disableSubmit = false;
+    addDepartPreviewDrawer.value.edit(record);
+  }
+  if(record.dimension =='区域维度'){
+    addNuPreviewDrawer.value.disableSubmit = false;
+    addNuPreviewDrawer.value.edit(record);
+  }
 }
 
 // 删除

src/views/device/manager/components/preview/preview.api.ts

@@ -6,6 +6,7 @@ enum Api {
   configList = '/iot/device/config/queryList',
   nuList = '/iot/device/manager/nuList',
   savePreview = '/iot/device/manager/savePreview',
+  updatePreview = '/iot/device/manager/updatePreview',
   deletePreview = '/iot/device/manager/deletePreview',
 }
 
@@ -21,7 +22,11 @@ export const nuList = (params) => defHttp.get({ url: Api.nuList, params });
  * 新增机构
  * @param id
  */
-export const savePreview = (params) => defHttp.post({ url: Api.savePreview, params });
+export const savePreview = (params, isUpdate) => {
+  let url = isUpdate ? Api.updatePreview : Api.savePreview;
+  return defHttp.post({url: url, params});
+}
+
 /**
  * 删除
  * @param id