节点:初始化数据

This commit is contained in:
高云鹏 2024-07-10 18:11:14 +08:00
parent 89be3efb6a
commit 55009164d0
4 changed files with 67 additions and 12 deletions

View File

@ -14,7 +14,7 @@ import {
import createAxios from '/@/utils/axios'
export const getNodeListReq = () => {
return createAxios<never, RequestReturnType>({
return createAxios<never, RequestReturnType<nodeType[]>>({
url: '/api/node/list',
method: 'post',
})
@ -52,7 +52,7 @@ export const submitNodeConfigReq = () => {
}
export const getLinkListReq = (data: getLinkType) => {
return createAxios<never, RequestReturnType<linkType>>({
return createAxios<never, RequestReturnRowType<linkType[]>>({
url: '/api/node/link/list',
method: 'post',
data: data,

View File

@ -945,7 +945,7 @@ $paginationHeight: 32px;
justify-content: space-between;
align-items: center;
width: 80px;
height: 200px;
height: 150px;
.el-button {
margin: 0;
}

View File

@ -679,7 +679,7 @@ $paginationHeight: 32px;
justify-content: space-between;
align-items: center;
width: 80px;
height: 200px;
height: 150px;
.el-button {
margin: 0;
}

View File

@ -30,11 +30,13 @@
</template>
<template #asideMain>
<el-tree
ref="nodeTreeRef"
:data="treeData"
:props="replaceTreeProps"
node-key="id"
@node-click="nodeClick"
@node-contextmenu="nodeContextMenu"
highlight-current
></el-tree>
</template>
<template #mainHeader>
@ -53,7 +55,25 @@
</div>
</template>
<template #mainMain>
<el-table W></el-table>
<el-table :data="linkTableData">
<el-table-column prop="linkName" label="链路名称" align="center"></el-table-column>
<el-table-column prop="protocol" label="协议类型" align="center"></el-table-column>
<el-table-column prop="params" label="参数" align="center"></el-table-column>
<el-table-column prop="nodeName" label="节点名称" align="center"></el-table-column>
<el-table-column fixed="right" label="操作" min-width="80" align="center">
<template #default="scope">
<div class="tableOperate">
<a>编辑</a>
<a>|</a>
<el-popconfirm title="确定删除么?">
<template #reference>
<a>删除</a>
</template>
</el-popconfirm>
</div>
</template>
</el-table-column>
</el-table>
</template>
</Container>
<ContextMenu v-model:visible="nodeContextMenuVisible" :pos="nodeContextMenuPos">
@ -80,10 +100,10 @@
<script setup lang="ts">
import { ElInput, ElButton, ElTree, ElTable, ElMessage } from 'element-plus'
import type { FormInstance } from 'element-plus'
import type { FormInstance, TreeInstance } from 'element-plus'
import { Search, Plus, Upload, Download } from '@element-plus/icons-vue'
import { ref } from 'vue'
import { nodeType } from '/@/views/backend/node/type'
import { ref, nextTick } from 'vue'
import { nodeType, linkType } from '/@/views/backend/node/type'
import ContextMenu from '/@/views/backend/auth/model/contextMenu.vue'
import Container from '/@/components/container/index.vue'
import {
@ -100,11 +120,11 @@ import {
submitNodeConfigReq,
} from '/@/api/backend/node/request'
import { getInstitutionalTreeListReq } from '/@/api/backend/org/request'
import { getTreeDataReturnType } from '/@/views/backend/auth/org/type'
const searchTreeInput = ref('')
const replaceTreeProps = { label: 'nodeName' }
const treeData = ref([])
const nodeTreeRef = ref<TreeInstance>()
const treeData = ref<nodeType[]>([])
const nodeVisible = ref(false)
const nodeTitle = ref('新增节点')
@ -272,10 +292,14 @@ const closeNodeForm = () => {
}
const getNodeList = () => {
getNodeListReq()
return getNodeListReq()
.then((res) => {
if (res.success) {
treeData.value = res.data!
clickTreeData.value = res.data![0]
nextTick(() => {
nodeTreeRef.value?.setCurrentKey(res.data![0].id)
})
} else {
ElMessage.error(res.msg ?? '查询失败')
}
@ -284,7 +308,25 @@ const getNodeList = () => {
ElMessage.error(err?.response?.data?.msg ?? '查询失败')
})
}
getNodeList()
const linkTableData = ref<linkType[]>([])
const getLinkData = (nodeId: string) => {
getLinkListReq({ nodeId })
.then((res) => {
if (res.rows) {
linkTableData.value = res.rows
} else {
ElMessage.error(res.msg ?? '查询失败')
}
})
.catch((err) => {
ElMessage.error(err?.response?.data?.msg ?? '查询失败')
})
}
getNodeList().then(() => {
getLinkData(clickTreeData.value!.id!)
})
</script>
<style scoped>
@ -313,6 +355,19 @@ getNodeList()
align-items: center;
width: 290px;
}
.tableOperate {
display: flex;
justify-content: center;
align-items: center;
a {
margin: 5px;
color: #0064aa;
font-weight: 600;
&:hover {
cursor: pointer;
}
}
}
.modelOperate {
display: flex;
flex-direction: column;