修改设备分组功能默认展开左边的树,默认加载第一分组的数据

This commit is contained in:
liub
2025-10-11 11:01:03 +08:00
parent 47d8f14ad4
commit 7445e789a4
3 changed files with 39 additions and 104 deletions

View File

@ -10,7 +10,7 @@
</div> </div>
<div class="treeContent"> <div class="treeContent">
<el-tree :data="treeData" :props="defaultProps" accordion @node-click="handleNodeClick" :highlight-current="true"> <el-tree :default-expand-all="true" :data="treeData" :props="defaultProps" accordion @node-click="handleNodeClick" :highlight-current="true">
<template #default="{ node, data }"> <template #default="{ node, data }">
<div class="custom-tree-node"> <div class="custom-tree-node">
<span :class="data.parentId != null ? '' : 'treeBold'">{{ node.label }}</span> <span :class="data.parentId != null ? '' : 'treeBold'">{{ node.label }}</span>
@ -171,12 +171,17 @@
</el-dialog> </el-dialog>
<!-- 添加节点的弹出框 --> <!-- 添加节点的弹出框 -->
<el-dialog :width="350" :draggable="true" v-model="Status.dialogEditNode" :title="cEdit.id ? '修改分组' :(cEdit.pNode?'新增子节点': '新增根节点')" center> <el-dialog
:width="350"
:draggable="true"
v-model="Status.dialogEditNode"
:title="cEdit.id ? '修改分组' : cEdit.pNode ? '新增子节点' : '新增根节点'"
center
>
<div> <div>
<el-form class="demo-form-inline" :inline="true" :model="cEdit" label-width="auto" style="width: 100%"> <el-form class="demo-form-inline" :inline="true" :model="cEdit" label-width="auto" style="width: 100%">
<el-form-item label="分组名称"> <el-input v-model="cEdit.groupName" placeholder="请输入" /> </el-form-item <el-form-item label="分组名称"> <el-input v-model="cEdit.groupName" placeholder="请输入" /> </el-form-item>
> <div style="text-indent: 68px; color: #f56c6c; margin-top: -15px">{{ cEdit.groupName ? '' : '请输入分组名称' }}</div>
<div style="text-indent: 68px;color: #f56c6c;margin-top: -15px;">{{ cEdit.groupName?'':'请输入分组名称' }}</div>
</el-form> </el-form>
</div> </div>
<template #footer> <template #footer>
@ -337,6 +342,7 @@ var getDeviceList = () => {
deviceName: GjSearchForm.deviceName deviceName: GjSearchForm.deviceName
}; };
showloading(); showloading();
return new Promise((resolve, reject) => {
api api
.getNodeDevice(para) .getNodeDevice(para)
.then((res) => { .then((res) => {
@ -348,6 +354,8 @@ var getDeviceList = () => {
}) })
.finally(() => { .finally(() => {
hideloading(); hideloading();
resolve();
});
}); });
}; };
//树控件节点点击事件 //树控件节点点击事件
@ -363,6 +371,12 @@ var handleNodeClick = (node) => {
//树控件筛选后显示的数据源 //树控件筛选后显示的数据源
var treeData = computed(() => { var treeData = computed(() => {
let arr = api.treeNodeSearch(treeDataOrin.value, searchTxt.value, 'groupName', 'children'); let arr = api.treeNodeSearch(treeDataOrin.value, searchTxt.value, 'groupName', 'children');
if (arr.length && !checkNode.val) {
checkNode.val = arr[0].id;
getDeviceList().finally(() => {
checkNode.val = '';
});
}
return arr; return arr;
}); });
@ -379,7 +393,7 @@ var editNode = (node) => {
Status.isEditTreeNode = true; Status.isEditTreeNode = true;
cEdit.value.editNode = node; cEdit.value.editNode = node;
cEdit.value.pNode = null; cEdit.value.pNode = null;
Status.dialogEditNode=true; Status.dialogEditNode = true;
// //
}; };
@ -413,7 +427,7 @@ var completeEdit = (node) => {
if (res.code == 200) { if (res.code == 200) {
alert('操作成功'); alert('操作成功');
RefreshTree(); RefreshTree();
Status.dialogEditNode=false; Status.dialogEditNode = false;
} else { } else {
alert(res.msg); alert(res.msg);
} }
@ -477,7 +491,7 @@ var addNode = (node) => {
}; };
var saveNode = () => { var saveNode = () => {
if(!cEdit.value.groupName){ if (!cEdit.value.groupName) {
return; return;
} }
let val = new Date().getTime(); let val = new Date().getTime();
@ -917,8 +931,8 @@ onMounted(() => {
} }
.custom-tree-node .iconContent .icon { .custom-tree-node .iconContent .icon {
width: 18px; width: 15px;
height: 18px; height: 15px;
visibility: hidden; visibility: hidden;
} }

View File

@ -1,83 +1,6 @@
<template> <template>
<el-form :model="user" label-width="80px"> <div>敬请期待</div>
<div v-for="item in user">
<el-form-item :label="item.dictLabel" prop="dictLabel">
<el-input v-model="item.dictLabel" disabled />
</el-form-item>
<el-form-item label="版本号" prop="dictValue">
<el-input v-model="item.dictValue" placeholder="请输入版本号" clearable />
</el-form-item>
<el-form-item label="下载地址" prop="remark">
<el-input v-model="item.remark" placeholder="请输入wgt下载地址" clearable />
</el-form-item>
</div>
<el-form-item>
<el-button type="primary" @click="submit">保存</el-button>
</el-form-item>
</el-form>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import request from '@/utils/request';
const user = ref([
{
'dictValue': '',
'dictLabel': 'ios',
'remark': ''
},
{
'dictValue': '',
'dictLabel': 'android',
'remark': ''
}
]);
function getCfg() {
request({
url: '/app/auth/version',
method: 'get'
}).then((res) => {
if (res && res.code === 200) {
user.value.forEach((v) => {
let f = res.data.find((item) => {
return item.dictLabel === v.dictLabel;
});
if (f) {
v.dictValue = f.dictValue;
v.remark = f.remark;
}
});
}
});
}
function submit() {
let flag = [];
user.value.forEach((v) => {
let keys = Object.keys(v);
keys.forEach((k) => {
if (!v[k]) {
flag.push(false);
}
});
});
if (flag.length > 0) {
ElMessageBox.alert('所有项都是必填');
return;
}
request({
url: '/api/xinghan/device/UpVersion',
method: 'post',
data: user.value
}).then((res) => {
if (res && res.code === 200) {
ElMessageBox.alert('操作成功');
}
});
}
onMounted(() => {
getCfg();
});
</script> </script>

View File

@ -61,9 +61,7 @@
<el-tab-pane label="在线设备" name="onlineDevice"> <el-tab-pane label="在线设备" name="onlineDevice">
<onlineDevice :devices="state.devices" /> <onlineDevice :devices="state.devices" />
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="App版本" name="appVer">
<appVer />
</el-tab-pane>
</el-tabs> </el-tabs>
</el-card> </el-card>
</el-col> </el-col>