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
ec42b0e2
Commit
ec42b0e2
authored
Aug 24, 2025
by
wanglizhen
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
脱敏算法
parent
9d86b124
隐藏空白字符变更
内嵌
并排
正在显示
6 个修改的文件
包含
393 行增加
和
164 行删除
+393
-164
src/api/ruleConfig/algorithm.js
+53
-0
src/components/EditPop/ExpressionEditor.vue
+122
-68
src/views/ruleConfig/Algorithm/index.vue
+76
-39
src/views/ruleConfig/Algorithm/modules/formModule.vue
+124
-35
src/views/ruleConfig/CalculationMethod/index.vue
+17
-18
src/views/ruleConfig/CalculationMethod/modules/formModule.vue
+1
-4
没有找到文件。
src/api/ruleConfig/algorithm.js
View file @
ec42b0e2
...
@@ -11,4 +11,56 @@ export function query(query) {
...
@@ -11,4 +11,56 @@ export function query(query) {
method
:
'get'
,
method
:
'get'
,
params
:
query
params
:
query
})
})
}
/**
* 脱敏算法 - 新增算法
* @param {*} data
* @returns
*/
export
function
save
(
data
)
{
return
request
({
url
:
'/core/desensitizationrule/save'
,
method
:
'post'
,
data
:
data
})
}
/**
* 脱敏算法 - 获取函数列表
* @param {*} query
* @returns
*/
export
function
queryFunctionList
(
query
)
{
return
request
({
url
:
'/core/desensitizationAlgorithm/queryFunctionList'
,
method
:
'get'
,
params
:
query
})
}
/**
* 脱敏算法 - 删除算法
* @param {*} data
* @returns
*/
export
function
del
(
data
)
{
return
request
({
url
:
'/core/desensitizationrule/delete'
,
method
:
'post'
,
data
:
data
})
}
/**
* 脱敏算法 - 测试算法
* @param {*} data
* @returns
*/
export
function
test
(
data
)
{
return
request
({
url
:
'/core/desensitizationrule/test'
,
method
:
'post'
,
data
:
data
})
}
}
\ No newline at end of file
src/components/EditPop/ExpressionEditor.vue
View file @
ec42b0e2
<
script
setup
lang=
"ts"
name=
"ExpressionEditor"
>
<
script
setup
lang=
"ts"
name=
"ExpressionEditor"
>
import
{
ref
,
onMounted
,
toRefs
}
from
"vue"
;
import
{
ref
,
onMounted
,
toRefs
,
watch
,
reactive
}
from
"vue"
;
import
ModalPop
from
"./ModalPop.vue"
import
ModalPop
from
"./ModalPop.vue"
;
import
{
queryFunctionList
,
test
}
from
"@/api/ruleConfig/algorithm"
;
const
props
=
defineProps
<
{
const
props
=
defineProps
<
{
modelValue
:
boolean
;
modelValue
:
boolean
;
data
?:
Object
;
rulename
?:
String
;
}
>
();
}
>
();
const
emit
=
defineEmits
([
"update:modelValue"
,
"confirm"
,
"cancel"
]);
const
emit
=
defineEmits
([
"update:modelValue"
,
"confirm"
,
"cancel"
]);
const
editorName
=
ref
(
""
);
const
editorValue
=
ref
(
""
);
const
editorValue
=
ref
(
""
);
const
infoText
=
ref
(
''
)
const
infoText
=
ref
(
""
);
const
listData
=
ref
([
const
listData
=
ref
([]);
{
const
testVisible
=
ref
(
false
);
name
:
'convert_base1()'
const
testResult
=
ref
(
""
);
// 执行结果
},
const
testData
=
reactive
({
{
expression
:
""
,
name
:
'convert_base2()'
param
:
""
,
}
});
])
// 确认
// 确认
const
confirm
=
()
=>
{
const
confirm
=
()
=>
{
emit
(
"confirm"
,
editorValue
.
value
);
emit
(
"confirm"
,
editorValue
.
value
);
};
};
// 测试
const
test
=
()
=>
{
console
.
log
(
"test"
);
};
const
cancel
=
()
=>
{
const
cancel
=
()
=>
{
editorValue
.
value
=
JSON
.
parse
(
JSON
.
stringify
(
props
.
rulename
));
editorName
.
value
=
JSON
.
parse
(
JSON
.
stringify
(
props
.
rulename
));
emit
(
"cancel"
);
emit
(
"cancel"
);
}
}
;
// 划过事件
// 划过事件
const
hoverFunc
=
(
item
)
=>
{
const
hoverFunc
=
(
item
)
=>
{
infoText
.
value
=
item
;
infoText
.
value
=
item
.
remark
;
}
}
;
const
change
=
(
val
)
=>
{
// 获取函数列表
if
(
!
val
)
return
;
const
getQueryFuncList
=
()
=>
{
console
.
log
(
props
.
data
)
queryFunctionList
({}).
then
((
res
)
=>
{
editorValue
.
value
=
props
.
data
.
name
;
const
{
data
}
=
res
;
listData
.
value
=
data
;
});
};
// 执行测试
const
executeTest
=
()
=>
{
testData
.
expression
=
editorValue
.
value
;
test
(
testData
).
then
((
res
)
=>
{
const
{
flag
,
data
}
=
res
;
if
(
flag
)
{
testResult
.
value
=
data
;
}
});
};
// 测试关闭
const
testCancel
=
()
=>
{
testVisible
.
value
=
false
;
testData
.
param
=
''
testResult
.
value
=
""
;
}
}
watch
(
()
=>
props
.
modelValue
,
(
newVal
)
=>
{
if
(
props
.
modelValue
)
{
getQueryFuncList
();
}
},
{
deep
:
true
,
immediate
:
true
}
);
watch
(
()
=>
props
.
rulename
,
(
newVal
)
=>
{
editorValue
.
value
=
JSON
.
parse
(
JSON
.
stringify
(
props
.
rulename
));
editorName
.
value
=
JSON
.
parse
(
JSON
.
stringify
(
props
.
rulename
));
},
{
deep
:
true
,
immediate
:
true
}
);
</
script
>
</
script
>
<
template
>
<
template
>
<ModalPop
v-model=
"props.modelValue"
title=
"编辑器"
@
cancel=
"cancel"
@
change=
"change"
>
<div>
<template
#
content
>
<ModalPop
v-model=
"props.modelValue"
title=
"编辑器"
@
cancel=
"cancel"
>
<div
class=
"title"
>
算法名称 :
</div>
<template
#
content
>
<div
class=
"content"
>
<div
class=
"title"
>
算法名称 :
{{
editorName
}}
</div>
<div
class=
"content_left"
>
<div
class=
"content"
>
<div
class=
"content_left_tap"
>
函数
</div>
<div
class=
"content_left"
>
<div
class=
"content_left_list"
>
<div
class=
"content_left_tap"
>
函数
</div>
<el-scrollbar
height=
"362px"
>
<div
class=
"content_left_list"
>
<div
class=
"function__item"
@
mouseover=
"hoverFunc(item)"
v-for=
"(item,index) in listData"
:key=
"index"
>
{{
item
.
name
}}
</div>
<el-scrollbar
height=
"362px"
>
</el-scrollbar>
<div
class=
"function__item"
@
mouseover=
"hoverFunc(item)"
v-for=
"(item,index) in listData"
:key=
"index"
>
{{
item
.
name
}}
</div>
</el-scrollbar>
</div>
</div>
</div>
</div>
<div
class=
"content_right"
>
<div
class=
"content_right"
>
<div
class=
"content_right_info"
>
<div
class=
"content_right_info"
>
<div
class=
"content_right_info_title"
>
说明
</div>
<div
class=
"content_right_info_title"
>
说明
</div>
<div
class=
"content_right_info_content"
>
定义:
{{
infoText
}}
</div>
<div
class=
"content_right_info_content"
>
定义:
{{
infoText
}}
</div>
</div>
<div
class=
"content_right_editor"
>
<el-input
type=
"textarea"
placeholder=
"请输入内容"
v-model=
"editorValue"
/>
</div>
</div>
</div>
<div
class=
"content_right_editor"
>
</div>
<el-input
<div
style=
"display: flex; justify-content: center; padding-top: 20px;"
>
type=
"textarea"
<el-button
type=
"primary"
style=
"width: 150px;"
@
click=
"testVisible = true"
>
测试
</el-button>
placeholder=
"请输入内容"
<el-button
type=
"info"
style=
"width: 150px;"
@
click=
"cancel"
>
取消
</el-button>
v-model=
"editorValue"
<el-button
type=
"primary"
style=
"width: 150px;"
@
click=
"confirm"
>
确认
</el-button>
/>
</div>
</
template
>
</ModalPop>
<!-- 测试 -->
<ModalPop
v-model=
"testVisible"
width=
"800px"
title=
"测试"
@
cancel=
"testCancel"
>
<
template
#
content
>
<el-form-item
label=
"输入参数$value的值:"
label-width=
"180px"
prop=
"expression"
>
<div
style=
"width: 100%;display: flex; justify-content: center;"
>
<el-input
placeholder=
"输入参数$value的值"
v-model=
"testData.param"
/>
<el-button
type=
"primary"
style=
"margin-left: 10px;"
@
click=
"executeTest"
>
执行
</el-button>
</div>
</div>
</el-form-item>
<el-form-item
label=
"执行结果:"
label-width=
"180px"
>
<div>
{{
testResult
}}
</div>
</el-form-item>
<div
style=
"display: flex; justify-content: center; padding-top: 20px;"
>
<el-button
type=
"primary"
style=
"width: 150px;"
@
click=
"testCancel"
>
关闭
</el-button>
</div>
</div>
</div>
</
template
>
<div
style=
"display: flex; justify-content: center; padding-top: 20px;"
>
</ModalPop>
<el-button
type=
"primary"
style=
"width: 150px;"
@
click=
"test"
>
测试
</el-button>
</div>
<el-button
type=
"info"
style=
"width: 150px;"
@
click=
"cancel"
>
取消
</el-button>
<el-button
type=
"primary"
style=
"width: 150px;"
@
click=
"confirm"
>
确认
</el-button>
</div>
</
template
>
</ModalPop>
</template>
</template>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.title
{
.title
{
height
:
32px
;
line-height
:
32px
;
height
:
32px
;
line-height
:
32px
;
}
}
.content
{
.content
{
display
:
flex
;
display
:
flex
;
height
:
400px
;
height
:
400px
;
width
:
100%
;
width
:
100%
;
&_left{
&_left
{
height
:
100%
;
height
:
100%
;
width
:
322px
;
width
:
322px
;
border-width
:
1px
;
border-width
:
1px
;
border-style
:
solid
;
border-style
:
solid
;
border-color
:
rgb
(
220
,
229
,
235
);
border-color
:
rgb
(
220
,
229
,
235
);
border-image
:
initial
;
border-image
:
initial
;
&_tap{
&_tap
{
height
:
36px
;
height
:
36px
;
line-height
:
36px
;
line-height
:
36px
;
font-size
:
14px
;
font-size
:
14px
;
...
@@ -106,46 +160,46 @@ const change = (val) => {
...
@@ -106,46 +160,46 @@ const change = (val) => {
padding-left
:
20px
;
padding-left
:
20px
;
color
:
rgb
(
44
,
158
,
247
);
color
:
rgb
(
44
,
158
,
247
);
}
}
&
_list
{
&
_list
{
height
:
100%
;
height
:
100%
;
.function__item{
.function__item
{
padding-left
:
20px
;
padding-left
:
20px
;
cursor
:
pointer
;
cursor
:
pointer
;
color
:
#7
A
8596
;
color
:
#7
a
8596
;
}
}
.function__item
:hover
{
.function__item
:hover
{
background
:
rgb
(
243
,
245
,
250
);
background
:
rgb
(
243
,
245
,
250
);
}
}
}
}
}
}
&
_right
{
&
_right
{
margin-left
:
10px
;
margin-left
:
10px
;
height
:
100%
;
height
:
100%
;
flex
:
1
;
flex
:
1
;
&_info{
&_info
{
height
:
146px
;
height
:
146px
;
border-style
:
solid
;
border-style
:
solid
;
border-color
:
rgb
(
220
,
229
,
235
);
border-color
:
rgb
(
220
,
229
,
235
);
border-image
:
initial
;
border-image
:
initial
;
border-width
:
1px
1px
0px
;
border-width
:
1px
1px
0px
;
padding
:
0px
20px
;
padding
:
0px
20px
;
&_title{
&_title
{
height
:
42px
;
height
:
42px
;
line-height
:
42px
;
line-height
:
42px
;
color
:
rgb
(
122
,
132
,
149
);
color
:
rgb
(
122
,
132
,
149
);
font-size
:
14px
;
font-size
:
14px
;
font-weight
:
700
;
font-weight
:
700
;
}
}
&
_content
{
&
_content
{
margin-top
:
-4px
;
margin-top
:
-4px
;
color
:
rgb
(
122
,
132
,
149
);
color
:
rgb
(
122
,
132
,
149
);
font-size
:
12px
;
font-size
:
12px
;
word-break
:
break-all
;
word-break
:
break-all
;
}
}
}
}
&
_editor
{
&
_editor
{
width
:
100%
;
width
:
100%
;
:deep(.el-textarea__inner){
:deep(.el-textarea__inner)
{
box-sizing
:
border-box
!important
;
box-sizing
:
border-box
!important
;
height
:
254px
!important
;
height
:
254px
!important
;
min-height
:
254px
!important
;
min-height
:
254px
!important
;
...
...
src/views/ruleConfig/Algorithm/index.vue
View file @
ec42b0e2
<
script
setup
name=
"Algorithm"
>
<
script
setup
name=
"Algorithm"
>
import
{
onMounted
,
ref
,
toRefs
}
from
'vue'
import
{
onMounted
,
ref
,
toRefs
}
from
'vue'
import
{
Split
}
from
'view-ui-plus'
;
import
{
Split
}
from
'view-ui-plus'
;
import
{
ElMessage
}
from
"element-plus"
;
import
CollapseView
from
'@/components/CollapseView/index.vue'
import
CollapseView
from
'@/components/CollapseView/index.vue'
import
formModule
from
'./modules/formModule.vue'
import
formModule
from
'./modules/formModule.vue'
import
ModalPop
from
"@/components/EditPop/ModalPop.vue"
import
ModalPop
from
"@/components/EditPop/ModalPop.vue"
import
{
query
}
from
'@/api/ruleConfig/algorithm.js'
import
{
query
,
del
}
from
'@/api/ruleConfig/algorithm.js'
const
splitNum
=
ref
(
0.31
)
// 左右分割比例
const
splitNum
=
ref
(
0.31
)
// 左右分割比例
const
collapseList
=
ref
([])
const
collapseList
=
ref
([])
const
rulenameList
=
ref
([])
// 规则名称列表
const
searchValue
=
ref
(
''
)
const
searchValue
=
ref
(
''
)
const
data
=
reactive
({
const
data
=
reactive
({
formEdit
:
{
addForm
:
{},
name
:
""
,
editForm
:
{},
},
delData
:
{
formAdd
:
{
id
:
''
name
:
""
,
}
}
});
});
const
{
formEdit
,
formAdd
}
=
toRefs
(
data
);
const
{
addForm
,
editForm
,
delData
}
=
toRefs
(
data
);
const
modalData
=
reactive
({
const
modalData
=
reactive
({
show
:
false
,
show
:
false
,
...
@@ -33,26 +34,40 @@ const modalData = reactive({
...
@@ -33,26 +34,40 @@ const modalData = reactive({
const
modalPopShow
=
ref
(
false
)
const
modalPopShow
=
ref
(
false
)
// 获取数据
// 获取数据
const
getCollapse
=
()
=>
{
const
getCollapse
=
(
type
)
=>
{
query
({
dataarea
:
searchValue
.
value
}).
then
(
res
=>
{
query
({
dataarea
:
searchValue
.
value
}).
then
(
res
=>
{
const
{
data
}
=
res
collapseList
.
value
=
data
.
map
(
item
=>
{
const
list
=
item
.
ruleList
.
map
(
itemTwo
=>
{
rulenameList
.
value
.
push
(
itemTwo
.
rulename
)
return
{
...
itemTwo
,
name
:
itemTwo
.
rulename
,
defaulttype
:
itemTwo
.
defaluttype
,
isCheck
:
false
,
isDelete
:
true
,
}
})
return
{
...
item
,
list
:
list
,
isAdd
:
true
,
isView
:
false
,
isDelete
:
false
,
}
})
if
(
type
===
'edit'
)
return
if
(
collapseList
.
value
.
length
<=
0
)
return
if
(
collapseList
.
value
[
0
].
ruleList
.
length
>
0
)
{
editForm
.
value
=
collapseList
.
value
[
0
].
ruleList
[
0
]
}
else
{
const
{
id
}
=
collapseList
.
value
[
0
]
editForm
.
value
=
{
dataarea_id
:
id
}
}
})
})
// collapseList.value = data.map(item => {
// const list = item.list.map(itemTwo => {
// return {
// ...itemTwo,
// isCheck: false,
// isDelete: true,
// }
// })
// return {
// ...item,
// list: list,
// isAdd: true,
// isView: false,
// isDelete: false,
// }
// })
}
}
// 新增算法关闭
// 新增算法关闭
...
@@ -62,32 +77,50 @@ const modalPopCancel = () => {
...
@@ -62,32 +77,50 @@ const modalPopCancel = () => {
// 新增算法
// 新增算法
const
collapseAdd
=
(
item
)
=>
{
const
collapseAdd
=
(
item
)
=>
{
console
.
log
(
'添加事件'
,
item
)
// console.log('添加事件', item)
formAdd
.
value
=
{}
const
{
id
}
=
item
addForm
.
value
=
{
dataarea_id
:
id
}
modalPopShow
.
value
=
true
modalPopShow
.
value
=
true
}
}
// 删除事件
// 删除事件
const
collapseDelete
=
(
item
)
=>
{
const
collapseDelete
=
(
item
)
=>
{
console
.
log
(
'删除事件'
,
item
)
// console.log('删除事件', item)
const
{
rulename
}
=
item
delData
.
value
=
item
modalData
.
show
=
true
modalData
.
show
=
true
modalData
.
icon
=
'error'
modalData
.
icon
=
'error'
modalData
.
text
=
'删除后无法恢复,是否确认删除['
+
item
.
name
+
']?'
modalData
.
text
=
'删除后无法恢复,是否确认删除['
+
rule
name
+
']?'
}
}
// 删除回调
// 删除回调
const
modalConfirm
=
()
=>
{
const
modalConfirm
=
()
=>
{
modalData
.
show
=
false
const
{
id
}
=
delData
.
value
const
data
=
{
ruleId
:
id
}
del
(
data
).
then
(
res
=>
{
const
{
flag
}
=
res
if
(
flag
)
{
ElMessage
.
success
(
'删除成功'
)
getCollapse
()
modalData
.
show
=
false
}
else
{
ElMessage
.
error
(
'删除失败'
)
}
})
}
}
// 点击监听
// 点击监听
const
collapseChange
=
(
item
)
=>
{
const
collapseChange
=
(
item
)
=>
{
formEdit
.
value
=
item
editForm
.
value
=
item
.
item
}
}
// 算法确认
// 算法确认
const
formModuleConfirm
=
(
item
)
=>
{
const
formModuleConfirm
=
(
val
)
=>
{
console
.
log
(
'新增算法'
,
item
)
getCollapse
(
val
)
modalPopShow
.
value
=
false
modalPopShow
.
value
=
false
}
}
...
@@ -106,7 +139,7 @@ onMounted(() => {
...
@@ -106,7 +139,7 @@ onMounted(() => {
<div
class=
"app-container__body"
>
<div
class=
"app-container__body"
>
<Split
v-model=
"splitNum"
>
<Split
v-model=
"splitNum"
>
<
template
#
left
>
<
template
#
left
>
<div
class=
"demo-split-pane"
style=
"padding: 0 38px 10px 0;width: 100%;overflow: auto;height: 100%;"
>
<div
class=
"demo-split-pane"
style=
"padding: 0 38px 10px 0;width: 100%;overflow: auto;height: 100%;
display: flex;flex-direction: column;
"
>
<el-input
class=
"mb20"
v-model=
"searchValue"
placeholder=
"脱敏规则搜索"
>
<el-input
class=
"mb20"
v-model=
"searchValue"
placeholder=
"脱敏规则搜索"
>
<template
#
suffix
>
<template
#
suffix
>
<el-icon
style=
"vertical-align: middle;cursor: pointer;"
@
click=
"getCollapse"
>
<el-icon
style=
"vertical-align: middle;cursor: pointer;"
@
click=
"getCollapse"
>
...
@@ -114,7 +147,10 @@ onMounted(() => {
...
@@ -114,7 +147,10 @@ onMounted(() => {
</el-icon>
</el-icon>
</
template
>
</
template
>
</el-input>
</el-input>
<CollapseView
:list=
"collapseList"
@
add=
"collapseAdd"
@
childDelete=
"collapseDelete"
@
change=
"collapseChange"
/>
<el-scrollbar
style=
"width: 100%;flex: 1;padding-right: 38px;"
>
<CollapseView
:list=
"collapseList"
@
add=
"collapseAdd"
@
childDelete=
"collapseDelete"
@
change=
"collapseChange"
/>
</el-scrollbar>
</div>
</div>
</template>
</template>
<
template
#
right
>
<
template
#
right
>
...
@@ -127,7 +163,7 @@ onMounted(() => {
...
@@ -127,7 +163,7 @@ onMounted(() => {
<span
style=
"margin-left: 5px;"
>
脱敏规则
</span>
<span
style=
"margin-left: 5px;"
>
脱敏规则
</span>
</div>
</div>
<div
class=
"right-content"
>
<div
class=
"right-content"
>
<formModule
v-model=
"formEdit"
type=
"edit
"
/>
<formModule
:itemData=
"editForm"
:nameList=
"rulenameList"
type=
"edit"
@
confirm=
"formModuleConfirm
"
/>
</div>
</div>
</div>
</div>
</div>
</div>
...
@@ -139,9 +175,10 @@ onMounted(() => {
...
@@ -139,9 +175,10 @@ onMounted(() => {
@
confirm=
"modalConfirm"
></Modal>
@
confirm=
"modalConfirm"
></Modal>
<!-- 新增算法 -->
<!-- 新增算法 -->
<ModalPop
v-model=
"modalPopShow"
title=
"
编辑器
"
@
cancel=
"modalPopCancel"
>
<ModalPop
v-model=
"modalPopShow"
title=
"
新增算法
"
@
cancel=
"modalPopCancel"
>
<
template
#
content
>
<
template
#
content
>
<formModule
v-model=
"formAdd"
type=
"add"
@
cancel=
"modalPopCancel"
@
confirm=
"formModuleConfirm"
/>
<formModule
:itemData=
"addForm"
:nameList=
"rulenameList"
type=
"add"
@
cancel=
"modalPopCancel"
@
confirm=
"formModuleConfirm"
/>
</
template
>
</
template
>
</ModalPop>
</ModalPop>
</div>
</div>
...
...
src/views/ruleConfig/Algorithm/modules/formModule.vue
View file @
ec42b0e2
<
script
setup
lang=
"ts"
name=
"Form"
>
<
script
setup
lang=
"ts"
name=
"Form"
>
import
{
onMounted
,
reactive
,
ref
,
toRefs
,
watch
}
from
"vue"
;
import
{
onMounted
,
reactive
,
ref
,
toRefs
,
watch
}
from
"vue"
;
import
{
Switch
}
from
"view-ui-plus"
;
import
{
Switch
}
from
"view-ui-plus"
;
import
ExpressionEditor
from
'@/components/EditPop/ExpressionEditor.vue'
import
type
{
FormInstance
}
from
"element-plus"
;
import
{
ElMessage
}
from
"element-plus"
;
import
ExpressionEditor
from
"@/components/EditPop/ExpressionEditor.vue"
;
import
{
save
}
from
"@/api/ruleConfig/algorithm"
;
const
props
=
defineProps
<
{
const
props
=
defineProps
<
{
modelValue
:
boolean
;
itemData
:
Object
;
type
:
string
;
type
:
string
;
nameList
:
any
;
}
>
();
}
>
();
const
emit
=
defineEmits
([
"
update:modelValue"
,
'cancel'
,
'confirm'
]);
const
emit
=
defineEmits
([
"
cancel"
,
"confirm"
]);
const
data
=
reactive
({
const
data
=
reactive
({
rules
:
{},
form
:
<
any
>
{
dataarea_id
:
""
,
defaluttype
:
"0"
,
expression
:
""
,
id
:
""
,
rulename
:
""
,
rulesource
:
""
,
},
rules
:
{
expression
:
[
{
required
:
true
,
message
:
"请输入表达式"
,
trigger
:
[
"blur"
],
},
],
},
});
});
const
{
rules
}
=
toRefs
(
data
);
const
{
form
,
rules
}
=
toRefs
(
data
);
const
editorShow
=
ref
(
false
);
const
editorShow
=
ref
(
false
);
const
readOnly
=
ref
(
true
);
const
readOnly
=
ref
(
true
);
const
editor
=
ref
({});
const
editor
=
ref
({});
const
rulenameList
=
ref
([])
const
formRef
=
ref
<
FormInstance
>
();
watch
(
// 重置
()
=>
props
.
type
,
const
reset
=
()
=>
{
(
newVal
)
=>
{
form
.
value
=
{
readOnly
.
value
=
props
.
type
===
'edit'
?
true
:
false
;
dataarea_id
:
""
,
},
defaulttype
:
"0"
,
{
deep
:
true
,
immediate
:
true
}
enc_name
:
""
,
);
encryption_id
:
""
,
secretkey_id
:
""
,
};
};
// 打开编辑器
// 打开编辑器
const
openEditor
=
()
=>
{
const
openEditor
=
()
=>
{
editorShow
.
value
=
true
editorShow
.
value
=
true
;
editor
.
value
=
props
.
modelValue
editor
.
value
=
form
.
value
.
expression
;
}
}
;
// 取消
// 取消
const
cancel
=
()
=>
{
const
cancel
=
()
=>
{
if
(
props
.
type
===
'edit'
)
{
if
(
props
.
type
===
"edit"
)
{
readOnly
.
value
=
true
readOnly
.
value
=
true
;
}
else
if
(
props
.
type
===
'add'
)
{
const
data
=
JSON
.
parse
(
JSON
.
stringify
(
props
.
itemData
));
emit
(
'cancel'
)
form
.
value
=
{
...
form
.
value
,
...
data
};
}
else
if
(
props
.
type
===
"add"
)
{
emit
(
"cancel"
);
}
}
}
}
;
const
confirm
=
()
=>
{
const
confirm
=
()
=>
{
if
(
props
.
type
===
'edit'
)
{
formRef
.
value
?.
validate
((
valid
)
=>
{
readOnly
.
value
=
true
if
(
valid
)
{
saveFunc
();
}
else
{
}
});
};
const
saveFunc
=
()
=>
{
if
(
props
.
type
===
"edit"
)
{
form
.
value
=
{
...
form
.
value
,
...{
id
:
form
.
value
.
id
}
};
}
}
emit
(
'confirm'
)
save
(
form
.
value
).
then
((
res
)
=>
{
}
const
{
flag
}
=
res
;
if
(
flag
)
{
ElMessage
.
success
(
props
.
type
===
"add"
||
!
form
.
value
.
id
?
"新增成功"
:
"修改成功"
);
if
(
props
.
type
===
"edit"
)
{
readOnly
.
value
=
true
;
}
else
if
(
props
.
type
===
"add"
)
{
reset
();
}
emit
(
"confirm"
,
props
.
type
);
}
});
};
// 算法名称验证
const
validateRulename
=
(
rule
,
value
,
callback
)
=>
{
if
(
form
.
value
.
id
)
{
callback
();
return
false
;
}
const
state
=
rulenameList
.
value
.
includes
(
value
);
if
(
state
)
{
callback
(
new
Error
(
'算法名称已存在'
));
}
else
{
callback
();
}
};
// 编辑器确认
// 编辑器确认
const
formConfirm
=
(
val
)
=>
{
const
formConfirm
=
(
val
)
=>
{
editorShow
.
value
=
false
editorShow
.
value
=
false
;
props
.
modelValue
.
name
=
val
form
.
value
.
expression
=
val
;
}
}
;
watch
(
()
=>
props
.
type
,
(
newVal
)
=>
{
readOnly
.
value
=
props
.
type
===
"edit"
?
true
:
false
;
},
{
deep
:
true
,
immediate
:
true
}
);
watch
(
()
=>
props
.
itemData
,
(
newVal
)
=>
{
if
(
props
.
itemData
)
{
const
data
=
JSON
.
parse
(
JSON
.
stringify
(
props
.
itemData
));
form
.
value
=
{
...
form
.
value
,
...
data
};
}
},
{
deep
:
true
,
immediate
:
true
}
);
watch
(
()
=>
props
.
nameList
,
(
newVal
)
=>
{
rulenameList
.
value
=
props
.
nameList
;
},
{
deep
:
true
,
immediate
:
true
}
);
</
script
>
</
script
>
<
template
>
<
template
>
<div>
<div>
<el-form
ref=
"formRef"
:model=
"modelValue"
label-width=
"100px"
:disabled=
"readOnly"
>
<el-form
ref=
"formRef"
:model=
"form"
:rules=
"rules"
label-width=
"100px"
:disabled=
"readOnly"
>
<el-form-item
label=
"算法名称"
required
>
<el-form-item
label=
"算法名称"
prop=
"rulename"
required
<el-input
v-model=
"modelValue.name"
></el-input>
:rules=
"[
{ required: true, message: '请输入算法名称', trigger:'blur' },{ required: true, validator: validateRulename, trigger:'blur' }]">
<el-input
v-model=
"form.rulename"
></el-input>
</el-form-item>
</el-form-item>
<el-form-item
label=
"表达式"
required
>
<el-form-item
label=
"表达式"
prop=
"expression"
required
>
<el-input
type=
"textarea"
rows=
"8"
v-model=
"
modelValue.name
"
></el-input>
<el-input
type=
"textarea"
rows=
"8"
v-model=
"
form.expression
"
></el-input>
<el-button
class=
"openEditor"
type=
"primary"
@
click=
"openEditor"
>
打开编辑器
</el-button>
<el-button
class=
"openEditor"
type=
"primary"
@
click=
"openEditor"
>
打开编辑器
</el-button>
</el-form-item>
</el-form-item>
<el-form-item
label=
"默认规则"
>
<el-form-item
label=
"默认规则"
>
<Switch
:disabled=
"readOnly"
>
<Switch
true-value=
"1"
false-value=
"0"
v-model=
"form.defaluttype"
:disabled=
"readOnly"
>
<template
#
open
>
<template
#
open
>
<span>
是
</span>
<span>
是
</span>
</
template
>
</
template
>
...
@@ -86,7 +175,7 @@ const formConfirm = (val) => {
...
@@ -86,7 +175,7 @@ const formConfirm = (val) => {
<el-button
type=
"primary"
style=
"width: 150px;"
@
click=
"confirm"
v-if=
"!readOnly"
>
确认
</el-button>
<el-button
type=
"primary"
style=
"width: 150px;"
@
click=
"confirm"
v-if=
"!readOnly"
>
确认
</el-button>
</div>
</div>
<ExpressionEditor
v-model=
"editorShow"
:
data
=
"editor"
@
cancel=
" editorShow = false"
@
confirm=
"formConfirm"
/>
<ExpressionEditor
v-model=
"editorShow"
:
rulename
=
"editor"
@
cancel=
" editorShow = false"
@
confirm=
"formConfirm"
/>
</div>
</div>
</template>
</template>
...
...
src/views/ruleConfig/CalculationMethod/index.vue
View file @
ec42b0e2
...
@@ -14,9 +14,8 @@ const collapseList = ref([])
...
@@ -14,9 +14,8 @@ const collapseList = ref([])
const
encryptionList
=
ref
([])
// 加密规则列表
const
encryptionList
=
ref
([])
// 加密规则列表
const
data
=
reactive
({
const
data
=
reactive
({
formData
:
{
addForm
:
{},
name
:
""
,
editForm
:
{},
},
queryParams
:
{
queryParams
:
{
dataarea
:
''
dataarea
:
''
},
},
...
@@ -25,7 +24,7 @@ const data = reactive({
...
@@ -25,7 +24,7 @@ const data = reactive({
}
}
});
});
const
{
formData
,
queryParams
,
delData
}
=
toRefs
(
data
);
const
{
addForm
,
editForm
,
queryParams
,
delData
}
=
toRefs
(
data
);
const
modalData
=
reactive
({
const
modalData
=
reactive
({
show
:
false
,
show
:
false
,
...
@@ -37,7 +36,7 @@ const modalData = reactive({
...
@@ -37,7 +36,7 @@ const modalData = reactive({
const
modalPopShow
=
ref
(
false
)
const
modalPopShow
=
ref
(
false
)
// 获取数据
// 获取数据
const
getCollapse
=
()
=>
{
const
getCollapse
=
(
type
)
=>
{
query
(
queryParams
.
value
).
then
(
res
=>
{
query
(
queryParams
.
value
).
then
(
res
=>
{
const
{
data
}
=
res
const
{
data
}
=
res
collapseList
.
value
=
data
.
map
(
item
=>
{
collapseList
.
value
=
data
.
map
(
item
=>
{
...
@@ -57,14 +56,15 @@ const getCollapse = () => {
...
@@ -57,14 +56,15 @@ const getCollapse = () => {
isDelete
:
false
,
isDelete
:
false
,
}
}
})
})
if
(
type
===
'edit'
)
return
if
(
collapseList
.
value
.
length
<=
0
)
return
if
(
collapseList
.
value
.
length
<=
0
)
return
if
(
collapseList
.
value
[
0
].
secretkeyList
.
length
>
0
)
{
if
(
collapseList
.
value
[
0
].
secretkeyList
.
length
>
0
)
{
formData
.
value
=
{
editForm
.
value
=
{
dataarea_id
:
collapseList
.
value
[
0
].
id
,
dataarea_id
:
collapseList
.
value
[
0
].
id
,
...
collapseList
.
value
[
0
].
secretkeyList
[
0
]
...
collapseList
.
value
[
0
].
secretkeyList
[
0
]
}
}
}
else
{
}
else
{
formData
.
value
=
{
editForm
.
value
=
{
dataarea_id
:
collapseList
.
value
[
0
].
id
dataarea_id
:
collapseList
.
value
[
0
].
id
}
}
}
}
...
@@ -80,7 +80,7 @@ const modalPopCancel = () => {
...
@@ -80,7 +80,7 @@ const modalPopCancel = () => {
const
collapseAdd
=
(
item
)
=>
{
const
collapseAdd
=
(
item
)
=>
{
// console.log('添加事件', item)
// console.log('添加事件', item)
const
{
id
}
=
item
const
{
id
}
=
item
formData
.
value
=
{
addForm
.
value
=
{
dataarea_id
:
id
dataarea_id
:
id
}
}
modalPopShow
.
value
=
true
modalPopShow
.
value
=
true
...
@@ -88,7 +88,7 @@ const collapseAdd = (item) => {
...
@@ -88,7 +88,7 @@ const collapseAdd = (item) => {
// 删除事件
// 删除事件
const
collapseDelete
=
(
item
)
=>
{
const
collapseDelete
=
(
item
)
=>
{
console
.
log
(
'删除事件'
,
item
)
//
console.log('删除事件', item)
const
{
name
}
=
item
const
{
name
}
=
item
delData
.
value
=
item
delData
.
value
=
item
modalData
.
show
=
true
modalData
.
show
=
true
...
@@ -112,21 +112,20 @@ const modalConfirm = () => {
...
@@ -112,21 +112,20 @@ const modalConfirm = () => {
ElMessage
.
error
(
'删除失败'
)
ElMessage
.
error
(
'删除失败'
)
}
}
})
})
}
}
// 点击监听
// 点击监听
const
collapseChange
=
(
item
)
=>
{
const
collapseChange
=
(
item
)
=>
{
console
.
log
(
'修改事件'
,
item
)
//
console.log('修改事件', item)
formData
.
value
=
{
editForm
.
value
=
{
...
item
.
item
...
item
.
item
}
}
}
}
// 算法确认
// 算法确认
const
formModuleConfirm
=
(
item
)
=>
{
const
formModuleConfirm
=
(
val
)
=>
{
console
.
log
(
'新增算法'
,
item
)
// console.log('新增算法', val
)
getCollapse
()
getCollapse
(
val
)
modalPopShow
.
value
=
false
modalPopShow
.
value
=
false
}
}
...
@@ -183,7 +182,7 @@ onMounted(() => {
...
@@ -183,7 +182,7 @@ onMounted(() => {
<span
style=
"margin-left: 5px;"
>
加密算法
</span>
<span
style=
"margin-left: 5px;"
>
加密算法
</span>
</div>
</div>
<div
class=
"right-content"
>
<div
class=
"right-content"
>
<formModule
:itemData=
"
formData
"
:encryptionDict=
"encryptionList"
type=
"edit"
@
cancel=
"modalPopCancel"
<formModule
:itemData=
"
editForm
"
:encryptionDict=
"encryptionList"
type=
"edit"
@
cancel=
"modalPopCancel"
@
confirm=
"formModuleConfirm"
/>
@
confirm=
"formModuleConfirm"
/>
</div>
</div>
</div>
</div>
...
@@ -196,9 +195,9 @@ onMounted(() => {
...
@@ -196,9 +195,9 @@ onMounted(() => {
@
confirm=
"modalConfirm"
></Modal>
@
confirm=
"modalConfirm"
></Modal>
<!-- 新增加密算法 -->
<!-- 新增加密算法 -->
<ModalPop
v-model=
"modalPopShow"
title=
"
编辑器
"
@
cancel=
"modalPopCancel"
>
<ModalPop
v-model=
"modalPopShow"
title=
"
新增加密算法
"
@
cancel=
"modalPopCancel"
>
<
template
#
content
>
<
template
#
content
>
<formModule
:itemData=
"
formData
"
:encryptionDict=
"encryptionList"
type=
"add"
@
cancel=
"modalPopCancel"
<formModule
:itemData=
"
addForm
"
:encryptionDict=
"encryptionList"
type=
"add"
@
cancel=
"modalPopCancel"
@
confirm=
"formModuleConfirm"
/>
@
confirm=
"formModuleConfirm"
/>
</
template
>
</
template
>
</ModalPop>
</ModalPop>
...
...
src/views/ruleConfig/CalculationMethod/modules/formModule.vue
View file @
ec42b0e2
...
@@ -85,7 +85,7 @@ const confirm = () => {
...
@@ -85,7 +85,7 @@ const confirm = () => {
};
};
const
saveFunc
=
()
=>
{
const
saveFunc
=
()
=>
{
console
.
log
(
form
.
value
)
//
console.log(form.value)
if
(
props
.
type
===
"edit"
)
{
if
(
props
.
type
===
"edit"
)
{
form
.
value
=
{
...
form
.
value
,
...{
id
:
form
.
value
.
id
}
}
form
.
value
=
{
...
form
.
value
,
...{
id
:
form
.
value
.
id
}
}
}
}
...
@@ -135,9 +135,6 @@ watch(
...
@@ -135,9 +135,6 @@ watch(
()
=>
props
.
itemData
,
()
=>
props
.
itemData
,
(
newVal
)
=>
{
(
newVal
)
=>
{
if
(
props
.
itemData
)
{
if
(
props
.
itemData
)
{
if
(
!
props
.
itemData
.
enc_name
)
{
reset
()
}
const
data
=
JSON
.
parse
(
JSON
.
stringify
(
props
.
itemData
));
const
data
=
JSON
.
parse
(
JSON
.
stringify
(
props
.
itemData
));
form
.
value
=
{
...
form
.
value
,
...
data
};
form
.
value
=
{
...
form
.
value
,
...
data
};
if
(
props
.
type
===
"edit"
&&
form
.
value
.
secretkey_id
)
{
if
(
props
.
type
===
"edit"
&&
form
.
value
.
secretkey_id
)
{
...
...
编写
预览
Markdown
格式
0%
重试
或
添加新文件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
请先完成此评论的编辑!
取消
请
注册
或者
登录
后发表评论