Skip to content
项目
群组
代码片段
帮助
当前项目
正在载入...
登录 / 注册
切换导航面板
N
nse-ui
概览
Overview
Details
Activity
Cycle Analytics
版本库
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
问题
0
Issues
0
列表
Board
标记
里程碑
合并请求
0
Merge Requests
0
CI / CD
CI / CD
流水线
作业
日程表
图表
维基
Wiki
代码片段
Snippets
成员
Members
Collapse sidebar
Close sidebar
活动
图像
聊天
创建新问题
作业
提交
Issue Boards
Open sidebar
吴超
nse-ui
Commits
fc213e16
Commit
fc213e16
authored
Aug 27, 2025
by
ningjihai
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
脱敏新增
parent
5897447f
隐藏空白字符变更
内嵌
并排
正在显示
5 个修改的文件
包含
281 行增加
和
828 行删除
+281
-828
src/api/desensitizationStrategy/index.js
+14
-1
src/views/desensitizationStrategy/DesensitizationStrategy/list.vue
+11
-8
src/views/desensitizationStrategy/DesensitizationStrategy/modules/DesensitizationRuleDialog.vue
+62
-24
src/views/desensitizationStrategy/DesensitizationStrategy/modules/StrategyAddDialog.vue
+194
-56
src/views/desensitizationStrategy/DesensitizationStrategy/modules/StrategyAddDialogccc.vue
+0
-739
没有找到文件。
src/api/desensitizationStrategy/index.js
View file @
fc213e16
...
...
@@ -106,4 +106,17 @@ export function desensitizationStrategyDetails(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
View file @
fc213e16
...
...
@@ -10,7 +10,8 @@ import StrategyAddDialog from './modules/StrategyAddDialog.vue' // 统一对话
import
{
getTableList
,
queryAll
queryAll
,
remove
}
from
'@/api/desensitizationStrategy'
const
appStore
=
useAppStore
()
...
...
@@ -122,7 +123,7 @@ const showDetail = (row) => {
dialog
.
value
.
type
=
'info'
strategyDialogRef
.
value
.
openDialog
(
'detail'
,
row
)
strategy
Add
DialogRef
.
value
.
openDialog
(
'detail'
,
row
)
}
/**
...
...
@@ -151,10 +152,13 @@ const deleteStrategy = (row) => {
type
:
'warning'
}
).
then
(()
=>
{
deleteStrategyApi
(
row
.
id
).
then
(
res
=>
{
remove
({
projectid
:
sessionStorage
.
getItem
(
'projectId'
),
strategyId
:
row
.
strategyId
}).
then
(
res
=>
{
if
(
res
.
flag
)
{
ElMessage
.
success
(
'删除成功'
)
getList
()
// 刷新列表
handleQuery
()
// 刷新列表
}
else
{
ElMessage
.
error
(
res
.
msg
)
}
...
...
@@ -232,8 +236,7 @@ const toggleStatus = (row) => {
:header-cell-style=
"{ background: '#f5f7fa', color: '#606266' }"
v-loading=
"loading"
>
<el-table-column
prop=
"index"
label=
"序号"
width=
"80"
align=
"center"
/>
<el-table-column
prop=
"strategyName"
label=
"策略名称"
min-width=
"120"
/>
<el-table-column
prop=
"strategyName"
label=
"策略名称"
min-width=
"120"
fiexd
/>
<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=
"createuser"
label=
"创建人"
width=
"120"
/>
...
...
@@ -244,7 +247,7 @@ const toggleStatus = (row) => {
</el-tag>
</
template
>
</el-table-column>
<el-table-column
label=
"操作"
width=
"280"
align=
"center"
>
<el-table-column
label=
"操作"
width=
"280"
align=
"center"
fixed=
"right"
>
<
template
#
default=
"{ row }"
>
<el-button
link
type=
"primary"
size=
"small"
@
click=
"showDetail(row)"
>
详情
</el-button>
<el-divider
direction=
"vertical"
/>
...
...
@@ -270,7 +273,7 @@ const toggleStatus = (row) => {
</div>
<!-- 统一策略对话框组件 -->
<StrategyAddDialog
:title=
"dialog.title"
ref=
"strategyAddDialogRef"
@
refresh=
"
getList
"
/>
<StrategyAddDialog
:title=
"dialog.title"
ref=
"strategyAddDialogRef"
@
refresh=
"
handleQuery
"
/>
</div>
</template>
...
...
src/views/desensitizationStrategy/DesensitizationStrategy/modules/DesensitizationRuleDialog.vue
View file @
fc213e16
...
...
@@ -72,6 +72,31 @@ import {
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
)
...
...
@@ -101,11 +126,6 @@ onMounted(() => {
})
const
loadDataAreaList
=
()
=>
{
desensitizationruleQuery
().
then
(
res
=>
{
dataAreaList
.
value
=
res
.
data
})
}
// 选择数据域
...
...
@@ -123,10 +143,10 @@ const selectRule = (val) => {
// 打开弹窗
const
open
=
(
fieldData
=
{})
=>
{
console
.
log
(
'open'
,
fieldData
)
loadDataAreaList
()
currentFieldData
.
value
=
fieldData
console
.
log
(
'currentFieldData.value'
,
currentFieldData
.
value
)
initData
(
fieldData
)
initData
(
currentFieldData
.
value
)
dialogVisible
.
value
=
true
}
...
...
@@ -137,19 +157,28 @@ const close = () => {
}
// 初始化数据
const
initData
=
(
fieldData
)
=>
{
const
initData
=
(
val
)
=>
{
desensitizationruleQuery
().
then
(
res
=>
{
dataAreaList
.
value
=
res
.
data
// 如果有传入的字段数据,可以预设选择
if
(
val
.
dataareanameId
)
{
selectedDataArea
.
value
=
dataAreaList
.
value
.
find
(
item
=>
item
.
id
===
val
.
dataareanameId
)
console
.
log
(
'123123'
,
selectedDataArea
.
value
)
// selectedDataArea.value = val.dataarea_id
}
if
(
val
.
rulenameId
&&
selectedDataArea
.
value
)
{
selectedRule
.
value
=
selectedDataArea
.
value
.
ruleList
.
find
(
item
=>
item
.
id
===
val
.
rulenameId
)
}
})
// 如果有传入的字段数据,可以预设选择
if
(
fieldData
.
dataarea_id
)
{
// selectedDataArea.value = fieldData.dataarea_id
}
if
(
fieldData
.
rule_id
)
{
// selectedRule.value = fieldData.rule_id
}
// 如果没有传入数据,重置表单
// if (!fieldData || Object.keys(fieldData).length === 0) {
...
...
@@ -175,17 +204,26 @@ const handleConfirm = () => {
ElMessage
.
warning
(
'请选择脱敏规则'
)
return
}
console
.
log
(
'selectedRule'
,
selectedRule
.
vaue
)
emit
(
'confirm'
,
{
selectedDataArea
:
selectedDataArea
.
value
,
selectedRule
:
selectedRule
.
value
,
fieldData
:
currentFieldData
.
value
})
let
data
=
{
dataSystemid
:
props
.
dataSystemid
,
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
()
ElMessage
.
success
(
'脱敏规则设置成功'
)
//
ElMessage.success('脱敏规则设置成功')
}
// 关闭弹窗
...
...
src/views/desensitizationStrategy/DesensitizationStrategy/modules/StrategyAddDialog.vue
View file @
fc213e16
...
...
@@ -25,6 +25,7 @@
>
<el-form-item
label=
"策略名称"
prop=
"strategyName"
required
>
<el-input
:disabled=
"dialogType === 'detail'"
v-model=
"formData.strategyName"
placeholder=
"请输入策略名称"
maxlength=
"50"
...
...
@@ -34,6 +35,7 @@
<el-form-item
label=
"备注"
prop=
"remarks"
>
<el-input
:disabled=
"dialogType === 'detail'"
v-model=
"formData.remarks"
type=
"textarea"
:rows=
"4"
...
...
@@ -106,9 +108,18 @@
<el-button
v-if=
"activeStep === 2"
@
click=
"activeStep = 1"
>
上一步
</el-button>
<el-button
type=
"primary"
v-if=
"activeStep === 1"
@
click=
"handleNextStep"
>
{{
activeStep
===
1
?
'下一步'
:
'确定'
}}
下一步
</el-button>
<el-button
v-if=
"activeStep === 2"
type=
"primary"
:loading=
"saveLoading"
@
click=
"handleNextStep"
>
确定
</el-button>
</span>
</
template
>
...
...
@@ -116,6 +127,10 @@
<DesensitizationRuleDialog
:dataSystemid=
"dataSystemid"
:tschemas=
"schema"
:dataTableLabel=
"dataTableLabel"
:table_field_id=
"currentFieldData?.columnname"
ref=
"desensitizationRuleDialogRef"
@
confirm=
"handleRuleConfirm"
/>
...
...
@@ -133,12 +148,11 @@ queryversion,
queryShemas
,
queryOriginalList
,
queryTask
,
queryProVersion
,
queryTaskVersion
,
desensitizationStrategyDetails
,
rowsensitivelevel
,
save
,
queryDesensitizationTables
}
from
'@/api/desensitizationStrategy'
import
{
queryTables
,
query
}
from
'@/api/classification/classification.js'
...
...
@@ -303,6 +317,15 @@ const currentNodeLevel = computed(() => {
const
datasystem_id
=
ref
(
''
)
const
schema
=
ref
(
''
)
const
dataBaseLabel
=
ref
(
''
)
const
dataTableLabel
=
ref
(
''
)
const
dataTableColumnsLabel
=
ref
(
''
)
const
dataSystemid
=
ref
(
''
)
const
mapData
=
ref
({})
// 监听 currentNodeLevel 和 currentNodeData,一级节点时自动查详情
watch
([
currentNodeLevel
,
currentNodeData
],
async
([
level
,
node
])
=>
{
// if (level === 1 && node && tab === 'basic') {
...
...
@@ -314,18 +337,28 @@ watch([currentNodeLevel, currentNodeData], async ([level, node]) => {
// }
if
(
level
===
1
&&
node
)
{
console
.
log
(
'level1'
,
node
)
datasystem_id
.
value
=
node
.
tid
dataSystemid
.
value
=
node
.
tid
}
if
(
level
===
2
&&
node
)
{
console
.
log
(
'
第一层
'
,
node
)
console
.
log
(
'
level2
'
,
node
)
schema
.
value
=
node
.
value
dataBaseLabel
.
value
=
node
.
label
}
if
(
level
===
3
&&
node
)
{
console
.
log
(
'level3'
,
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
({
table_name
:
node
.
showName
,
table_name
:
node
.
label
,
projectId
:
sessionStorage
.
getItem
(
'projectId'
),
datasystem_id
:
datasystem_id
.
value
,
schema
:
schema
.
value
...
...
@@ -337,44 +370,152 @@ watch([currentNodeLevel, currentNodeData], async ([level, node]) => {
fieldName
:
item
.
columnname
,
comment
:
item
.
remarks
,
dataareaname
:
''
,
rulename
:
''
dataareanameId
:
''
,
rulename
:
''
,
rulenameId
:
''
// 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
{
ElMessage
.
error
(
res
.
msg
)
tableLoading
.
value
=
false
tableData
.
value
=
[]
}
}).
catch
(
err
=>
{
console
.
log
(
err
)
ElMessage
.
error
(
err
.
msg
)
tableLoading
.
value
=
false
tableData
.
value
=
[]
})
}
console
.
log
(
'mapData'
,
mapData
)
})
const
selectedDataArea
=
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
)
if
(
index
!==
-
1
){
console
.
log
(
'index'
,
index
)
console
.
log
(
'给table重新赋值'
)
tableData
.
value
[
index
].
dataareaname
=
val
.
selectedDataArea
.
dataarea
tableData
.
value
[
index
].
rulename
=
val
.
selectedRule
.
rulename
}
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
){
tableData
.
value
[
index
].
names
=
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
}
}
}
// 生成唯一标识符
function
uuid
()
{
return
'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'
.
replace
(
/
[
xy
]
/g
,
function
(
c
)
{
...
...
@@ -445,15 +586,18 @@ const tableData = ref([])
const
infoTable
=
ref
([])
const
dialogType
=
ref
(
''
)
// 打开对话框
const
openDialog
=
async
(
mode
,
strategyData
=
null
)
=>
{
dialogType
.
value
=
mode
dialogVisible
.
value
=
true
activeStep
.
value
=
1
selectedVersion
.
value
=
''
desensitizationStrategyDetails
({
strategyId
:
props
.
strategyId
,
strategyId
:
strategyData
?
strategyData
.
strategyId
:
''
,
projectid
:
sessionStorage
.
getItem
(
'projectId'
)
}).
then
(
res
=>
{
if
(
res
.
flag
){
...
...
@@ -493,6 +637,9 @@ const openDialog = async (mode, strategyData = null) => {
formData
.
strategyName
=
strategyData
.
strategyName
||
''
formData
.
remarks
=
strategyData
.
remarks
||
''
}
// 清空表格数据
tableData
.
value
=
[]
...
...
@@ -517,7 +664,7 @@ const openDialog = async (mode, strategyData = null) => {
// 关闭对话框
const
handleClose
=
(
done
)
=>
{
// 如果有未保存的数据,提示用户
if
(
formData
.
strategyName
||
formData
.
remarks
)
{
if
(
(
formData
.
strategyName
||
formData
.
remarks
)
&&
dialogType
.
value
!==
'detail'
)
{
ElMessageBox
.
confirm
(
'确定要关闭吗?未保存的数据将会丢失'
,
'提示'
,
{
confirmButtonText
:
'确定'
,
cancelButtonText
:
'取消'
,
...
...
@@ -570,50 +717,41 @@ const handleNextStep = async () => {
await
saveStrategy
()
}
}
const
saveLoading
=
ref
(
false
)
// 保存策略
const
saveStrategy
=
async
()
=>
{
saveLoading
.
value
=
true
try
{
// 调用保存API
// 动态生成 mapStr 并构建完整对象
const
mapStr
=
`
${
dataBaseLabel
.
value
}
.
${
dataTableLabel
.
value
}
.
${
dataTableColumnsLabel
.
value
}
`
;
const
params
=
{
strategyName
:
formData
.
strategyName
,
remarks
:
formData
.
remarks
,
state
:
"0"
,
strategyId
:
props
.
strategyId
||
''
,
projectId
:
sessionStorage
.
getItem
(
'projectId'
),
projectId
:
sessionStorage
.
getItem
(
'projectId'
),
roleGroup
:
''
,
map
:{
map
:
mapData
.
value
};
}
const
res
=
await
save
(
params
);
if
(
res
.
flag
)
{
ElMessage
.
success
(
props
.
strategyId
?
'编辑成功'
:
'新增成功'
);
saveLoading
.
value
=
false
dialogVisible
.
value
=
false
;
emit
(
'refresh'
);
resetForm
();
// 其他需要保存的数据
}
else
{
ElMessage
.
error
(
res
.
msg
);
saveLoading
.
value
=
false
}
// 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
(
'保存失败'
)
console
.
log
(
error
);
saveLoading
.
value
=
false
ElMessage
.
error
(
'保存失败'
);
}
}
...
...
src/views/desensitizationStrategy/DesensitizationStrategy/modules/StrategyAddDialogccc.vue
deleted
100644 → 0
View file @
5897447f
<
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
人
到此讨论。请谨慎行事。
请先完成此评论的编辑!
取消
请
注册
或者
登录
后发表评论