Skip to content

N
nse-ui
Commit fc213e16 by ningjihai
Options

脱敏新增

parent 5897447f
正在显示 包含 273 行增加 和 820 行删除
src/api/desensitizationStrategy/index.js
...@@ -106,4 +106,17 @@ export function desensitizationStrategyDetails(data) { ...@@ -106,4 +106,17 @@ export function desensitizationStrategyDetails(data) {
data: data data: data
}) })
} }
export function save(data) {
return request({
url: '/core/desensitizationStrategy/save',
method: 'post',
data: data
})
}
export function remove(data) {
return request({
url: '/core/desensitizationStrategy/remove',
method: 'post',
data: data
})
}
src/views/desensitizationStrategy/DesensitizationStrategy/list.vue
...@@ -10,7 +10,8 @@ import StrategyAddDialog from './modules/StrategyAddDialog.vue' // 统一对话 ...@@ -10,7 +10,8 @@ import StrategyAddDialog from './modules/StrategyAddDialog.vue' // 统一对话
import { import {
getTableList, getTableList,
queryAll queryAll,
remove
} from '@/api/desensitizationStrategy' } from '@/api/desensitizationStrategy'
const appStore = useAppStore() const appStore = useAppStore()
...@@ -122,7 +123,7 @@ const showDetail = (row) => { ...@@ -122,7 +123,7 @@ const showDetail = (row) => {
dialog.value.type = 'info' dialog.value.type = 'info'
strategyDialogRef.value.openDialog('detail', row) strategyAddDialogRef.value.openDialog('detail', row)
} }
/** /**
...@@ -151,10 +152,13 @@ const deleteStrategy = (row) => { ...@@ -151,10 +152,13 @@ const deleteStrategy = (row) => {
type: 'warning' type: 'warning'
} }
).then(() => { ).then(() => {
deleteStrategyApi(row.id).then(res => { remove({
projectid: sessionStorage.getItem('projectId'),
strategyId: row.strategyId
}).then(res => {
if (res.flag) { if (res.flag) {
ElMessage.success('删除成功') ElMessage.success('删除成功')
getList() // 刷新列表 handleQuery() // 刷新列表
} else { } else {
ElMessage.error(res.msg) ElMessage.error(res.msg)
} }
...@@ -232,8 +236,7 @@ const toggleStatus = (row) => { ...@@ -232,8 +236,7 @@ const toggleStatus = (row) => {
:header-cell-style="{ background: '#f5f7fa', color: '#606266' }" :header-cell-style="{ background: '#f5f7fa', color: '#606266' }"
v-loading="loading" v-loading="loading"
> >
<el-table-column prop="index" label="序号" width="80" align="center" /> <el-table-column prop="strategyName" label="策略名称" min-width="120" fiexd/>
<el-table-column prop="strategyName" label="策略名称" min-width="120" />
<el-table-column prop="remarks" label="备注" min-width="120" show-overflow-tooltip /> <el-table-column prop="remarks" label="备注" min-width="120" show-overflow-tooltip />
<el-table-column prop="createtime" label="创建时间" min-width="180" /> <el-table-column prop="createtime" label="创建时间" min-width="180" />
<el-table-column prop="createuser" label="创建人" width="120" /> <el-table-column prop="createuser" label="创建人" width="120" />
...@@ -244,7 +247,7 @@ const toggleStatus = (row) => { ...@@ -244,7 +247,7 @@ const toggleStatus = (row) => {
</el-tag> </el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" width="280" align="center"> <el-table-column label="操作" width="280" align="center" fixed="right">
<template #default="{ row }"> <template #default="{ row }">
<el-button link type="primary" size="small" @click="showDetail(row)">详情</el-button> <el-button link type="primary" size="small" @click="showDetail(row)">详情</el-button>
<el-divider direction="vertical" /> <el-divider direction="vertical" />
...@@ -270,7 +273,7 @@ const toggleStatus = (row) => { ...@@ -270,7 +273,7 @@ const toggleStatus = (row) => {
</div> </div>
<!-- 统一策略对话框组件 --> <!-- 统一策略对话框组件 -->
<StrategyAddDialog :title="dialog.title" ref="strategyAddDialogRef" @refresh="getList" /> <StrategyAddDialog :title="dialog.title" ref="strategyAddDialogRef" @refresh="handleQuery" />
</div> </div>
</template> </template>
......
src/views/desensitizationStrategy/DesensitizationStrategy/modules/DesensitizationRuleDialog.vue
...@@ -72,6 +72,31 @@ import { ...@@ -72,6 +72,31 @@ import {
const emit = defineEmits(['confirm']) const emit = defineEmits(['confirm'])
const props = defineProps({
// 数据
tschemas: {
type: String,
default: '',
},
// 当前的值
dataTableLabel: [Number, String, Array],
// 当未找到匹配的数据时，显示value
table_field_id: {
type: String,
default: '',
},
dataSystemid: {
type: String,
default: '',
}
})
// 控制弹窗显示 // 控制弹窗显示
const dialogVisible = ref(false) const dialogVisible = ref(false)
...@@ -101,11 +126,6 @@ onMounted(() => { ...@@ -101,11 +126,6 @@ onMounted(() => {
}) })
const loadDataAreaList = () => {
desensitizationruleQuery().then(res=>{
dataAreaList.value = res.data
})
}
// 选择数据域 // 选择数据域
...@@ -123,10 +143,10 @@ const selectRule = (val) => { ...@@ -123,10 +143,10 @@ const selectRule = (val) => {
// 打开弹窗 // 打开弹窗
const open = (fieldData = {}) => { const open = (fieldData = {}) => {
console.log('open',fieldData) console.log('open',fieldData)
loadDataAreaList()
currentFieldData.value = fieldData currentFieldData.value = fieldData
console.log('currentFieldData.value',currentFieldData.value) console.log('currentFieldData.value',currentFieldData.value)
initData(fieldData) initData(currentFieldData.value)
dialogVisible.value = true dialogVisible.value = true
} }
...@@ -137,19 +157,28 @@ const close = () => { ...@@ -137,19 +157,28 @@ const close = () => {
} }
// 初始化数据 // 初始化数据
const initData = (fieldData) => { const initData = (val) => {
desensitizationruleQuery().then(res=>{
dataAreaList.value = res.data
// 如果有传入的字段数据，可以预设选择 // 如果有传入的字段数据，可以预设选择
if (fieldData.dataarea_id) { if (val.dataareanameId) {
// selectedDataArea.value = fieldData.dataarea_id
selectedDataArea.value = dataAreaList.value.find(item => item.id === val.dataareanameId)
console.log('123123',selectedDataArea.value)
// selectedDataArea.value = val.dataarea_id
} }
if (fieldData.rule_id) { if (val.rulenameId && selectedDataArea.value) {
// selectedRule.value = fieldData.rule_id selectedRule.value = selectedDataArea.value.ruleList.find(item => item.id === val.rulenameId)
} }
})
// 如果没有传入数据，重置表单 // 如果没有传入数据，重置表单
// if (!fieldData || Object.keys(fieldData).length === 0) { // if (!fieldData || Object.keys(fieldData).length === 0) {
...@@ -176,16 +205,25 @@ const handleConfirm = () => { ...@@ -176,16 +205,25 @@ const handleConfirm = () => {
return return
} }
console.log('selectedRule',selectedRule.vaue)
emit('confirm', {
selectedDataArea: selectedDataArea.value, let data = {
selectedRule: selectedRule.value, dataSystemid:props.dataSystemid,
fieldData: currentFieldData.value dataareaid: selectedDataArea.value.id,
}) dataareaname: selectedDataArea.value.dataarea,
ruleId: selectedRule.value.id,
rulename: selectedRule.value.rulename,
table_field_id:props.table_field_id,
tschemas:props.tschemas,
names:props.dataTableLabel
}
let str = `${props.tschemas}.${props.dataTableLabel}.${props.table_field_id}`
emit('confirm',str,data)
close() close()
ElMessage.success('脱敏规则设置成功') // ElMessage.success('脱敏规则设置成功')
} }
// 关闭弹窗 // 关闭弹窗
......
src/views/desensitizationStrategy/DesensitizationStrategy/modules/StrategyAddDialog.vue
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
> >
<el-form-item label="策略名称" prop="strategyName" required> <el-form-item label="策略名称" prop="strategyName" required>
<el-input <el-input
:disabled="dialogType === 'detail'"
v-model="formData.strategyName" v-model="formData.strategyName"
placeholder="请输入策略名称" placeholder="请输入策略名称"
maxlength="50" maxlength="50"
...@@ -34,6 +35,7 @@ ...@@ -34,6 +35,7 @@
<el-form-item label="备注" prop="remarks"> <el-form-item label="备注" prop="remarks">
<el-input <el-input
:disabled="dialogType === 'detail'"
v-model="formData.remarks" v-model="formData.remarks"
type="textarea" type="textarea"
:rows="4" :rows="4"
...@@ -106,9 +108,18 @@ ...@@ -106,9 +108,18 @@
<el-button v-if="activeStep === 2" @click="activeStep = 1">上一步</el-button> <el-button v-if="activeStep === 2" @click="activeStep = 1">上一步</el-button>
<el-button <el-button
type="primary" type="primary"
v-if="activeStep === 1"
@click="handleNextStep" @click="handleNextStep"
> >
{{ activeStep === 1 ? '下一步' : '确定' }} 下一步
</el-button>
<el-button
v-if="activeStep === 2"
type="primary"
:loading="saveLoading"
@click="handleNextStep"
>
确定
</el-button> </el-button>
</span> </span>
</template> </template>
...@@ -116,6 +127,10 @@ ...@@ -116,6 +127,10 @@
<DesensitizationRuleDialog <DesensitizationRuleDialog
:dataSystemid="dataSystemid"
:tschemas="schema"
:dataTableLabel="dataTableLabel"
:table_field_id="currentFieldData?.columnname"
ref="desensitizationRuleDialogRef" ref="desensitizationRuleDialogRef"
@confirm="handleRuleConfirm" @confirm="handleRuleConfirm"
/> />
...@@ -133,12 +148,11 @@ queryversion, ...@@ -133,12 +148,11 @@ queryversion,
queryShemas, queryShemas,
queryOriginalList, queryOriginalList,
queryTask, queryTask,
queryProVersion, queryProVersion,
queryTaskVersion, queryTaskVersion,
desensitizationStrategyDetails, desensitizationStrategyDetails,
rowsensitivelevel, save,
queryDesensitizationTables queryDesensitizationTables
} from '@/api/desensitizationStrategy' } from '@/api/desensitizationStrategy'
import { queryTables,query } from '@/api/classification/classification.js' import { queryTables,query } from '@/api/classification/classification.js'
...@@ -303,6 +317,15 @@ const currentNodeLevel = computed(() => { ...@@ -303,6 +317,15 @@ const currentNodeLevel = computed(() => {
const datasystem_id = ref('') const datasystem_id = ref('')
const schema = ref('') const schema = ref('')
const dataBaseLabel = ref('')
const dataTableLabel = ref('')
const dataTableColumnsLabel = ref('')
const dataSystemid = ref('')
const mapData = ref({})
// 监听 currentNodeLevel 和 currentNodeData，一级节点时自动查详情 // 监听 currentNodeLevel 和 currentNodeData，一级节点时自动查详情
watch([currentNodeLevel, currentNodeData], async ([level, node]) => { watch([currentNodeLevel, currentNodeData], async ([level, node]) => {
// if (level === 1 && node && tab === 'basic') { // if (level === 1 && node && tab === 'basic') {
...@@ -314,18 +337,28 @@ watch([currentNodeLevel, currentNodeData], async ([level, node]) => { ...@@ -314,18 +337,28 @@ watch([currentNodeLevel, currentNodeData], async ([level, node]) => {
// } // }
if (level === 1 && node ) { if (level === 1 && node ) {
console.log('level1',node)
datasystem_id.value = node.tid datasystem_id.value = node.tid
dataSystemid.value = node.tid
} }
if (level === 2 && node ) { if (level === 2 && node ) {
console.log('第一层',node) console.log('level2',node)
schema.value = node.value schema.value = node.value
dataBaseLabel.value = node.label
}
if (level === 3 && node ) {
console.log('level3',node)
} }
// 查询表基本信息 // 查询表基本信息
if (level === 4 && node ) { if (level === 4 && node ) {
console.log(node) console.log('level4',node)
dataTableLabel.value = node.label
schema.value = node.parent.parent.value
datasystem_id.value = node.parent.parent.parent.tid
dataSystemid.value = node.parent.parent.parent.tid
tableLoading.value = true
queryOriginalList({ queryOriginalList({
table_name: node.showName, table_name: node.label,
projectId: sessionStorage.getItem('projectId'), projectId: sessionStorage.getItem('projectId'),
datasystem_id: datasystem_id.value, datasystem_id: datasystem_id.value,
schema: schema.value schema: schema.value
...@@ -337,44 +370,152 @@ watch([currentNodeLevel, currentNodeData], async ([level, node]) => { ...@@ -337,44 +370,152 @@ watch([currentNodeLevel, currentNodeData], async ([level, node]) => {
fieldName: item.columnname, fieldName: item.columnname,
comment: item.remarks, comment: item.remarks,
dataareaname:'', dataareaname:'',
rulename: '' dataareanameId: '',
rulename: '',
rulenameId: ''
// dataDomain: item. // dataDomain: item.
}))) })))
tableLoading.value = false
if(mapData.value && dialogType.value === 'addtactics'){
for (const key in mapData.value) {
const item = mapData.value[key];
console.log(`字段键名: ${key}`);
console.log(`数据系统ID: ${item.dataSystemid}`);
console.log(`数据域ID: ${item.dataareaid}`);
console.log(`数据域名称: ${item.dataareaname}`);
console.log(`规则ID: ${item.ruleId}`);
console.log(`规则名称: ${item.rulename}`);
console.log(`表字段ID: ${item.table_field_id}`);
console.log(`模式: ${item.tschemas}`);
console.log(`表名: ${item.names}`);
console.log('----------------------');
console.log('tableData.value',tableData.value)
let index = tableData.value.findIndex(x =>x.fieldName === item.table_field_id)
console.log(index)
if(index !== -1 && datasystem_id.value === item.dataSystemid && schema.value === item.tschemas && dataTableLabel.value === item.names){
tableData.value[index].dataareaname = item.dataareaname
console.log('tableData.value',tableData.value)
tableData.value[index].rulename= item.rulename
tableData.value[index].dataareanameId = item.dataareaid
tableData.value[index].rulenameId = item.ruleId
}
}
}
// if(dialogType.value === 'edit'){
// console.log('infoTable.value',infoTable.value)
// }
}else{ }else{
ElMessage.error(res.msg) ElMessage.error(res.msg)
tableLoading.value = false
tableData.value = []
} }
}).catch(err=>{ }).catch(err=>{
console.log(err)
ElMessage.error(err.msg) ElMessage.error(err.msg)
tableLoading.value = false
tableData.value = []
}) })
} }
console.log('mapData',mapData)
}) })
const selectedDataArea = ref(null) const selectedDataArea = ref(null)
const selectedRule = ref(null) const selectedRule = ref(null)
const handleRuleConfirm = (val) =>{
console.log('fieldData',val.fieldData)
console.log('selectedDataArea',val.selectedDataArea)
console.log('selectedRule',val.selectedRule)
selectedDataArea.value = val.selectedDataArea
selectedRule.value = val.selectedRule
let index = tableData.value.findIndex(item =>item.id === val.fieldData.id)
const handleRuleConfirm = (str,data) =>{
console.log('str',str)
// console.log('selectedDataArea',val.selectedDataArea)
// console.log('selectedRule',val.selectedRule)
// selectedDataArea.value = val.selectedDataArea
// selectedRule.value = val.selectedRule
// let index = tableData.value.findIndex(item =>item.id === val.fieldData.id)
// if(index !== -1){
// console.log('index',index)
// console.log('给table重新赋值')
// tableData.value[index].dataareaname = val.selectedDataArea.dataarea
// tableData.value[index].rulename= val.selectedRule.rulename
// tableData.value[index].dataareanameId = val.selectedDataArea.id
// tableData.value[index].rulenameId = val.selectedRule.id
// dataTableColumnsLabel.value = tableData.value[index].columnname
// }
mapData.value[`${str}`] = data
console.log('mapData11111',mapData.value)
for (const key in mapData.value) {
const item = mapData.value[key];
console.log(`字段键名: ${key}`);
console.log(`数据系统ID: ${item.dataSystemid}`);
console.log(`数据域ID: ${item.dataareaid}`);
console.log(`数据域名称: ${item.dataareaname}`);
console.log(`规则ID: ${item.ruleId}`);
console.log(`规则名称: ${item.rulename}`);
console.log(`表字段ID: ${item.table_field_id}`);
console.log(`模式: ${item.tschemas}`);
console.log(`表名: ${item.names}`);
console.log('----------------------');
console.log('tableData.value',tableData.value)
let index = tableData.value.findIndex(x =>x.fieldName === item.table_field_id)
console.log(index)
if(index !== -1){ if(index !== -1){
console.log('index',index) tableData.value[index].names = item.names
console.log('给table重新赋值') tableData.value[index].dataareaname = item.dataareaname
tableData.value[index].dataareaname = val.selectedDataArea.dataarea console.log('tableData.value',tableData.value)
tableData.value[index].rulename= val.selectedRule.rulename tableData.value[index].rulename= item.rulename
tableData.value[index].dataareanameId = item.dataareaid
tableData.value[index].rulenameId = item.ruleId
}
} }
} }
// 生成唯一标识符 // 生成唯一标识符
function uuid() { function uuid() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) { return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
...@@ -445,15 +586,18 @@ const tableData = ref([]) ...@@ -445,15 +586,18 @@ const tableData = ref([])
const infoTable = ref([]) const infoTable = ref([])
const dialogType = ref('')
// 打开对话框 // 打开对话框
const openDialog = async (mode, strategyData = null) => { const openDialog = async (mode, strategyData = null) => {
dialogType.value = mode
dialogVisible.value = true dialogVisible.value = true
activeStep.value = 1 activeStep.value = 1
selectedVersion.value = '' selectedVersion.value = ''
desensitizationStrategyDetails({ desensitizationStrategyDetails({
strategyId: props.strategyId, strategyId: strategyData ? strategyData.strategyId : '',
projectid: sessionStorage.getItem('projectId') projectid: sessionStorage.getItem('projectId')
}).then(res =>{ }).then(res =>{
if(res.flag){ if(res.flag){
...@@ -494,6 +638,9 @@ const openDialog = async (mode, strategyData = null) => { ...@@ -494,6 +638,9 @@ const openDialog = async (mode, strategyData = null) => {
formData.remarks = strategyData.remarks || '' formData.remarks = strategyData.remarks || ''
} }
// 清空表格数据 // 清空表格数据
tableData.value = [] tableData.value = []
...@@ -517,7 +664,7 @@ const openDialog = async (mode, strategyData = null) => { ...@@ -517,7 +664,7 @@ const openDialog = async (mode, strategyData = null) => {
// 关闭对话框 // 关闭对话框
const handleClose = (done) => { const handleClose = (done) => {
// 如果有未保存的数据，提示用户 // 如果有未保存的数据，提示用户
if (formData.strategyName || formData.remarks) { if ((formData.strategyName || formData.remarks) && dialogType.value !=='detail') {
ElMessageBox.confirm('确定要关闭吗？未保存的数据将会丢失', '提示', { ElMessageBox.confirm('确定要关闭吗？未保存的数据将会丢失', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
...@@ -570,50 +717,41 @@ const handleNextStep = async () => { ...@@ -570,50 +717,41 @@ const handleNextStep = async () => {
await saveStrategy() await saveStrategy()
} }
} }
const saveLoading = ref(false)
// 保存策略 // 保存策略
const saveStrategy = async () => { const saveStrategy = async () => {
saveLoading.value = true
try { try {
// 调用保存API // 动态生成 mapStr 并构建完整对象
const mapStr = `${dataBaseLabel.value}.${dataTableLabel.value}.${dataTableColumnsLabel.value}`;
const params = { const params = {
strategyName: formData.strategyName, strategyName: formData.strategyName,
remarks: formData.remarks, remarks: formData.remarks,
state: "0", state: "0",
strategyId: props.strategyId || '', strategyId: props.strategyId || '',
projectId:sessionStorage.getItem('projectId'), projectId: sessionStorage.getItem('projectId'),
roleGroup: '', roleGroup: '',
map:{ map: mapData.value
};
}
// 其他需要保存的数据
}
// if (props.strategyId) { const res = await save(params);
// params.id = props.strategyId
// }
// const res = await (props.strategyId ? updateStrategy(params) : addStrategy(params))
// if (res.flag) {
ElMessage.success(props.strategyId ? '编辑成功' : '新增成功')
dialogVisible.value = false
emit('refresh')
resetForm()
// } else {
// ElMessage.error(res.msg)
// }
// 模拟API调用 if (res.flag) {
setTimeout(() => { ElMessage.success(props.strategyId ? '编辑成功' : '新增成功');
ElMessage.success(props.strategyId ? '编辑成功' : '新增成功') saveLoading.value = false
dialogVisible.value = false dialogVisible.value = false;
emit('refresh') emit('refresh');
resetForm() resetForm();
}, 500)
} else {
ElMessage.error(res.msg);
saveLoading.value = false
}
} catch (error) { } catch (error) {
ElMessage.error('保存失败') console.log(error);
saveLoading.value = false
ElMessage.error('保存失败');
} }
} }
......
src/views/desensitizationStrategy/DesensitizationStrategy/modules/StrategyAddDialogccc.vue deleted 100644 → 0
<template>
<el-dialog
v-model="dialogVisible"
:title="title"
width="80%"
:before-close="handleClose"
class="strategy-add-dialog"
>
<!-- 步骤指示器 -->
<div class="steps-container">
<el-steps :active="activeStep" align-center>
<el-step title="基本信息" />
<el-step title="规则配置" />
</el-steps>
</div>
<!-- 第一步：基本信息 -->
<div v-if="activeStep === 1" class="step-content">
<el-form
ref="step1FormRef"
:model="formData"
:rules="formRules"
label-width="100px"
label-position="top"
>
<el-form-item label="策略名称" prop="strategyName" required>
<el-input
v-model="formData.strategyName"
placeholder="请输入策略名称"
maxlength="50"
show-word-limit
/>
</el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input
v-model="formData.remarks"
type="textarea"
:rows="4"
placeholder="请输入策略备注信息"
maxlength="200"
show-word-limit
/>
</el-form-item>
</el-form>
</div>
<!-- 第二步：规则配置 -->
<div v-if="activeStep === 2" class="step-content">
<div class="version-select">
<span class="label">根据发现版本设置脱敏:</span>
<span class="label" style="margin-left: 60px;">选择发现版本:</span>
<el-tree-select
v-model="selectedVersion"
:data="editionList"
:props="treeSelectProps"
:load="loadCascader"
lazy
placeholder="选择发现版本"
clearable
style="width: 200px; margin-left: 10px;"
/>
</div>
<div class="config-container">
<!-- 左侧树形结构 -->
<div class="tree-panel">
<el-tree
ref="treeRef"
:data="treeData"
node-key="id"
:props="treeProps"
:expand-on-click-node="false"
:highlight-current="true"
@node-click="handleNodeClick"
>
<template #default="{ node, data }">
<span class="tree-node">
<span class="node-label">{{ node.label }}</span>
<span v-if="data.type === 'database'" class="node-count">({{ data.tableCount }})</span>
</span>
</template>
</el-tree>
</div>
<!-- 右侧表格 -->
<div class="table-panel">
<el-table
:data="tableData"
border
style="width: 100%"
height="100%"
v-loading="tableLoading"
>
<el-table-column prop="id" label="主键" width="80" align="center" />
<el-table-column prop="fieldName" label="字段名" min-width="120" />
<el-table-column prop="comment" label="注释" min-width="150" show-overflow-tooltip />
<el-table-column prop="dataDomain" label="数据域" min-width="120" />
<el-table-column prop="algorithm" label="脱敏算法" min-width="150" />
<el-table-column label="操作" width="120" align="center" fixed="right">
<template #default="{ row }">
<el-button link type="primary" size="small" @click="editField(row)">
编辑
</el-button>
</template>
</el-table-column>
</el-table>
<div v-if="tableData.length === 0 && !tableLoading" class="empty-table">
<el-empty description="暂无数据" />
</div>
</div>
</div>
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="handleCancel">取消</el-button>
<el-button v-if="activeStep === 2" @click="activeStep = 1">上一步</el-button>
<el-button
type="primary"
@click="handleNextStep"
>
{{ activeStep === 1 ? '下一步' : '确定' }}
</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import { ref, reactive, watch, computed, nextTick } from 'vue'
import { ElMessage } from 'element-plus'
import {
desensitizationruleQuery,
queryversion,
queryTask,
queryProVersion,
queryTaskVersion,
tdatasourceQuery,
queryShemas,
rowsensitivelevel,
queryDesensitizationTables
} from '@/api/desensitizationStrategy'
const props = defineProps({
title: {
type: String,
default: '添加策略'
},
strategyId: {
type: String,
default: ''
}
})
const emit = defineEmits(['refresh', 'update:visible'])
const dialogVisible = ref(false)
const activeStep = ref(1)
const selectedVersion = ref('')
const tableLoading = ref(false)
// 表单数据
const formData = reactive({
strategyName: '',
remarks: ''
})
const step1FormRef = ref()
// 表单验证规则
const formRules = {
strategyName: [
{ required: true, message: '请填写策略名称', trigger: 'blur' }
]
}
const treeSelectProps = {
// value: 'value',
// label: 'text',
// children: 'children',
// isLeaf: 'leaf'
}
// 版本选项
const editionList = ref([
{
value: 'none',
label: '无版本'
},
{
value: 'v1',
label: '版本1.0'
},
{
value: 'v2',
label: '版本2.0'
}
])
// 树形数据
const treeData = ref([
{
id: '1',
label: '若依配测2',
type: 'project',
children: [
{
id: '1-1',
label: 'ry',
children: [
{ id: '1-1-1', label: 'gen_table', type: 'table' },
{ id: '1-1-2', label: 'gen_table_column', type: 'table' },
{ id: '1-1-3', label: 'sys_config', type: 'table' }
]
}
]
},
{
id: '2',
label: '若依测试库2',
type: 'project',
children: [
{
id: '2-1',
label: 'ry_test',
type: 'database',
tableCount: 15,
children: [
{ id: '2-1-1', label: 'sys_dept', type: 'table' },
{ id: '2-1-2', label: 'sys_dict_data', type: 'table' },
{ id: '2-1-3', label: 'sys_dict_type', type: 'table' }
]
}
]
}
])
// 表格数据
const tableData = ref([])
// 树形配置
const treeProps = {
// children: 'children',
// label: 'text'
}
const dataAreaInfo = ref({
dataAreaList:[]
})
// 打开对话框
const openDialog = (mode, strategyData = null) => {
dialogVisible.value = true
activeStep.value = 1
selectedVersion.value = ''
desensitizationruleQuery().then(res=>{
dataAreaInfo.value.dataAreaList = res.data
})
queryversion({
projectid: sessionStorage.getItem('projectId')
}).then(res=>{
// editionList.value = res.data
editionList.value = res.data.map(item => {
let res = {
label: item.text,
value: item.value,
children: [],
leaf: item.value === 'null' || item.value === 'AllVersion'
}
!res.leaf && (res.loading = false)
return res
})
editionList.value.splice(1, 2)
console.log(editionList.value)
})
// 重置表单数据
if (mode === 'addtactics') {
formData.strategyName = ''
formData.remarks = ''
} else if (strategyData) {
// 填充编辑数据
formData.strategyName = strategyData.strategyName || ''
formData.remarks = strategyData.remarks || ''
}
// 清空表格数据
tableData.value = []
}
const dblinkname = ref('')
const dataSystem = ref()
const loadNode = (node, resolve, searchData) =>{
if (node.level === 0) {
// 第一级显示数据源
tdatasourceQuery({project_id: sessionStorage.getItem('projectId')}).then(res => {
let data = res.data
dblinkname.vlaue = res.data[0].dblinkname
data.map(item => {
item.level = 1
item.type = 'datasource'
item.label = item.sysname
item.icon = this.DATABASE_ICONS[item.dbtype]
item.expand = true
item.isLeaf = false
item.isshow = false
item.parent = null
})
if (treeData.value.length === 0) {
getTreeData(JSON.parse(JSON.stringify(data)))
}
this.treeNode = node
resolve(data)
})
}
else if (node.level === 1) {
queryShemas({
dataType: node.data.dbtype,
dataSystemId: node.data.tid,
projectid: sessionStorage.getItem('projectId')
}).then(res => {
if (res.data.data && res.data.data.length >= 1) {
let data = res.data.data
dataSystem.value = node.data
let schemaValus = res.data.data.map(item => item.value).join(',')
data.map(item => {
item.type = 'schema'
item.label = item.text
item.dataSystemId = node.data.tid
item.icon = this.DATABASE_ICONS.DATABASE
item.expand = true
item.isLeaf = false
item.isshow = false
item.parent = node.data
})
node.data.resolve = resolve
resolve(data)
let searchData = []
searchWay(res.data.data).then(tabs => {
filterschema.value.forEach(item => {
let index = schemaValus.indexOf(item.value)
if (index !== -1) {
searchData.push(item)
}
})
if (searchData.length >= 1) {
if (node.childNodes && node.childNodes.length >= 1) {
for (let i = node.childNodes.length - 1; i >= 0; i--) {
if (searchData.findIndex(item => item.value === node.childNodes[i].data.value) === -1) {
this.deleteNodeFn(node.data.tid, node.childNodes[i].data.value, node.childNodes[i])
node.childNodes.splice(i, 1)
}
}
}
} else {
if (node.childNodes && node.childNodes.length >= 1) {
for (let i = node.childNodes.length - 1; i >= 0; i--) {
this.deleteNodeFn(node.data.tid, node.childNodes[i].data.value, node.childNodes[i])
node.childNodes.splice(i, 1)
}
}
}
})
}
})
} else if (node.level === 2) {
// 显示 表
dataSystem.value = node.data.parent
node.data.resolve = resolve
resolve([
{
type: 'queryTables',
label: '表',
dataSystemId: node.data.dataSystemId,
icon: this.DATABASE_ICONS.queryTables,
isLeaf: false,
isshow: false,
parent: node.data
}
])
} else if (node.level === 3) {
if (searchData) {
if (resolve) {
resolve(searchData.map(item => {
return {
datasystem_id: node.data.dataSystemId,
label: item,
schema: this.schemaValue,
type: 'table',
icon: this.DATABASE_ICONS.TABLE,
isLeaf: true,
isshow: true,
children: [],
parent: node.data
}
}))
}
} else {
dataSystem.value = node.data.parent.parent
rowsensitivelevel(`${node.data.type}`, {
dataSystemId: node.data.parent.dataSystemId,
schema: node.data.parent.value
}).then(res => {
console.log(res.data.data)
let data = []
this.searchWay([{value: node.data.parent.value}]).then(tabs => {
tabs.forEach(item => {
if (res.data.data.findIndex(i => i.realName === item) !== -1) {
data.push(item)
}
})
console.log(tabs, data)
node.data.resolve = resolve
resolve(data.map(item => {
console.log(item)
return {
datasystem_id: node.data.dataStrueystemId,
label: item,
schema: this.schemaValue,
type: 'table',
// icon: this.DATABASE_ICONS.TABLE,
isLeaf: true,
isshow: false,
children: [],
parent: node.data
}
}))
})
})
}
} else {
resolve([])
}
}
const deleteNodeFn = (tid, schemaValue, schemas) => {
let isrepetition = false
this.deleteNode.forEach(item => {
if (item.tid === tid && item.schema === schemaValue) {
isrepetition = true
item.node = schemas
}
})
if (!isrepetition) {
this.deleteNode.push({
tid,
schema: schemaValue,
schemas
})
}
}
const getTreeData = (data, resolve) => {
treeData.value = data
treeData.value.forEach(item => {
item.data = JSON.parse(JSON.stringify(item))
queryShemas({
dataType: item.dbtype,
dataSystemId: item.tid,
projectid: sessionStorage.getItem('projectId')
}).then(res => {
item.children = res.data.data.filter(re => {
re.isunfold = false
re.isshow = false // 判断schema是否显示
return re
})
item.children.forEach(schema => {
schema.children = [{
type: 'queryTables',
label: '表',
dataSystemId: item.tid,
// icon: this.DATABASE_ICONS.queryTables,
isLeaf: false,
parent: schema,
isunfold: false
}]
})
})
})
}
const isDesensitization = ref('-1')
const tableName = ref('')
const dataArea = ref('-1')
const filterschema = ref([])
const searchWay = async (schema, node) =>{
let data = []
filterschema.value = []
for (let item of schema) {
await queryDesensitizationTables({
dataSystemId: dataSystem.value.tid,
schema: item.value,
state: isDesensitization.value === '-1' ? '' : isDesensitization.value,
tableName: tableName.value,
dataareaid: dataArea.value === '-1' ? '' : dataArea.value,
strategyId: props.strategyId
}).then(res => {
if (res.data && res.data.length >= 1) {
filterschema.value.push(item)
data = res.data
}
})
}
return data
}
// 关闭对话框
const handleClose = (done) => {
// 如果有未保存的数据，提示用户
if (formData.strategyName || formData.remarks) {
ElMessageBox.confirm('确定要关闭吗？未保存的数据将会丢失', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
resetForm()
done()
}).catch(() => {
// 取消关闭
})
} else {
resetForm()
done()
}
}
// 取消操作
const handleCancel = () => {
dialogVisible.value = false
resetForm()
}
// 重置表单
const resetForm = () => {
formData.strategyName = ''
formData.remarks = ''
activeStep.value = 1
selectedVersion.value = ''
tableData.value = []
}
// 下一步操作
const handleNextStep = async () => {
if (activeStep.value === 1) {
// 验证第一步表单
if (step1FormRef.value) {
const formInstance = step1FormRef.value
if (formInstance) {
try {
await formInstance.validate()
activeStep.value = 2
} catch (error) {
ElMessage.error('请填写策略名称')
}
}
}
} else {
// 第二步：保存策略
await saveStrategy()
}
}
// 保存策略
const saveStrategy = async () => {
try {
// 调用保存API
// const params = {
// strategyName: formData.strategyName,
// remarks: formData.remarks,
// version: selectedVersion.value,
// // 其他需要保存的数据
// }
// if (props.strategyId) {
// params.id = props.strategyId
// }
// const res = await (props.strategyId ? updateStrategy(params) : addStrategy(params))
// if (res.flag) {
ElMessage.success(props.strategyId ? '编辑成功' : '新增成功')
dialogVisible.value = false
emit('refresh')
resetForm()
// } else {
// ElMessage.error(res.msg)
// }
// 模拟API调用
setTimeout(() => {
ElMessage.success(props.strategyId ? '编辑成功' : '新增成功')
dialogVisible.value = false
emit('refresh')
resetForm()
}, 500)
} catch (error) {
ElMessage.error('保存失败')
}
}
// 树节点点击事件
const handleNodeClick = (data, node) => {
if (data.type === 'table') {
showTable(data)
}
}
// 显示表格数据
const showTable = async (tableData) => {
tableLoading.value = true
try {
// 调用接口查询表格字段数据
// const res = await getTableFields({
// tableName: tableData.label,
// database: tableData.parent.label,
// project: tableData.parent.parent.label
// })
// if (res.flag) {
// tableData.value = res.data
// } else {
// ElMessage.error(res.msg)
// tableData.value = []
// }
// 模拟数据
setTimeout(() => {
tableData.value = [
{ id: 1, fieldName: 'id', comment: '主键ID', dataDomain: '数字', algorithm: '保留原值' },
{ id: 2, fieldName: 'name', comment: '名称', dataDomain: '文本', algorithm: '部分隐藏' },
{ id: 3, fieldName: 'email', comment: '邮箱地址', dataDomain: '邮箱', algorithm: '完全隐藏' },
{ id: 4, fieldName: 'phone', comment: '手机号码', dataDomain: '手机号', algorithm: '部分隐藏' },
{ id: 5, fieldName: 'create_time', comment: '创建时间', dataDomain: '日期', algorithm: '保留原值' }
]
tableLoading.value = false
}, 500)
} catch (error) {
ElMessage.error('获取表格数据失败')
tableLoading.value = false
}
}
// 编辑字段
const editField = (row) => {
ElMessage.info('编辑字段功能待实现')
}
// 暴露方法给父组件
defineExpose({
openDialog
})
</script>
<style scoped>
.strategy-add-dialog {
:deep(.el-dialog__body) {
padding: 20px;
}
}
.steps-container {
margin-bottom: 30px;
padding: 0 50px;
}
.step-content {
min-height: 400px;
}
.version-select {
margin-bottom: 20px;
display: flex;
align-items: center;
.label {
font-weight: bold;
color: #606266;
}
}
.config-container {
display: flex;
height: 400px;
border: 1px solid #e4e7ed;
border-radius: 4px;
}
.tree-panel {
width: 300px;
border-right: 1px solid #e4e7ed;
padding: 10px;
overflow-y: auto;
}
.table-panel {
flex: 1;
position: relative;
padding: 10px;
}
.empty-table {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.tree-node {
display: flex;
align-items: center;
.node-label {
flex: 1;
}
.node-count {
color: #909399;
font-size: 12px;
margin-left: 8px;
}
}
.dialog-footer {
display: flex;
justify-content: flex-end;
gap: 10px;
}
:deep(.el-form-item__label) {
font-weight: bold;
}
</style>
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论