10 changed files with 732 additions and 95 deletions
@ -0,0 +1,222 @@ |
|||
<template> |
|||
<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">代码归属: {{ form.sysName || '暂无代码归属' }}</span> |
|||
</el-col> |
|||
|
|||
<!-- 代码编号 --> |
|||
<el-col :span="8"> |
|||
<span class="info-text">代码编号: {{ form.codeNum || '暂无代码编号' }}</span> |
|||
</el-col> |
|||
|
|||
<!-- 代码名称 --> |
|||
<el-col :span="8"> |
|||
<span class="info-text">代码名称: {{ form.codeName || '暂无代码名称' }}</span> |
|||
</el-col> |
|||
</el-row> |
|||
</div> |
|||
|
|||
|
|||
<!-- 查询表单 --> |
|||
<div class="query-form-container"> |
|||
<el-form :model="queryParams" ref="queryRef" :inline="true"> |
|||
<el-form-item label="代码值/名称" prop="codeNum"> |
|||
<el-input |
|||
v-model="queryParams.codeNum" |
|||
placeholder="请输入标准代码编号" |
|||
clearable |
|||
style="width: 220px" |
|||
/> |
|||
</el-form-item> |
|||
|
|||
<el-form-item> |
|||
<el-button type="primary" @click="handleQuery">搜索</el-button> |
|||
<el-button icon="Refresh" @click="resetQuery">重置</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</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="代码值" |
|||
align="center" |
|||
prop="codeNum" |
|||
:editable="true" |
|||
> |
|||
|
|||
</el-table-column> |
|||
|
|||
<el-table-column |
|||
label="代码含义" |
|||
align="center" |
|||
prop="codeName" |
|||
:editable="true" |
|||
> |
|||
|
|||
</el-table-column> |
|||
|
|||
</el-table> |
|||
|
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref, reactive, onMounted, toRefs } from 'vue'; |
|||
import { listStdCode,getStdCode} from "@/api/datastd/stdcode"; // 更新为新的接口 |
|||
|
|||
const { proxy } = getCurrentInstance(); |
|||
const { std_code_status } = proxy.useDict("std_code_status"); |
|||
|
|||
const props = defineProps({ |
|||
codeId: { |
|||
type: Object, |
|||
required: false |
|||
}, |
|||
|
|||
}); |
|||
|
|||
const queryParams = ref({ |
|||
codeNum: '', |
|||
parentId: props.codeId, |
|||
codeName: '', |
|||
codeType: '', |
|||
sysName: '', |
|||
classId: 'codeItem', |
|||
sysId: '', |
|||
pageNum: 1, |
|||
pageSize: 100 |
|||
}); |
|||
|
|||
const form = ref({ |
|||
id: "", |
|||
codeNum: '', |
|||
codeName: '', |
|||
codeType: 'company', |
|||
codeStatus: '', |
|||
sysName: '', |
|||
classId: 'code', |
|||
codeMapId: '', |
|||
codeMapName: '', |
|||
codeMapNum: '', |
|||
sysId: undefined |
|||
}); |
|||
|
|||
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.codeType == "sys") { |
|||
showSys.value = true; |
|||
} else { |
|||
showSys.value = false; |
|||
} |
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
// 获取数据列表 |
|||
const getList = async () => { |
|||
loading.value = true; |
|||
console.log(queryParams.value,"queryParams.value") |
|||
const response = await listStdCode(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(); |
|||
}; |
|||
|
|||
// 重置查询 |
|||
const resetQuery = () => { |
|||
queryParams.value = { |
|||
parentId:props.codeId, |
|||
pageNum: 1, |
|||
pageSize: 100 |
|||
}; |
|||
|
|||
}; |
|||
|
|||
defineExpose({ |
|||
selections |
|||
}); |
|||
|
|||
|
|||
onMounted(() => { |
|||
getStdCode(props.codeId).then(response => { |
|||
form.value = response.data; |
|||
|
|||
}); |
|||
getList(); |
|||
// getcompanyList() |
|||
}); |
|||
</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> |
|||
|
|||
|
@ -0,0 +1,269 @@ |
|||
<template> |
|||
<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">代码归属: {{ form.sysName || '暂无代码归属' }}</span> |
|||
</el-col> |
|||
|
|||
<!-- 代码编号 --> |
|||
<el-col :span="8"> |
|||
<span class="info-text">代码编号: {{ form.codeNum || '暂无代码编号' }}</span> |
|||
</el-col> |
|||
|
|||
<!-- 代码名称 --> |
|||
<el-col :span="8"> |
|||
<span class="info-text">代码名称: {{ form.codeName || '暂无代码名称' }}</span> |
|||
</el-col> |
|||
</el-row> |
|||
</div> |
|||
|
|||
|
|||
<!-- 查询表单 --> |
|||
<!-- <div class="query-form-container"> |
|||
<el-form :model="queryParams" ref="queryRef" :inline="true"> |
|||
<el-form-item label="代码值/名称" prop="codeNum"> |
|||
<el-input |
|||
v-model="queryParams.codeNum" |
|||
placeholder="请输入标准代码编号" |
|||
clearable |
|||
style="width: 220px" |
|||
/> |
|||
</el-form-item> |
|||
|
|||
<el-form-item> |
|||
<el-button type="primary" @click="handleQuery">搜索</el-button> |
|||
<el-button icon="Refresh" @click="resetQuery">重置</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</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="源系统" |
|||
align="center" |
|||
prop="targetSysName" |
|||
> |
|||
|
|||
</el-table-column> |
|||
<el-table-column |
|||
label="系统级代码编号" |
|||
align="center" |
|||
prop="targetCodeNum" |
|||
> |
|||
|
|||
</el-table-column> |
|||
<el-table-column |
|||
label="系统级代码名称" |
|||
align="center" |
|||
prop="targetCodeName" |
|||
> |
|||
|
|||
</el-table-column> |
|||
<el-table-column |
|||
label="系统级代码" |
|||
align="center" |
|||
prop="targetCodeNumItem" |
|||
> |
|||
|
|||
</el-table-column> |
|||
<el-table-column |
|||
label="系统级代码含义" |
|||
align="center" |
|||
prop="targetCodeNameItem" |
|||
> |
|||
|
|||
</el-table-column> |
|||
<el-table-column |
|||
label="公司级代码名称" |
|||
align="center" |
|||
prop="resourceCodeNum" |
|||
> |
|||
|
|||
</el-table-column> |
|||
<el-table-column |
|||
label="公司级代码编号" |
|||
align="center" |
|||
prop="resourceCodeName" |
|||
> |
|||
|
|||
</el-table-column> |
|||
<el-table-column |
|||
label="公司级代码" |
|||
align="center" |
|||
prop="resourceCodeNumItem" |
|||
> |
|||
|
|||
</el-table-column> |
|||
<el-table-column |
|||
label="公司级代码含义" |
|||
align="center" |
|||
prop="resourceCodeNameItem" |
|||
> |
|||
|
|||
</el-table-column> |
|||
|
|||
</el-table> |
|||
|
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref, reactive, onMounted, toRefs } from 'vue'; |
|||
import { listStdCodemap,getStdCode} from "@/api/datastd/stdcode"; // 更新为新的接口 |
|||
|
|||
const { proxy } = getCurrentInstance(); |
|||
const { std_code_status } = proxy.useDict("std_code_status"); |
|||
|
|||
const props = defineProps({ |
|||
codeId: { |
|||
type: Object, |
|||
required: false |
|||
}, |
|||
|
|||
}); |
|||
|
|||
const queryParams = ref({ |
|||
codeNum: '', |
|||
parentId: props.codeId, |
|||
codeName: '', |
|||
codeType: '', |
|||
sysName: '', |
|||
classId: 'codeItem', |
|||
sysId: '', |
|||
pageNum: 1, |
|||
pageSize: 100 |
|||
}); |
|||
|
|||
const form = ref({ |
|||
id: "", |
|||
codeNum: '', |
|||
codeName: '', |
|||
codeType: 'company', |
|||
codeStatus: '', |
|||
sysName: '', |
|||
classId: 'code', |
|||
codeMapId: '', |
|||
codeMapName: '', |
|||
codeMapNum: '', |
|||
sysId: undefined |
|||
}); |
|||
|
|||
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.codeType == "sys") { |
|||
showSys.value = true; |
|||
} else { |
|||
showSys.value = false; |
|||
} |
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
// 获取数据列表 |
|||
const getList = async () => { |
|||
loading.value = true; |
|||
console.log(queryParams.value,"queryParams.value") |
|||
const response = await listStdCodemap(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(); |
|||
}; |
|||
|
|||
// 重置查询 |
|||
const resetQuery = () => { |
|||
queryParams.value = { |
|||
parentId:props.codeId, |
|||
pageNum: 1, |
|||
pageSize: 100 |
|||
}; |
|||
|
|||
}; |
|||
|
|||
defineExpose({ |
|||
selections |
|||
}); |
|||
|
|||
|
|||
onMounted(() => { |
|||
getStdCode(props.codeId).then(response => { |
|||
form.value = response.data; |
|||
queryParams.value.codeType=form.value.codeType |
|||
getList(); |
|||
}); |
|||
|
|||
// getcompanyList() |
|||
}); |
|||
</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