You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

152 lines
3.6 KiB

<template>
<el-tabs v-model="activeName" style="margin-top: 8px">
<el-tab-pane label="图谱1" name="1">
<treeNodeg6 ref="treeGraph" :mockData="mockData" />
</el-tab-pane>
<el-tab-pane label="表格" name="2">
<el-table
v-loading="loading"
:data="tableData"
@selection-change="handleSelectionChange"
border
style="width: 100%"
>
<el-table-column label="代码编号" align="center" prop="cdNo" />
<el-table-column label="代码名称" align="center" prop="cdValCnMean" />
<el-table-column label="引用标准编号" align="center" prop="dataStdNo" />
<el-table-column label="引用标准英文名" align="center" prop="dataStdNo" />
<el-table-column label="引用标准中文名" align="center" prop="dataStdCnName" />
<el-table-column label="引用字典编号" align="center" prop="dataDictNo" />
<el-table-column label="引用字典英文名" align="center" prop="dataDictEngName" />
<el-table-column label="引用字典中文名" align="center" prop="dataDictCnName" />
</el-table>
</el-tab-pane>
</el-tabs>
</template>
<script setup>
import { ref, onMounted, nextTick } from "vue";
import { getStdCodeMap } from "@/api/datastd/std";
import treeNodeg6 from "./treeNodeg6.vue";
const activeName = ref("1"); // 默认打开图谱
const treeGraph = ref(null);
const tableData = ref([]);
const selections = ref([]);
const loading = ref(false);
const props = defineProps({
rowData: {
type: Object,
required: false
}
});
// mocked data
const mockData = ref({
id: "g1",
name: props.rowData.cdValCnMean,
count: 123456,
label: props.rowData.cdNo,
rate: 1.0,
status: "G",
variableValue: "代码",
variableUp: true,
children:[]
// children: [
// {
// id: "g12",
// name: "发行机构类型",
// count: 123456,
// label: "iss_ins_type",
// rate: 1.0,
// status: "R",
// currency: "xx001",
// variableValue: "标准",
// variableUp: true,
// children: [
// {
// id: "g121",
// name: "发行机构类型",
// collapsed: true,
// count: 123456,
// label: "iss_ins_type",
// rate: 1.0,
// status: "B",
// currency: "xx002",
// variableValue: "词典",
// variableUp: true,
// },
// ],
// },
// {
// id: "g13",
// name: "发行人编号",
// label: "issr_no",
// rate: 1,
// status: "R",
// currency: "xx002",
// variableValue: "标准",
// variableUp: true,
// },
// ],
});
// 获取数据列表
const getList = async () => {
loading.value = true;
try {
const response = await listStdCodemap();
tableData.value = response.rows || [];
} finally {
loading.value = false;
}
};
const handleSelectionChange = (selection) => {
selections.value = selection;
};
// 默认加载图谱
onMounted(() => {
nextTick(() => {
getStdCodeMap(props.rowData.id).then(response => {
mockData.value.children = response.data.children;
tableData.value = response.data.tableData;
if (treeGraph.value) {
treeGraph.value.refreshGraph();
}
});
});
});
</script>
<style scoped>
.app-container {
padding: 20px;
}
.query-form-container {
margin-bottom: 20px;
}
.el-table .el-input {
width: 100%;
}
.form-container {
margin-bottom: 20px;
}
.info-text {
font-size: 18px;
line-height: 1.6;
color: #333;
font-weight: 500;
display: inline-block;
width: 100%;
}
</style>