Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
F
fk-spider-web
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
周田
fk-spider-web
Commits
3b026207
Commit
3b026207
authored
Jan 16, 2026
by
liucan
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
fix:修改对话框关闭按钮样式、监控页面添加esa任务数据
parent
e1d41e5d
Show whitespace changes
Inline
Side-by-side
Showing
11 changed files
with
229 additions
and
142 deletions
+229
-142
.env.development
.env.development
+2
-2
App.vue
src/App.vue
+2
-1
close-btn.svg
src/assets/picture/close-btn.svg
+2
-0
_element.scss
src/styles/_element.scss
+18
-1
allDataTab.vue
src/views/os-dataDisplay/components/allDataTab.vue
+0
-1
dataCard.vue
src/views/os-status/components/dataCard.vue
+15
-9
taskCard.vue
src/views/os-status/components/taskCard.vue
+80
-31
addUserDialog.vue
src/views/os-system/components/addUserDialog.vue
+109
-94
index.vue
src/views/os-system/index.vue
+0
-1
addTaskDialog.vue
src/views/os-taskInformation/components/addTaskDialog.vue
+0
-1
vite.config.ts
vite.config.ts
+1
-1
No files found.
.env.development
View file @
3b026207
# 开发环境配置
VITE_APP_BASE_API = '/api'
VITE_APP_TITLE = 'Spider Admin Pro'
VITE_WEBSOCKET_API = "http://192.168.3.10:5001/"
\ No newline at end of file
VITE_WEBSOCKET_API = "http://192.168.0.211:5001/"
\ No newline at end of file
src/App.vue
View file @
3b026207
<
script
setup
lang=
"ts"
>
import
{
ElConfigProvider
}
from
"element-plus"
;
import
zhCn
from
"element-plus/es/locale/lang/zh-cn"
;
import
{
CloseBold
}
from
"@element-plus/icons-vue"
;
</
script
>
<
template
>
<el-config-provider
:locale=
"zhCn"
>
<el-config-provider
:locale=
"zhCn"
:close-icon=
"CloseBold"
>
<router-view
/>
</el-config-provider>
</
template
>
...
...
src/assets/picture/close-btn.svg
0 → 100644
View file @
3b026207
<svg
t=
"1768531151799"
class=
"icon"
viewBox=
"0 0 1024 1024"
version=
"1.1"
xmlns=
"http://www.w3.org/2000/svg"
p-id=
"8727"
width=
"32"
height=
"32"
><path
d=
"M563.8 512l262.5-312.9c4.4-5.2 0.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9c-4.4 5.2-0.7 13.1 6.1 13.1h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"
p-id=
"8728"
fill=
"#ffffff"
></path></svg>
\ No newline at end of file
src/styles/_element.scss
View file @
3b026207
...
...
@@ -64,7 +64,7 @@
}
.el-dialog
{
background-image
:
url("@/assets/picture/dialog1.png")
;
background-image
:
url("@/assets/picture/dialog1.png")
!
important
;
background-size
:
100%
100%
;
background-repeat
:
no-repeat
;
...
...
@@ -146,3 +146,19 @@
background-color
:
#1d5484
!
important
;
box-shadow
:
none
!
important
;
}
/* Dialog 关闭按钮 */
.el-dialog__headerbtn
.el-dialog__close
{
font-size
:
0
;
}
.el-dialog__headerbtn
{
content
:
''
;
width
:
32px
;
height
:
32px
;
margin-right
:
15px
;
margin-top
:
15px
;
display
:
inline-block
;
background
:
url('@/assets/picture/close-btn.svg')
no-repeat
center
!
important
;
background-size
:
contain
;
}
\ No newline at end of file
src/views/os-dataDisplay/components/allDataTab.vue
View file @
3b026207
...
...
@@ -605,7 +605,6 @@ const handleExport = () => {
/* 修改弹窗样式 */
.el-dialog
{
background
:
transparent
;
background-image
:
url("@/assets/picture/dialog1.png")
;
background-size
:
100%
100%
;
background-repeat
:
no-repeat
;
color
:
#ffffff
;
...
...
src/views/os-status/components/dataCard.vue
View file @
3b026207
...
...
@@ -8,17 +8,23 @@
<div
class=
"items"
>
<div
class=
"wordStyle"
>
<span>
总数据量(条):
</span>
<span
class=
"total-num"
v-if=
"totalDataNumber != null"
>
{{
formatExactLargeNum
(
totalDataNumber
)
}}
</span>
<span
class=
"total-num"
v-if=
"totalDataNumber !== null"
>
{{
formatExactLargeNum
(
totalDataNumber
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
采集的页面数量(个):
</span>
<span
class=
"total-num"
v-if=
"totalPageNumber != null"
>
{{
formatExactLargeNum
(
totalPageNumber
)
}}
</span>
<span
class=
"total-num"
v-if=
"totalPageNumber !== null"
>
{{
formatExactLargeNum
(
totalPageNumber
)
??
"--"
}}
</span
>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
采集的目标数量(个):
</span>
<span
class=
"total-num"
v-if=
"totalTargetNumber != null"
>
{{
formatExactLargeNum
(
totalTargetNumber
)
}}
</span>
<span
class=
"total-num"
v-if=
"totalTargetNumber !== null"
>
{{
formatExactLargeNum
(
totalTargetNumber
)
??
"--"
}}
</span
>
<span
class=
"loading"
v-else
></span>
</div>
</div>
...
...
@@ -30,17 +36,17 @@
<div
class=
"items"
>
<div
class=
"wordStyle"
>
<span>
任务执行成功统计(个):
</span>
<span
class=
"total-num"
v-if=
"successTask !=
null"
>
{{
formatExactLargeNum
(
successTask
)
}}
</span>
<span
class=
"total-num"
v-if=
"successTask !=
= null"
>
{{
formatExactLargeNum
(
successTask
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
任务执行失败统计(个):
</span>
<span
class=
"total-num"
v-if=
"failTask !=
null"
>
{{
formatExactLargeNum
(
failTask
)
}}
</span>
<span
class=
"total-num"
v-if=
"failTask !=
= null"
>
{{
formatExactLargeNum
(
failTask
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
任务异常数统计(个):
</span>
<span
class=
"total-num"
v-if=
"unusualTask !=
null"
>
{{
formatExactLargeNum
(
unusualTask
)
}}
</span>
<span
class=
"total-num"
v-if=
"unusualTask !=
= null"
>
{{
formatExactLargeNum
(
unusualTask
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
</div>
...
...
@@ -52,17 +58,17 @@
<div
class=
"items"
>
<div
class=
"wordStyle"
>
<span>
平均成功率:
</span>
<span
class=
"total-num"
v-if=
"speed !=
null"
>
{{
speed
}}
</span>
<span
class=
"total-num"
v-if=
"speed !=
= null"
>
{{
speed
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
平均错误率:
</span>
<span
class=
"total-num"
v-if=
"errorRate !=
null"
>
{{
errorRate
}}
</span>
<span
class=
"total-num"
v-if=
"errorRate !=
= null"
>
{{
errorRate
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
平均异常率:
</span>
<span
class=
"total-num"
v-if=
"unusualRate !=
null"
>
{{
unusualRate
}}
</span>
<span
class=
"total-num"
v-if=
"unusualRate !=
= null"
>
{{
unusualRate
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
</div>
...
...
src/views/os-status/components/taskCard.vue
View file @
3b026207
...
...
@@ -8,24 +8,28 @@
<div
class=
"items"
>
<div
class=
"wordStyle"
>
<span>
DSN爬虫任务数(个):
</span>
<span
class=
"total-num"
v-if=
"dsnTotalTaskNumber != null"
>
{{
formatExactLargeNum
(
dsnTotalTaskNumber
)
}}
</span>
<span
class=
"total-num"
v-if=
"dsnTotalTaskNumber !== null"
>
{{
formatExactLargeNum
(
dsnTotalTaskNumber
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
任务执行成功统计(个):
</span>
<span
class=
"total-num"
v-if=
"dsnTaskSuccessNumber != null"
>
{{
formatExactLargeNum
(
dsnTaskSuccessNumber
)
<span
class=
"total-num"
v-if=
"dsnTaskSuccessNumber !=
=
null"
>
{{
formatExactLargeNum
(
dsnTaskSuccessNumber
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
任务执行失败统计(个):
</span>
<span
class=
"total-num"
v-if=
"dsnTaskFailNumber != null"
>
{{
formatExactLargeNum
(
dsnTaskFailNumber
)
}}
</span>
<span
class=
"total-num"
v-if=
"dsnTaskFailNumber !== null"
>
{{
formatExactLargeNum
(
dsnTaskFailNumber
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
错误率:
</span>
<span
class=
"total-num"
v-if=
"dsnErrorRate !=
null"
>
{{
dsnErrorRate
}}
</span>
<span
class=
"total-num"
v-if=
"dsnErrorRate !=
= null"
>
{{
dsnErrorRate
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
</div>
...
...
@@ -37,24 +41,28 @@
<div
class=
"items"
>
<div
class=
"wordStyle"
>
<span>
ITU爬虫任务数(个):
</span>
<span
class=
"total-num"
v-if=
"ituTotalTaskNumber != null"
>
{{
formatExactLargeNum
(
ituTotalTaskNumber
)
}}
</span>
<span
class=
"total-num"
v-if=
"ituTotalTaskNumber !== null"
>
{{
formatExactLargeNum
(
ituTotalTaskNumber
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
任务执行成功统计(个):
</span>
<span
class=
"total-num"
v-if=
"ituTaskSuccessNumber != null"
>
{{
formatExactLargeNum
(
ituTaskSuccessNumber
)
<span
class=
"total-num"
v-if=
"ituTaskSuccessNumber !=
=
null"
>
{{
formatExactLargeNum
(
ituTaskSuccessNumber
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
任务执行失败统计(个):
</span>
<span
class=
"total-num"
v-if=
"ituTaskFailNumber != null"
>
{{
formatExactLargeNum
(
ituTaskFailNumber
)
}}
</span>
<span
class=
"total-num"
v-if=
"ituTaskFailNumber !== null"
>
{{
formatExactLargeNum
(
ituTaskFailNumber
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
错误率:
</span>
<span
class=
"total-num"
v-if=
"ituErrorRate !=
null"
>
{{
ituErrorRate
}}
</span>
<span
class=
"total-num"
v-if=
"ituErrorRate !=
= null"
>
{{
ituErrorRate
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
</div>
...
...
@@ -66,19 +74,57 @@
<div
class=
"items"
>
<div
class=
"wordStyle"
>
<span>
ST爬虫任务数(个):
</span>
<span
class=
"total-num"
v-if=
"stTotalTaskNumber != null"
>
{{
formatExactLargeNum
(
stTotalTaskNumber
)
}}
</span>
<span
class=
"total-num"
v-if=
"stTotalTaskNumber !== null"
>
{{
formatExactLargeNum
(
stTotalTaskNumber
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
任务执行成功统计(个):
</span>
<span
class=
"total-num"
v-if=
"stTaskSuccessNumber != null"
>
{{
formatExactLargeNum
(
stTaskSuccessNumber
)
<span
class=
"total-num"
v-if=
"stTaskSuccessNumber !== null"
>
{{
formatExactLargeNum
(
stTaskSuccessNumber
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
任务执行失败统计(个):
</span>
<span
class=
"total-num"
v-if=
"stTaskFailNumber !== null"
>
{{
formatExactLargeNum
(
stTaskFailNumber
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
错误率:
</span>
<span
class=
"total-num"
v-if=
"stErrorRate != null"
>
{{
stErrorRate
}}
</span>
<span
class=
"total-num"
v-if=
"stErrorRate !== null"
>
{{
stErrorRate
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
</div>
</div>
<div
class=
"dataCard"
@
click=
"goToSTTaskRecordPage"
>
<div
class=
"titleStyle"
>
<span>
ESA爬取任务
</span>
</div>
<div
class=
"items"
>
<div
class=
"wordStyle"
>
<span>
ESA爬虫任务数(个):
</span>
<span
class=
"total-num"
v-if=
"esaTotalCount !== null"
>
{{
formatExactLargeNum
(
esaTotalCount
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
任务执行成功统计(个):
</span>
<span
class=
"total-num"
v-if=
"esaSuccessCount !== null"
>
{{
formatExactLargeNum
(
esaSuccessCount
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
任务执行失败统计(个):
</span>
<span
class=
"total-num"
v-if=
"esaFailCount !== null"
>
{{
formatExactLargeNum
(
esaFailCount
)
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
<div
class=
"wordStyle"
>
<span>
错误率:
</span>
<span
class=
"total-num"
v-if=
"esaErrorRate !== null"
>
{{
esaErrorRate
??
"--"
}}
</span>
<span
class=
"loading"
v-else
></span>
</div>
</div>
...
...
@@ -112,6 +158,10 @@ const stTotalTaskNumber = ref(null);
const
stTaskSuccessNumber
=
ref
(
null
);
const
stTaskFailNumber
=
ref
(
null
);
const
stErrorRate
=
ref
(
null
);
const
esaTotalCount
=
ref
(
null
);
const
esaSuccessCount
=
ref
(
null
);
const
esaErrorRate
=
ref
(
null
);
const
esaFailCount
=
ref
(
null
);
const
goToDSNTaskRecordPage
=
()
=>
{
router
.
push
({
...
...
@@ -149,20 +199,23 @@ const getData = async () => {
const
res
=
await
getAllSpiderTaskStatistics
({});
const
stTask
=
await
getSpiderTaskList
({
spiders
:
"api_spider"
});
const
allTask
=
await
getAllTaskStatistics
();
console
.
log
(
allTask
);
dsnTotalTaskNumber
.
value
=
allTask
.
data
.
dsn_now
.
totalCount
;
dsnTaskSuccessNumber
.
value
=
res
.
data
.
dsn_now
.
successCount
;
dsnTaskFailNumber
.
value
=
res
.
data
.
dsn_now
.
failCount
;
dsnErrorRate
.
value
=
res
.
data
.
dsn_now
.
errorRate
;
ituTotalTaskNumber
.
value
=
allTask
.
data
.
itu_space_explorer
.
totalCount
;
ituTaskSuccessNumber
.
value
=
res
.
data
.
itu_space_explorer
.
successCount
;
ituTaskFailNumber
.
value
=
res
.
data
.
itu_space_explorer
.
failCount
;
ituErrorRate
.
value
=
res
.
data
.
itu_space_explorer
.
errorRate
;
stTotalTaskNumber
.
value
=
allTask
.
data
.
space_track
.
totalCount
;
stTaskSuccessNumber
.
value
=
res
.
data
.
space_track
.
successCount
;
stTaskFailNumber
.
value
=
res
.
data
.
space_track
.
failCount
;
stErrorRate
.
value
=
res
.
data
.
space_track
.
errorRate
;
ituTotalTaskNumber
.
value
=
allTask
.
data
.
itu_space_explorer
?.
totalCount
;
ituTaskSuccessNumber
.
value
=
res
.
data
.
itu_space_explorer
?.
successCount
;
ituTaskFailNumber
.
value
=
res
.
data
.
itu_space_explorer
?.
failCount
;
ituErrorRate
.
value
=
res
.
data
.
itu_space_explorer
?.
errorRate
;
stTotalTaskNumber
.
value
=
allTask
.
data
.
space_track
?.
totalCount
;
stTaskSuccessNumber
.
value
=
res
.
data
.
space_track
?.
successCount
;
stTaskFailNumber
.
value
=
res
.
data
.
space_track
?.
failCount
;
stErrorRate
.
value
=
res
.
data
.
space_track
?.
errorRate
;
esaTotalCount
.
value
=
res
.
data
.
es_track_transmission
?.
totalCount
;
esaSuccessCount
.
value
=
res
.
data
.
es_track_transmission
?.
successCount
;
esaFailCount
.
value
=
res
.
data
.
es_track_transmission
?.
failCount
;
esaErrorRate
.
value
=
res
.
data
.
es_track_transmission
?.
errorRate
;
};
onMounted
(()
=>
{
getData
();
...
...
@@ -174,9 +227,7 @@ onMounted(() => {
background-image
:
url("@/assets/picture/box2.png")
;
background-size
:
100%
100%
;
background-repeat
:
no-repeat
;
//
background
:
#c6ebfc
;
//
border
:
1.5px
solid
rgb
(
193
,
188
,
188
);
width
:
350px
;
width
:
275px
;
height
:
100%
;
border-radius
:
5px
;
cursor
:
pointer
;
...
...
@@ -193,11 +244,10 @@ onMounted(() => {
}
.wordStyle
{
font-size
:
1
8
px
;
font-size
:
1
6
px
;
color
:
#ffffff
;
margin-top
:
1%
;
display
:
flex
;
margin-left
:
15px
;
display
:
flex
;
justify-content
:
space-between
;
}
...
...
@@ -208,13 +258,12 @@ onMounted(() => {
letter-spacing
:
3px
;
color
:
#ffffff
;
font-weight
:
500
;
transform
:
translateX
(
-25px
);
transition
:
0.2s
;
}
.total-num
{
color
:
#4edaff
;
font-size
:
1
6
px
;
font-size
:
1
4
px
;
font-weight
:
600
;
text-shadow
:
0
0
10px
rgba
(
0
,
200
,
255
,
0.5
);
letter-spacing
:
1px
;
...
...
@@ -223,7 +272,7 @@ onMounted(() => {
}
.toRight0
{
transform
:
translateX
(
-10px
)
;
transform
:
translateX
(
5px
)
!important
;
}
.items
{
...
...
src/views/os-system/components/addUserDialog.vue
View file @
3b026207
<
template
>
<el-dialog
v-model=
"currentVisible"
:title=
"currentMode === AddMode.ADD_MODE ? '新增用户' : '编辑用户'"
width=
"480"
center
align-center
@
close=
"handleClose"
draggable
>
<el-dialog
v-model=
"currentVisible"
:title=
"currentMode === AddMode.ADD_MODE ? '新增用户' : '编辑用户'"
width=
"480"
center
align-center
@
close=
"handleClose"
draggable
>
<div
v-if=
"currentMode === AddMode.ADD_MODE"
>
<el-form
:rules=
"firstFormRules"
ref=
"firstRuleFormRef"
:model=
"firstForm"
>
<el-form-item
label=
"用户账号:"
prop=
"userAccount"
label-width=
"100px"
>
<el-input
v-model=
"firstForm.userAccount"
style=
"width: 300px;"
/>
<el-input
v-model=
"firstForm.userAccount"
style=
"width: 300px"
/>
</el-form-item>
<el-form-item
label=
"用户名称:"
prop=
"userName"
label-width=
"100px"
>
<el-input
v-model=
"firstForm.userName"
style=
"width: 300px"
/>
<el-input
v-model=
"firstForm.userName"
style=
"width: 300px"
/>
</el-form-item>
<el-form-item
label=
"用户状态:"
label-width=
"100px"
>
<el-select
v-model=
"userStatusValue"
placeholder=
"请选择状态"
style=
"width: 300px;
"
>
<el-select
v-model=
"userStatusValue"
placeholder=
"请选择状态"
style=
"width: 300px
"
>
<el-option
v-for=
"item in userStatusOptions"
:key=
"item.value"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
<el-form-item
label=
"用户密码:"
prop=
"userPassword"
label-width=
"100px"
>
<el-input
v-model=
"firstForm.userPassword"
style=
"width: 300px;"
/>
<el-input
v-model=
"firstForm.userPassword"
style=
"width: 300px"
/>
</el-form-item>
<el-form-item
label=
"用户角色:"
label-width=
"100px"
>
<el-select
v-model=
"userRoleValue"
placeholder=
"请选择角色"
style=
"width: 300px;
"
>
<el-select
v-model=
"userRoleValue"
placeholder=
"请选择角色"
style=
"width: 300px
"
>
<el-option
v-for=
"item in userRoleOptions"
:key=
"item.value"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
...
...
@@ -27,10 +34,10 @@
<div
v-if=
"currentMode === AddMode.UPDATE_MODE"
>
<el-form
:inline=
"true"
:rules=
"secondFormRules"
ref=
"secondRuleFormRef"
:model=
"secondForm"
>
<el-form-item
label=
"用户名称:"
prop=
"userName"
label-width=
"100px"
>
<el-input
v-model=
"secondForm.userName"
style=
"width: 300px;"
/>
<el-input
v-model=
"secondForm.userName"
style=
"width: 300px"
/>
</el-form-item>
<el-form-item
label=
"用户角色:"
label-width=
"100px"
>
<el-select
v-model=
"userRoleValue"
placeholder=
"请选择角色"
style=
"width: 300px;
"
>
<el-select
v-model=
"userRoleValue"
placeholder=
"请选择角色"
style=
"width: 300px
"
>
<el-option
v-for=
"item in userRoleOptions"
:key=
"item.value"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
...
...
@@ -38,118 +45,113 @@
<div
class=
"m-t-4"
/>
<el-form
:inline=
"true"
:rules=
"editPasswordRules"
ref=
"editPasswordFormRef"
:model=
"editPasswordForm"
>
<el-form-item
label=
"用户状态:"
label-width=
"100px"
>
<el-select
v-model=
"userStatusValue"
placeholder=
"请选择状态"
style=
"width: 300px;
"
>
<el-select
v-model=
"userStatusValue"
placeholder=
"请选择状态"
style=
"width: 300px
"
>
<el-option
v-for=
"item in userStatusOptions"
:key=
"item.value"
:label=
"item.label"
:value=
"item.value"
/>
</el-select>
</el-form-item>
<el-form-item
label=
"用户密码:"
prop=
"userPassword"
label-width=
"100px"
>
<el-input
v-model=
"editPasswordForm.userPassword"
placeholder=
" "
style=
"width: 300px;"
/>
<el-input
v-model=
"editPasswordForm.userPassword"
placeholder=
" "
style=
"width: 300px"
/>
</el-form-item>
</el-form>
</div>
<template
#
footer
>
<div
class=
"dialog-footer"
>
<el-button
@
click=
"handleClose"
>
取消
</el-button>
<el-button
type=
"primary"
@
click=
"handleConfirm"
>
确定
</el-button>
<el-button
type=
"primary"
@
click=
"handleConfirm"
>
确定
</el-button>
</div>
</
template
>
</el-dialog>
</template>
<
script
lang=
"ts"
setup
>
import
{
ref
,
watch
}
from
'vue'
import
{
defineProps
,
defineEmits
}
from
'vue'
;
import
{
addUser
,
updateUser
}
from
'@/api/user.ts'
import
type
{
FormInstance
,
FormRules
}
from
'element-plus'
import
{
ElMessage
}
from
'element-plus'
;
import
{
AddMode
}
from
'./enum'
;
import
{
ref
,
watch
}
from
"vue"
;
import
{
addUser
,
updateUser
}
from
"@/api/user.ts"
;
import
type
{
FormInstance
,
FormRules
}
from
"element-plus"
;
import
{
ElMessage
}
from
"element-plus"
;
import
{
AddMode
}
from
"./enum"
;
interface
addDialogPropType
{
dialogVisible
:
boolean
,
mode
:
AddMode
,
nickName
:
string
,
userName
:
string
,
id
:
number
,
userPassword
:
string
,
userRole
:
number
,
userStatus
:
boolean
dialogVisible
:
boolean
;
mode
:
AddMode
;
nickName
:
string
;
userName
:
string
;
id
:
number
;
userPassword
:
string
;
userRole
:
number
;
userStatus
:
boolean
;
}
const
props
=
defineProps
<
addDialogPropType
>
()
const
props
=
defineProps
<
addDialogPropType
>
()
;
// 定义表单数据结构(与rules对应)
const
firstForm
=
ref
({
userAccount
:
''
,
// 用户账号
userName
:
''
,
// 用户名称
userPassword
:
''
// 用户密码
})
userAccount
:
""
,
// 用户账号
userName
:
""
,
// 用户名称
userPassword
:
""
,
// 用户密码
})
;
const
secondForm
=
ref
({
userName
:
''
// 编辑模式的用户名称
})
userName
:
""
,
// 编辑模式的用户名称
})
;
const
editPasswordForm
=
ref
({
userPassword
:
''
// 编辑模式的密码
})
userPassword
:
""
,
// 编辑模式的密码
})
;
// 表单引用
const
firstRuleFormRef
=
ref
<
FormInstance
>
()
const
secondRuleFormRef
=
ref
<
FormInstance
>
()
const
editPasswordFormRef
=
ref
<
FormInstance
>
()
const
firstRuleFormRef
=
ref
<
FormInstance
>
()
;
const
secondRuleFormRef
=
ref
<
FormInstance
>
()
;
const
editPasswordFormRef
=
ref
<
FormInstance
>
()
;
// 新增模式验证规则
const
firstFormRules
=
ref
<
FormRules
>
({
userAccount
:
[
{
required
:
true
,
message
:
'请输入用户账号'
,
trigger
:
'blur'
},
{
type
:
'string'
,
min
:
3
,
max
:
20
,
message
:
'用户账号长度3-20字符'
,
trigger
:
'blur'
},
{
pattern
:
/^
[
A-Za-z0-9
]
+$/
,
message
:
'用户账号只能包含英文字母或数字'
,
trigger
:
'blur'
}
{
required
:
true
,
message
:
"请输入用户账号"
,
trigger
:
"blur"
},
{
type
:
"string"
,
min
:
3
,
max
:
20
,
message
:
"用户账号长度3-20字符"
,
trigger
:
"blur"
},
{
pattern
:
/^
[
A-Za-z0-9
]
+$/
,
message
:
"用户账号只能包含英文字母或数字"
,
trigger
:
"blur"
},
],
userName
:
[
{
required
:
true
,
message
:
'请输入用户名称'
,
trigger
:
'blur'
},
{
type
:
'string'
,
min
:
2
,
max
:
20
,
message
:
'用户名称长度2-20字符'
,
trigger
:
'blur'
},
{
required
:
true
,
message
:
"请输入用户名称"
,
trigger
:
"blur"
},
{
type
:
"string"
,
min
:
2
,
max
:
20
,
message
:
"用户名称长度2-20字符"
,
trigger
:
"blur"
},
],
userPassword
:
[
{
required
:
true
,
message
:
'请输入用户密码'
,
trigger
:
'blur'
},
{
type
:
'string'
,
min
:
6
,
max
:
20
,
message
:
'密码长度6-20字符'
,
trigger
:
'blur'
},
{
required
:
true
,
message
:
"请输入用户密码"
,
trigger
:
"blur"
},
{
type
:
"string"
,
min
:
6
,
max
:
20
,
message
:
"密码长度6-20字符"
,
trigger
:
"blur"
},
],
})
})
;
// 编辑模式验证规则(密码可选)
const
secondFormRules
=
ref
<
FormRules
>
({
userName
:
[
{
required
:
true
,
message
:
'请输入用户名称'
,
trigger
:
'blur'
},
{
type
:
'string'
,
min
:
1
,
max
:
20
,
message
:
'用户名称长度1-20字符'
,
trigger
:
'blur'
},
{
required
:
true
,
message
:
"请输入用户名称"
,
trigger
:
"blur"
},
{
type
:
"string"
,
min
:
1
,
max
:
20
,
message
:
"用户名称长度1-20字符"
,
trigger
:
"blur"
},
],
})
})
;
const
editPasswordRules
=
ref
<
FormRules
>
({
userPassword
:
[
{
type
:
'string'
,
min
:
6
,
max
:
20
,
message
:
'密码长度6-20字符'
,
trigger
:
'blur'
},
],
})
userPassword
:
[{
type
:
"string"
,
min
:
6
,
max
:
20
,
message
:
"密码长度6-20字符"
,
trigger
:
"blur"
}],
});
const
userStatusValue
=
ref
(
true
)
const
userRoleValue
=
ref
(
1
)
const
userStatusValue
=
ref
(
true
)
;
const
userRoleValue
=
ref
(
1
)
;
const
userStatusOptions
=
[
{
value
:
true
,
label
:
'启用'
},
{
value
:
false
,
label
:
'停用'
}
]
{
value
:
true
,
label
:
"启用"
},
{
value
:
false
,
label
:
"停用"
},
]
;
const
userRoleOptions
=
[
{
value
:
1
,
label
:
'管理员'
},
{
value
:
0
,
label
:
'普通用户'
}
]
{
value
:
1
,
label
:
"管理员"
},
{
value
:
0
,
label
:
"普通用户"
},
]
;
const
emit
=
defineEmits
([
'update:dialogVisible'
,
'getUserList'
])
const
emit
=
defineEmits
([
"update:dialogVisible"
,
"getUserList"
]);
// 组件状态
const
currentVisible
=
ref
(
props
.
dialogVisible
)
const
currentMode
=
ref
(
props
.
mode
)
const
currentVisible
=
ref
(
props
.
dialogVisible
)
;
const
currentMode
=
ref
(
props
.
mode
)
;
// 关闭对话框的方法
const
handleClose
=
()
=>
{
firstRuleFormRef
.
value
?.
resetFields
()
secondRuleFormRef
.
value
?.
resetFields
()
editPasswordFormRef
.
value
?.
resetFields
()
currentVisible
.
value
=
false
}
firstRuleFormRef
.
value
?.
resetFields
();
secondRuleFormRef
.
value
?.
resetFields
();
editPasswordFormRef
.
value
?.
resetFields
();
currentVisible
.
value
=
false
;
}
;
// 创建用户与编辑用户的方法
const
handleConfirm
=
async
()
=>
{
...
...
@@ -165,10 +167,10 @@ const handleConfirm = async () => {
username
:
firstForm
.
value
.
userAccount
,
password
:
firstForm
.
value
.
userPassword
,
role
:
userRoleValue
.
value
,
status
:
userStatusValue
.
value
status
:
userStatusValue
.
value
,
});
ElMessage
.
success
(
'新增成功'
);
emit
(
'getUserList'
);
ElMessage
.
success
(
"新增成功"
);
emit
(
"getUserList"
);
currentVisible
.
value
=
false
;
}
}
else
if
(
currentMode
.
value
===
AddMode
.
UPDATE_MODE
)
{
...
...
@@ -186,10 +188,10 @@ const handleConfirm = async () => {
nickname
:
secondForm
.
value
.
userName
,
role
:
userRoleValue
.
value
,
status
:
userStatusValue
.
value
,
...(
editPasswordForm
.
value
.
userPassword
&&
{
password
:
editPasswordForm
.
value
.
userPassword
})
...(
editPasswordForm
.
value
.
userPassword
&&
{
password
:
editPasswordForm
.
value
.
userPassword
}),
});
ElMessage
.
success
(
'编辑成功'
);
emit
(
'getUserList'
);
ElMessage
.
success
(
"编辑成功"
);
emit
(
"getUserList"
);
currentVisible
.
value
=
false
;
}
}
...
...
@@ -198,33 +200,49 @@ const handleConfirm = async () => {
}
};
watch
(()
=>
props
.
dialogVisible
,
(
newVal
)
=>
{
currentVisible
.
value
=
newVal
})
watch
(
()
=>
props
.
dialogVisible
,
(
newVal
)
=>
{
currentVisible
.
value
=
newVal
;
}
);
watch
(()
=>
currentVisible
.
value
,
(
newVal
)
=>
{
emit
(
'update:dialogVisible'
,
newVal
)
})
watch
(
()
=>
currentVisible
.
value
,
(
newVal
)
=>
{
emit
(
"update:dialogVisible"
,
newVal
);
}
);
watch
(()
=>
props
.
mode
,
(
newVal
)
=>
{
currentMode
.
value
=
newVal
})
watch
(
()
=>
props
.
mode
,
(
newVal
)
=>
{
currentMode
.
value
=
newVal
;
}
);
// 监听参数变化,将参数展示到对话框中
watch
(
[()
=>
props
.
dialogVisible
,
()
=>
props
.
mode
,
()
=>
props
.
nickName
,
()
=>
props
.
userPassword
,
()
=>
props
.
userStatus
,
()
=>
props
.
userRole
],
[
()
=>
props
.
dialogVisible
,
()
=>
props
.
mode
,
()
=>
props
.
nickName
,
()
=>
props
.
userPassword
,
()
=>
props
.
userStatus
,
()
=>
props
.
userRole
,
],
([
newVisible
,
newMode
,
newNickName
,
newPwd
,
newStatus
,
newRole
])
=>
{
if
(
newVisible
&&
newMode
===
AddMode
.
UPDATE_MODE
)
{
secondForm
.
value
.
userName
=
newNickName
;
editPasswordForm
.
value
.
userPassword
=
newPwd
||
''
;
editPasswordForm
.
value
.
userPassword
=
newPwd
||
""
;
userStatusValue
.
value
=
newStatus
;
userRoleValue
.
value
=
newRole
;
}
if
(
!
newVisible
)
{
// 清空表单
firstForm
.
value
=
{
userAccount
:
''
,
userName
:
''
,
userPassword
:
''
};
secondForm
.
value
=
{
userName
:
''
};
editPasswordForm
.
value
=
{
userPassword
:
''
};
firstForm
.
value
=
{
userAccount
:
""
,
userName
:
""
,
userPassword
:
""
};
secondForm
.
value
=
{
userName
:
""
};
editPasswordForm
.
value
=
{
userPassword
:
""
};
}
},
{
immediate
:
true
}
...
...
@@ -235,7 +253,6 @@ watch(
/* 保持原有样式 */
.el-dialog
{
background
:
transparent
;
background-image
:
url("@/assets/picture/dialog1.png")
;
background-size
:
100%
100%
;
background-repeat
:
no-repeat
;
color
:
#ffffff
;
...
...
@@ -265,4 +282,3 @@ watch(
}
}
</
style
>
\ No newline at end of file
src/views/os-system/index.vue
View file @
3b026207
...
...
@@ -192,7 +192,6 @@ onMounted(async () => {
<
style
>
/* 修改弹窗样式 */
.el-dialog
{
background-image
:
url("@/assets/picture/dialog1.png")
;
background-size
:
100%
100%
;
background-repeat
:
no-repeat
;
...
...
src/views/os-taskInformation/components/addTaskDialog.vue
View file @
3b026207
...
...
@@ -253,7 +253,6 @@ onMounted(() => {
/* 修改弹出框样式 */
.el-dialog
{
background
:
transparent
;
background-image
:
url("@/assets/picture/dialog1.png")
;
background-size
:
100%
100%
;
background-repeat
:
no-repeat
;
color
:
#ffffff
;
...
...
vite.config.ts
View file @
3b026207
...
...
@@ -31,7 +31,7 @@ export default defineConfig({
proxy
:
{
// 代理API请求,使用更精确的路径匹配
'/api'
:
{
target
:
'http://192.168.
3.10
:5001/'
,
target
:
'http://192.168.
0.211
:5001/'
,
changeOrigin
:
true
,
},
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment