siyaqi
4 weeks ago
7 changed files with 340 additions and 8 deletions
@ -0,0 +1,228 @@ |
|||||
|
|
||||
|
<template> |
||||
|
<el-tabs v-model="activeName" style="margin-top: 8px"> |
||||
|
<el-tab-pane label="图谱" name="1"> |
||||
|
<treeNodeg6 ref="treeGraph" :mockData="mockData" /> |
||||
|
</el-tab-pane> |
||||
|
<el-tab-pane label="表格" name="2"> |
||||
|
<el-form :model="form" ref="formRef" label-width="120px" > |
||||
|
<div class="form-container"> |
||||
|
<el-row :gutter="20"> |
||||
|
<!-- 代码归属 --> |
||||
|
<el-col :span="8"> |
||||
|
<span class="info-text" > |
||||
|
字典系统:{{ getSrcSysName(form.srcSys) }} |
||||
|
</span> |
||||
|
</el-col> |
||||
|
|
||||
|
<!-- 代码编号 --> |
||||
|
<el-col :span="8"> |
||||
|
<span class="info-text">字典英文名称: {{ form.dataDictEngName || '暂无字典英文名称' }}</span> |
||||
|
</el-col> |
||||
|
|
||||
|
<!-- 代码名称 --> |
||||
|
<el-col :span="8"> |
||||
|
<span class="info-text">字典中文名称: {{ form.dataDictCnName || '暂无字典中文名称' }}</span> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</div> |
||||
|
|
||||
|
|
||||
|
|
||||
|
</el-form> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<!-- 表格展示 --> |
||||
|
<el-table |
||||
|
v-loading="loading" |
||||
|
:data="tableData" |
||||
|
@selection-change="handleSelectionChange" |
||||
|
border |
||||
|
style="width: 100%" |
||||
|
> |
||||
|
<el-table-column type="selection" width="55" align="center" /> |
||||
|
|
||||
|
<el-table-column label="字典编号" prop="dataStdNo" align="center" /> |
||||
|
<el-table-column label="字典英文名称" prop="dataDictEngName" align="center" /> |
||||
|
<el-table-column label="字典中文名称" prop="dataDictCnName" align="center" /> |
||||
|
<el-table-column label="字典编号" prop="dataDictNo" align="center" /> |
||||
|
<el-table-column label="字典英文名称" prop="dataDictEngName" align="center" /> |
||||
|
<el-table-column label="字典中文名称" prop="dataDictCnName" align="center" /> |
||||
|
|
||||
|
|
||||
|
|
||||
|
</el-table> |
||||
|
</el-tab-pane> |
||||
|
</el-tabs> |
||||
|
</template> |
||||
|
<script setup> |
||||
|
import { ref, reactive, onMounted, toRefs } from 'vue'; |
||||
|
import { listDictMap,getDictMap,getStdDict} from "@/api/datastd/std"; // 更新为新的接口 |
||||
|
import treeNodeg6 from "../stdcode/treeNodeg6.vue"; |
||||
|
|
||||
|
const { proxy } = getCurrentInstance(); |
||||
|
const { std_code_status } = proxy.useDict("std_code_status"); |
||||
|
import useUserStore from '@/store/modules/user'; // 注意路径是否正确 |
||||
|
|
||||
|
const userStore = useUserStore(); // 正确调用 |
||||
|
const dsSysList = userStore.dsSysList; // 访问属性 |
||||
|
const props = defineProps({ |
||||
|
codeId: { |
||||
|
type: Object, |
||||
|
required: false |
||||
|
}, |
||||
|
|
||||
|
}); |
||||
|
|
||||
|
const getSrcSysName = (id) => { |
||||
|
const match = dsSysList.find(item => item.id === id); |
||||
|
return match ? match.name : id; |
||||
|
}; |
||||
|
|
||||
|
const queryParams = ref({ |
||||
|
cdNo: '', |
||||
|
onum: props.codeId, |
||||
|
cdValCnMean: '', |
||||
|
cdType: '', |
||||
|
sysName: '', |
||||
|
sysId: '', |
||||
|
pageNum: 1, |
||||
|
pageSize: 100 |
||||
|
}); |
||||
|
|
||||
|
const form = ref({ |
||||
|
id: "", |
||||
|
cdNo: '', |
||||
|
cdValCnMean: '', |
||||
|
cdType: 'company', |
||||
|
cdValStat: '', |
||||
|
sysName: '', |
||||
|
classId: 'code', |
||||
|
codeMapId: '', |
||||
|
codeMapName: '', |
||||
|
codeMapNum: '', |
||||
|
}); |
||||
|
const activeName = ref("1"); // 默认打开图谱 |
||||
|
const tableData = ref([]); |
||||
|
const selections = ref([]); |
||||
|
const loading = ref(false); |
||||
|
const showSys = ref(false); |
||||
|
const multiple = ref(false); |
||||
|
|
||||
|
|
||||
|
//初始话判断展示系统及映射下拉选 |
||||
|
if (props.codeId) { |
||||
|
form.value = { ...props.rowData }; |
||||
|
if (form.value.cdType == "sys") { |
||||
|
showSys.value = true; |
||||
|
} else { |
||||
|
showSys.value = false; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
// 获取数据列表 |
||||
|
const getList = async () => { |
||||
|
loading.value = true; |
||||
|
console.log(queryParams.value,"queryParams.value") |
||||
|
const response = await listDictMap(queryParams.value); |
||||
|
tableData.value = response.rows.map(item => ({ ...item})); |
||||
|
loading.value = false; |
||||
|
}; |
||||
|
|
||||
|
|
||||
|
|
||||
|
const handleCodeClick = (row) => { |
||||
|
console.log('点击了字典代码名称', row); |
||||
|
}; |
||||
|
|
||||
|
|
||||
|
const handleSelectionChange = (selection) => { |
||||
|
multiple.value = selection.length > 0; |
||||
|
selections.value = selection; // 保存选中的行数据 |
||||
|
console.log(selections.value,"子页面选中") |
||||
|
}; |
||||
|
|
||||
|
// 搜索 |
||||
|
const handleQuery = () => { |
||||
|
queryParams.value.pageNum = 1; |
||||
|
getList(); |
||||
|
}; |
||||
|
|
||||
|
|
||||
|
defineExpose({ |
||||
|
selections |
||||
|
}); |
||||
|
const treeGraph = ref(null); |
||||
|
|
||||
|
const mockData = ref({ |
||||
|
id: "g1", |
||||
|
name: "", |
||||
|
count: 123456, |
||||
|
label: "", |
||||
|
rate: 1.0, |
||||
|
status: "G", |
||||
|
variableValue: "代码", |
||||
|
variableUp: true, |
||||
|
children:[] |
||||
|
|
||||
|
}); |
||||
|
|
||||
|
onMounted(() => { |
||||
|
nextTick(() => { |
||||
|
getStdDict(props.codeId).then(response => { |
||||
|
form.value = response.data; |
||||
|
mockData.value.variableValue="数据字典" |
||||
|
mockData.value.name=form.value.dataDictCnName |
||||
|
mockData.value.label=form.value.dataDictEngName |
||||
|
getDictMap(form.value.onum).then(response => { |
||||
|
mockData.value.children = response.data.children; |
||||
|
tableData.value = response.data.tableData; |
||||
|
if (treeGraph.value) { |
||||
|
treeGraph.value.refreshGraph(); |
||||
|
} |
||||
|
}); |
||||
|
getList(); |
||||
|
}); |
||||
|
|
||||
|
|
||||
|
}); |
||||
|
}); |
||||
|
</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> |
||||
|
|
||||
|
|
||||
Loading…
Reference in new issue