日志记录:请求联调

故障录波：添加配置回显

ui/dasadmin/src/api/backend/logRecord/request.ts

@@ -8,9 +8,44 @@ export const getLogRecordListReq = (data: {
     endTime: string
 }) => {
     return createAxios<never, Promise<ReqReturnType<any>>>({
-        url: '',
+        url: '/api/plc/files',
         method: 'post',
         data
     })
 }
 
+export const setConfigReq = (data: {
+    id: string
+    options:string
+}) => {
+    return createAxios<never, Promise<ReqReturnType<never>>>({
+        url: '/api/plc/updateFdrConfig',
+        method: 'post',
+        data
+    })
+}
+
+
+export const previewFileReq = (data: {
+    url: string
+    deviceCode: string
+}) => {
+    return createAxios<never, Promise<ReqReturnType<any>>>({
+        url: '/api/plc/parseData',
+        method: 'post',
+        data
+    })
+}
+
+export const downloadFileReq = (data: {
+    url: string
+}) => {
+    return createAxios({
+        url: '/api/plc/download',
+        method: 'post',
+        data,
+        responseType: 'blob'
+    }, {
+        reductDataFormat: false
+    })
+}

ui/dasadmin/src/views/backend/logRecord/index.vue

@@ -80,7 +80,7 @@
             </el-container>
         </el-container>
     </div>
-    <el-dialog v-model="configDialogVisible" title="配置信息" width="500">
+    <el-dialog v-model="configDialogVisible" title="配置信息" width="500" @close="closeConfigDialog">
         <el-form ref="configFormRef" :model="configFormData" label-width="120" :rules="configFormRules">
             <el-form-item prop="timeFormat" label="时间格式">
                 <el-input v-model="configFormData.timeFormat"></el-input>
@@ -136,7 +136,7 @@
 import { ref, reactive, computed, onMounted, nextTick, onUnmounted } from 'vue'
 import { dayjs, ElMessage, FormInstance, TreeInstance } from 'element-plus'
 import { Search, Setting } from '@element-plus/icons-vue'
-import { getLogRecordListReq } from '/@/api/backend/logRecord/request'
+import { getLogRecordListReq, setConfigReq, previewFileReq, downloadFileReq } from '/@/api/backend/logRecord/request'
 import { equipList } from '/@/api/backend/temperature/request'
 import * as echarts from 'echarts'
 import { tableItemData } from './type'
@@ -157,6 +157,7 @@ const treeData = ref<
         label: string
         id: string
         code: string
+        options: any
         children?: any[]
     }[]
 >([
@@ -164,6 +165,7 @@ const treeData = ref<
         label: '风机列表',
         id: '0',
         code: '0',
+        options: {},
         children: [],
     },
 ])
@@ -186,14 +188,16 @@ const curTreeData = ref<{
     label: string
     id: string
     code: string
+    options: any
     children?: any[]
 }>({
     label: '风机列表',
     id: '0',
     code: '0',
+    options: {},
 })
 
-const handleNodeClick = (target: { label: string; id: string; code: string }) => {
+const handleNodeClick = (target: { label: string; id: string; code: string; options: any }) => {
     curTreeData.value = target
     if (target.id === '0') return
     getListForAirBlower()
@@ -207,6 +211,7 @@ const getTreeDataList = () => {
                     label: item.name,
                     code: item.code,
                     id: item.id,
+                    options: item.options ? JSON.parse(item.options).fdrFormat : {},
                 }
             })
             originTreeChildData = data
@@ -274,17 +279,21 @@ const getListForAirBlower = () => {
         endTime: dayjs(searchData.date[1]).format('YYYY-MM'),
     }
 
-    // getLogRecordListReq(data).then((res) => {
+    getLogRecordListReq(data).then((res) => {
-    //     if (res.success) {
+        if (res.success) {
-    //         pageSetting.total = res.data.length
+            pageSetting.total = res.data.length
-    //         originTableData.value = res.data
+            originTableData.value = res.data
-    //     }
+        }
-    // })
+    })
 }
 
 const configDialogVisible = ref(false)
 
 const configFormRef = ref<FormInstance>()
+const closeConfigDialog = () => {
+    configFormRef.value?.resetFields()
+}
+
 const configFormData = reactive({
     timeFormat: 'yyyy-MM-dd-HH:mm:ss.SSS',
     delimiter: ';',
@@ -293,6 +302,9 @@ const configFormData = reactive({
 
 const openConfigDialog = () => {
     configDialogVisible.value = true
+    configFormData.delimiter = curTreeData.value.options.delimiter
+    configFormData.timeFormat = curTreeData.value.options.timeFormat
+    configFormData.validStartLine = curTreeData.value.options.validStartLine
 }
 
 const configFormRules = {
@@ -332,17 +344,19 @@ const cancelConfig = () => {
 }
 
 const setAirBlowerConfig = () => {
-    // setConfigReq({
+    const stringify = JSON.stringify({ fdrFormat: configFormData })
-    //     id: curTreeData.value.id,
+
-    //     fdrFormat: JSON.stringify(configFormData),
+    setConfigReq({
-    // })
+        id: curTreeData.value.id,
-    //     .then(() => {
+        options: stringify,
-    //         ElMessage.success('配置成功')
+    })
-    //         configDialogVisible.value = false
+        .then(() => {
-    //     })
+            ElMessage.success('配置成功')
-    //     .catch((err) => {
+            configDialogVisible.value = false
-    //         ElMessage.error('配置失败')
+        })
-    //     })
+        .catch((err) => {
+            ElMessage.error('配置失败')
+        })
 }
 
 const previewFileDialogVisible = ref(false)
@@ -351,18 +365,19 @@ const readFile = (data: tableItemData) => {
     getFileData(data.path)
 }
 const downloadFile = (data: tableItemData) => {
-    // downloadFileReq({ url: data.path }).then((res) => {
+    downloadFileReq({ url: data.path }).then((res) => {
-    //     const url = window.URL.createObjectURL(res.data)
+        const url = window.URL.createObjectURL(res.data)
-    //     const a = document.createElement('a')
+        const a = document.createElement('a')
-    //     a.style.display = 'none'
+        a.style.display = 'none'
-    //     a.href = url
+        a.href = url
-    //     a.download = data.name
+        a.download = data.name
-    //     document.body.appendChild(a)
+        document.body.appendChild(a)
-    //     a.click()
+        a.click()
-    //     window.URL.revokeObjectURL(url)
+        window.URL.revokeObjectURL(url)
-    //     document.body.removeChild(a)
+        document.body.removeChild(a)
-    // })
+    })
 }
+
 const closePreviewFileDialog = () => {
     previewTreeData.value = []
     previewChartData = []
@@ -412,7 +427,11 @@ const handleCheckChange = (data: any, state: boolean) => {
         const index = selectPreviewTree.findIndex((item: string) => item === data.key)
         selectPreviewTree.splice(index, 1)
     }
+    if(selectPreviewTree.length > 0){
         initPreviewChart()
+    }else{
+        previewChartInstance && previewChartInstance.clear()
+    }
 }
 
 let previewChartData: any = {}
@@ -420,6 +439,14 @@ let curSeries: any = []
 let previewChartInstance: any = null
 const previewChartRef = ref()
 
+const getRandomDarkColor = () => {
+    let r = Math.floor(Math.random() * 200) // 限制在0到127之间，以生成较深的颜色
+    let g = Math.floor(Math.random() * 200)
+    let b = Math.floor(Math.random() * 200)
+
+    let color = `#${r.toString(16).padStart(2, '0')}${g.toString(16).padStart(2, '0')}${b.toString(16).padStart(2, '0')}`
+    return color
+}
 const createSeriresData = () => {
     const seriesData: any = []
     const curAttr = curSeries.map((item: any) => item.name)
@@ -430,7 +457,7 @@ const createSeriresData = () => {
     })
     selectPreviewTree.forEach((item: string) => {
         if (!curAttr.includes(item)) {
-            const color = '#' + Math.floor(Math.random() * 16777215).toString(16)
+            const color = getRandomDarkColor()
             const data = {
                 name: item,
                 type: 'line',
@@ -534,7 +561,7 @@ const initPreviewChart = () => {
             {
                 start: 0,
                 end: 100,
-            }
+            },
         ],
         legend: {
             data: [],
@@ -550,30 +577,30 @@ const initPreviewChart = () => {
 
 const getFileData = (url: string) => {
     previewTreeLoading.value = true
-    // previewFileReq({
+    previewFileReq({
-    //     deviceCode: curTreeData.value.code,
+        deviceCode: curTreeData.value.code,
-    //     url: url,
+        url: url,
-    // }).then((res) => {
+    }).then((res) => {
-    //     previewChartData = res.data
+        previewChartData = res.data
-    //     const attrName = Object.keys(res.data)
+        const attrName = Object.keys(res.data)
-    //     const data: any = []
+        const data: any = []
-    //     attrName.forEach((item) => {
+        attrName.forEach((item) => {
-    //         if (item === 'TimeStamp') {
+            if (item === 'TimeStamp') {
-    //             previewChartData.TimeStamp = previewChartData.TimeStamp.map((item: any) => {
+                previewChartData.TimeStamp = previewChartData.TimeStamp.map((item: any) => {
-    //                 return dayjs(item).format('YYYY-MM-DD HH:mm:ss')
+                    return dayjs(item).format('YYYY-MM-DD HH:mm:ss')
-    //             })
+                })
-    //         } else {
+            } else {
-    //             data.push({
+                data.push({
-    //                 label: item,
+                    label: item,
-    //                 key: item,
+                    key: item,
-    //                 isLeaf: true,
+                    isLeaf: true,
-    //             })
+                })
-    //         }
+            }
-    //     })
+        })
-    //     previewTreeData.value = data
+        previewTreeData.value = data
-    //     originPreviewTreeData = data
+        originPreviewTreeData = data
-    //     previewTreeLoading.value = false
+        previewTreeLoading.value = false
-    // })
+    })
 }
 
 onMounted(() => {

ui/dasadmin/src/views/backend/malfunction/index.vue

@@ -80,7 +80,7 @@
             </el-container>
         </el-container>
     </div>
-    <el-dialog v-model="configDialogVisible" title="配置信息" width="500">
+    <el-dialog v-model="configDialogVisible" title="配置信息" width="500" @close="closeConfigDialog">
         <el-form ref="configFormRef" :model="configFormData" label-width="120" :rules="configFormRules">
             <el-form-item prop="timeFormat" label="时间格式">
                 <el-input v-model="configFormData.timeFormat"></el-input>
@@ -120,6 +120,9 @@
                         node-key="key"
                         @check-change="handleCheckChange"
                     ></el-tree>
+                    <!-- 
+                     @node-click="previewNodeClick"
+                    -->
                 </el-scrollbar>
             </el-col>
             <el-col :span="16" class="colPart">
@@ -157,6 +160,7 @@ const treeData = ref<
         label: string
         id: string
         code: string
+        options: any
         children?: any[]
     }[]
 >([
@@ -164,6 +168,7 @@ const treeData = ref<
         label: '风机列表',
         id: '0',
         code: '0',
+        options: {},
         children: [],
     },
 ])
@@ -186,14 +191,16 @@ const curTreeData = ref<{
     label: string
     id: string
     code: string
+    options: any
     children?: any[]
 }>({
     label: '风机列表',
     id: '0',
     code: '0',
+    options: {},
 })
 
-const handleNodeClick = (target: { label: string; id: string; code: string }) => {
+const handleNodeClick = (target: { label: string; id: string; code: string; options: any }) => {
     curTreeData.value = target
     if (target.id === '0') return
     getListForAirBlower()
@@ -207,6 +214,7 @@ const getTreeDataList = () => {
                     label: item.name,
                     code: item.code,
                     id: item.id,
+                    options: item.options ? JSON.parse(item.options).fdrFormat : {},
                 }
             })
             originTreeChildData = data
@@ -285,6 +293,10 @@ const getListForAirBlower = () => {
 const configDialogVisible = ref(false)
 
 const configFormRef = ref<FormInstance>()
+const closeConfigDialog = () => {
+    configFormRef.value?.resetFields()
+}
+
 const configFormData = reactive({
     timeFormat: 'yyyy-MM-dd-HH:mm:ss.SSS',
     delimiter: ';',
@@ -293,6 +305,9 @@ const configFormData = reactive({
 
 const openConfigDialog = () => {
     configDialogVisible.value = true
+    configFormData.delimiter = curTreeData.value.options.delimiter
+    configFormData.timeFormat = curTreeData.value.options.timeFormat
+    configFormData.validStartLine = curTreeData.value.options.validStartLine
 }
 
 const configFormRules = {
@@ -415,9 +430,19 @@ const handleCheckChange = (data: any, state: boolean) => {
         const index = selectPreviewTree.findIndex((item: string) => item === data.key)
         selectPreviewTree.splice(index, 1)
     }
+    if(selectPreviewTree.length > 0){
         initPreviewChart()
+    }else{
+        previewChartInstance && previewChartInstance.clear()
     }
-
+}
+// const previewNodeClick = (data: any) => {
+//     if (selectPreviewTree.includes(data.key)) {
+//         previewTreeRef.value?.setChecked(data.key, false, false)
+//     }else{
+//         previewTreeRef.value?.setChecked(data.key, true, false)
+//     }
+// }
 let previewChartData: any = {}
 let curSeries: any = []
 let previewChartInstance: any = null
@@ -433,6 +458,8 @@ const getRandomDarkColor = () => {
 }
 const createSeriresData = () => {
     const seriesData: any = []
+    console.log(curSeries);
+    
     const curAttr = curSeries.map((item: any) => item.name)
     selectPreviewTree.forEach((item: string, index: number) => {
         if (curAttr.includes(item)) {