数据方案-设备信息联调
This commit is contained in:
@@ -9,14 +9,14 @@ export function getSchemeTree() {
|
||||
}
|
||||
|
||||
// 根据方案查询测试项信息
|
||||
export function getTestRecordInfo(id:any) {
|
||||
export function getTestRecordInfo(id: any) {
|
||||
return createAxios({
|
||||
url: '/cs-device-boot/wlRecord/getTestRecordById?testRecordId='+id,
|
||||
url: '/cs-device-boot/wlRecord/getTestRecordById?testRecordId=' + id,
|
||||
method: 'GET'
|
||||
})
|
||||
}
|
||||
//新增修改方案
|
||||
export function addPlan(data:any) {
|
||||
export function addPlan(data: any) {
|
||||
return createAxios({
|
||||
url: '/cs-device-boot/wlRecord/updateSchemeRecord',
|
||||
method: 'POST',
|
||||
@@ -25,7 +25,7 @@ export function addPlan(data:any) {
|
||||
}
|
||||
|
||||
//新增测试项
|
||||
export function addRecord(data:any) {
|
||||
export function addRecord(data: any) {
|
||||
return createAxios({
|
||||
url: '/cs-device-boot/wlRecord/addRecord',
|
||||
method: 'POST',
|
||||
@@ -34,7 +34,7 @@ export function addRecord(data:any) {
|
||||
}
|
||||
|
||||
//新增测试项
|
||||
export function updateRecord(data:any) {
|
||||
export function updateRecord(data: any) {
|
||||
return createAxios({
|
||||
url: '/cs-device-boot/wlRecord/updateTestRecord',
|
||||
method: 'POST',
|
||||
@@ -43,16 +43,15 @@ export function updateRecord(data:any) {
|
||||
}
|
||||
|
||||
//删除方案或测试项
|
||||
export function delRecord(data:any) {
|
||||
export function delRecord(data: any) {
|
||||
return createAxios({
|
||||
url: '/cs-device-boot/wlRecord/deleteRecord?id='+data.id,
|
||||
method: 'DELETE',
|
||||
url: '/cs-device-boot/wlRecord/deleteRecord?id=' + data.id,
|
||||
method: 'DELETE'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
//查询历史趋势折线图
|
||||
export function getHistoryTrend(data:any) {
|
||||
export function getHistoryTrend(data: any) {
|
||||
return createAxios({
|
||||
url: '/cs-device-boot/wlRecord/queryCommonStatisticalByTest',
|
||||
method: 'POST',
|
||||
@@ -61,7 +60,7 @@ export function getHistoryTrend(data:any) {
|
||||
}
|
||||
|
||||
//查询设备列表
|
||||
export function getDeviceList(data:any) {
|
||||
export function getDeviceList(data: any) {
|
||||
return createAxios({
|
||||
url: '/cs-device-boot/wlRecord/queryPage',
|
||||
method: 'POST',
|
||||
@@ -69,3 +68,20 @@ export function getDeviceList(data:any) {
|
||||
})
|
||||
}
|
||||
|
||||
//添加测试项中的设备基础数据
|
||||
export function addDevice(data: any) {
|
||||
return createAxios({
|
||||
url: '/cs-device-boot/wlRecord/saveDataRecord',
|
||||
method: 'POST',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
//删除测试项中的设备基础数据
|
||||
export function delDevice(data: any) {
|
||||
return createAxios({
|
||||
url: '/cs-device-boot/wlRecord/deleteDataRecord',
|
||||
method: 'DELETE',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
@@ -496,7 +496,7 @@ function formatDate(date: Date): string {
|
||||
const day = String(date.getDate()).padStart(2, '0')
|
||||
return `${year}-${month}-${day}`
|
||||
}
|
||||
defineExpose({ timeValue, interval, timeFlag, setTimeOptions, setInterval, getYearOnYear, getMonthOnMonth })
|
||||
defineExpose({ timeValue, interval, timeFlag, setTimeOptions, setInterval, getYearOnYear, getMonthOnMonth,timeChange })
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -152,6 +152,8 @@ const onComSearch = async () => {
|
||||
await tableStore.onTableAction('search', {})
|
||||
}
|
||||
const onResetForm = () => {
|
||||
//时间重置成默认值
|
||||
datePickerRef.value?.timeChange(3)
|
||||
tableStore.onTableAction('reset', {})
|
||||
}
|
||||
const setDatePicker = (list: any) => {
|
||||
|
||||
107
src/components/tree/govern/deviceInfoTree.vue
Normal file
107
src/components/tree/govern/deviceInfoTree.vue
Normal file
@@ -0,0 +1,107 @@
|
||||
<template>
|
||||
<Tree
|
||||
ref="treRef"
|
||||
@check-change="handleCheckChange"
|
||||
:default-checked-keys="defaultCheckedKeys"
|
||||
:show-checkbox="props.showCheckbox"
|
||||
:data="tree"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, nextTick, defineProps } from 'vue'
|
||||
import Tree from '../index.vue'
|
||||
import { getDeviceTree } from '@/api/cs-device-boot/csLedger'
|
||||
import { useConfig } from '@/stores/config'
|
||||
defineOptions({
|
||||
name: 'govern/deviceTree'
|
||||
})
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
showCheckbox?: boolean
|
||||
defaultCheckedKeys?: any
|
||||
}>(),
|
||||
{
|
||||
showCheckbox: false,
|
||||
defaultCheckedKeys: [],
|
||||
}
|
||||
)
|
||||
|
||||
const emit = defineEmits(['init', 'checkChange'])
|
||||
const config = useConfig()
|
||||
const tree = ref()
|
||||
const treRef = ref()
|
||||
getDeviceTree().then(res => {
|
||||
return
|
||||
let arr: any[] = []
|
||||
res.data.forEach((item: any) => {
|
||||
item.icon = 'el-icon-HomeFilled'
|
||||
item.color = config.getColorVal('elementUiPrimary')
|
||||
item.children.forEach((item2: any) => {
|
||||
item2.icon = 'el-icon-List'
|
||||
item2.color = config.getColorVal('elementUiPrimary')
|
||||
item2.children.forEach((item3: any) => {
|
||||
item3.icon = 'el-icon-Platform'
|
||||
item3.color = config.getColorVal('elementUiPrimary')
|
||||
if (item3.comFlag === 1) {
|
||||
item3.color = '#e26257 !important'
|
||||
}
|
||||
arr.push(item3)
|
||||
})
|
||||
})
|
||||
})
|
||||
tree.value = res.data
|
||||
nextTick(() => {
|
||||
if (arr.length) {
|
||||
treRef.value.treeRef.setCurrentKey(arr[0].id)
|
||||
// 注册父组件事件
|
||||
emit('init', {
|
||||
level: 2,
|
||||
...arr[0]
|
||||
})
|
||||
} else {
|
||||
emit('init')
|
||||
}
|
||||
})
|
||||
})
|
||||
const getTreeList = (list:any) => {
|
||||
let arr: any[] = []
|
||||
list.forEach((item: any) => {
|
||||
item.icon = 'el-icon-HomeFilled'
|
||||
item.color = config.getColorVal('elementUiPrimary')
|
||||
item.children.forEach((item2: any) => {
|
||||
item2.icon = 'el-icon-List'
|
||||
item2.color = config.getColorVal('elementUiPrimary')
|
||||
item2.children?.forEach((item3: any) => {
|
||||
item3.icon = 'el-icon-Platform'
|
||||
item3.color = config.getColorVal('elementUiPrimary')
|
||||
if (item3.comFlag === 1) {
|
||||
item3.color = '#e26257 !important'
|
||||
}
|
||||
arr.push(item3)
|
||||
})
|
||||
})
|
||||
})
|
||||
tree.value = list;
|
||||
nextTick(() => {
|
||||
if (arr.length) {
|
||||
treRef.value.treeRef.setCurrentKey(arr[0].id)
|
||||
// 注册父组件事件
|
||||
emit('init', {
|
||||
level: 2,
|
||||
...arr[0]
|
||||
})
|
||||
} else {
|
||||
emit('init')
|
||||
}
|
||||
})
|
||||
}
|
||||
const handleCheckChange = (data: any, checked: any, indeterminate: any) => {
|
||||
emit('checkChange', {
|
||||
data,
|
||||
checked,
|
||||
indeterminate
|
||||
})
|
||||
}
|
||||
defineExpose({getTreeList})
|
||||
</script>
|
||||
256
src/views/govern/terminal/planData/components/device.vue
Normal file
256
src/views/govern/terminal/planData/components/device.vue
Normal file
@@ -0,0 +1,256 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
class="cn-operate-dialog device-manage-popup"
|
||||
v-model="dialogVisible"
|
||||
title="设备信息"
|
||||
draggable
|
||||
width="85%"
|
||||
>
|
||||
<el-button type="primary" @click="addFlag = true" v-if="!addFlag">新增</el-button>
|
||||
<el-popconfirm
|
||||
confirm-button-text="是"
|
||||
cancel-button-text="否"
|
||||
icon-color="#626AEF"
|
||||
title="是否确认删除所选数据?"
|
||||
@confirm="handleDelete('')"
|
||||
@cancel="cancelDelete"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button type="danger" :disabled="checkedList.length == 0" v-if="!addFlag">删除</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
|
||||
<div class="default-main device-manage" v-show="addFlag" v-loading="loading">
|
||||
<deviceInfoTree
|
||||
:showCheckbox="true"
|
||||
:default-checked-keys="defaultCheckedKeys"
|
||||
@checkChange="checkChange"
|
||||
ref="deviceInfoTreeRef"
|
||||
></deviceInfoTree>
|
||||
<div class="device-manage-right">
|
||||
<TableHeader datePicker ref="TableHeaderRef"></TableHeader>
|
||||
<Table ref="tableRef" />
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="default-main device-manage"
|
||||
v-show="!addFlag"
|
||||
:style="{ height: pageHeight.height }"
|
||||
v-loading="loading"
|
||||
>
|
||||
<div class="device-manage-right" :style="{ height: pageHeight.height }">
|
||||
<!-- <datePicker ref="datePickerRef"></datePicker>
|
||||
<el-button type="primary" @click="handleSearch">查询</el-button> -->
|
||||
<vxe-table
|
||||
v-bind="defaultAttribute"
|
||||
:data="tableData"
|
||||
height="auto"
|
||||
style="width: 100%; margin-top: 10px"
|
||||
ref="checkedTableRef"
|
||||
@checkbox-all="selectChangeEvent"
|
||||
@checkbox-change="selectChangeEvent"
|
||||
>
|
||||
<vxe-column type="checkbox" width="60"></vxe-column>
|
||||
<vxe-column field="devName" title="设备名称"></vxe-column>
|
||||
<vxe-column field="devMac" title="设备MAC"></vxe-column>
|
||||
<vxe-column field="devNdId" title="网络识别码"></vxe-column>
|
||||
<vxe-column field="lineName" title="线路号"></vxe-column>
|
||||
<vxe-column field="startTime" title="开始时间"></vxe-column>
|
||||
<vxe-column field="endTime" title="结束时间"></vxe-column>
|
||||
<vxe-column title="操作" width="120" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<el-popconfirm
|
||||
confirm-button-text="是"
|
||||
cancel-button-text="否"
|
||||
icon-color="#626AEF"
|
||||
title="是否确认删除当前数据?"
|
||||
@confirm="handleDelete(row)"
|
||||
@cancel="cancelDelete"
|
||||
>
|
||||
<template #reference>
|
||||
<el-button type="danger" size="small">删除</el-button>
|
||||
</template>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer="">
|
||||
<el-button @click="close">取 消</el-button>
|
||||
<el-button type="primary" @click="submit" v-if="addFlag">确 定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
import deviceInfoTree from '@/components/tree/govern/deviceInfoTree.vue'
|
||||
import { mainHeight } from '@/utils/layout'
|
||||
import { ref, onMounted, provide, watch } from 'vue'
|
||||
import { getDeviceList, addDevice, delDevice } from '@/api/cs-device-boot/planData'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
const pageHeight = mainHeight(-20)
|
||||
const loading = ref(false)
|
||||
const defaultCheckedKeys: any = ref([])
|
||||
const tableData = ref([])
|
||||
defineOptions({
|
||||
name: 'govern/tourist/index'
|
||||
})
|
||||
const treeIds: any = ref(['-1'])
|
||||
//树节点选择变化的时候处理树节点选中数据
|
||||
const checkChange = async (data: any) => {
|
||||
if (data.checked) {
|
||||
defaultCheckedKeys.value.push(data.data.id)
|
||||
data.data.children?.map((item: any) => {
|
||||
treeIds.value.push(item.id)
|
||||
})
|
||||
} else {
|
||||
defaultCheckedKeys.value.splice(defaultCheckedKeys.value.indexOf(data.data.id), 1)
|
||||
data.data.children?.map((item: any) => {
|
||||
treeIds.value.splice(defaultCheckedKeys.value.indexOf(item.id), 1)
|
||||
})
|
||||
}
|
||||
// await tableStore.index()
|
||||
}
|
||||
const datePickerRef = ref()
|
||||
const handleSearch = () => {
|
||||
console.log(datePickerRef.value.timeValue)
|
||||
}
|
||||
const dialogVisible = ref(false)
|
||||
const deviceInfoTreeRef = ref()
|
||||
//判断是否显示新增页面 false显示详情页面和删除按钮隐藏确定按钮 true显示新增页面与确定按钮隐藏删除按钮
|
||||
const addFlag = ref(false)
|
||||
const selectId: any = ref('')
|
||||
//查绑定测试项列表
|
||||
const getSelectedTable = (id: any) => {
|
||||
getDeviceList({ id: id, isTrueFlag: 1, pageNum: 1, pageSize: 1000 }).then(res => {
|
||||
tableData.value = res.data.records
|
||||
})
|
||||
}
|
||||
//新增设备列表
|
||||
const tableStore = new TableStore({
|
||||
url: '/cs-device-boot/wlRecord/queryPage',
|
||||
// publicHeight: 65,
|
||||
method: 'POST',
|
||||
column: [
|
||||
{ width: '60', type: 'checkbox' },
|
||||
{ title: '序号', type: 'seq', width: 80 },
|
||||
{ field: 'devName', title: '设备名称', minWidth: 170 },
|
||||
{ field: 'devMac', title: '设备MAC', minWidth: 170 },
|
||||
{ field: 'devNdId', title: '网络识别码', minWidth: 170 },
|
||||
{ field: 'lineName', title: '线路号', minWidth: 170 },
|
||||
{ field: 'startTime', title: '开始时间', minWidth: 170 },
|
||||
{ field: 'endTime', title: '结束时间', minWidth: 170 }
|
||||
],
|
||||
|
||||
beforeSearchFun: () => {
|
||||
tableStore.table.params.id = selectId.value
|
||||
tableStore.table.params.isTrueFlag = 0
|
||||
tableStore.table.params.treeIds = treeIds.value
|
||||
}
|
||||
})
|
||||
provide('tableStore', tableStore)
|
||||
//弹框打开处理
|
||||
const open = (id: any) => {
|
||||
dialogVisible.value = true
|
||||
selectId.value = id
|
||||
//1 列表 0树
|
||||
//获取树形数据
|
||||
getDeviceList({ id: id, isTrueFlag: 0 }).then(res => {
|
||||
deviceInfoTreeRef.value.getTreeList(res.data)
|
||||
})
|
||||
//查绑定测试项列表
|
||||
getSelectedTable(id)
|
||||
//查新增列表
|
||||
tableStore.index()
|
||||
}
|
||||
const close = () => {
|
||||
addFlag.value = false
|
||||
dialogVisible.value = false
|
||||
}
|
||||
const tableRef = ref()
|
||||
//添加设备
|
||||
const submit = () => {
|
||||
//选择的数据
|
||||
let deviceIds = []
|
||||
//新增的时候执行的逻辑
|
||||
if (addFlag.value == true) {
|
||||
tableStore.table.selection.map(item => {
|
||||
deviceIds.push(item.id)
|
||||
})
|
||||
const addForm = {
|
||||
id: selectId.value,
|
||||
list: deviceIds
|
||||
}
|
||||
addDevice(addForm).then(res => {
|
||||
if (res.code == 'A0000') {
|
||||
ElMessage.success('添加成功')
|
||||
getSelectedTable(selectId.value)
|
||||
addFlag.value = false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
//删除设备
|
||||
const checkedTableRef = ref()
|
||||
//判断是否选择了设备数据
|
||||
const checkedList: any = ref([])
|
||||
/*
|
||||
* 记录选择的项
|
||||
*/
|
||||
const selectChangeEvent = (checked: any) => {
|
||||
checkedList.value = checkedTableRef.value.getCheckboxRecords()
|
||||
}
|
||||
|
||||
const handleDelete = (row: any) => {
|
||||
let list = []
|
||||
//单选删除
|
||||
if (row) {
|
||||
list.push(row.id)
|
||||
}
|
||||
//批量删除
|
||||
else {
|
||||
checkedTableRef.value.getCheckboxRecords().length != 0
|
||||
? checkedTableRef.value.getCheckboxRecords().map((item: any) => {
|
||||
list.push(item.id)
|
||||
})
|
||||
: (list = [])
|
||||
}
|
||||
if (list.length != 0) {
|
||||
delDevice({ id: selectId.value, list: list }).then(res => {
|
||||
if (res.code == 'A0000') {
|
||||
ElMessage.success('删除成功')
|
||||
getSelectedTable(selectId.value)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
const cancelDelete = () => {
|
||||
console.log('取消')
|
||||
}
|
||||
onMounted(() => {})
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.device-manage {
|
||||
display: flex;
|
||||
|
||||
&-right {
|
||||
overflow: hidden;
|
||||
flex: 1;
|
||||
padding: 10px 10px 10px 0;
|
||||
.el-descriptions__header {
|
||||
height: 36px;
|
||||
margin-bottom: 7px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
// ::v-deep .el-
|
||||
</style>
|
||||
@@ -1,283 +0,0 @@
|
||||
<template>
|
||||
<div class="table">
|
||||
<el-button type="primary" @click="open">新增</el-button>
|
||||
<!-- 设备信息 -->
|
||||
<vxe-table
|
||||
border
|
||||
show-overflow
|
||||
ref="tableRef"
|
||||
:loading="loading"
|
||||
align="center"
|
||||
:data="tableData"
|
||||
:edit-config="{ trigger: 'manual', mode: 'row' }"
|
||||
>
|
||||
<!-- <vxe-column type="seq" width="60"></vxe-column> -->
|
||||
<vxe-column field="name" title="设备名称" width="150">
|
||||
<template #edit="{ row }">
|
||||
<vxe-input v-model="row.name" type="text"></vxe-input>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="role" title="设备MAC" width="150">
|
||||
<template #edit="{ row }">
|
||||
<vxe-input v-model="row.role" type="text" placeholder="请输入昵称"></vxe-input>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="num6" title="网络识别码" width="150">
|
||||
<template #edit="{ row }">
|
||||
<vxe-input v-model="row.num6" type="number" placeholder="请输入数值"></vxe-input>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="sex" title="线路号" width="150" :edit-render="{}">
|
||||
<!-- <template #default="{ row }">
|
||||
<span>{{ formatSex(row.sex) }}</span>
|
||||
</template> -->
|
||||
<template #default="{ row }">
|
||||
<el-select v-model="row.sex" @change="saveRowEvent(row)" style="width: 80px !important">
|
||||
<el-option
|
||||
v-for="item in sexList"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
:label="item.label"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="date12" title="数据起始时间" width="150">
|
||||
<template #edit="{ row }">
|
||||
<vxe-input v-model="row.date12" type="date" placeholder="请选择日期" transfer></vxe-input>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="date13" title="数据结束时间" width="150">
|
||||
<template #edit="{ row }">
|
||||
<vxe-input v-model="row.date13" type="week" placeholder="请选择日期" transfer></vxe-input>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column title="操作" width="160" fixed="right">
|
||||
<template #default="{ row }">
|
||||
<!-- <el-button type="primary" size="small" @click="editRowEvent(row)">修改</el-button> -->
|
||||
<el-button type="danger" size="small" @click="delDevice(row)">删除</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
<!-- 新增设备信息 -->
|
||||
<el-dialog v-model="dialogVisible" width="65%" title="添加设备" draggable :append-to-body="true">
|
||||
<vxe-table
|
||||
border
|
||||
show-overflow
|
||||
ref="checkTableRef"
|
||||
:loading="loading"
|
||||
align="center"
|
||||
:data="tableData"
|
||||
:edit-config="{ trigger: 'manual', mode: 'row' }"
|
||||
@checkbox-all="selectAllChangeEvent"
|
||||
@checkbox-change="selectChangeEvent"
|
||||
>
|
||||
<!-- <vxe-column type="seq" width="60"></vxe-column> -->
|
||||
<vxe-column type="checkbox" width="60"></vxe-column>
|
||||
<vxe-column field="name" title="设备名称">
|
||||
<template #edit="{ row }">
|
||||
<vxe-input v-model="row.name" type="text"></vxe-input>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="role" title="设备MAC">
|
||||
<template #edit="{ row }">
|
||||
<vxe-input v-model="row.role" type="text" placeholder="请输入昵称"></vxe-input>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="num6" title="网络识别码">
|
||||
<template #edit="{ row }">
|
||||
<vxe-input v-model="row.num6" type="number" placeholder="请输入数值"></vxe-input>
|
||||
</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="sex" title="线路号" :edit-render="{}">
|
||||
<!-- <template #default="{ row }">
|
||||
<span>{{ formatSex(row.sex) }}</span>
|
||||
</template> -->
|
||||
<template #default="{ row }">
|
||||
<el-select v-model="row.sex" @change="saveRowEvent(row)" style="width: 80px !important">
|
||||
<el-option
|
||||
v-for="item in sexList"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
:label="item.label"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
<template #footer="">
|
||||
<el-button @click="close">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue'
|
||||
import { VxeTableInstance } from 'vxe-table'
|
||||
import { getDeviceList } from '@/api/cs-device-boot/planData'
|
||||
interface RowVO {
|
||||
id: number
|
||||
name: string
|
||||
nickname: string
|
||||
role: string
|
||||
sex: string
|
||||
sex2: string[]
|
||||
num1: number
|
||||
age: number
|
||||
address: string
|
||||
date12: string
|
||||
date13: string
|
||||
}
|
||||
|
||||
const tableRef: any = ref(null)
|
||||
const checkTableRef: any = ref(null)
|
||||
const loading = ref(false)
|
||||
const tableData = ref([
|
||||
{
|
||||
id: 10001,
|
||||
name: 'Test1',
|
||||
nickname: 'T1',
|
||||
role: 'Develop',
|
||||
sex: '0',
|
||||
sex2: ['0'],
|
||||
num1: 40,
|
||||
age: 28,
|
||||
address: 'Shenzhen',
|
||||
date12: '',
|
||||
date13: ''
|
||||
},
|
||||
{
|
||||
id: 10002,
|
||||
name: 'Test2',
|
||||
nickname: 'T2',
|
||||
role: 'Designer',
|
||||
sex: '1',
|
||||
sex2: ['0', '1'],
|
||||
num1: 20,
|
||||
age: 22,
|
||||
address: 'Guangzhou',
|
||||
date12: '',
|
||||
date13: '2020-08-20'
|
||||
},
|
||||
{
|
||||
id: 10003,
|
||||
name: 'Test3',
|
||||
nickname: 'T3',
|
||||
role: 'Test',
|
||||
sex: '0',
|
||||
sex2: ['1'],
|
||||
num1: 200,
|
||||
age: 32,
|
||||
address: 'Shanghai',
|
||||
date12: '2020-09-10',
|
||||
date13: ''
|
||||
},
|
||||
{
|
||||
id: 10004,
|
||||
name: 'Test4',
|
||||
nickname: 'T4',
|
||||
role: 'Designer',
|
||||
sex: '1',
|
||||
sex2: ['1'],
|
||||
num1: 30,
|
||||
age: 23,
|
||||
address: 'Shenzhen',
|
||||
date12: '',
|
||||
date13: '2020-12-04'
|
||||
}
|
||||
])
|
||||
|
||||
const sexList = ref([
|
||||
{ label: '', value: '' },
|
||||
{ label: '男', value: '1' },
|
||||
{ label: '女', value: '0' }
|
||||
])
|
||||
|
||||
const formatSex = (value: string) => {
|
||||
if (value === '1') {
|
||||
return '男'
|
||||
}
|
||||
if (value === '0') {
|
||||
return '女'
|
||||
}
|
||||
return ''
|
||||
}
|
||||
|
||||
const editRowEvent = (row: RowVO) => {
|
||||
const $table = tableRef.value
|
||||
if ($table) {
|
||||
$table.setEditRow(row)
|
||||
}
|
||||
}
|
||||
const getList = (id: any) => {
|
||||
getDeviceList({ id: id }).then(res => {
|
||||
console.log(res, '查询列表')
|
||||
})
|
||||
}
|
||||
const saveRowEvent = (row: RowVO) => {
|
||||
// const $table = tableRef.value
|
||||
// if ($table) {
|
||||
// $table.clearEdit().then(() => {
|
||||
// loading.value = true
|
||||
// setTimeout(() => {
|
||||
// loading.value = false
|
||||
// VxeUI.modal.message({ content: `保存成功!name=${row.name}`, status: 'success' })
|
||||
// }, 300)
|
||||
// })
|
||||
// }
|
||||
}
|
||||
|
||||
const cancelRowEvent = (row: RowVO) => {
|
||||
const $table = tableRef.value
|
||||
if ($table) {
|
||||
$table.clearEdit().then(() => {
|
||||
// 还原行数据
|
||||
$table.revertData(row)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const selectAllChangeEvent = (checked: any) => {
|
||||
const $table = checkTableRef.value
|
||||
if ($table) {
|
||||
const records = $table.getCheckboxRecords()
|
||||
console.log(checked ? '所有勾选事件' : '所有取消事件', records)
|
||||
}
|
||||
}
|
||||
|
||||
const selectChangeEvent = (checked: any) => {
|
||||
const $table = checkTableRef.value
|
||||
if ($table) {
|
||||
const records = $table.getCheckboxRecords()
|
||||
console.log(checked ? '勾选事件' : '取消事件', records)
|
||||
}
|
||||
}
|
||||
|
||||
//删除设备
|
||||
const delDevice = (row: any) => {
|
||||
console.log(row, '8888')
|
||||
}
|
||||
|
||||
//添加设备
|
||||
const dialogVisible = ref(false)
|
||||
//
|
||||
const open = () => {
|
||||
dialogVisible.value = true
|
||||
}
|
||||
//提交所选择的设备
|
||||
const submit = () => {
|
||||
console.log(6666)
|
||||
}
|
||||
const close = () => {
|
||||
dialogVisible.value = false
|
||||
checkTableRef.value.clearCheckboxRow()
|
||||
}
|
||||
defineExpose({ getList })
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.table {
|
||||
height: 400px;
|
||||
}
|
||||
</style>
|
||||
@@ -183,7 +183,6 @@
|
||||
import { ref, inject, defineEmits } from 'vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { Plus, Minus, Message } from '@element-plus/icons-vue'
|
||||
import deviceInfo from './deviceInfo.vue'
|
||||
import { addPlan, addRecord, updateRecord, getDeviceList } from '@/api/cs-device-boot/planData'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
const dictData = useDictData()
|
||||
@@ -223,8 +222,8 @@ const title: any = ref('')
|
||||
const activeFormIndex: any = ref(null)
|
||||
const planId: any = ref('')
|
||||
const deviceRef: any = ref(null)
|
||||
const details=(val:any)=>{
|
||||
form.value=val
|
||||
const details = (val: any) => {
|
||||
form.value = val
|
||||
}
|
||||
// 0 新增方案 1 修改方案 2 新增测试项 3 修改测试项 4 删除方案 5 删除测试项 6 设备信息
|
||||
const open = (val: any, id: any) => {
|
||||
@@ -248,8 +247,8 @@ const open = (val: any, id: any) => {
|
||||
//数据回显
|
||||
if (val == 0 || val == 2) {
|
||||
form.value = {
|
||||
itemName: row.itemName, //方案名称
|
||||
describe: row.describe, //方案描述
|
||||
itemName: '', //方案名称
|
||||
describe: '', //方案描述
|
||||
//测试项数据
|
||||
records: [
|
||||
{
|
||||
@@ -273,12 +272,10 @@ const open = (val: any, id: any) => {
|
||||
}
|
||||
}
|
||||
if (val == 1 || val == 3) {
|
||||
|
||||
}
|
||||
if (val == 6) {
|
||||
//1 列表 0树
|
||||
getDeviceList({ id: id ,isTrueFlag:0,pageNum:1,pageSize:200}).then(res => {
|
||||
console.log(res, '查询列表')
|
||||
getDeviceList({ id: id, isTrueFlag: 0, pageNum: 1, pageSize: 200 }).then(res => {
|
||||
})
|
||||
}
|
||||
}
|
||||
@@ -395,7 +392,7 @@ const submit = () => {
|
||||
})
|
||||
}
|
||||
}
|
||||
defineExpose({ open ,details})
|
||||
defineExpose({ open, details })
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-form-item__content {
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
<template>
|
||||
<div class="default-main device-manage" :style="{ height: pageHeight.height }" v-loading="loading">
|
||||
<schemeTree @node-click="nodeClick" @init="nodeClick" @node-change="nodeClick" ref="schemeTreeRef"></schemeTree>
|
||||
<!-- @node-change="nodeClick" -->
|
||||
<schemeTree @node-click="nodeClick" @init="nodeClick" ref="schemeTreeRef"></schemeTree>
|
||||
<div class="device-manage-right" v-if="deviceData">
|
||||
<el-descriptions title="方案信息" class="mb10" :column="4" border>
|
||||
<template #extra>
|
||||
@@ -69,7 +70,7 @@
|
||||
<!-- <el-button type="primary" size="small" icon="el-icon-EditPen" @click="handleOpen(3)">
|
||||
修改
|
||||
</el-button> -->
|
||||
<el-button type="primary" size="small" icon="el-icon-InfoFilled" @click="handleOpen(6)">
|
||||
<el-button type="primary" size="small" icon="el-icon-InfoFilled" @click="openDevice">
|
||||
设备信息
|
||||
</el-button>
|
||||
</el-descriptions-item>
|
||||
@@ -77,38 +78,37 @@
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
|
||||
<div class="history_title">
|
||||
<p>历史趋势</p>
|
||||
</div>
|
||||
<div class="history_header">
|
||||
<el-form :model="form" class="history_select">
|
||||
<el-form-item label="统计指标">
|
||||
<el-select v-model="form.index" placeholder="请选择统计指标" clearable>
|
||||
<el-select @change="init" v-model="form.index" placeholder="请选择统计指标">
|
||||
<el-option
|
||||
v-for="item in rankOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
v-for="item in indexOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="值类型">
|
||||
<el-select v-model="form.type" placeholder="请选择值类型" clearable>
|
||||
<el-select v-model="form.type" placeholder="请选择值类型">
|
||||
<el-option
|
||||
v-for="item in rankOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
v-for="item in typeOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="history_searchBtn">
|
||||
<el-button type="primary" size="small" icon="el-icon-Search" @click="handleSearch">查询</el-button>
|
||||
<el-button type="primary" size="small" icon="el-icon-Download" @click="handleExport">
|
||||
<el-button type="primary" icon="el-icon-Search" @click="handleSearch">查询</el-button>
|
||||
<!-- <el-button type="primary" size="small" icon="el-icon-Download" @click="handleExport">
|
||||
报表导出
|
||||
</el-button>
|
||||
</el-button> -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="title">
|
||||
@@ -140,6 +140,7 @@
|
||||
</div>
|
||||
<el-empty v-else description="请选择设备" class="device-manage-right" />
|
||||
<MangePopup ref="mangePopup" />
|
||||
<device ref="deviceRef"></device>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -151,13 +152,14 @@ import { queryByCode, queryByid, queryCsDictTree } from '@/api/system-boot/dictT
|
||||
import { getDeviceData } from '@/api/cs-device-boot/EquipmentDelivery'
|
||||
// import { getTargetById } from '@/api/cs-device-boot/csDatalistay'
|
||||
import { getGroup } from '@/api/cs-device-boot/csGroup'
|
||||
import { ref, reactive, onMounted,provide } from 'vue'
|
||||
import { ref, reactive, onMounted, provide, nextTick } from 'vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { defaultAttribute } from '@/components/table/defaultAttribute'
|
||||
import MyEchart from '@/components/echarts/MyEchart.vue'
|
||||
import { getDeviceDataTrend } from '@/api/cs-harmonic-boot/datatrend'
|
||||
import { getTestRecordInfo, getHistoryTrend } from '@/api/cs-device-boot/planData'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import device from './components/device.vue'
|
||||
const dictData = useDictData()
|
||||
defineOptions({
|
||||
name: 'govern/device/manage'
|
||||
@@ -166,55 +168,80 @@ defineOptions({
|
||||
const voltageLevelList = dictData.getBasicData('Dev_Voltage')
|
||||
//接线方式
|
||||
const volConTypeList = dictData.getBasicData('Dev_Connect')
|
||||
//统计指标
|
||||
|
||||
//值类型
|
||||
|
||||
const pageHeight = mainHeight(20)
|
||||
const loading = ref(true)
|
||||
const form = ref({})
|
||||
// const indexOptions = [
|
||||
// {
|
||||
// id: '1',
|
||||
// name: '相电压有效值'
|
||||
// },
|
||||
// {
|
||||
// id: '2',
|
||||
// name: '线电压有效值'
|
||||
// },
|
||||
// {
|
||||
// id: '3',
|
||||
// name: '电压偏差'
|
||||
// },
|
||||
// {
|
||||
// id: '4',
|
||||
// name: '三相电压不平衡'
|
||||
// }
|
||||
// ]
|
||||
const typeOptions = [
|
||||
{
|
||||
id: '1',
|
||||
name: '最大值'
|
||||
},
|
||||
{
|
||||
id: '2',
|
||||
name: '最小值'
|
||||
},
|
||||
{
|
||||
id: '3',
|
||||
name: '平均值'
|
||||
},
|
||||
{
|
||||
id: '4',
|
||||
name: 'CP95'
|
||||
}
|
||||
]
|
||||
form.value = {
|
||||
index: '',
|
||||
type: ''
|
||||
type: typeOptions[0].id
|
||||
}
|
||||
const rankOptions = ref([
|
||||
{
|
||||
value: '1',
|
||||
label: '1级'
|
||||
},
|
||||
{
|
||||
value: '2',
|
||||
label: '2级'
|
||||
},
|
||||
{
|
||||
value: '3',
|
||||
label: '3级'
|
||||
}
|
||||
])
|
||||
//统计指标
|
||||
const indexOptions: any = ref([])
|
||||
queryByCode('portable-harmonic').then(res => {
|
||||
queryByid(res.data.id).then(item => {
|
||||
indexOptions.value = item.data
|
||||
form.value.index=indexOptions.value[0].id
|
||||
})
|
||||
})
|
||||
const activeName: any = ref()
|
||||
const deviceData: any = ref([])
|
||||
const schemeTreeRef = ref(null)
|
||||
const chartsDataList: any = ref([])
|
||||
const nodeClick = async (e: anyObj) => {
|
||||
// if (!e) {
|
||||
// loading.value = false
|
||||
// return
|
||||
// }
|
||||
// if (e.level == 2) {
|
||||
loading.value = true
|
||||
deviceData.value = []
|
||||
// if (e?.id) {
|
||||
|
||||
// }
|
||||
//查询测试项信息
|
||||
try {
|
||||
await getTestRecordInfo(e.id).then(res => {
|
||||
deviceData.value = res.data
|
||||
loading.value = false
|
||||
activeName.value = res.data.records[0]?.itemName
|
||||
schemeTreeRef.value.getPlanData(deviceData.value)
|
||||
schemeTreeRef.value.getPlanData(deviceData.value)
|
||||
})
|
||||
|
||||
} catch (error) {
|
||||
loading.value = false
|
||||
}
|
||||
try {
|
||||
//查询历史趋势
|
||||
const historyData = {
|
||||
devId: e.id,
|
||||
statisticalId: '11aaa206ba82c5b68b7339fe60e22945',
|
||||
@@ -228,9 +255,11 @@ const nodeClick = async (e: anyObj) => {
|
||||
} catch (error) {
|
||||
loading.value = false
|
||||
}
|
||||
//查询历史趋势
|
||||
}
|
||||
|
||||
const deviceRef = ref()
|
||||
const openDevice = () => {
|
||||
deviceRef.value.open(deviceData.value.records[0].id)
|
||||
}
|
||||
const mangePopup = ref()
|
||||
const handleOpen = (val: any) => {
|
||||
mangePopup.value.open(val, deviceData.value.records[0].id)
|
||||
@@ -255,9 +284,20 @@ const init = () => {
|
||||
title: [
|
||||
{
|
||||
left: 'center',
|
||||
text: '10KV 母线_监测点 相电压有效值'
|
||||
text:
|
||||
'10KV 母线_监测点 ' +
|
||||
indexOptions.value.find(item => {
|
||||
return item.id == form.value.index
|
||||
})?.name
|
||||
}
|
||||
],
|
||||
toolbox: {
|
||||
feature: {
|
||||
saveAsImage: {
|
||||
title: '保存'
|
||||
}
|
||||
}
|
||||
},
|
||||
// backgroundColor: '#1B232E',
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
@@ -296,7 +336,7 @@ const init = () => {
|
||||
fontSize: 14
|
||||
},
|
||||
top: 0,
|
||||
right: 50,
|
||||
left: 50,
|
||||
itemWidth: 20,
|
||||
itemHeight: 10,
|
||||
itemGap: 15
|
||||
|
||||
Reference in New Issue
Block a user