6 changed files with 577 additions and 87 deletions
@ -0,0 +1,421 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<el-row :gutter="10" class="mb8"> |
|||
<el-form :inline="true" :model="queryForm"> |
|||
|
|||
<el-form-item label="归属系统"> |
|||
<el-select v-model="queryForm.ssysCd" placeholder="请选择系统" clearable allow-create filterable style="width: 180px"> |
|||
<el-option v-for="item in dsSysList" :key="item.id" :label="item.name" :value="item.name" /> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="模式名"> |
|||
<el-input |
|||
v-model="queryForm.mdlName" |
|||
placeholder="请输入模式名" |
|||
clearable |
|||
/> |
|||
</el-form-item> |
|||
|
|||
<el-form-item> |
|||
<el-button type="primary" icon="Search" @click="handleSearch" |
|||
>搜索</el-button |
|||
> |
|||
<el-button icon="Refresh" @click="resetQuery">重置</el-button> |
|||
</el-form-item> |
|||
</el-form> |
|||
</el-row> |
|||
<span> 值类型参数调整</span> |
|||
<el-row :gutter="10" class="mb8"> |
|||
<el-col :span="1.5"> |
|||
<el-button type="primary" plain icon="Plus" @click="openAddDialog1" |
|||
>新增</el-button |
|||
> |
|||
</el-col> |
|||
<el-col :span="1.5"> |
|||
<el-button |
|||
type="success" |
|||
plain |
|||
icon="Edit" |
|||
:disabled="selectedRows1.length !== 1" |
|||
@click="openEditDialog1(selectedRows1[0])" |
|||
>修改</el-button |
|||
> |
|||
</el-col> |
|||
<el-col :span="1.5"> |
|||
<el-button |
|||
type="danger" |
|||
plain |
|||
icon="Delete" |
|||
:disabled="selectedRows1.length === 0" |
|||
@click="deleteSelected1" |
|||
>删除</el-button |
|||
> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-table |
|||
v-loading="loading" |
|||
:data="configList1" |
|||
@selection-change="handleSelectionChange1" |
|||
style="width: 100%" |
|||
height="500" |
|||
|
|||
border |
|||
stripe |
|||
> |
|||
<el-table-column type="selection" width="55" /> |
|||
<el-table-column prop="datatype" label="值类型" width="200" /> |
|||
<el-table-column prop="ratio" label="阈值" width="150" /> |
|||
<el-table-column prop="updBy" label="更新人" width="150" /> |
|||
|
|||
<el-table-column prop="updTime" label="更新时间" width="180" /> |
|||
</el-table> |
|||
|
|||
<span> 业务类型参数调整</span> |
|||
<el-row :gutter="10" class="mb8"> |
|||
<el-col :span="1.5"> |
|||
<el-button type="primary" plain icon="Plus" @click="openAddDialog2" |
|||
>新增</el-button |
|||
> |
|||
</el-col> |
|||
<el-col :span="1.5"> |
|||
<el-button |
|||
type="success" |
|||
plain |
|||
icon="Edit" |
|||
:disabled="selectedRows2.length !== 1" |
|||
@click="openEditDialog2(selectedRows2[0])" |
|||
>修改</el-button |
|||
> |
|||
</el-col> |
|||
<el-col :span="1.5"> |
|||
<el-button |
|||
type="danger" |
|||
plain |
|||
icon="Delete" |
|||
:disabled="selectedRows2.length === 0" |
|||
@click="deleteSelected2" |
|||
>删除</el-button |
|||
> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-table |
|||
v-loading="loading" |
|||
:data="configList2" |
|||
@selection-change="handleSelectionChange2" |
|||
style="width: 100%" |
|||
height="500" |
|||
border |
|||
stripe |
|||
> |
|||
<el-table-column type="selection" width="55" /> |
|||
<el-table-column prop="regexName" label="业务类型" width="200" /> |
|||
<el-table-column prop="regexPattern" label="正则表达式" width="200" /> |
|||
<el-table-column prop="ratio" label="阈值" width="150" /> |
|||
<el-table-column prop="updBy" label="更新人" width="150" /> |
|||
|
|||
<el-table-column prop="updTime" label="更新时间" width="180" /> |
|||
</el-table> |
|||
|
|||
<span> 字段处理类型参数调整</span> |
|||
|
|||
|
|||
<el-dialog |
|||
:title="title" |
|||
v-model="open1" |
|||
width="500px" |
|||
append-to-body |
|||
:before-close="handleClose1" |
|||
> |
|||
<el-form |
|||
ref="clasFormRef1" |
|||
:model="form1" |
|||
:rules="rules1" |
|||
label-width="120px" |
|||
size="small" |
|||
> |
|||
|
|||
<el-form-item label="值类型" prop="datatype"> |
|||
<el-input v-model="form1.datatype" autocomplete="off" /> |
|||
</el-form-item> |
|||
<el-form-item label="阈值" prop="ratio"> |
|||
<el-input v-model.number="form1.ratio" autocomplete="off" /> |
|||
</el-form-item> |
|||
|
|||
</el-form> |
|||
<template #footer> |
|||
<el-button @click="open1 = false">取消</el-button> |
|||
<el-button type="primary" @click="submitForm1">保存</el-button> |
|||
</template> |
|||
</el-dialog> |
|||
<el-dialog |
|||
:title="title" |
|||
v-model="open2" |
|||
width="500px" |
|||
append-to-body |
|||
:before-close="handleClose2" |
|||
> |
|||
<el-form |
|||
ref="clasFormRef2" |
|||
:model="form2" |
|||
:rules="rules2" |
|||
label-width="120px" |
|||
size="small" |
|||
> |
|||
|
|||
<el-form-item label="业务类型" prop="regexName"> |
|||
<el-input v-model="form2.regexName" autocomplete="off" /> |
|||
</el-form-item> |
|||
<el-form-item label="正则表达式" prop="regexPattern"> |
|||
<el-input v-model="form2.regexPattern" autocomplete="off" /> |
|||
</el-form-item> |
|||
<el-form-item label="阈值" prop="ratio"> |
|||
<el-input v-model.number="form2.ratio" autocomplete="off" /> |
|||
</el-form-item> |
|||
|
|||
</el-form> |
|||
<template #footer> |
|||
<el-button @click="open2 = false">取消</el-button> |
|||
<el-button type="primary" @click="submitForm2">保存</el-button> |
|||
</template> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script setup> |
|||
import { ref, reactive, onMounted } from "vue"; |
|||
import { ElMessageBox, ElMessage } from "element-plus"; |
|||
import { |
|||
deleteDatatypeLabel, |
|||
editDatatypeLabel, |
|||
addDatatypeLabel, |
|||
getDatatypeLabelList, |
|||
deleteBusiLabel, |
|||
editBusiLabel, |
|||
addBusiLabel, |
|||
getBusiLabelList |
|||
} from "@/api/metadataConfig/metadataConfig"; |
|||
import useUserStore from '@/store/modules/user'; |
|||
|
|||
const userStore = useUserStore(); |
|||
const dsSysList = userStore.dsSysList; |
|||
|
|||
const queryForm = reactive({ |
|||
ssysCd: "*", |
|||
mdlName: "*", |
|||
}); |
|||
|
|||
const configList1 = ref([]); // 值类型参数数据 |
|||
const configList2 = ref([]); // 业务类型参数数据 |
|||
const loading = ref(false); |
|||
|
|||
const open1 = ref(false); // 值类型弹窗开关 |
|||
const open2 = ref(false); // 业务类型弹窗开关 |
|||
const title = ref(""); |
|||
|
|||
const clasFormRef1 = ref(null); // 值类型 formRef |
|||
const clasFormRef2 = ref(null); // 业务类型 formRef |
|||
|
|||
const form1 = reactive({ |
|||
datatype: "", |
|||
ratio: null, |
|||
}); |
|||
const form2 = reactive({ |
|||
regexName: "", |
|||
regexPattern: "", |
|||
ratio: null, |
|||
}); |
|||
|
|||
const rules1 = { |
|||
datatype: [{ required: true, message: "请输入值类型", trigger: "blur" }], |
|||
ratio: [{ required: true, message: "请输入阈值", trigger: "blur" }], |
|||
}; |
|||
const rules2 = { |
|||
regexName: [{ required: true, message: "请输入业务类型", trigger: "blur" }], |
|||
regexPattern: [{ required: true, message: "请输入正则表达式", trigger: "blur" }], |
|||
ratio: [{ required: true, message: "请输入阈值", trigger: "blur" }], |
|||
}; |
|||
|
|||
const selectedRows1 = ref([]); |
|||
const selectedRows2 = ref([]); |
|||
|
|||
function handleSelectionChange1(val) { |
|||
selectedRows1.value = val; |
|||
} |
|||
function handleSelectionChange2(val) { |
|||
selectedRows2.value = val; |
|||
} |
|||
|
|||
async function getList1() { |
|||
loading.value = true; |
|||
try { |
|||
const res = await getDatatypeLabelList(queryForm); |
|||
configList1.value = res.data || []; |
|||
} catch (error) { |
|||
ElMessage.error("获取值类型列表失败"); |
|||
} finally { |
|||
loading.value = false; |
|||
} |
|||
} |
|||
|
|||
async function getList2() { |
|||
loading.value = true; |
|||
try { |
|||
const res = await getBusiLabelList(queryForm); |
|||
configList2.value = res.data || []; |
|||
} catch (error) { |
|||
ElMessage.error("获取业务类型列表失败"); |
|||
} finally { |
|||
loading.value = false; |
|||
} |
|||
} |
|||
|
|||
function resetQuery() { |
|||
queryForm.ssysCd = "*"; |
|||
queryForm.mdlName = "*"; |
|||
getList1(); |
|||
getList2(); |
|||
} |
|||
|
|||
function handleSearch() { |
|||
getList1(); |
|||
getList2(); |
|||
} |
|||
|
|||
// ===== 值类型弹窗处理 ===== |
|||
function openAddDialog1() { |
|||
title.value = "新增值类型参数"; |
|||
Object.assign(form1, { datatype: "", ratio: null }); |
|||
open1.value = true; |
|||
} |
|||
function openEditDialog1(row) { |
|||
if (!row) { |
|||
ElMessage.warning("请选择一条记录进行编辑"); |
|||
return; |
|||
} |
|||
title.value = "编辑值类型参数"; |
|||
Object.assign(form1, row); |
|||
open1.value = true; |
|||
} |
|||
|
|||
function submitForm1() { |
|||
clasFormRef1.value.validate(async (valid) => { |
|||
if (!valid) return; |
|||
const submitData = { ...form1,ssysCd:queryForm.ssysCd,mdlName:queryForm.mdlName }; |
|||
try { |
|||
if (title.value.includes("新增")) { |
|||
await addDatatypeLabel(submitData); |
|||
ElMessage.success("新增成功"); |
|||
} else { |
|||
await editDatatypeLabel(submitData); |
|||
ElMessage.success("编辑成功"); |
|||
} |
|||
open1.value = false; |
|||
getList1(); |
|||
} catch (error) { |
|||
ElMessage.error("操作失败，请重试"); |
|||
} |
|||
}); |
|||
} |
|||
|
|||
function deleteSelected1() { |
|||
if (selectedRows1.value.length === 0) { |
|||
ElMessage.warning("请至少选择一条记录删除"); |
|||
return; |
|||
} |
|||
ElMessageBox.confirm( |
|||
`确定删除选中的 ${selectedRows1.value.length} 条值类型参数吗？`, |
|||
"提示", |
|||
{ type: "warning" } |
|||
).then(async () => { |
|||
try { |
|||
for (const row of selectedRows1.value) { |
|||
await deleteDatatypeLabel(row.clasOnum); |
|||
} |
|||
ElMessage.success("删除成功"); |
|||
getList1(); |
|||
} catch { |
|||
ElMessage.error("删除失败，请重试"); |
|||
} |
|||
}); |
|||
} |
|||
|
|||
function handleClose1(done) { |
|||
clasFormRef1.value.resetFields(); |
|||
done(); |
|||
} |
|||
|
|||
// ===== 业务类型弹窗处理 ===== |
|||
function openAddDialog2() { |
|||
title.value = "新增业务类型参数"; |
|||
Object.assign(form2, { |
|||
regexName: "", |
|||
regexPattern: "", |
|||
ratio: null, |
|||
}); |
|||
open2.value = true; |
|||
} |
|||
|
|||
function openEditDialog2(row) { |
|||
if (!row) { |
|||
ElMessage.warning("请选择一条记录进行编辑"); |
|||
return; |
|||
} |
|||
title.value = "编辑业务类型参数"; |
|||
Object.assign(form2, row); |
|||
open2.value = true; |
|||
} |
|||
|
|||
function submitForm2() { |
|||
clasFormRef2.value.validate(async (valid) => { |
|||
if (!valid) return; |
|||
const submitData = { ...form2,ssysCd:queryForm.ssysCd,mdlName:queryForm.mdlName}; |
|||
try { |
|||
if (title.value.includes("新增")) { |
|||
await addBusiLabel(submitData); |
|||
ElMessage.success("新增成功"); |
|||
} else { |
|||
await editBusiLabel(submitData); |
|||
ElMessage.success("编辑成功"); |
|||
} |
|||
open2.value = false; |
|||
getList2(); |
|||
} catch { |
|||
ElMessage.error("操作失败，请重试"); |
|||
} |
|||
}); |
|||
} |
|||
|
|||
function deleteSelected2() { |
|||
if (selectedRows2.value.length === 0) { |
|||
ElMessage.warning("请至少选择一条记录删除"); |
|||
return; |
|||
} |
|||
ElMessageBox.confirm( |
|||
`确定删除选中的 ${selectedRows2.value.length} 条业务类型参数吗？`, |
|||
"提示", |
|||
{ type: "warning" } |
|||
).then(async () => { |
|||
try { |
|||
for (const row of selectedRows2.value) { |
|||
await deleteBusiLabel(row.onum); |
|||
} |
|||
ElMessage.success("删除成功"); |
|||
getList2(); |
|||
} catch { |
|||
ElMessage.error("删除失败，请重试"); |
|||
} |
|||
}); |
|||
} |
|||
|
|||
function handleClose2(done) { |
|||
clasFormRef2.value.resetFields(); |
|||
done(); |
|||
} |
|||
|
|||
onMounted(() => { |
|||
getList1(); |
|||
getList2(); |
|||
}); |
|||
</script> |
|||
Loading…
Reference in new issue