Skip to content
项目
群组
代码片段
帮助
当前项目
正在载入...
登录 / 注册
切换导航面板
M
mini-wms
概览
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
周海峰
mini-wms
Commits
2ae44490
Commit
2ae44490
authored
Dec 03, 2025
by
ningjihai
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
UI修改,字典管理
parent
4f51b614
隐藏空白字符变更
内嵌
并排
正在显示
10 个修改的文件
包含
849 行增加
和
156 行删除
+849
-156
ruoyi-admin-vue/src/assets/styles/element-ui.scss
+18
-0
ruoyi-admin-vue/src/assets/styles/element-variables.scss
+3
-1
ruoyi-admin-vue/src/assets/styles/index.scss
+25
-0
ruoyi-admin-vue/src/assets/styles/sidebar.scss
+114
-0
ruoyi-admin-vue/src/assets/styles/variables.scss
+4
-4
ruoyi-admin-vue/src/components/PageTitle/index.vue
+98
-0
ruoyi-admin-vue/src/components/Search/PageWrapperSearch.vue
+415
-0
ruoyi-admin-vue/src/layout/components/AppMain.vue
+17
-5
ruoyi-admin-vue/src/main.js
+6
-0
ruoyi-admin-vue/src/views/system/dict/index.vue
+149
-146
没有找到文件。
ruoyi-admin-vue/src/assets/styles/element-ui.scss
View file @
2ae44490
...
...
@@ -89,4 +89,21 @@
>
.el-submenu__title
.el-submenu__icon-arrow
{
display
:
none
;
}
/* 全局修复,确保所有 el-select 在表单中宽度为 100% */
.page-wrapper-search
.el-select
{
width
:
100%
;
}
.page-wrapper-search
.el-form-item__content
.el-select
{
width
:
100%
;
}
.page-wrapper-search
.el-form-item__content
.el-date-editor
{
width
:
100%
;
}
.page-wrapper-search
.el-form-item
{
display
:
flex
;
}
.page-wrapper-search
.el-form-item__content
{
flex
:
1
;
}
\ No newline at end of file
ruoyi-admin-vue/src/assets/styles/element-variables.scss
View file @
2ae44490
...
...
@@ -4,7 +4,9 @@
**/
/* theme color */
$--color-primary
:
#1890ff
;
// $--color-primary: #1890ff;
$--color-primary
:
#356CEF
;
$--color-success
:
#13ce66
;
$--color-warning
:
#ffba00
;
$--color-danger
:
#ff4949
;
...
...
ruoyi-admin-vue/src/assets/styles/index.scss
View file @
2ae44490
...
...
@@ -122,6 +122,31 @@ aside {
//main-container全局样式
.app-container
{
padding
:
20px
;
padding-top
:
10px
;
flex
:
1
;
border-radius
:
4px
;
box-sizing
:
border-box
;
// box-shadow: 2px 2px 4px rgba(30, 92, 235, 0.1);
// margin: 10px;
// background-color: #fff;
display
:
flex
;
flex-direction
:
column
;
min-height
:
200px
;
}
.page-container
{
padding
:
20px
;
flex
:
1
;
border-radius
:
4px
;
box-sizing
:
border-box
;
box-shadow
:
2px
2px
4px
rgba
(
30
,
92
,
235
,
0
.1
);
background-color
:
#fff
;
display
:
flex
;
flex-direction
:
column
;
min-height
:
200px
;
}
.table-container
{
flex
:
1
;
min-height
:
200px
;
}
.components-container
{
...
...
ruoyi-admin-vue/src/assets/styles/sidebar.scss
View file @
2ae44490
...
...
@@ -5,6 +5,8 @@
transition
:
margin-left
.28s
;
margin-left
:
$base-sidebar-width
;
position
:
relative
;
display
:
flex
;
flex-direction
:
column
;
}
.sidebarHide
{
...
...
@@ -74,6 +76,7 @@
overflow
:
hidden
!
important
;
text-overflow
:
ellipsis
!
important
;
white-space
:
nowrap
!
important
;
}
// menu hover
...
...
@@ -86,6 +89,7 @@
&
.theme-dark
.is-active
>
.el-submenu__title
{
color
:
$base-menu-color-active
!
important
;
}
&
.nest-menu
.el-submenu
>
.el-submenu__title
,
...
...
@@ -224,4 +228,113 @@
border-radius
:
20px
;
}
}
.theme-dark
{
.el-submenu__title
{
i
{
color
:
#fff
;
}
}
}
}
.theme-dark
{
.el-submenu__title
{
i
{
color
:
#fff
!
important
;
}
// 或者更具体地选择箭头图标
.el-icon-arrow-down
,
.el-icon-arrow-up
{
color
:
#fff
!
important
;
}
}
.svg-icon
{
color
:
#fff
!
important
;
}
span
{
color
:
#fff
!
important
;
}
}
.el-menu
{
// 鼠标悬浮在菜单项上的样式
.el-menu-item
:hover
,
.el-submenu__title
:hover
{
position
:
relative
;
&
:
:
after
{
content
:
''
;
position
:
absolute
;
top
:
5%
;
bottom
:
5%
;
left
:
5%
;
right
:
5%
;
background-color
:
rgba
(
255
,
255
,
255
,
0
.15
);
border-radius
:
6px
;
transition
:
all
0
.3s
ease
;
pointer-events
:
none
;
}
}
// 选中的子菜单项样式
.el-menu-item.is-active
{
position
:
relative
;
&
:
:
after
{
content
:
''
;
position
:
absolute
;
top
:
5%
;
bottom
:
5%
;
left
:
5%
;
right
:
5%
;
background-color
:
rgba
(
255
,
255
,
255
,
0
.15
);
border-radius
:
6px
;
transition
:
all
0
.3s
ease
;
pointer-events
:
none
;
}
}
// 打开的父级菜单样式
.el-submenu.is-opened
{
>
.el-submenu__title
{
position
:
relative
;
&
:
:
after
{
content
:
''
;
position
:
absolute
;
top
:
5%
;
bottom
:
5%
;
left
:
5%
;
right
:
5%
;
background-color
:
rgba
(
255
,
255
,
255
,
0
.15
);
border-radius
:
6px
;
transition
:
all
0
.3s
ease
;
pointer-events
:
none
;
}
}
}
// 选中的父级菜单样式(如果有的话)
.el-submenu.is-active
{
>
.el-submenu__title
{
position
:
relative
;
&
:
:
after
{
content
:
''
;
position
:
absolute
;
top
:
5%
;
bottom
:
5%
;
left
:
5%
;
right
:
5%
;
background-color
:
rgba
(
255
,
255
,
255
,
0
.15
);
border-radius
:
6px
;
transition
:
all
0
.3s
ease
;
pointer-events
:
none
;
}
}
}
}
\ No newline at end of file
ruoyi-admin-vue/src/assets/styles/variables.scss
View file @
2ae44490
...
...
@@ -9,17 +9,17 @@ $yellow:#FEC171;
$panGreen
:
#30B08F
;
// 默认菜单主题风格
$base-menu-color
:
#
bfcbd9
;
$base-menu-color
:
#
fff
;
$base-menu-color-active
:
#f4f4f5
;
$base-menu-background
:
#3
04156
;
$base-menu-background
:
#3
56cec
;
$base-logo-title-color
:
#ffffff
;
$base-menu-light-color
:
rgba
(
0
,
0
,
0
,.
70
);
$base-menu-light-background
:
#ffffff
;
$base-logo-light-title-color
:
#001529
;
$base-sub-menu-background
:
#
1f2d3d
;
$base-sub-menu-hover
:
#
001528
;
$base-sub-menu-background
:
#
356cec
;
$base-sub-menu-hover
:
#
2f61d4
;
// 自定义暗色菜单风格
/**
...
...
ruoyi-admin-vue/src/components/PageTitle/index.vue
0 → 100644
View file @
2ae44490
<
template
>
<div
class=
"page-title"
>
<div
class=
"page-title-container"
>
<div
class=
"left-part"
>
<el-button
v-if=
"back"
icon=
"el-icon-back"
class=
"page-back-logo"
type=
"text"
size=
"large"
@
click=
"handlePageBack"
/>
<div
class=
"title"
>
<slot>
{{
titleStr
}}
</slot>
</div>
</div>
<div
class=
"right-part"
>
<slot
name=
"buttons"
/>
</div>
</div>
</div>
</
template
>
<
script
>
export
default
{
name
:
'PageTitle'
,
props
:
{
back
:
{
type
:
Boolean
,
default
:
false
},
title
:
{
type
:
String
,
default
:
''
}
},
data
()
{
return
{
settingsStore
:
null
,
appStore
:
null
,
route
:
null
}
},
computed
:
{
titleStr
()
{
return
this
.
title
||
String
(
this
.
route
?.
meta
?.
title
||
''
)
},
},
mounted
()
{
// 模拟 Vue 3 的 store 和 route
this
.
initStores
()
},
methods
:
{
initStores
()
{
// 这里需要根据您的实际 store 结构进行调整
// 假设您有类似 Vuex store 的结构
try
{
this
.
settingsStore
=
this
.
$store
?.
state
?.
settings
||
{}
this
.
appStore
=
this
.
$store
?.
state
?.
app
||
{}
this
.
route
=
this
.
$route
||
{}
}
catch
(
error
)
{
console
.
warn
(
'Store or route not available, using default values'
)
this
.
settingsStore
=
{}
this
.
appStore
=
{}
this
.
route
=
{}
}
},
handlePageBack
()
{
this
.
$emit
(
'back'
)
}
}
}
</
script
>
<
style
lang=
"scss"
scoped
>
.page-title
{
margin-bottom
:
10px
;
.page-title-container
{
height
:
48px
;
padding
:
0
20px
;
display
:
flex
;
justify-content
:
space-between
;
border-radius
:
4px
;
background
:
rgba
(
255
,
255
,
255
,
1
);
box-shadow
:
2px
2px
4px
rgba
(
30
,
92
,
235
,
0.1
);
align-items
:
center
;
.left-part
{
font-size
:
16px
;
color
:
rgb
(
46
,
46
,
46
);
}
}
}
</
style
>
\ No newline at end of file
ruoyi-admin-vue/src/components/Search/PageWrapperSearch.vue
0 → 100644
View file @
2ae44490
<
script
>
const
XS
=
0
const
SM
=
768
const
MD
=
992
const
LG
=
1200
const
XL
=
1920
export
default
{
name
:
'PageWrapperSearch'
,
emits
:
[
'update:advanced'
,
'search'
,
'reset'
],
components
:
{
ElRow
:
()
=>
import
(
'element-ui/lib/row'
),
ElCol
:
()
=>
import
(
'element-ui/lib/col'
),
ElForm
:
()
=>
import
(
'element-ui/lib/form'
),
ElFormItem
:
()
=>
import
(
'element-ui/lib/form-item'
),
ElIcon
:
()
=>
import
(
'element-ui/lib/icon'
),
ElButton
:
()
=>
import
(
'element-ui/lib/button'
)
},
props
:
{
xs
:
{
type
:
Number
,
default
:
24
},
sm
:
{
type
:
Number
,
default
:
24
},
md
:
{
type
:
Number
,
default
:
12
},
lg
:
{
type
:
Number
,
default
:
8
},
xl
:
{
type
:
Number
,
default
:
6
},
labelWidth
:
[
Number
,
String
]
},
data
()
{
return
{
observer
:
null
,
ElFormRef
:
null
,
max
:
0
,
isAdvanced
:
true
,
isFold
:
true
,
// 默认折叠状态
labelWidthValue
:
''
,
inputEvents
:
[],
screenWidth
:
1920
}
},
computed
:
{
gutter
()
{
return
(
24
/
this
.
max
%
24
)
||
0
},
// 计算每行最多能显示的列数
maxItemsPerRow
()
{
return
Math
.
floor
(
24
/
this
.
currentColWidth
)
},
// 获取当前屏幕尺寸对应的列宽
currentColWidth
()
{
if
(
this
.
screenWidth
>=
XL
)
return
this
.
xl
if
(
this
.
screenWidth
>=
LG
)
return
this
.
lg
if
(
this
.
screenWidth
>=
MD
)
return
this
.
md
if
(
this
.
screenWidth
>=
SM
)
return
this
.
sm
return
this
.
xs
},
// 是否显示折叠按钮
shouldShowFoldButton
()
{
const
formItems
=
this
.
extractFormItems
(
this
.
$slots
.
default
||
[])
return
formItems
.
length
>
this
.
maxItemsPerRow
-
1
},
// 折叠状态下每行最多显示的表单项数量(包括按钮列)
maxVisibleItemsWhenFold
()
{
return
Math
.
max
(
1
,
this
.
maxItemsPerRow
-
1
)
// 减去按钮列
},
// 是否需要将按钮放在单独一行
shouldWrapButtons
()
{
return
!
this
.
isFold
&&
this
.
shouldShowFoldButton
}
},
mounted
()
{
this
.
screenWidth
=
document
.
documentElement
.
clientWidth
this
.
observer
=
new
ResizeObserver
((
entries
)
=>
{
if
(
entries
[
0
].
contentRect
.
width
>
0
)
{
this
.
initSize
()
}
})
if
(
this
.
ElFormRef
?.
$el
)
{
this
.
observer
.
observe
(
this
.
ElFormRef
.
$el
)
}
this
.
initSize
()
window
.
addEventListener
(
'resize'
,
this
.
handleResize
)
},
beforeDestroy
()
{
if
(
this
.
observer
)
{
this
.
observer
.
disconnect
()
if
(
this
.
ElFormRef
?.
$el
)
{
this
.
observer
.
unobserve
(
this
.
ElFormRef
.
$el
)
}
}
window
.
removeEventListener
(
'resize'
,
this
.
handleResize
)
},
methods
:
{
handleResize
()
{
this
.
screenWidth
=
document
.
documentElement
.
clientWidth
this
.
initSize
()
},
initSize
()
{
this
.
max
=
24
/
this
.
currentColWidth
this
.
resetLabelWidth
()
},
resetLabelWidth
()
{
this
.
labelWidthValue
=
''
this
.
$nextTick
().
then
(()
=>
{
const
formItemLabels
=
this
.
ElFormRef
?.
$el
?
this
.
ElFormRef
.
$el
.
querySelectorAll
(
'.el-form-item__label'
)
:
[]
const
arr
=
[]
formItemLabels
.
forEach
(
item
=>
{
arr
.
push
(
item
.
offsetWidth
)
})
const
max
=
Math
.
max
.
apply
(
null
,
arr
)
this
.
labelWidthValue
=
String
(
max
+
16
)
})
},
toggleFold
()
{
this
.
isFold
=
!
this
.
isFold
this
.
labelWidthValue
=
''
this
.
resetLabelWidth
()
},
// 判断是否应该隐藏表单项
shouldHideItem
(
index
)
{
if
(
!
this
.
isFold
)
return
false
return
index
>=
this
.
maxVisibleItemsWhenFold
},
// 更可靠的 el-form-item 检测方法
isFormItemNode
(
node
)
{
if
(
!
node
)
return
false
if
(
node
.
componentOptions
&&
node
.
componentOptions
.
tag
===
'el-form-item'
)
{
return
true
}
if
(
node
.
data
&&
node
.
data
.
attrs
)
{
const
attrs
=
node
.
data
.
attrs
if
(
attrs
.
label
||
attrs
.
prop
)
{
return
true
}
}
if
(
node
.
data
&&
node
.
data
.
staticClass
)
{
if
(
node
.
data
.
staticClass
.
includes
(
'el-form-item'
))
{
return
true
}
}
return
false
},
// 递归查找所有表单项
extractFormItems
(
nodes
,
result
=
[])
{
if
(
!
nodes
||
!
Array
.
isArray
(
nodes
))
return
result
nodes
.
forEach
(
node
=>
{
if
(
!
node
)
return
if
(
this
.
isFormItemNode
(
node
))
{
result
.
push
(
node
)
}
else
if
(
node
.
children
)
{
this
.
extractFormItems
(
node
.
children
,
result
)
}
else
if
(
node
.
componentOptions
&&
node
.
componentOptions
.
children
)
{
this
.
extractFormItems
(
node
.
componentOptions
.
children
,
result
)
}
})
return
result
}
},
render
()
{
// 提取所有 el-form-item
const
defaultSlots
=
this
.
$slots
.
default
||
[]
const
formItems
=
this
.
extractFormItems
(
defaultSlots
)
// 渲染表单项
const
formItemCols
=
formItems
.
map
((
item
,
index
)
=>
{
const
isHidden
=
this
.
shouldHideItem
(
index
)
return
(
<
el
-
col
class
=
{{
'hidden'
:
isHidden
}}
key
=
{
`formitem-
${
index
}
`
}
xs
=
{
24
}
sm
=
{
this
.
sm
}
md
=
{
this
.
md
}
lg
=
{
this
.
lg
}
xl
=
{
this
.
xl
}
>
{
item
}
<
/el-col
>
)
})
// 渲染按钮
const
buttons
=
(
<
div
class
=
"buttons-space"
>
<
el
-
button
plain
=
{
true
}
on
-
click
=
{()
=>
{
this
.
$emit
(
'reset'
,
this
.
ElFormRef
)
}}
>
重置
<
/el-button
>
<
el
-
button
type
=
"primary"
on
-
click
=
{()
=>
{
this
.
$emit
(
'search'
)
}}
>
查询
<
/el-button
>
{
this
.
shouldShowFoldButton
?
(
<
div
class
=
"advanced"
on
-
click
=
{
this
.
toggleFold
}
>
<
span
>
{
this
.
isFold
?
'展开'
:
'收起'
}
<
/span
>
<
i
class
=
{
`el-icon-arrow-
${
this
.
isFold
?
'down'
:
'up'
}
advanced-icon`
}
><
/i
>
<
/div
>
)
:
null
}
<
/div
>
)
// 按钮列
const
buttonsCol
=
(
<
el
-
col
class
=
"ElColButtons"
xs
=
{
24
}
sm
=
{
this
.
sm
}
md
=
{
this
.
md
}
lg
=
{
this
.
lg
}
xl
=
{
this
.
xl
}
style
=
{
this
.
shouldWrapButtons
?
'margin-top: 18px;'
:
''
}
>
{
this
.
$slots
.
buttons
?
this
.
$slots
.
buttons
:
buttons
}
<
/el-col
>
)
return
(
<
el
-
form
{...{
attrs
:
this
.
$attrs
}}
label
-
width
=
{
this
.
labelWidth
||
this
.
labelWidthValue
}
label
-
position
=
"right"
ref
=
"ElFormRef"
class
=
"page-wrapper-search"
>
{
/* 第一行:表单项 */
}
<
el
-
row
gutter
=
{
this
.
gutter
}
>
{
formItemCols
}
{
/* 折叠状态:按钮列与表单项在同一行 */
}
{
!
this
.
shouldWrapButtons
&&
buttonsCol
}
<
/el-row
>
{
/* 展开状态:按钮列在第二行 */
}
{
this
.
shouldWrapButtons
&&
(
<
el
-
row
gutter
=
{
this
.
gutter
}
style
=
"margin-top: 0;display: flex;justify-content: flex-end;"
>
{
buttonsCol
}
<
/el-row
>
)}
<
/el-form
>
)
}
}
</
script
>
<
style
lang=
"scss"
scoped
>
.page-wrapper-search
{
position
:
relative
;
background
:
white
;
padding
:
16px
;
}
:deep
(
.el-form-item
)
{
margin-bottom
:
18px
;
.el-form-item__label
{
color
:
#606266
;
font-weight
:
normal
;
}
.el-form-item__content
{
>
div
{
width
:
100%
;
}
.el-input
,
.el-select
,
.el-date-editor
{
width
:
100%
;
.el-input__inner
{
border-radius
:
4px
;
border
:
1px
solid
#DCDFE6
;
&:focus
{
border-color
:
#356CEF
;
}
}
}
.el-select
.el-input__inner
{
cursor
:
pointer
;
}
}
}
.advanced
{
display
:
inline-flex
;
align-items
:
center
;
color
:
#356CEF
;
font-size
:
14px
;
white-space
:
nowrap
;
cursor
:
pointer
;
margin-left
:
10px
;
vertical-align
:
middle
;
&:hover
{
color
:
#1257f7
;
}
&
-icon
{
margin-left
:
4px
;
}
}
.buttons-space
{
display
:
flex
;
justify-content
:
flex-end
;
align-items
:
center
;
width
:
100%
;
gap
:
12px
;
.el-button
{
border-radius
:
4px
;
font-size
:
14px
;
padding
:
10px
20px
;
height
:
32px
;
line-height
:
1
;
display
:
flex
;
align-items
:
center
;
justify-self
:
center
;
&.is-plain
{
border-color
:
#DCDFE6
;
color
:
#606266
;
&:hover
{
border-color
:
#356CEF
;
color
:
#356CEF
;
background-color
:
#ecf5ff
;
}
}
&
.el-button--primary
{
background-color
:
#356CEF
;
border-color
:
#356CEF
;
&:hover
{
background-color
:
#1257f7
;
border-color
:
#1257f7
;
}
}
}
}
.ElColButtons
{
:deep(.el-form-item__content)
{
display
:
flex
;
justify-content
:
flex-end
;
align-items
:
center
;
height
:
40px
;
}
}
.hidden
{
display
:
none
!important
;
}
@media
(
max-width
:
768px
)
{
.page-wrapper-search
{
padding
:
12px
;
}
.ElColButtons
{
:deep(.el-form-item__content)
{
justify-content
:
flex-start
;
height
:
auto
;
}
}
.buttons-space
{
justify-content
:
flex-start
;
flex-direction
:
column
;
align-items
:
flex-start
;
gap
:
8px
;
.el-button,
.advanced
{
width
:
100%
;
justify-content
:
center
;
}
}
}
</
style
>
\ No newline at end of file
ruoyi-admin-vue/src/layout/components/AppMain.vue
View file @
2ae44490
...
...
@@ -47,17 +47,25 @@ export default {
<
style
lang=
"scss"
scoped
>
.app-main
{
/* 50= navbar 50 */
min-height
:
calc
(
100vh
-
50px
);
//
min-height
:
calc
(
100vh
-
50px
);
width
:
100%
;
position
:
relative
;
overflow
:
hidden
;
flex
:
1
;
display
:
flex
;
flex-direction
:
column
;
background-color
:
#F3F5FB
;
}
.fixed-header
+
.app-main
{
overflow-y
:
auto
;
scrollbar-gutter
:
auto
;
height
:
calc
(
100vh
-
50px
);
min-height
:
0px
;
//
height
:
calc
(
100vh
-
50px
);
//
min-height
:
0px
;
flex
:
1
;
display
:
flex
;
flex-direction
:
column
;
background-color
:
#F3F5FB
;
}
.app-main
:has
(
.copyright
)
{
...
...
@@ -71,12 +79,16 @@ export default {
.hasTagsView
{
.app-main
{
/* 84 = navbar + tags-view = 50 + 34 */
min-height
:
calc
(
100vh
-
84px
);
//
min-height
:
calc
(
100vh
-
84px
);
flex
:
1
;
display
:
flex
;
flex-direction
:
column
;
background-color
:
#F3F5FB
;
}
.fixed-header
+
.app-main
{
margin-top
:
84px
;
height
:
calc
(
100vh
-
84px
);
//
height
:
calc
(
100vh
-
84px
);
min-height
:
0px
;
}
}
...
...
ruoyi-admin-vue/src/main.js
View file @
2ae44490
...
...
@@ -36,6 +36,10 @@ import DictTag from '@/components/DictTag'
// 字典数据组件
import
DictData
from
'@/components/DictData'
import
PageWrapperSearch
from
'@/components/Search/PageWrapperSearch.vue'
import
PageTitle
from
'@/components/PageTitle/index.vue'
// 全局方法挂载
Vue
.
prototype
.
getDicts
=
getDicts
Vue
.
prototype
.
getConfigKey
=
getConfigKey
...
...
@@ -55,6 +59,8 @@ Vue.component('Editor', Editor)
Vue
.
component
(
'FileUpload'
,
FileUpload
)
Vue
.
component
(
'ImageUpload'
,
ImageUpload
)
Vue
.
component
(
'ImagePreview'
,
ImagePreview
)
Vue
.
component
(
'PageWrapperSearch'
,
PageWrapperSearch
)
Vue
.
component
(
'PageTitle'
,
PageTitle
)
Vue
.
use
(
directive
)
Vue
.
use
(
plugins
)
...
...
ruoyi-admin-vue/src/views/system/dict/index.vue
View file @
2ae44490
<
template
>
<div
class=
"app-container"
>
<el-form
:model=
"queryParams"
ref=
"queryForm"
size=
"small"
:inline=
"true"
v-show=
"showSearch"
label-width=
"68px"
>
<el-form-item
label=
"字典名称"
prop=
"dictName"
>
<el-input
v-model=
"queryParams.dictName"
placeholder=
"请输入字典名称"
clearable
style=
"width: 240px"
@
keyup
.
enter
.
native=
"handleQuery"
/>
</el-form-item>
<el-form-item
label=
"字典类型"
prop=
"dictType"
>
<el-input
v-model=
"queryParams.dictType"
placeholder=
"请输入字典类型"
clearable
style=
"width: 240px"
@
keyup
.
enter
.
native=
"handleQuery"
/>
</el-form-item>
<el-form-item
label=
"状态"
prop=
"status"
>
<el-select
v-model=
"queryParams.status"
placeholder=
"字典状态"
clearable
style=
"width: 240px"
>
<el-option
v-for=
"dict in dict.type.sys_normal_disable"
:key=
"dict.value"
:label=
"dict.label"
:value=
"dict.value"
/>
</el-select>
</el-form-item>
<el-form-item
label=
"创建时间"
>
<el-date-picker
v-model=
"dateRange"
style=
"width: 240px"
value-format=
"yyyy-MM-dd"
type=
"daterange"
range-separator=
"-"
start-placeholder=
"开始日期"
end-placeholder=
"结束日期"
></el-date-picker>
</el-form-item>
<el-form-item>
<el-button
type=
"primary"
icon=
"el-icon-search"
size=
"mini"
@
click=
"handleQuery"
>
搜索
</el-button>
<el-button
icon=
"el-icon-refresh"
size=
"mini"
@
click=
"resetQuery"
>
重置
</el-button>
</el-form-item>
</el-form>
<el-row
:gutter=
"10"
class=
"mb8"
>
<el-col
:span=
"1.5"
>
<el-button
type=
"primary"
plain
icon=
"el-icon-plus"
size=
"mini"
@
click=
"handleAdd"
v-hasPermi=
"['system:dict:add']"
>
新增
</el-button>
</el-col>
<el-col
:span=
"1.5"
>
<el-button
type=
"success"
plain
icon=
"el-icon-edit"
size=
"mini"
:disabled=
"single"
@
click=
"handleUpdate"
v-hasPermi=
"['system:dict:edit']"
>
修改
</el-button>
</el-col>
<el-col
:span=
"1.5"
>
<el-button
type=
"danger"
plain
icon=
"el-icon-delete"
size=
"mini"
:disabled=
"multiple"
@
click=
"handleDelete"
v-hasPermi=
"['system:dict:remove']"
>
删除
</el-button>
</el-col>
<el-col
:span=
"1.5"
>
<el-button
type=
"warning"
plain
icon=
"el-icon-download"
size=
"mini"
@
click=
"handleExport"
v-hasPermi=
"['system:dict:export']"
>
导出
</el-button>
</el-col>
<el-col
:span=
"1.5"
>
<el-button
type=
"danger"
plain
icon=
"el-icon-refresh"
size=
"mini"
@
click=
"handleRefreshCache"
v-hasPermi=
"['system:dict:remove']"
>
刷新缓存
</el-button>
</el-col>
<right-toolbar
:showSearch
.
sync=
"showSearch"
@
queryTable=
"getList"
></right-toolbar>
</el-row>
<el-table
v-loading=
"loading"
:data=
"typeList"
@
selection-change=
"handleSelectionChange"
>
<el-table-column
type=
"selection"
width=
"55"
align=
"center"
/>
<el-table-column
label=
"字典编号"
align=
"center"
prop=
"dictId"
/>
<el-table-column
label=
"字典名称"
align=
"center"
prop=
"dictName"
:show-overflow-tooltip=
"true"
/>
<el-table-column
label=
"字典类型"
align=
"center"
:show-overflow-tooltip=
"true"
>
<template
slot-scope=
"scope"
>
<router-link
:to=
"'/system/dict-data/index/' + scope.row.dictId"
class=
"link-type"
>
<span>
{{
scope
.
row
.
dictType
}}
</span>
</router-link>
</
template
>
</el-table-column>
<el-table-column
label=
"状态"
align=
"center"
prop=
"status"
>
<
template
slot-scope=
"scope"
>
<dict-tag
:options=
"dict.type.sys_normal_disable"
:value=
"scope.row.status"
/>
</
template
>
</el-table-column>
<el-table-column
label=
"备注"
align=
"center"
prop=
"remark"
:show-overflow-tooltip=
"true"
/>
<el-table-column
label=
"创建时间"
align=
"center"
prop=
"createTime"
width=
"180"
>
<
template
slot-scope=
"scope"
>
<span>
{{
parseTime
(
scope
.
row
.
createTime
)
}}
</span>
</
template
>
</el-table-column>
<el-table-column
label=
"操作"
align=
"center"
class-name=
"small-padding fixed-width"
>
<
template
slot-scope=
"scope"
>
<PageTitle>
<template
#
buttons
>
<el-button
type=
"primary"
plain
icon=
"el-icon-plus"
size=
"medium"
@
click=
"handleAdd"
v-hasPermi=
"['system:dict:add']"
>
新增
</el-button>
<el-button
size=
"mini
"
type=
"text"
type=
"success
"
plain
icon=
"el-icon-edit"
@
click=
"handleUpdate(scope.row)"
size=
"medium"
:disabled=
"single"
@
click=
"handleUpdate"
v-hasPermi=
"['system:dict:edit']"
>
修改
</el-button>
<el-button
size=
"mini
"
type=
"text"
type=
"danger
"
plain
icon=
"el-icon-delete"
@
click=
"handleDelete(scope.row)"
size=
"medium"
:disabled=
"multiple"
@
click=
"handleDelete"
v-hasPermi=
"['system:dict:remove']"
>
删除
</el-button>
</
template
>
</el-table-column>
</el-table>
<el-button
type=
"warning"
plain
icon=
"el-icon-download"
size=
"medium"
@
click=
"handleExport"
v-hasPermi=
"['system:dict:export']"
>
导出
</el-button>
<el-button
type=
"danger"
plain
icon=
"el-icon-refresh"
size=
"medium"
@
click=
"handleRefreshCache"
v-hasPermi=
"['system:dict:remove']"
>
刷新缓存
</el-button>
</
template
>
</PageTitle>
<div
class=
"page-container"
>
<page-wrapper-search
:model=
"queryParams"
ref=
"queryForm"
size=
"small"
@
search=
"handleQuery"
@
reset=
"resetQuery"
>
<el-form-item
label=
"字典名称"
prop=
"dictName"
>
<el-input
v-model=
"queryParams.dictName"
placeholder=
"请输入字典名称"
clearable
@
keyup
.
enter
.
native=
"handleQuery"
/>
</el-form-item>
<el-form-item
label=
"字典类型"
prop=
"dictType"
>
<el-input
v-model=
"queryParams.dictType"
placeholder=
"请输入字典类型"
clearable
@
keyup
.
enter
.
native=
"handleQuery"
/>
</el-form-item>
<el-form-item
label=
"状态"
prop=
"status"
>
<el-select
v-model=
"queryParams.status"
placeholder=
"字典状态"
clearable
>
<el-option
v-for=
"dict in dict.type.sys_normal_disable"
:key=
"dict.value"
:label=
"dict.label"
:value=
"dict.value"
/>
</el-select>
</el-form-item>
<el-form-item
label=
"创建时间"
>
<el-date-picker
v-model=
"dateRange"
value-format=
"yyyy-MM-dd"
type=
"daterange"
range-separator=
"-"
start-placeholder=
"开始日期"
end-placeholder=
"结束日期"
></el-date-picker>
</el-form-item>
</page-wrapper-search>
<div
class=
"table-container"
>
<el-table
v-loading=
"loading"
height=
"100%"
:data=
"typeList"
@
selection-change=
"handleSelectionChange"
>
<el-table-column
type=
"selection"
width=
"55"
align=
"center"
/>
<el-table-column
label=
"字典编号"
align=
"center"
prop=
"dictId"
/>
<el-table-column
label=
"字典名称"
align=
"center"
prop=
"dictName"
:show-overflow-tooltip=
"true"
/>
<el-table-column
label=
"字典类型"
align=
"center"
:show-overflow-tooltip=
"true"
>
<
template
slot-scope=
"scope"
>
<router-link
:to=
"'/system/dict-data/index/' + scope.row.dictId"
class=
"link-type"
>
<span>
{{
scope
.
row
.
dictType
}}
</span>
</router-link>
</
template
>
</el-table-column>
<el-table-column
label=
"状态"
align=
"center"
prop=
"status"
>
<
template
slot-scope=
"scope"
>
<dict-tag
:options=
"dict.type.sys_normal_disable"
:value=
"scope.row.status"
/>
</
template
>
</el-table-column>
<el-table-column
label=
"备注"
align=
"center"
prop=
"remark"
:show-overflow-tooltip=
"true"
/>
<el-table-column
label=
"创建时间"
align=
"center"
prop=
"createTime"
width=
"180"
>
<
template
slot-scope=
"scope"
>
<span>
{{
parseTime
(
scope
.
row
.
createTime
)
}}
</span>
</
template
>
</el-table-column>
<el-table-column
label=
"操作"
align=
"center"
class-name=
"small-padding fixed-width"
>
<
template
slot-scope=
"scope"
>
<el-button
size=
"mini"
type=
"text"
icon=
"el-icon-edit"
@
click=
"handleUpdate(scope.row)"
v-hasPermi=
"['system:dict:edit']"
>
修改
</el-button>
<el-button
size=
"mini"
type=
"text"
icon=
"el-icon-delete"
@
click=
"handleDelete(scope.row)"
v-hasPermi=
"['system:dict:remove']"
>
删除
</el-button>
</
template
>
</el-table-column>
</el-table>
</div>
<pagination
v-show=
"total>0"
:total=
"total"
:page
.
sync=
"queryParams.pageNum"
:limit
.
sync=
"queryParams.pageSize"
@
pagination=
"getList"
/>
</div>
<pagination
v-show=
"total>0"
:total=
"total"
:page
.
sync=
"queryParams.pageNum"
:limit
.
sync=
"queryParams.pageSize"
@
pagination=
"getList"
/>
<!-- 添加或修改参数配置对话框 -->
<el-dialog
:title=
"title"
:visible
.
sync=
"open"
width=
"500px"
append-to-body
>
...
...
编写
预览
Markdown
格式
0%
重试
或
添加新文件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
请先完成此评论的编辑!
取消
请
注册
或者
登录
后发表评论