设备详情功能测试

src/api/big/device.js

@@ -34,4 +34,83 @@ export function delDevice(id) {
         method: 'get',
         params: { ids: id }
     })
+}
+// 获取设备详情
+export function getDeviceinfo() {
+    return new Promise((resolve,reject)=>{
+        let val ={
+            msg:'',
+            code:200,
+            data:{
+                name: "默认",
+                devconfig:"",
+                label:"",
+                checkbox: ["是否网关"],
+                model:"model",
+            }
+        }
+        resolve(val)
+    })
+}
+// 获取设备属性
+export function getDeviceattribute(data) {
+    return new Promise((resolve,reject)=>{
+       
+        let val ={
+            msg:'',
+            code:200,
+            data:[],
+            total:''
+        }
+        for(var i=data.page*10-10+1;i<=data.pageSize;i++){
+            val.data.push({
+                nowTime: i+'时间',
+                keyName: i+'键名',
+                keyValue: i+'值',
+            })
+        }
+        val.total=val.data.length
+        resolve(val)
+    })
+}
+// 获取最新遥测数据
+export function gettelemetrydata(data) {
+    return new Promise((resolve,reject)=>{
+        let val ={
+            msg:'',
+            code:200,
+            data:[],
+            total:''
+        }
+        for(var i=data.page*10-10+1;i<=data.pageSize;i++){
+            val.data.push({
+                nowTime: i+'时间',
+                keyName: i+'键名',
+                keyValue: i+'值',
+            })
+        }
+        val.total=val.data.length
+        resolve(val)
+    })
+}
+// 获取PDF
+export function getDevicePDF(data) {
+    return new Promise((resolve,reject)=>{
+        let val ={
+            msg:'',
+            code:200,
+            data:[],
+            total:''
+        }
+        for(var i=data.page*10-10+1;i<=data.pageSize;i++){
+            val.data.push({
+                nowTime: i+'时间',
+                Name: i+'名称',
+                address: i+'地址',
+                more: i+'更多',
+            })
+        }
+        val.total=val.data.length
+        resolve(val)
+    })
 }

src/views/big/device/components/devInfo.vue

@@ -1,3 +1,12 @@
+<!--
+ * @FilePath: \code\Goats-Cloud-ui\src\views\big\device\components\devInfo.vue
+ * @Author: 王路平
+ * @文件版本: V1.0.0
+ * @Date: 2023-06-27 10:33:55
+ * @Description: 
+ * 
+ * 版权信息         : 2023 by ${再登软件}, All Rights Reserved.
+-->
 <template>
   <el-drawer
     :model-value="prop.visible"
@@ -72,7 +81,8 @@
 </template>
 
 <script setup lang="ts">
-import { getCurrentInstance, ref } from "vue";
+import { getCurrentInstance, onMounted, ref } from "vue";
+import { getDeviceinfo,getDeviceattribute,gettelemetrydata,getDevicePDF } from '@/api/big/device'
 import Wform from "./Wform.vue";
 import Wdescriptions from "./Wdescriptions.vue";
 import upLoad from "./upLoad.vue";
@@ -123,7 +133,7 @@ const formconfig = ref({
       labelWidth: "auto",
       content: {
         type: "input",
-        model: "name",
+        model: "devconfig",
         readonly: true,
         disabled: true,
       },
@@ -133,7 +143,7 @@ const formconfig = ref({
       labelWidth: "auto",
       content: {
         type: "input",
-        model: "name",
+        model: "label",
         readonly: true,
         disabled: true,
       },
@@ -158,7 +168,7 @@ const formconfig = ref({
       labelWidth: "auto",
       content: {
         type: "input",
-        model: "name",
+        model: "caption",
         readonly: true,
         disabled: true,
         textarea: true,
@@ -168,7 +178,10 @@ const formconfig = ref({
 });
 const formdata = ref({
   name: "默认",
+  devconfig:"",
+  label:"",
   checkbox: ["是否网关"],
+  model:"model",
 });
 //描述列表数据配置
 const descriptionsData = ref({
@@ -320,7 +333,20 @@ const handleClose = () => {
 };
 //切换tab标签方法
 const handleClick = (tab: TabsPaneContext, event: Event) => {
-  //   console.log(tab, event)
+    console.log(tab, event)
+};
+//获取设备详情信息
+const getdevinfoFun =  async (val) => {
+  let result=  await getDeviceinfo()
+  if(result.code==200){
+     formdata.value.name = result.data.name
+     formdata.value.devconfig = result.data.devconfig
+     formdata.value.label = result.data.label
+     formdata.value.checkbox = result.data.checkbox
+     formdata.value.model = result.data.model
+  }else{
+    proxy.$modal.msgError(result.msg)
+  }
 };
 //刷新属性数据方法
 const researchtable=()=>{
@@ -329,8 +355,14 @@ const researchtable=()=>{
     getTableList()
 }
 //获取数据数据方法
-const getTableList = () => {
+const getTableList = async (val) => {
-  console.log(pageval.value);
+  let result=  await getDeviceattribute({page:pageval.value.page,pageSize:pageval.value.pageSize})
+  if(result.code==200){
+    tableData.value=result.data
+    pageval.value.total=result.total
+  }else{
+    proxy.$modal.msgError(result.msg)
+  }
 };
 //刷新遥测数据方法
 const researchtelemetrytable=()=>{
@@ -339,8 +371,14 @@ const researchtelemetrytable=()=>{
     getTableList()
 }
 //获取遥测数据方法
-const gettelemetryTableList = () => {
+const gettelemetryTableList = async (val) => {
-  console.log(telemetrypageval.value);
+  let result=  await gettelemetrydata({page:pageval.value.page,pageSize:pageval.value.pageSize})
+  if(result.code==200){
+    telemetrytableData.value=result.data
+    telemetrypageval.value.total=result.total
+  }else{
+    proxy.$modal.msgError(result.msg)
+  }
 };
 
 //刷新PDF数据方法
@@ -350,10 +388,16 @@ const researchPDFtable=()=>{
     getTableList()
 }
 //获取DFT数据方法
-const getPDFTableList = () => {
+const getPDFTableList = async (val) => {
-  console.log(PDFpageval.value);
+  let result=  await getDevicePDF({page:pageval.value.page,pageSize:pageval.value.pageSize})
+  if(result.code==200){
+    PDFtableData.value=result.data
+    PDFpageval.value.total=result.total
+  }else{
+    proxy.$modal.msgError(result.msg)
+  }
 };
-
+//PDF上传功能配置
 const uploadConfig=ref({
         //上传文件的类型限制
         accept:[''],
@@ -367,8 +411,25 @@ const uploadConfig=ref({
         limit:1,
         multiple:false
 })
+//打开dialog获取数据信息
+const getdata = (val)=>{
+  //获取设备详情信息
+  getdevinfoFun(val)
+  getTableList(val)
+  gettelemetryTableList(val)
+  getPDFTableList(val)
+}
+
+
 // 刷新表格事件
 const emit = defineEmits(["closeDialog"]);
+onMounted(() => {
+  
+})
+//抛出获取信息方法
+defineExpose({
+  getdata
+});
 </script>
 
 <style lang="scss" scoped>

src/views/big/device/index.vue

@@ -98,7 +98,7 @@
         <el-dialog v-model="imgDialogVisible">
             <img w-full :src="dialogImageUrl" alt="Preview Image" class="img-preview" />
         </el-dialog>
-        <devInfo @closeDialog="devinfoopen = false" :visible="devinfoopen" :form="devinfoForm" :title="devinfoTitle"></devInfo>
+        <devInfo ref="devInfoRight" @closeDialog="devinfoopen = false" :visible="devinfoopen" :form="devinfoForm" :title="devinfoTitle"></devInfo>
     </div>
 </template>
   
@@ -226,6 +226,8 @@ function handleDevInfo(row) {
     devinfoTitle.value= row.name;
     devinfoopen.value = true;
     devinfoForm.value = row;
+    //更新抽屉内数据
+    proxy.$refs["devInfoRight"].getdata(row)
 }
 
 /** 删除按钮操作 */