按UI调整系统管理界面
This commit is contained in:
wangchengming
parent
30e176fbda
commit
8b74ce11db
Binary file not shown.
|
Before Width: | Height: | Size: 5.5 KiB After Width: | Height: | Size: 15 KiB |
BIN
src/assets/images/otherbg.png
Normal file
BIN
src/assets/images/otherbg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 491 KiB |
BIN
src/assets/images/search_bg.png
Normal file
BIN
src/assets/images/search_bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
|
|
@ -18,6 +18,7 @@
|
||||||
.cell {
|
.cell {
|
||||||
.el-tag {
|
.el-tag {
|
||||||
margin-right: 0px;
|
margin-right: 0px;
|
||||||
|
font-size: 16px !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -122,7 +122,9 @@ aside {
|
||||||
|
|
||||||
//main-container全局样式
|
//main-container全局样式
|
||||||
.app-container {
|
.app-container {
|
||||||
padding: 20px;
|
width: 1840px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.components-container {
|
.components-container {
|
||||||
|
|
|
||||||
|
|
@ -7,53 +7,79 @@
|
||||||
.pt5 {
|
.pt5 {
|
||||||
padding-top: 5px;
|
padding-top: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.pr5 {
|
.pr5 {
|
||||||
padding-right: 5px;
|
padding-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.pb5 {
|
.pb5 {
|
||||||
padding-bottom: 5px;
|
padding-bottom: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mt5 {
|
.mt5 {
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mr5 {
|
.mr5 {
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mb5 {
|
.mb5 {
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mb8 {
|
.mb8 {
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ml5 {
|
.ml5 {
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mt10 {
|
.mt10 {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mr10 {
|
.mr10 {
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mb10 {
|
.mb10 {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ml10 {
|
.ml10 {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mt20 {
|
.mt20 {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mr20 {
|
.mr20 {
|
||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mb20 {
|
.mb20 {
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ml20 {
|
.ml20 {
|
||||||
margin-left: 20px;
|
margin-left: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
|
.h1,
|
||||||
|
.h2,
|
||||||
|
.h3,
|
||||||
|
.h4,
|
||||||
|
.h5,
|
||||||
|
.h6,
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
font-family: inherit;
|
font-family: inherit;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
line-height: 1.1;
|
line-height: 1.1;
|
||||||
|
|
@ -63,6 +89,7 @@
|
||||||
.el-form .el-form-item__label {
|
.el-form .el-form-item__label {
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-dialog:not(.is-fullscreen) {
|
.el-dialog:not(.is-fullscreen) {
|
||||||
margin-top: 6vh !important;
|
margin-top: 6vh !important;
|
||||||
}
|
}
|
||||||
|
|
@ -75,29 +102,44 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-table {
|
.el-table {
|
||||||
.el-table__header-wrapper, .el-table__fixed-header-wrapper {
|
|
||||||
|
.el-table__header-wrapper,
|
||||||
|
.el-table__fixed-header-wrapper {
|
||||||
th {
|
th {
|
||||||
|
font-family: Microsoft YaHei !important;
|
||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
background-color: #f8f8f9 !important;
|
background-color: #f4f4f3 !important;
|
||||||
color: #515a6e;
|
color: #3B3B3B;
|
||||||
height: 40px !important;
|
height: 50px !important;
|
||||||
font-size: 13px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-table__body-wrapper {
|
.el-table__body-wrapper {
|
||||||
.el-button [class*="el-icon-"] + span {
|
.el-button [class*="el-icon-"]+span {
|
||||||
margin-left: 1px;
|
margin-left: 1px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 设置行单元格样式
|
||||||
|
.el-table__cell {
|
||||||
|
font-family: Microsoft YaHei !important;
|
||||||
|
// font-weight: 400 !important;
|
||||||
|
font-size: 16px !important;
|
||||||
|
color: #1E1E1E !important;
|
||||||
|
padding: 4px 0px !important;
|
||||||
|
height: 54px !important;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 表单布局 **/
|
/** 表单布局 **/
|
||||||
.form-header {
|
.form-header {
|
||||||
font-size:15px;
|
font-size: 15px;
|
||||||
color:#6379bb;
|
color: #6379bb;
|
||||||
border-bottom:1px solid #ddd;
|
border-bottom: 1px solid #ddd;
|
||||||
margin:8px 10px 25px 10px;
|
margin: 8px 10px 25px 10px;
|
||||||
padding-bottom:5px
|
padding-bottom: 5px
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 表格布局 **/
|
/** 表格布局 **/
|
||||||
|
|
@ -123,10 +165,11 @@
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
.pagination-container {
|
.pagination-container {
|
||||||
.el-pagination {
|
.el-pagination {
|
||||||
> .el-pagination__jump {
|
>.el-pagination__jump {
|
||||||
display: none !important;
|
display: none !important;
|
||||||
}
|
}
|
||||||
> .el-pagination__sizes {
|
|
||||||
|
>.el-pagination__sizes {
|
||||||
display: none !important;
|
display: none !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -138,7 +181,7 @@
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
border: 1px solid var(--el-border-color-light, #e5e6e7);
|
border: 1px solid var(--el-border-color-light, #e5e6e7);
|
||||||
background: var(--el-bg-color, #FFFFFF) none;
|
background: var(--el-bg-color, #FFFFFF) none;
|
||||||
border-radius:4px;
|
border-radius: 4px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -155,15 +198,16 @@
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-table .el-dropdown, .el-icon-arrow-down {
|
.el-table .el-dropdown,
|
||||||
|
.el-icon-arrow-down {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-tree-node__content > .el-checkbox {
|
.el-tree-node__content>.el-checkbox {
|
||||||
margin-right: 8px;
|
margin-right: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.list-group-striped > .list-group-item {
|
.list-group-striped>.list-group-item {
|
||||||
border-left: 0;
|
border-left: 0;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
|
|
@ -201,6 +245,10 @@
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.el-button {
|
||||||
|
font-size: 16px !important;
|
||||||
|
}
|
||||||
|
|
||||||
/* button color */
|
/* button color */
|
||||||
.el-button--cyan.is-active,
|
.el-button--cyan.is-active,
|
||||||
.el-button--cyan:active {
|
.el-button--cyan:active {
|
||||||
|
|
@ -273,10 +321,10 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 拖拽列样式 */
|
/* 拖拽列样式 */
|
||||||
.sortable-ghost{
|
.sortable-ghost {
|
||||||
opacity: .8;
|
opacity: .8;
|
||||||
color: #fff!important;
|
color: #fff !important;
|
||||||
background: #42b983!important;
|
background: #42b983 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 表格右侧工具栏样式 */
|
/* 表格右侧工具栏样式 */
|
||||||
|
|
@ -288,3 +336,432 @@
|
||||||
.splitpanes.default-theme .splitpanes__pane {
|
.splitpanes.default-theme .splitpanes__pane {
|
||||||
background-color: var(--splitpanes-default-bg) !important;
|
background-color: var(--splitpanes-default-bg) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 自定义行样式
|
||||||
|
.my_row {
|
||||||
|
padding: 0px;
|
||||||
|
margin: 17px 0px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 按钮样式
|
||||||
|
.primaryBtn {
|
||||||
|
height: 30px;
|
||||||
|
border-radius: 15px 15px 15px 15px;
|
||||||
|
background: #1a75e6;
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
text-align: center;
|
||||||
|
color: #FFFFFF;
|
||||||
|
padding: 7px 25px 8px 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.primaryBtn:hover {
|
||||||
|
background: #1a75e6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-form-item.is-required:not(.is-no-asterisk).asterisk-left>.el-form-item__label-wrap>.el-form-item__label:before,
|
||||||
|
.el-form-item.is-required:not(.is-no-asterisk).asterisk-left>.el-form-item__label:before {
|
||||||
|
color: #FF2A00;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 确认消息框
|
||||||
|
.el-message-box__header {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #000000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-message-box__content {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #525252;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询条件表单样式覆盖
|
||||||
|
.searchPanel {
|
||||||
|
width: 1840px;
|
||||||
|
height: 45px;
|
||||||
|
line-height: 45px;
|
||||||
|
background: rgba(255, 255, 255, 0.06);
|
||||||
|
border-top: 1px solid rgba(255, 255, 255, 0.3);
|
||||||
|
border-bottom: 1px solid rgba(255, 255, 255, 0.3);
|
||||||
|
margin-bottom: 20px;
|
||||||
|
padding: 0 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-form-item--default {
|
||||||
|
margin-bottom: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-form--inline .el-form-item {
|
||||||
|
display: inline-flex;
|
||||||
|
margin-right: 26px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-form-item__label {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
min-width: 34px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 文本输入框样式
|
||||||
|
.searchPanelForm .el-input__inner {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-input__clear {
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-input__clear:hover {
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-input__inner::placeholder {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-input__wrapper {
|
||||||
|
background-color: transparent;
|
||||||
|
border-radius: 0;
|
||||||
|
box-shadow: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 选择框样式
|
||||||
|
.searchPanelForm .el-select__wrapper {
|
||||||
|
background-color: transparent;
|
||||||
|
border-radius: 0;
|
||||||
|
box-shadow: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-select__wrapper.is-hovering:not(.is-focused) {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-select__placeholder {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-select__caret {
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询日期框样式
|
||||||
|
.searchPanelForm .el-date-editor .el-range__icon {
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-date-editor .el-range-separator {
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-date-editor .el-range-input {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-date-editor .el-range-input::placeholder {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-date-editor .el-range__close-icon {
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchPanelForm .el-date-editor.el-input__wrapper:hover {
|
||||||
|
background-color: transparent;
|
||||||
|
border-radius: 0;
|
||||||
|
box-shadow: none !important;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 分页器
|
||||||
|
.pagination-container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
background-color: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-pagination .el-pagination__sizes,
|
||||||
|
.el-pagination__total {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
text-align: center;
|
||||||
|
color: #000001;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-pagination .el-pagination__jump {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
text-align: center;
|
||||||
|
color: #000001;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-pagination .el-select__placeholder {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
text-align: center;
|
||||||
|
color: #000001;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-pagination .el-pagination__editor.el-input {
|
||||||
|
width: 48px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-pagination .el-input__wrapper {
|
||||||
|
height: 28px;
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
background: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-pagination .el-select {
|
||||||
|
width: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-pagination .el-select__wrapper {
|
||||||
|
height: 28px;
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
background: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-pagination.is-background .btn-prev,
|
||||||
|
.my-pagination.is-background .el-pager li,
|
||||||
|
.my-pagination.is-background .btn-next {
|
||||||
|
width: 30px;
|
||||||
|
height: 28px;
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
background: #f4f4f5;
|
||||||
|
font-family: Arial;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
text-align: center;
|
||||||
|
color: #000000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-pagination.is-background .btn-next.is-active,
|
||||||
|
.my-pagination.is-background .btn-prev.is-active,
|
||||||
|
.my-pagination.is-background .el-pager li.is-active {
|
||||||
|
background-color: #467CF6;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-pagination .btn-next .el-icon,
|
||||||
|
.my-pagination .btn-prev .el-icon {
|
||||||
|
fill: #C2CAD6;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 主内容显示面板
|
||||||
|
.el-card {
|
||||||
|
border: none;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-card__body {
|
||||||
|
padding: 0px 20px 20px 20px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-card.is-always-shadow {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-card__header {
|
||||||
|
height: 60px;
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #000000;
|
||||||
|
border-bottom: 1px solid #DCDCDC;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 20px 30px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subHeaderTitle {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #000000;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 弹窗样式覆盖
|
||||||
|
.my_dialog {
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my_dialog .el-dialog__header {
|
||||||
|
border-bottom: 1px solid #D4DAE1 !important;
|
||||||
|
padding: 16px;
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #000000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my_dialog .el-dialog__headerbtn {
|
||||||
|
top: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my_dialog .el-dialog__headerbtn .el-dialog__close {
|
||||||
|
color: #000000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my_dialog .el-dialog__body {
|
||||||
|
// font-family: Microsoft YaHei;
|
||||||
|
// font-weight: 400;
|
||||||
|
// font-size: 16px;
|
||||||
|
// color: #3B3B3B;
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my_dialog .el-dialog__footer {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 16px;
|
||||||
|
text-align: right;
|
||||||
|
border-top: 1px solid #D4DAE1 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 表单录入样式
|
||||||
|
.myInsertForm .el-form-item--default {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-form--inline .el-form-item {
|
||||||
|
display: inline-flex;
|
||||||
|
margin-right: 26px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-form-item__label {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #3B3B3B;
|
||||||
|
// min-width: 34px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 文本输入框样式
|
||||||
|
.myInsertForm .el-input__inner {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #525252;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-input__clear {
|
||||||
|
color: #B8B8B8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-input__clear:hover {
|
||||||
|
color: #B8B8B8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-input__inner::placeholder {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #B8B8B8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-input__wrapper {
|
||||||
|
// background-color: transparent;
|
||||||
|
// border-radius: 0;
|
||||||
|
// box-shadow: none;
|
||||||
|
// padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 选择框样式
|
||||||
|
.myInsertForm .el-select__wrapper {
|
||||||
|
// background-color: transparent;
|
||||||
|
// border-radius: 0;
|
||||||
|
// box-shadow: none;
|
||||||
|
// padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-select__wrapper.is-hovering:not(.is-focused) {
|
||||||
|
// box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-select__placeholder {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-select__caret {
|
||||||
|
color: #B8B8B8;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 单选框
|
||||||
|
.myInsertForm .el-radio__inner {
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-radio__label {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #525252;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 复选框
|
||||||
|
.myInsertForm .el-checkbox__inner {
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-checkbox__label {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #525252;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 树选择
|
||||||
|
.myInsertForm .el-text--default {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #525252;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 多文本输入框
|
||||||
|
.myInsertForm .el-textarea__inner {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #525252;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myInsertForm .el-textarea__inner::placeholder {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #B8B8B8;
|
||||||
|
}
|
||||||
|
|
@ -5,7 +5,7 @@
|
||||||
.main-container {
|
.main-container {
|
||||||
min-height: 100%;
|
min-height: 100%;
|
||||||
transition: margin-left .28s;
|
transition: margin-left .28s;
|
||||||
margin-left: vars.$base-sidebar-width;
|
// margin-left: vars.$base-sidebar-width;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -128,9 +128,12 @@ html.dark {
|
||||||
|
|
||||||
/* 侧边栏菜单覆盖 */
|
/* 侧边栏菜单覆盖 */
|
||||||
.sidebar-container {
|
.sidebar-container {
|
||||||
.el-menu-item, .menu-title {
|
|
||||||
|
.el-menu-item,
|
||||||
|
.menu-title {
|
||||||
color: var(--el-text-color-regular);
|
color: var(--el-text-color-regular);
|
||||||
}
|
}
|
||||||
|
|
||||||
& .theme-dark .nest-menu .el-sub-menu>.el-sub-menu__title,
|
& .theme-dark .nest-menu .el-sub-menu>.el-sub-menu__title,
|
||||||
& .theme-dark .el-sub-menu .el-menu-item {
|
& .theme-dark .el-sub-menu .el-menu-item {
|
||||||
background-color: var(--el-bg-color) !important;
|
background-color: var(--el-bg-color) !important;
|
||||||
|
|
@ -141,6 +144,7 @@ html.dark {
|
||||||
.el-menu--horizontal {
|
.el-menu--horizontal {
|
||||||
.el-menu-item {
|
.el-menu-item {
|
||||||
&:not(.is-disabled) {
|
&:not(.is-disabled) {
|
||||||
|
|
||||||
&:hover,
|
&:hover,
|
||||||
&:focus {
|
&:focus {
|
||||||
background-color: var(--navbar-hover) !important;
|
background-color: var(--navbar-hover) !important;
|
||||||
|
|
@ -180,17 +184,23 @@ html.dark {
|
||||||
--el-table-border-color: var(--el-border-color-light) !important;
|
--el-table-border-color: var(--el-border-color-light) !important;
|
||||||
--el-table-row-hover-bg-color: var(--el-bg-color-overlay) !important;
|
--el-table-row-hover-bg-color: var(--el-bg-color-overlay) !important;
|
||||||
|
|
||||||
.el-table__header-wrapper, .el-table__fixed-header-wrapper {
|
.el-table__header-wrapper,
|
||||||
|
.el-table__fixed-header-wrapper {
|
||||||
th {
|
th {
|
||||||
background-color: var(--el-bg-color-overlay, #f8f8f9) !important;
|
background-color: var(--el-bg-color-overlay, #f8f8f9) !important;
|
||||||
color: var(--el-text-color-regular, #515a6e);
|
color: var(--el-text-color-regular, #515a6e);
|
||||||
}
|
|
||||||
|
font-weight: 600 !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* 树组件高亮样式覆盖 */
|
/* 树组件高亮样式覆盖 */
|
||||||
.el-tree {
|
.el-tree {
|
||||||
.el-tree-node.is-current > .el-tree-node__content {
|
.el-tree-node.is-current>.el-tree-node__content {
|
||||||
background-color: var(--el-bg-color-overlay) !important;
|
background-color: var(--el-bg-color-overlay) !important;
|
||||||
color: var(--el-color-primary);
|
color: var(--el-color-primary);
|
||||||
}
|
}
|
||||||
|
|
@ -201,7 +211,8 @@ html.dark {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 下拉菜单样式覆盖 */
|
/* 下拉菜单样式覆盖 */
|
||||||
.el-dropdown-menu__item:not(.is-disabled):focus, .el-dropdown-menu__item:not(.is-disabled):hover{
|
.el-dropdown-menu__item:not(.is-disabled):focus,
|
||||||
|
.el-dropdown-menu__item:not(.is-disabled):hover {
|
||||||
background-color: var(--navbar-hover) !important;
|
background-color: var(--navbar-hover) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -218,4 +229,3 @@ html.dark {
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div :class="{ 'hidden': hidden }" class="pagination-container">
|
<div :class="{ 'hidden': hidden }" class="pagination-container">
|
||||||
<el-pagination
|
<el-pagination
|
||||||
|
class="my-pagination"
|
||||||
:background="background"
|
:background="background"
|
||||||
v-model:current-page="currentPage"
|
v-model:current-page="currentPage"
|
||||||
v-model:page-size="pageSize"
|
v-model:page-size="pageSize"
|
||||||
|
|
|
||||||
|
|
@ -1,22 +1,27 @@
|
||||||
<template>
|
<template>
|
||||||
<el-menu :default-active="activeMenu" mode="horizontal" @select="handleSelect" :ellipsis="false">
|
<el-menu :default-active="activeMenu" mode="horizontal" @select="handleSelect" :ellipsis="false">
|
||||||
<template v-for="(item, index) in topMenus">
|
<template v-for="(item, index) in topMenus">
|
||||||
<el-menu-item :style="{ '--theme': theme }" :index="item.path" :key="index" v-if="index < visibleNumber">
|
<el-menu-item v-if="!item.children" :style="{ '--theme': theme }" :index="item.path">
|
||||||
<svg-icon v-if="item.meta && item.meta.icon && item.meta.icon !== '#'" :icon-class="item.meta.icon" />
|
<svg-icon v-if="item.meta && item.meta.icon && item.meta.icon !== '#'" :icon-class="item.meta.icon"
|
||||||
{{ item.meta.title }}
|
class="navIcon" />
|
||||||
|
<span>{{ item.meta.title }}</span>
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
</template>
|
<el-sub-menu v-else :style="{ '--theme': theme }" :index="item.path">
|
||||||
|
|
||||||
<!-- 顶部菜单超出数量折叠 -->
|
<template #title>
|
||||||
<el-sub-menu :style="{ '--theme': theme }" index="more" v-if="topMenus.length > visibleNumber">
|
<svg-icon v-if="item.meta && item.meta.icon && item.meta.icon !== '#'" :icon-class="item.meta.icon"
|
||||||
<template #title>更多菜单</template>
|
class="navIcon" />
|
||||||
<template v-for="(item, index) in topMenus">
|
<span>{{ item.meta.title }}</span>
|
||||||
<el-menu-item :index="item.path" :key="index" v-if="index >= visibleNumber">
|
</template>
|
||||||
<svg-icon v-if="item.meta && item.meta.icon && item.meta.icon !== '#'" :icon-class="item.meta.icon" />
|
<template v-for="(subItem, index) in item.children">
|
||||||
{{ item.meta.title }}
|
<el-menu-item :style="{ '--theme': theme }" :index="subItem.path">
|
||||||
|
<svg-icon v-if="subItem.meta && subItem.meta.icon && subItem.meta.icon !== '#'"
|
||||||
|
:icon-class="subItem.meta.icon" />
|
||||||
|
{{ subItem.meta.title }}
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
</template>
|
</template>
|
||||||
</el-sub-menu>
|
</el-sub-menu>
|
||||||
|
</template>
|
||||||
</el-menu>
|
</el-menu>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -43,212 +48,7 @@ const router = useRouter()
|
||||||
// 主题颜色
|
// 主题颜色
|
||||||
const theme = computed(() => settingsStore.theme)
|
const theme = computed(() => settingsStore.theme)
|
||||||
// 所有的路由信息
|
// 所有的路由信息
|
||||||
// const routers = computed(() => permissionStore.topbarRouters)
|
const routers = computed(() => permissionStore.topbarRouters)
|
||||||
const routers = ref([
|
|
||||||
{
|
|
||||||
path: "/",
|
|
||||||
hidden: false,
|
|
||||||
component: "Layout",
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
name: "工作台",
|
|
||||||
path: "index",
|
|
||||||
hidden: false,
|
|
||||||
component: "index",
|
|
||||||
meta: {
|
|
||||||
title: "工作台",
|
|
||||||
noCache: false,
|
|
||||||
link: null
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "/",
|
|
||||||
hidden: false,
|
|
||||||
component: "Layout",
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
name: "媒体库管理",
|
|
||||||
path: "mediaLibrary",
|
|
||||||
hidden: false,
|
|
||||||
component: "index",
|
|
||||||
meta: {
|
|
||||||
title: "媒体库管理",
|
|
||||||
noCache: false,
|
|
||||||
link: null
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "/",
|
|
||||||
hidden: false,
|
|
||||||
component: "Layout",
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
name: "户外媒介数据",
|
|
||||||
path: "outdoorMedia",
|
|
||||||
hidden: false,
|
|
||||||
component: "index",
|
|
||||||
meta: {
|
|
||||||
title: "户外媒介数据",
|
|
||||||
noCache: false,
|
|
||||||
link: null
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "/",
|
|
||||||
hidden: false,
|
|
||||||
component: "Layout",
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
name: "供应商",
|
|
||||||
path: "supplier",
|
|
||||||
hidden: false,
|
|
||||||
component: "index",
|
|
||||||
meta: {
|
|
||||||
title: "供应商",
|
|
||||||
noCache: false,
|
|
||||||
link: null
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: "/",
|
|
||||||
hidden: false,
|
|
||||||
component: "Layout",
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
name: "问题反馈",
|
|
||||||
path: "problemFeedback",
|
|
||||||
hidden: false,
|
|
||||||
component: "index",
|
|
||||||
meta: {
|
|
||||||
title: "问题反馈",
|
|
||||||
noCache: false,
|
|
||||||
link: null
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "System",
|
|
||||||
"path": "/system",
|
|
||||||
"hidden": false,
|
|
||||||
"redirect": "noRedirect",
|
|
||||||
"component": "Layout",
|
|
||||||
"alwaysShow": true,
|
|
||||||
"meta": {
|
|
||||||
"title": "系统管理",
|
|
||||||
"noCache": false,
|
|
||||||
"link": null
|
|
||||||
},
|
|
||||||
"children": [
|
|
||||||
{
|
|
||||||
"name": "Menu",
|
|
||||||
"path": "menu",
|
|
||||||
"hidden": false,
|
|
||||||
"component": "system/menu/index",
|
|
||||||
"meta": {
|
|
||||||
"title": "菜单管理",
|
|
||||||
"icon": "#",
|
|
||||||
"noCache": false,
|
|
||||||
"link": null
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "Dept",
|
|
||||||
"path": "dept",
|
|
||||||
"hidden": false,
|
|
||||||
"component": "system/dept/index",
|
|
||||||
"meta": {
|
|
||||||
"title": "部门管理",
|
|
||||||
"icon": "#",
|
|
||||||
"noCache": false,
|
|
||||||
"link": null
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "Role",
|
|
||||||
"path": "role",
|
|
||||||
"hidden": false,
|
|
||||||
"component": "system/role/index",
|
|
||||||
"meta": {
|
|
||||||
"title": "角色管理",
|
|
||||||
"icon": "#",
|
|
||||||
"noCache": false,
|
|
||||||
"link": null
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "User",
|
|
||||||
"path": "user",
|
|
||||||
"hidden": false,
|
|
||||||
"component": "system/user/index",
|
|
||||||
"meta": {
|
|
||||||
"title": "用户管理",
|
|
||||||
"icon": "#",
|
|
||||||
"noCache": false,
|
|
||||||
"link": null
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "Locality",
|
|
||||||
"path": "locality",
|
|
||||||
"hidden": false,
|
|
||||||
"component": "system/locality/index",
|
|
||||||
"meta": {
|
|
||||||
"title": "属地管理",
|
|
||||||
"icon": "#",
|
|
||||||
"noCache": false,
|
|
||||||
"link": null
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "Section",
|
|
||||||
"path": "section",
|
|
||||||
"hidden": false,
|
|
||||||
"component": "system/section/index",
|
|
||||||
"meta": {
|
|
||||||
"title": "科室管理",
|
|
||||||
"icon": "#",
|
|
||||||
"noCache": false,
|
|
||||||
"link": null
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "UserApproval",
|
|
||||||
"path": "userApproval",
|
|
||||||
"hidden": false,
|
|
||||||
"component": "system/userApproval/index",
|
|
||||||
"meta": {
|
|
||||||
"title": "新用户审批",
|
|
||||||
"icon": "#",
|
|
||||||
"noCache": false,
|
|
||||||
"link": null
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"name": "Dict",
|
|
||||||
"path": "dict",
|
|
||||||
"hidden": false,
|
|
||||||
"component": "system/dict/index",
|
|
||||||
"meta": {
|
|
||||||
"title": "字典管理",
|
|
||||||
"icon": "#",
|
|
||||||
"noCache": false,
|
|
||||||
"link": null
|
|
||||||
}
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
])
|
|
||||||
|
|
||||||
console.log('routers', routers.value)
|
|
||||||
|
|
||||||
// 顶部显示菜单
|
// 顶部显示菜单
|
||||||
const topMenus = computed(() => {
|
const topMenus = computed(() => {
|
||||||
|
|
@ -266,8 +66,6 @@ const topMenus = computed(() => {
|
||||||
return topMenus
|
return topMenus
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// 设置子路由
|
// 设置子路由
|
||||||
const childrenMenus = computed(() => {
|
const childrenMenus = computed(() => {
|
||||||
let childrenMenus = []
|
let childrenMenus = []
|
||||||
|
|
@ -297,20 +95,18 @@ const activeMenu = computed(() => {
|
||||||
const tmpPath = path.substring(1, path.length)
|
const tmpPath = path.substring(1, path.length)
|
||||||
if (!route.meta.link) {
|
if (!route.meta.link) {
|
||||||
activePath = "/" + tmpPath.substring(0, tmpPath.indexOf("/"))
|
activePath = "/" + tmpPath.substring(0, tmpPath.indexOf("/"))
|
||||||
appStore.toggleSideBarHide(false)
|
// appStore.toggleSideBarHide(false)
|
||||||
}
|
}
|
||||||
} else if (!route.children) {
|
} else if (!route.children) {
|
||||||
activePath = path
|
activePath = path
|
||||||
appStore.toggleSideBarHide(true)
|
// appStore.toggleSideBarHide(true)
|
||||||
}
|
}
|
||||||
activeRoutes(activePath)
|
activeRoutes(activePath)
|
||||||
return activePath
|
return activePath
|
||||||
})
|
})
|
||||||
|
|
||||||
function setVisibleNumber() {
|
function setVisibleNumber() {
|
||||||
console.log('sdfsda')
|
|
||||||
const width = document.body.getBoundingClientRect().width / 3
|
const width = document.body.getBoundingClientRect().width / 3
|
||||||
console.log('sdfsda', width)
|
|
||||||
visibleNumber.value = parseInt(width / 85)
|
visibleNumber.value = parseInt(width / 85)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -329,11 +125,11 @@ function handleSelect(key, keyPath) {
|
||||||
} else {
|
} else {
|
||||||
router.push({ path: key })
|
router.push({ path: key })
|
||||||
}
|
}
|
||||||
appStore.toggleSideBarHide(true)
|
// appStore.toggleSideBarHide(true)
|
||||||
} else {
|
} else {
|
||||||
// 显示左侧联动菜单
|
// 显示左侧联动菜单
|
||||||
activeRoutes(key)
|
activeRoutes(key)
|
||||||
appStore.toggleSideBarHide(false)
|
// appStore.toggleSideBarHide(false)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -349,7 +145,7 @@ function activeRoutes(key) {
|
||||||
if (routes.length > 0) {
|
if (routes.length > 0) {
|
||||||
permissionStore.setSidebarRouters(routes)
|
permissionStore.setSidebarRouters(routes)
|
||||||
} else {
|
} else {
|
||||||
appStore.toggleSideBarHide(true)
|
// appStore.toggleSideBarHide(true)
|
||||||
}
|
}
|
||||||
return routes
|
return routes
|
||||||
}
|
}
|
||||||
|
|
@ -405,57 +201,70 @@ onMounted(() => {
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 带有二级菜单的 item */
|
||||||
|
.el-menu--horizontal>.el-sub-menu .el-sub-menu__title {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
padding: 0px !important;
|
||||||
|
margin: 0 36px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-menu--horizontal>.el-sub-menu .el-sub-menu__title:hover {
|
||||||
|
border-bottom: 2px solid #FFFFFF;
|
||||||
|
color: #FFFFFF !important;
|
||||||
|
background-color: transparent !important;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* 背景色隐藏 */
|
||||||
|
.el-menu--horizontal>.el-menu-item:not(.is-disabled):focus,
|
||||||
|
.el-menu--horizontal>.el-menu-item:not(.is-disabled):hover,
|
||||||
|
.el-menu--horizontal>.el-submenu .el-submenu__title:hover {
|
||||||
|
color: #FFFFFF !important;
|
||||||
|
background-color: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 悬浮子菜单样式
|
||||||
|
.el-menu--horizontal.el-menu--popup-container {
|
||||||
|
border-radius: 4px 4px 4px 4px !important;
|
||||||
|
border: 0px solid #3672eb;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-menu--popup {
|
||||||
|
border-radius: 4px 4px 4px 4px;
|
||||||
|
background: #ffffff;
|
||||||
|
box-shadow: 0 0 8px 0 #00328214;
|
||||||
|
min-width: auto !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-popper.is-light,
|
||||||
|
.el-popper.is-light>.el-popper__arrow:before {
|
||||||
|
border: 0px solid #3672eb !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 二级菜单未选中样式
|
||||||
|
.el-menu--horizontal .el-menu .el-menu-item,
|
||||||
|
.el-menu--horizontal .el-menu .el-sub-menu__title {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #1E1E1E;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 二级菜单悬浮和选中样式
|
||||||
.el-menu--horizontal .el-menu .el-menu-item:hover {
|
.el-menu--horizontal .el-menu .el-menu-item:hover {
|
||||||
color: #ffffff !important;
|
font-weight: 600 !important;
|
||||||
background: #545454 !important;
|
font-size: 16px !important;
|
||||||
|
color: #1A75E6 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-menu--horizontal .el-menu .el-menu-item.is-active {
|
.el-menu--horizontal .el-menu .el-menu-item.is-active {
|
||||||
color: #ffffff !important;
|
font-weight: 600 !important;
|
||||||
background: #545454 !important;
|
font-size: 16px !important;
|
||||||
|
color: #1A75E6 !important;
|
||||||
}
|
}
|
||||||
|
</style>
|
||||||
// .topmenu-container.el-menu--horizontal>.el-menu-item {
|
|
||||||
// float: left;
|
|
||||||
// height: 50px !important;
|
|
||||||
// line-height: 50px !important;
|
|
||||||
// color: #999093 !important;
|
|
||||||
// padding: 0 5px !important;
|
|
||||||
// margin: 0 10px !important;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// .topmenu-container.el-menu--horizontal>.el-menu-item.is-active,
|
|
||||||
// .el-menu--horizontal>.el-sub-menu.is-active .el-submenu__title {
|
|
||||||
// border-bottom: 2px solid #{'var(--theme)'} !important;
|
|
||||||
// color: #303133;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// /* sub-menu item */
|
|
||||||
// .topmenu-container.el-menu--horizontal>.el-sub-menu .el-sub-menu__title {
|
|
||||||
// float: left;
|
|
||||||
// height: 50px !important;
|
|
||||||
// line-height: 50px !important;
|
|
||||||
// color: #999093 !important;
|
|
||||||
// padding: 0 5px !important;
|
|
||||||
// margin: 0 10px !important;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// /* 背景色隐藏 */
|
|
||||||
// .topmenu-container.el-menu--horizontal>.el-menu-item:not(.is-disabled):focus,
|
|
||||||
// .topmenu-container.el-menu--horizontal>.el-menu-item:not(.is-disabled):hover,
|
|
||||||
// .topmenu-container.el-menu--horizontal>.el-submenu .el-submenu__title:hover {
|
|
||||||
// background-color: #ffffff;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// /* 图标右间距 */
|
|
||||||
// .topmenu-container .svg-icon {
|
|
||||||
// margin-right: 4px;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// /* topmenu more arrow */
|
|
||||||
// .topmenu-container .el-sub-menu .el-sub-menu__icon-arrow {
|
|
||||||
// position: static;
|
|
||||||
// vertical-align: middle;
|
|
||||||
// margin-left: 8px;
|
|
||||||
// margin-top: 0px;
|
|
||||||
// }</style>
|
|
||||||
|
|
|
||||||
|
|
@ -54,6 +54,7 @@ const logout = () => {
|
||||||
ElMessageBox.confirm('确定注销并退出系统吗？', '提示', {
|
ElMessageBox.confirm('确定注销并退出系统吗？', '提示', {
|
||||||
confirmButtonText: '确定',
|
confirmButtonText: '确定',
|
||||||
cancelButtonText: '取消',
|
cancelButtonText: '取消',
|
||||||
|
closeOnClickModal: false, // 禁止点击遮罩层关闭
|
||||||
type: 'warning'
|
type: 'warning'
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
userStore.logOut().then(() => {
|
userStore.logOut().then(() => {
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,8 @@
|
||||||
<template>
|
<template>
|
||||||
<div :class="classObj" class="app-wrapper" :style="{ '--current-color': theme }">
|
<div :class="classObj" class="app-wrapper"
|
||||||
<div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside"/>
|
:style="{ '--current-color': theme, 'backgroundImage': `url(${bgStore.bgImage})` }">
|
||||||
<sidebar v-if="!sidebar.hide" class="sidebar-container" />
|
<div v-if="device === 'mobile' && sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
|
||||||
|
<!-- <sidebar v-if="!sidebar.hide" class="sidebar-container" /> -->
|
||||||
<div :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }" class="main-container">
|
<div :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }" class="main-container">
|
||||||
<div :class="{ 'fixed-header': fixedHeader }">
|
<div :class="{ 'fixed-header': fixedHeader }">
|
||||||
<navbar @setLayout="setLayout" />
|
<navbar @setLayout="setLayout" />
|
||||||
|
|
@ -19,6 +20,8 @@ import Sidebar from './components/Sidebar/index.vue'
|
||||||
import { AppMain, Navbar, Settings, TagsView } from './components'
|
import { AppMain, Navbar, Settings, TagsView } from './components'
|
||||||
import useAppStore from '@/store/modules/app'
|
import useAppStore from '@/store/modules/app'
|
||||||
import useSettingsStore from '@/store/modules/settings'
|
import useSettingsStore from '@/store/modules/settings'
|
||||||
|
import { useBackgroundStore } from '@/store/modules/background'
|
||||||
|
const bgStore = useBackgroundStore()
|
||||||
|
|
||||||
const settingsStore = useSettingsStore()
|
const settingsStore = useSettingsStore()
|
||||||
const theme = computed(() => settingsStore.theme)
|
const theme = computed(() => settingsStore.theme)
|
||||||
|
|
@ -28,6 +31,7 @@ const device = computed(() => useAppStore().device)
|
||||||
const needTagsView = computed(() => settingsStore.tagsView)
|
const needTagsView = computed(() => settingsStore.tagsView)
|
||||||
const fixedHeader = computed(() => settingsStore.fixedHeader)
|
const fixedHeader = computed(() => settingsStore.fixedHeader)
|
||||||
|
|
||||||
|
|
||||||
const classObj = computed(() => ({
|
const classObj = computed(() => ({
|
||||||
hideSidebar: !sidebar.value.opened,
|
hideSidebar: !sidebar.value.opened,
|
||||||
openSidebar: sidebar.value.opened,
|
openSidebar: sidebar.value.opened,
|
||||||
|
|
@ -70,8 +74,14 @@ function setLayout() {
|
||||||
.app-wrapper {
|
.app-wrapper {
|
||||||
@include mix.clearfix;
|
@include mix.clearfix;
|
||||||
position: relative;
|
position: relative;
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
height: 100vh;
|
||||||
|
background-position: top;
|
||||||
|
/* 顶部对齐 */
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
/* 禁止平铺 */
|
||||||
|
background-size: cover;
|
||||||
|
/* 完全覆盖容器 */
|
||||||
|
|
||||||
&.mobile.openSidebar {
|
&.mobile.openSidebar {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
|
@ -94,7 +104,8 @@ function setLayout() {
|
||||||
top: 0;
|
top: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
z-index: 9;
|
z-index: 9;
|
||||||
width: calc(100% - #{vars.$base-sidebar-width});
|
// width: calc(100% - #{vars.$base-sidebar-width});
|
||||||
|
width: 100%;
|
||||||
transition: width 0.28s;
|
transition: width 0.28s;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -56,6 +56,7 @@ export default {
|
||||||
return ElMessageBox.confirm(content, "系统提示", {
|
return ElMessageBox.confirm(content, "系统提示", {
|
||||||
confirmButtonText: '确定',
|
confirmButtonText: '确定',
|
||||||
cancelButtonText: '取消',
|
cancelButtonText: '取消',
|
||||||
|
closeOnClickModal: false, // 禁止点击遮罩层关闭
|
||||||
type: "warning",
|
type: "warning",
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
@ -64,6 +65,7 @@ export default {
|
||||||
return ElMessageBox.prompt(content, "系统提示", {
|
return ElMessageBox.prompt(content, "系统提示", {
|
||||||
confirmButtonText: '确定',
|
confirmButtonText: '确定',
|
||||||
cancelButtonText: '取消',
|
cancelButtonText: '取消',
|
||||||
|
closeOnClickModal: false, // 禁止点击遮罩层关闭
|
||||||
type: "warning",
|
type: "warning",
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,3 @@
|
||||||
import { fa } from "element-plus/es/locales.mjs";
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
/**
|
/**
|
||||||
* 网页标题
|
* 网页标题
|
||||||
|
|
|
||||||
15
src/store/modules/background.js
Normal file
15
src/store/modules/background.js
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
// stores/background.js
|
||||||
|
import { defineStore } from 'pinia'
|
||||||
|
import bigBackgroud from '@/assets/images/bigBackgroud.png'
|
||||||
|
|
||||||
|
export const useBackgroundStore = defineStore('background', {
|
||||||
|
state: () => ({
|
||||||
|
bgImage: bigBackgroud
|
||||||
|
}),
|
||||||
|
actions: {
|
||||||
|
setBgImage(newImage) {
|
||||||
|
console.log('接收', newImage)
|
||||||
|
this.bgImage = newImage
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
@ -57,12 +57,20 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="Index">
|
<script setup name="Index">
|
||||||
import { ref } from 'vue';
|
import { onMounted, ref } from 'vue';
|
||||||
import mediaMap from '@/assets/images/mediaMap.png'
|
import mediaMap from '@/assets/images/mediaMap.png'
|
||||||
import supplierManage from '@/assets/images/supplierManage.png'
|
import supplierManage from '@/assets/images/supplierManage.png'
|
||||||
import mediaLibary from '@/assets/images/mediaLibary.png'
|
import mediaLibary from '@/assets/images/mediaLibary.png'
|
||||||
import outdoorMediaMap from '@/assets/images/outdoorMediaMap.png'
|
import outdoorMediaMap from '@/assets/images/outdoorMediaMap.png'
|
||||||
import notic_icon from '@/assets/images/notic-icon.png'
|
import notic_icon from '@/assets/images/notic-icon.png'
|
||||||
|
import {useBackgroundStore} from '@/store/modules/background'
|
||||||
|
import bigBackgroud from '@/assets/images/bigBackgroud.png'
|
||||||
|
const bgStore = useBackgroundStore()
|
||||||
|
|
||||||
|
// 初始化
|
||||||
|
onMounted(() => {
|
||||||
|
bgStore.setBgImage(bigBackgroud)
|
||||||
|
});
|
||||||
|
|
||||||
const notices = ref([
|
const notices = ref([
|
||||||
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
|
{ date: 'XXXXX供应商信息记不全，请完善！', content: 'XXXXX供应商信息记不全，请完善！' },
|
||||||
|
|
@ -253,14 +261,3 @@ const notices = ref([
|
||||||
line-height: 28px;
|
line-height: 28px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<style>
|
|
||||||
.app-wrapper {
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
background-image: url("../assets/images/bigBackgroud.png");
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
/* 禁止平铺 */
|
|
||||||
background-size: cover;
|
|
||||||
/* 完全覆盖容器 */
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
|
||||||
|
|
@ -1,60 +1,39 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
|
<div class="searchPanel">
|
||||||
|
<el-form :model="queryParams" ref="queryRef" class="searchPanelForm" :inline="true" v-show="showSearch">
|
||||||
<el-form-item label="部门名称" prop="deptName">
|
<el-form-item label="部门名称" prop="deptName">
|
||||||
<el-input
|
<el-input v-model="queryParams.deptName" placeholder="请输入部门名称" clearable style="width: 200px"
|
||||||
v-model="queryParams.deptName"
|
@keyup.enter="handleQuery" />
|
||||||
placeholder="请输入部门名称"
|
|
||||||
clearable
|
|
||||||
style="width: 200px"
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="状态" prop="status">
|
<el-form-item label="状态" prop="status">
|
||||||
<el-select v-model="queryParams.status" placeholder="部门状态" clearable style="width: 200px">
|
<el-select v-model="queryParams.status" placeholder="部门状态" clearable style="width: 200px">
|
||||||
<el-option
|
<el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label"
|
||||||
v-for="dict in sys_normal_disable"
|
:value="dict.value" />
|
||||||
:key="dict.value"
|
|
||||||
:label="dict.label"
|
|
||||||
:value="dict.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<el-card>
|
||||||
|
<template #header>
|
||||||
|
<div class="card-header">
|
||||||
|
<span>系统管理</span> <span class="subHeaderTitle">- 部门管理</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
<el-row :gutter="10" class="mb8">
|
<el-row :gutter="10" class="my_row">
|
||||||
<el-col :span="1.5">
|
<el-col :span="24">
|
||||||
<el-button
|
<el-button type="primary" class="primaryBtn" @click="handleAdd"
|
||||||
type="primary"
|
v-hasPermi="['system:dept:add']">新增</el-button>
|
||||||
plain
|
<el-button type="primary" class="primaryBtn" @click="toggleExpandAll">展开/折叠</el-button>
|
||||||
icon="Plus"
|
<el-button type="primary" class="primaryBtn" @click="handleQuery">搜索</el-button>
|
||||||
@click="handleAdd"
|
<el-button type="primary" class="primaryBtn" @click="resetQuery">重置</el-button>
|
||||||
v-hasPermi="['system:dept:add']"
|
|
||||||
>新增</el-button>
|
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="info"
|
|
||||||
plain
|
|
||||||
icon="Sort"
|
|
||||||
@click="toggleExpandAll"
|
|
||||||
>展开/折叠</el-button>
|
|
||||||
</el-col>
|
|
||||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-table
|
<el-table v-if="refreshTable" v-loading="loading" height="calc(100vh - 310px)" :data="deptList"
|
||||||
v-if="refreshTable"
|
row-key="deptId" :default-expand-all="isExpandAll"
|
||||||
v-loading="loading"
|
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
|
||||||
:data="deptList"
|
|
||||||
row-key="deptId"
|
|
||||||
:default-expand-all="isExpandAll"
|
|
||||||
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
|
||||||
>
|
|
||||||
<el-table-column prop="deptName" label="部门名称" width="260"></el-table-column>
|
<el-table-column prop="deptName" label="部门名称" width="260"></el-table-column>
|
||||||
<el-table-column prop="orderNum" label="排序" width="200"></el-table-column>
|
<el-table-column prop="orderNum" label="排序" width="200"></el-table-column>
|
||||||
<el-table-column prop="status" label="状态" width="100">
|
<el-table-column prop="status" label="状态" width="100">
|
||||||
|
|
@ -69,27 +48,27 @@
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:dept:edit']">修改</el-button>
|
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
|
||||||
<el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)" v-hasPermi="['system:dept:add']">新增</el-button>
|
v-hasPermi="['system:dept:edit']">修改</el-button>
|
||||||
<el-button v-if="scope.row.parentId != 0" link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:dept:remove']">删除</el-button>
|
<el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)"
|
||||||
|
v-hasPermi="['system:dept:add']">新增</el-button>
|
||||||
|
<el-button v-if="scope.row.parentId != 0" link type="primary" icon="Delete"
|
||||||
|
@click="handleDelete(scope.row)" v-hasPermi="['system:dept:remove']">删除</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
<!-- 添加或修改部门对话框 -->
|
<!-- 添加或修改部门对话框 -->
|
||||||
<el-dialog :title="title" v-model="open" width="600px" append-to-body>
|
<el-dialog :title="title" v-model="open" width="800px" class="my_dialog" append-to-body :destroy-on-close="true"
|
||||||
<el-form ref="deptRef" :model="form" :rules="rules" label-width="80px">
|
:close-on-click-modal="false">
|
||||||
|
<el-form ref="deptRef" :model="form" :rules="rules" label-width="100px" class="myInsertForm">
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="24" v-if="form.parentId !== 0">
|
<el-col :span="24" v-if="form.parentId !== 0">
|
||||||
<el-form-item label="上级部门" prop="parentId">
|
<el-form-item label="上级部门" prop="parentId">
|
||||||
<el-tree-select
|
<el-tree-select v-model="form.parentId" :data="deptOptions"
|
||||||
v-model="form.parentId"
|
:props="{ value: 'deptId', label: 'deptName', children: 'children' }" value-key="deptId"
|
||||||
:data="deptOptions"
|
placeholder="选择上级部门" check-strictly />
|
||||||
:props="{ value: 'deptId', label: 'deptName', children: 'children' }"
|
|
||||||
value-key="deptId"
|
|
||||||
placeholder="选择上级部门"
|
|
||||||
check-strictly
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
|
|
@ -120,11 +99,8 @@
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label="部门状态">
|
<el-form-item label="部门状态">
|
||||||
<el-radio-group v-model="form.status">
|
<el-radio-group v-model="form.status">
|
||||||
<el-radio
|
<el-radio v-for="dict in sys_normal_disable" :key="dict.value" :value="dict.value">{{ dict.label
|
||||||
v-for="dict in sys_normal_disable"
|
}}</el-radio>
|
||||||
:key="dict.value"
|
|
||||||
:value="dict.value"
|
|
||||||
>{{ dict.label }}</el-radio>
|
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
@ -141,7 +117,11 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="Dept">
|
<script setup name="Dept">
|
||||||
|
import { onMounted, ref } from 'vue';
|
||||||
import { listDept, getDept, delDept, addDept, updateDept, listDeptExcludeChild } from "@/api/system/dept"
|
import { listDept, getDept, delDept, addDept, updateDept, listDeptExcludeChild } from "@/api/system/dept"
|
||||||
|
import { useBackgroundStore } from '@/store/modules/background'
|
||||||
|
import otherbg from '@/assets/images/otherbg.png'
|
||||||
|
const bgStore = useBackgroundStore()
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance()
|
const { proxy } = getCurrentInstance()
|
||||||
const { sys_normal_disable } = proxy.useDict("sys_normal_disable")
|
const { sys_normal_disable } = proxy.useDict("sys_normal_disable")
|
||||||
|
|
@ -271,13 +251,17 @@ function submitForm() {
|
||||||
|
|
||||||
/** 删除按钮操作 */
|
/** 删除按钮操作 */
|
||||||
function handleDelete(row) {
|
function handleDelete(row) {
|
||||||
proxy.$modal.confirm('是否确认删除名称为"' + row.deptName + '"的数据项?').then(function() {
|
proxy.$modal.confirm('是否确认删除名称为"' + row.deptName + '"的数据项?').then(function () {
|
||||||
return delDept(row.deptId)
|
return delDept(row.deptId)
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
getList()
|
getList()
|
||||||
proxy.$modal.msgSuccess("删除成功")
|
proxy.$modal.msgSuccess("删除成功")
|
||||||
}).catch(() => {})
|
}).catch(() => { })
|
||||||
}
|
}
|
||||||
|
|
||||||
getList()
|
// 初始化
|
||||||
|
onMounted(() => {
|
||||||
|
bgStore.setBgImage(otherbg)
|
||||||
|
getList()
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -1,98 +1,59 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
|
<div class="searchPanel">
|
||||||
|
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" class="searchPanelForm">
|
||||||
<el-form-item label="字典名称" prop="dictType">
|
<el-form-item label="字典名称" prop="dictType">
|
||||||
<el-select v-model="queryParams.dictType" style="width: 200px">
|
<el-select v-model="queryParams.dictType" style="width: 140px">
|
||||||
<el-option
|
<el-option v-for="item in typeOptions" :key="item.dictId" :label="item.dictName"
|
||||||
v-for="item in typeOptions"
|
:value="item.dictType" />
|
||||||
:key="item.dictId"
|
|
||||||
:label="item.dictName"
|
|
||||||
:value="item.dictType"
|
|
||||||
/>
|
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="字典标签" prop="dictLabel">
|
<el-form-item label="字典标签" prop="dictLabel">
|
||||||
<el-input
|
<el-input v-model="queryParams.dictLabel" placeholder="请输入字典标签" clearable style="width: 140px"
|
||||||
v-model="queryParams.dictLabel"
|
@keyup.enter="handleQuery" />
|
||||||
placeholder="请输入字典标签"
|
|
||||||
clearable
|
|
||||||
style="width: 200px"
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="状态" prop="status">
|
<el-form-item label="状态" prop="status">
|
||||||
<el-select v-model="queryParams.status" placeholder="数据状态" clearable style="width: 200px">
|
<el-select v-model="queryParams.status" placeholder="数据状态" clearable style="min-width: 86px">
|
||||||
<el-option
|
<el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label"
|
||||||
v-for="dict in sys_normal_disable"
|
:value="dict.value" />
|
||||||
:key="dict.value"
|
|
||||||
:label="dict.label"
|
|
||||||
:value="dict.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
</el-form>
|
||||||
|
</div>
|
||||||
|
<el-card>
|
||||||
|
<template #header>
|
||||||
|
<div class="card-header">
|
||||||
|
<span>系统管理</span> <span class="subHeaderTitle">- 字典管理 - 字典明细</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
<el-row :gutter="10" class="mb8">
|
<el-row :gutter="10" class="my_row">
|
||||||
<el-col :span="1.5">
|
<el-col :span="24">
|
||||||
<el-button
|
<el-button type="primary" class="primaryBtn" @click="handleAdd"
|
||||||
type="primary"
|
v-hasPermi="['system:dict:add']">新增</el-button>
|
||||||
plain
|
<el-button type="primary" class="primaryBtn" :disabled="single" @click="handleUpdate"
|
||||||
icon="Plus"
|
v-hasPermi="['system:dict:edit']">修改</el-button>
|
||||||
@click="handleAdd"
|
<el-button type="primary" class="primaryBtn" :disabled="multiple" @click="handleDelete"
|
||||||
v-hasPermi="['system:dict:add']"
|
v-hasPermi="['system:dict:remove']">删除</el-button>
|
||||||
>新增</el-button>
|
<el-button type="primary" class="primaryBtn" @click="handleExport"
|
||||||
|
v-hasPermi="['system:dict:export']">导出</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleClose">关闭</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="resetQuery">重置</el-button>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="success"
|
|
||||||
plain
|
|
||||||
icon="Edit"
|
|
||||||
:disabled="single"
|
|
||||||
@click="handleUpdate"
|
|
||||||
v-hasPermi="['system:dict:edit']"
|
|
||||||
>修改</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="danger"
|
|
||||||
plain
|
|
||||||
icon="Delete"
|
|
||||||
:disabled="multiple"
|
|
||||||
@click="handleDelete"
|
|
||||||
v-hasPermi="['system:dict:remove']"
|
|
||||||
>删除</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="warning"
|
|
||||||
plain
|
|
||||||
icon="Download"
|
|
||||||
@click="handleExport"
|
|
||||||
v-hasPermi="['system:dict:export']"
|
|
||||||
>导出</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="warning"
|
|
||||||
plain
|
|
||||||
icon="Close"
|
|
||||||
@click="handleClose"
|
|
||||||
>关闭</el-button>
|
|
||||||
</el-col>
|
|
||||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-table v-loading="loading" :data="dataList" @selection-change="handleSelectionChange">
|
<el-table v-loading="loading" :data="dataList" height="calc(100vh - 362px)"
|
||||||
|
@selection-change="handleSelectionChange">
|
||||||
<el-table-column type="selection" width="55" align="center" />
|
<el-table-column type="selection" width="55" align="center" />
|
||||||
<el-table-column label="字典编码" align="center" prop="dictCode" />
|
<el-table-column label="字典编码" width="100" align="center" prop="dictCode" />
|
||||||
<el-table-column label="字典标签" align="center" prop="dictLabel">
|
<el-table-column label="字典标签" align="center" prop="dictLabel">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<span v-if="(scope.row.listClass == '' || scope.row.listClass == 'default') && (scope.row.cssClass == '' || scope.row.cssClass == null)">{{ scope.row.dictLabel }}</span>
|
<span
|
||||||
<el-tag v-else :type="scope.row.listClass == 'primary' ? '' : scope.row.listClass" :class="scope.row.cssClass">{{ scope.row.dictLabel }}</el-tag>
|
v-if="(scope.row.listClass == '' || scope.row.listClass == 'default') && (scope.row.cssClass == '' || scope.row.cssClass == null)">{{
|
||||||
|
scope.row.dictLabel }}</span>
|
||||||
|
<el-tag v-else :type="scope.row.listClass == 'primary' ? '' : scope.row.listClass"
|
||||||
|
:class="scope.row.cssClass">{{ scope.row.dictLabel }}</el-tag>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="字典键值" align="center" prop="dictValue" />
|
<el-table-column label="字典键值" align="center" prop="dictValue" />
|
||||||
|
|
@ -103,30 +64,33 @@
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
|
<el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
|
||||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
<el-table-column label="创建时间" align="center" prop="createTime" width="210">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
|
<el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:dict:edit']">修改</el-button>
|
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
|
||||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:dict:remove']">删除</el-button>
|
v-hasPermi="['system:dict:edit']">修改</el-button>
|
||||||
|
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
|
||||||
|
v-hasPermi="['system:dict:remove']">删除</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
|
||||||
<pagination
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
|
||||||
v-show="total > 0"
|
v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||||
:total="total"
|
|
||||||
v-model:page="queryParams.pageNum"
|
</el-card>
|
||||||
v-model:limit="queryParams.pageSize"
|
|
||||||
@pagination="getList"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<!-- 添加或修改参数配置对话框 -->
|
<!-- 添加或修改参数配置对话框 -->
|
||||||
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
|
<el-dialog :title="title" v-model="open" width="800px" class="my_dialog" append-to-body :destroy-on-close="true"
|
||||||
<el-form ref="dataRef" :model="form" :rules="rules" label-width="80px">
|
:close-on-click-modal="false">
|
||||||
|
<el-form ref="dataRef" :model="form" :rules="rules" label-width="120px" class="myInsertForm">
|
||||||
<el-form-item label="字典类型">
|
<el-form-item label="字典类型">
|
||||||
<el-input v-model="form.dictType" :disabled="true" />
|
<el-input v-model="form.dictType" :disabled="true" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
@ -144,21 +108,14 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="回显样式" prop="listClass">
|
<el-form-item label="回显样式" prop="listClass">
|
||||||
<el-select v-model="form.listClass">
|
<el-select v-model="form.listClass">
|
||||||
<el-option
|
<el-option v-for="item in listClassOptions" :key="item.value"
|
||||||
v-for="item in listClassOptions"
|
:label="item.label + '(' + item.value + ')'" :value="item.value"></el-option>
|
||||||
:key="item.value"
|
|
||||||
:label="item.label + '(' + item.value + ')'"
|
|
||||||
:value="item.value"
|
|
||||||
></el-option>
|
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="状态" prop="status">
|
<el-form-item label="状态" prop="status">
|
||||||
<el-radio-group v-model="form.status">
|
<el-radio-group v-model="form.status">
|
||||||
<el-radio
|
<el-radio v-for="dict in sys_normal_disable" :key="dict.value" :value="dict.value">{{ dict.label
|
||||||
v-for="dict in sys_normal_disable"
|
}}</el-radio>
|
||||||
:key="dict.value"
|
|
||||||
:value="dict.value"
|
|
||||||
>{{ dict.label }}</el-radio>
|
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="备注" prop="remark">
|
<el-form-item label="备注" prop="remark">
|
||||||
|
|
@ -176,9 +133,13 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="Data">
|
<script setup name="Data">
|
||||||
|
import { onMounted, ref } from 'vue';
|
||||||
import useDictStore from '@/store/modules/dict'
|
import useDictStore from '@/store/modules/dict'
|
||||||
import { optionselect as getDictOptionselect, getType } from "@/api/system/dict/type"
|
import { optionselect as getDictOptionselect, getType } from "@/api/system/dict/type"
|
||||||
import { listData, getData, delData, addData, updateData } from "@/api/system/dict/data"
|
import { listData, getData, delData, addData, updateData } from "@/api/system/dict/data"
|
||||||
|
import { useBackgroundStore } from '@/store/modules/background'
|
||||||
|
import otherbg from '@/assets/images/otherbg.png'
|
||||||
|
const bgStore = useBackgroundStore()
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance()
|
const { proxy } = getCurrentInstance()
|
||||||
const { sys_normal_disable } = proxy.useDict("sys_normal_disable")
|
const { sys_normal_disable } = proxy.useDict("sys_normal_disable")
|
||||||
|
|
@ -341,13 +302,13 @@ function submitForm() {
|
||||||
/** 删除按钮操作 */
|
/** 删除按钮操作 */
|
||||||
function handleDelete(row) {
|
function handleDelete(row) {
|
||||||
const dictCodes = row.dictCode || ids.value
|
const dictCodes = row.dictCode || ids.value
|
||||||
proxy.$modal.confirm('是否确认删除字典编码为"' + dictCodes + '"的数据项？').then(function() {
|
proxy.$modal.confirm('是否确认删除字典编码为"' + dictCodes + '"的数据项？').then(function () {
|
||||||
return delData(dictCodes)
|
return delData(dictCodes)
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
getList()
|
getList()
|
||||||
proxy.$modal.msgSuccess("删除成功")
|
proxy.$modal.msgSuccess("删除成功")
|
||||||
useDictStore().removeDict(queryParams.value.dictType)
|
useDictStore().removeDict(queryParams.value.dictType)
|
||||||
}).catch(() => {})
|
}).catch(() => { })
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 导出按钮操作 */
|
/** 导出按钮操作 */
|
||||||
|
|
@ -357,6 +318,11 @@ function handleExport() {
|
||||||
}, `dict_data_${new Date().getTime()}.xlsx`)
|
}, `dict_data_${new Date().getTime()}.xlsx`)
|
||||||
}
|
}
|
||||||
|
|
||||||
getTypes(route.params && route.params.dictId)
|
// 初始化
|
||||||
getTypeList()
|
onMounted(() => {
|
||||||
|
bgStore.setBgImage(otherbg)
|
||||||
|
getTypes(route.params && route.params.dictId)
|
||||||
|
getTypeList()
|
||||||
|
});
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -1,110 +1,57 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
|
<div class="searchPanel">
|
||||||
|
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" class="searchPanelForm">
|
||||||
<el-form-item label="字典名称" prop="dictName">
|
<el-form-item label="字典名称" prop="dictName">
|
||||||
<el-input
|
<el-input v-model="queryParams.dictName" placeholder="请输入字典名称" clearable style="width: 140px"
|
||||||
v-model="queryParams.dictName"
|
@keyup.enter="handleQuery" />
|
||||||
placeholder="请输入字典名称"
|
|
||||||
clearable
|
|
||||||
style="width: 240px"
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="字典类型" prop="dictType">
|
<el-form-item label="字典类型" prop="dictType">
|
||||||
<el-input
|
<el-input v-model="queryParams.dictType" placeholder="请输入字典类型" clearable style="width: 140px"
|
||||||
v-model="queryParams.dictType"
|
@keyup.enter="handleQuery" />
|
||||||
placeholder="请输入字典类型"
|
|
||||||
clearable
|
|
||||||
style="width: 240px"
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="状态" prop="status">
|
<el-form-item label="状态" prop="status">
|
||||||
<el-select
|
<el-select v-model="queryParams.status" placeholder="字典状态" clearable style="min-width: 86px">
|
||||||
v-model="queryParams.status"
|
<el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label"
|
||||||
placeholder="字典状态"
|
:value="dict.value" />
|
||||||
clearable
|
|
||||||
style="width: 240px"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="dict in sys_normal_disable"
|
|
||||||
:key="dict.value"
|
|
||||||
:label="dict.label"
|
|
||||||
:value="dict.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="创建时间" style="width: 308px">
|
<el-form-item label="创建时间" style="width: 308px">
|
||||||
<el-date-picker
|
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD" type="daterange" range-separator="-"
|
||||||
v-model="dateRange"
|
start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
||||||
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="Search" @click="handleQuery">搜索</el-button>
|
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
<el-row :gutter="10" class="mb8">
|
<el-card>
|
||||||
<el-col :span="1.5">
|
<template #header>
|
||||||
<el-button
|
<div class="card-header">
|
||||||
type="primary"
|
<span>系统管理</span> <span class="subHeaderTitle">- 字典管理</span>
|
||||||
plain
|
</div>
|
||||||
icon="Plus"
|
</template>
|
||||||
@click="handleAdd"
|
|
||||||
v-hasPermi="['system:dict:add']"
|
<el-row :gutter="10" class="my_row">
|
||||||
>新增</el-button>
|
<el-col :span="24">
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleAdd"
|
||||||
|
v-hasPermi="['system:dict:add']">新增</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" :disabled="single" @click="handleUpdate"
|
||||||
|
v-hasPermi="['system:dict:edit']">修改</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" :disabled="multiple" @click="handleDelete"
|
||||||
|
v-hasPermi="['system:dict:remove']">删除</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleExport"
|
||||||
|
v-hasPermi="['system:dict:export']">导出</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleRefreshCache"
|
||||||
|
v-hasPermi="['system:dict:remove']">刷新缓存</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="resetQuery">重置</el-button>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="success"
|
|
||||||
plain
|
|
||||||
icon="Edit"
|
|
||||||
:disabled="single"
|
|
||||||
@click="handleUpdate"
|
|
||||||
v-hasPermi="['system:dict:edit']"
|
|
||||||
>修改</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="danger"
|
|
||||||
plain
|
|
||||||
icon="Delete"
|
|
||||||
:disabled="multiple"
|
|
||||||
@click="handleDelete"
|
|
||||||
v-hasPermi="['system:dict:remove']"
|
|
||||||
>删除</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="warning"
|
|
||||||
plain
|
|
||||||
icon="Download"
|
|
||||||
@click="handleExport"
|
|
||||||
v-hasPermi="['system:dict:export']"
|
|
||||||
>导出</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="danger"
|
|
||||||
plain
|
|
||||||
icon="Refresh"
|
|
||||||
@click="handleRefreshCache"
|
|
||||||
v-hasPermi="['system:dict:remove']"
|
|
||||||
>刷新缓存</el-button>
|
|
||||||
</el-col>
|
|
||||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-table v-loading="loading" :data="typeList" @selection-change="handleSelectionChange">
|
<el-table v-loading="loading" :data="typeList" height="calc(100vh - 362px)"
|
||||||
|
@selection-change="handleSelectionChange">
|
||||||
<el-table-column type="selection" width="55" align="center" />
|
<el-table-column type="selection" width="55" align="center" />
|
||||||
<el-table-column label="字典编号" align="center" prop="dictId" />
|
<el-table-column label="字典编号" width="100" align="center" prop="dictId" />
|
||||||
<el-table-column label="字典名称" align="center" prop="dictName" :show-overflow-tooltip="true"/>
|
<el-table-column label="字典名称" align="center" prop="dictName" :show-overflow-tooltip="true" />
|
||||||
<el-table-column label="字典类型" align="center" :show-overflow-tooltip="true">
|
<el-table-column label="字典类型" align="center" :show-overflow-tooltip="true">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<router-link :to="'/system/dict-data/index/' + scope.row.dictId" class="link-type">
|
<router-link :to="'/system/dict-data/index/' + scope.row.dictId" class="link-type">
|
||||||
|
|
@ -118,30 +65,29 @@
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
|
<el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
|
||||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
<el-table-column label="创建时间" align="center" prop="createTime" width="210">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
|
<el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:dict:edit']">修改</el-button>
|
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
|
||||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:dict:remove']">删除</el-button>
|
v-hasPermi="['system:dict:edit']">修改</el-button>
|
||||||
|
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
|
||||||
|
v-hasPermi="['system:dict:remove']">删除</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
|
||||||
<pagination
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
|
||||||
v-show="total > 0"
|
v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||||
:total="total"
|
</el-card>
|
||||||
v-model:page="queryParams.pageNum"
|
|
||||||
v-model:limit="queryParams.pageSize"
|
|
||||||
@pagination="getList"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<!-- 添加或修改参数配置对话框 -->
|
<!-- 添加或修改参数配置对话框 -->
|
||||||
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
|
<el-dialog :title="title" v-model="open" width="800px" class="my_dialog" append-to-body :destroy-on-close="true"
|
||||||
<el-form ref="dictRef" :model="form" :rules="rules" label-width="80px">
|
:close-on-click-modal="false">
|
||||||
|
<el-form ref="dictRef" :model="form" :rules="rules" label-width="120px" class="myInsertForm">
|
||||||
<el-form-item label="字典名称" prop="dictName">
|
<el-form-item label="字典名称" prop="dictName">
|
||||||
<el-input v-model="form.dictName" placeholder="请输入字典名称" />
|
<el-input v-model="form.dictName" placeholder="请输入字典名称" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
@ -150,11 +96,8 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="状态" prop="status">
|
<el-form-item label="状态" prop="status">
|
||||||
<el-radio-group v-model="form.status">
|
<el-radio-group v-model="form.status">
|
||||||
<el-radio
|
<el-radio v-for="dict in sys_normal_disable" :key="dict.value" :value="dict.value">{{ dict.label
|
||||||
v-for="dict in sys_normal_disable"
|
}}</el-radio>
|
||||||
:key="dict.value"
|
|
||||||
:value="dict.value"
|
|
||||||
>{{ dict.label }}</el-radio>
|
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="备注" prop="remark">
|
<el-form-item label="备注" prop="remark">
|
||||||
|
|
@ -172,8 +115,12 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="Dict">
|
<script setup name="Dict">
|
||||||
|
import { onMounted, ref } from 'vue';
|
||||||
import useDictStore from '@/store/modules/dict'
|
import useDictStore from '@/store/modules/dict'
|
||||||
import { listType, getType, delType, addType, updateType, refreshCache } from "@/api/system/dict/type"
|
import { listType, getType, delType, addType, updateType, refreshCache } from "@/api/system/dict/type"
|
||||||
|
import { useBackgroundStore } from '@/store/modules/background'
|
||||||
|
import otherbg from '@/assets/images/otherbg.png'
|
||||||
|
const bgStore = useBackgroundStore()
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance()
|
const { proxy } = getCurrentInstance()
|
||||||
const { sys_normal_disable } = proxy.useDict("sys_normal_disable")
|
const { sys_normal_disable } = proxy.useDict("sys_normal_disable")
|
||||||
|
|
@ -296,12 +243,12 @@ function submitForm() {
|
||||||
/** 删除按钮操作 */
|
/** 删除按钮操作 */
|
||||||
function handleDelete(row) {
|
function handleDelete(row) {
|
||||||
const dictIds = row.dictId || ids.value
|
const dictIds = row.dictId || ids.value
|
||||||
proxy.$modal.confirm('是否确认删除字典编号为"' + dictIds + '"的数据项？').then(function() {
|
proxy.$modal.confirm('是否确认删除字典编号为"' + dictIds + '"的数据项？').then(function () {
|
||||||
return delType(dictIds)
|
return delType(dictIds)
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
getList()
|
getList()
|
||||||
proxy.$modal.msgSuccess("删除成功")
|
proxy.$modal.msgSuccess("删除成功")
|
||||||
}).catch(() => {})
|
}).catch(() => { })
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 导出按钮操作 */
|
/** 导出按钮操作 */
|
||||||
|
|
@ -319,5 +266,9 @@ function handleRefreshCache() {
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
getList()
|
// 初始化
|
||||||
|
onMounted(() => {
|
||||||
|
bgStore.setBgImage(otherbg)
|
||||||
|
getList()
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -1,66 +1,46 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
|
<div class="searchPanel">
|
||||||
<el-form-item label="菜单名称" prop="menuName">
|
<el-form :model="queryParams" ref="queryRef" class="searchPanelForm" :inline="true" v-show="showSearch">
|
||||||
<el-input
|
<el-form-item label="菜单名称:" prop="menuName">
|
||||||
v-model="queryParams.menuName"
|
<el-input v-model="queryParams.menuName" placeholder="请输入菜单名称" clearable style="width: 200px"
|
||||||
placeholder="请输入菜单名称"
|
@keyup.enter="handleQuery" />
|
||||||
clearable
|
|
||||||
style="width: 200px"
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="状态" prop="status">
|
<el-form-item label="状态:" prop="status">
|
||||||
<el-select v-model="queryParams.status" placeholder="菜单状态" clearable style="width: 200px">
|
<el-select v-model="queryParams.status" placeholder="请选择" clearable style="min-width: 70px">
|
||||||
<el-option
|
<el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label"
|
||||||
v-for="dict in sys_normal_disable"
|
:value="dict.value" />
|
||||||
:key="dict.value"
|
|
||||||
:label="dict.label"
|
|
||||||
:value="dict.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
</el-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
<el-row :gutter="10" class="mb8">
|
<el-card>
|
||||||
<el-col :span="1.5">
|
<template #header>
|
||||||
<el-button
|
<div class="card-header">
|
||||||
type="primary"
|
<span>系统管理</span> <span class="subHeaderTitle">- 菜单管理</span>
|
||||||
plain
|
</div>
|
||||||
icon="Plus"
|
</template>
|
||||||
@click="handleAdd"
|
|
||||||
v-hasPermi="['system:menu:add']"
|
<el-row :gutter="10" class="my_row">
|
||||||
>新增</el-button>
|
<el-col :span="24">
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleAdd"
|
||||||
|
v-hasPermi="['system:menu:add']">新增</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="toggleExpandAll">展开/折叠</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="resetQuery">重置</el-button>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="info"
|
|
||||||
plain
|
|
||||||
icon="Sort"
|
|
||||||
@click="toggleExpandAll"
|
|
||||||
>展开/折叠</el-button>
|
|
||||||
</el-col>
|
|
||||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-table
|
<el-table v-if="refreshTable" v-loading="loading" height="calc(100vh - 310px)" :data="menuList"
|
||||||
v-if="refreshTable"
|
row-key="menuId" :default-expand-all="isExpandAll"
|
||||||
v-loading="loading"
|
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
|
||||||
:data="menuList"
|
|
||||||
row-key="menuId"
|
|
||||||
:default-expand-all="isExpandAll"
|
|
||||||
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
|
||||||
>
|
|
||||||
<el-table-column prop="menuName" label="菜单名称" :show-overflow-tooltip="true" width="160"></el-table-column>
|
<el-table-column prop="menuName" label="菜单名称" :show-overflow-tooltip="true" width="160"></el-table-column>
|
||||||
<el-table-column prop="icon" label="图标" align="center" width="100">
|
<!-- <el-table-column prop="icon" label="图标" align="center" width="100">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<svg-icon :icon-class="scope.row.icon" />
|
<svg-icon :icon-class="scope.row.icon" />
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column> -->
|
||||||
<el-table-column prop="orderNum" label="排序" width="60"></el-table-column>
|
<el-table-column prop="orderNum" label="排序" width="60"></el-table-column>
|
||||||
<el-table-column prop="perms" label="权限标识" :show-overflow-tooltip="true"></el-table-column>
|
<el-table-column prop="perms" label="权限标识" :show-overflow-tooltip="true"></el-table-column>
|
||||||
<el-table-column prop="component" label="组件路径" :show-overflow-tooltip="true"></el-table-column>
|
<el-table-column prop="component" label="组件路径" :show-overflow-tooltip="true"></el-table-column>
|
||||||
|
|
@ -69,34 +49,36 @@
|
||||||
<dict-tag :options="sys_normal_disable" :value="scope.row.status" />
|
<dict-tag :options="sys_normal_disable" :value="scope.row.status" />
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="创建时间" align="center" width="160" prop="createTime">
|
<el-table-column label="创建时间" align="center" width="230" prop="createTime">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="操作" align="center" width="210" class-name="small-padding fixed-width">
|
<el-table-column label="操作" align="center" width="240" class-name="small-padding fixed-width">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:menu:edit']">修改</el-button>
|
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
|
||||||
<el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)" v-hasPermi="['system:menu:add']">新增</el-button>
|
v-hasPermi="['system:menu:edit']">修改</el-button>
|
||||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:menu:remove']">删除</el-button>
|
<el-button link type="primary" icon="Plus" @click="handleAdd(scope.row)"
|
||||||
|
v-hasPermi="['system:menu:add']">新增</el-button>
|
||||||
|
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
|
||||||
|
v-hasPermi="['system:menu:remove']">删除</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- 添加或修改菜单对话框 -->
|
<!-- 添加或修改菜单对话框 -->
|
||||||
<el-dialog :title="title" v-model="open" width="680px" append-to-body>
|
<el-dialog :title="title" v-model="open" width="800px" class="my_dialog" append-to-body :destroy-on-close="true"
|
||||||
<el-form ref="menuRef" :model="form" :rules="rules" label-width="100px">
|
:close-on-click-modal="false">
|
||||||
|
<el-form ref="menuRef" :model="form" :rules="rules" label-width="120px" class="myInsertForm">
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
<el-form-item label="上级菜单">
|
<el-form-item label="上级菜单">
|
||||||
<el-tree-select
|
<el-tree-select v-model="form.parentId" :data="menuOptions"
|
||||||
v-model="form.parentId"
|
:props="{ value: 'menuId', label: 'menuName', children: 'children' }" value-key="menuId"
|
||||||
:data="menuOptions"
|
placeholder="选择上级菜单" check-strictly />
|
||||||
:props="{ value: 'menuId', label: 'menuName', children: 'children' }"
|
|
||||||
value-key="menuId"
|
|
||||||
placeholder="选择上级菜单"
|
|
||||||
check-strictly
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="24">
|
<el-col :span="24">
|
||||||
|
|
@ -110,21 +92,15 @@
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12" v-if="form.menuType != 'F'">
|
<el-col :span="12" v-if="form.menuType != 'F'">
|
||||||
<el-form-item label="菜单图标" prop="icon">
|
<el-form-item label="菜单图标" prop="icon">
|
||||||
<el-popover
|
<el-popover placement="bottom-start" :width="540" trigger="click">
|
||||||
placement="bottom-start"
|
|
||||||
:width="540"
|
|
||||||
trigger="click"
|
|
||||||
>
|
|
||||||
<template #reference>
|
<template #reference>
|
||||||
<el-input v-model="form.icon" placeholder="点击选择图标" @blur="showSelectIcon" readonly>
|
<el-input v-model="form.icon" placeholder="点击选择图标" @blur="showSelectIcon" readonly>
|
||||||
<template #prefix>
|
<template #prefix>
|
||||||
<svg-icon
|
<svg-icon v-if="form.icon" :icon-class="form.icon" class="el-input__icon"
|
||||||
v-if="form.icon"
|
style="height: 32px;width: 16px;" />
|
||||||
:icon-class="form.icon"
|
<el-icon v-else style="height: 32px;width: 16px;">
|
||||||
class="el-input__icon"
|
<search />
|
||||||
style="height: 32px;width: 16px;"
|
</el-icon>
|
||||||
/>
|
|
||||||
<el-icon v-else style="height: 32px;width: 16px;"><search /></el-icon>
|
|
||||||
</template>
|
</template>
|
||||||
</el-input>
|
</el-input>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -146,7 +122,9 @@
|
||||||
<el-form-item prop="routeName">
|
<el-form-item prop="routeName">
|
||||||
<template #label>
|
<template #label>
|
||||||
<span>
|
<span>
|
||||||
<el-tooltip content="默认不填则和路由地址相同：如地址为：`user`，则名称为`User`（注意：因为router会删除名称相同路由，为避免名字的冲突，特殊情况下请自定义，保证唯一性）" placement="top">
|
<el-tooltip
|
||||||
|
content="默认不填则和路由地址相同：如地址为：`user`，则名称为`User`（注意：因为router会删除名称相同路由，为避免名字的冲突，特殊情况下请自定义，保证唯一性）"
|
||||||
|
placement="top">
|
||||||
<el-icon><question-filled /></el-icon>
|
<el-icon><question-filled /></el-icon>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
路由名称
|
路由名称
|
||||||
|
|
@ -201,7 +179,8 @@
|
||||||
<el-input v-model="form.perms" placeholder="请输入权限标识" maxlength="100" />
|
<el-input v-model="form.perms" placeholder="请输入权限标识" maxlength="100" />
|
||||||
<template #label>
|
<template #label>
|
||||||
<span>
|
<span>
|
||||||
<el-tooltip content="控制器中定义的权限字符，如：@PreAuthorize(`@ss.hasPermi('system:user:list')`)" placement="top">
|
<el-tooltip content="控制器中定义的权限字符，如：@PreAuthorize(`@ss.hasPermi('system:user:list')`)"
|
||||||
|
placement="top">
|
||||||
<el-icon><question-filled /></el-icon>
|
<el-icon><question-filled /></el-icon>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
权限字符
|
权限字符
|
||||||
|
|
@ -249,11 +228,8 @@
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
<el-radio-group v-model="form.visible">
|
<el-radio-group v-model="form.visible">
|
||||||
<el-radio
|
<el-radio v-for="dict in sys_show_hide" :key="dict.value" :value="dict.value">{{ dict.label
|
||||||
v-for="dict in sys_show_hide"
|
}}</el-radio>
|
||||||
:key="dict.value"
|
|
||||||
:value="dict.value"
|
|
||||||
>{{ dict.label }}</el-radio>
|
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
@ -268,11 +244,8 @@
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
<el-radio-group v-model="form.status">
|
<el-radio-group v-model="form.status">
|
||||||
<el-radio
|
<el-radio v-for="dict in sys_normal_disable" :key="dict.value" :value="dict.value">{{ dict.label
|
||||||
v-for="dict in sys_normal_disable"
|
}}</el-radio>
|
||||||
:key="dict.value"
|
|
||||||
:value="dict.value"
|
|
||||||
>{{ dict.label }}</el-radio>
|
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
@ -289,9 +262,13 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="Menu">
|
<script setup name="Menu">
|
||||||
|
import { onMounted, ref } from 'vue';
|
||||||
import { addMenu, delMenu, getMenu, listMenu, updateMenu } from "@/api/system/menu"
|
import { addMenu, delMenu, getMenu, listMenu, updateMenu } from "@/api/system/menu"
|
||||||
import SvgIcon from "@/components/SvgIcon"
|
import SvgIcon from "@/components/SvgIcon"
|
||||||
import IconSelect from "@/components/IconSelect"
|
import IconSelect from "@/components/IconSelect"
|
||||||
|
import { useBackgroundStore } from '@/store/modules/background'
|
||||||
|
import otherbg from '@/assets/images/otherbg.png'
|
||||||
|
const bgStore = useBackgroundStore()
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance()
|
const { proxy } = getCurrentInstance()
|
||||||
const { sys_show_hide, sys_normal_disable } = proxy.useDict("sys_show_hide", "sys_normal_disable")
|
const { sys_show_hide, sys_normal_disable } = proxy.useDict("sys_show_hide", "sys_normal_disable")
|
||||||
|
|
@ -440,13 +417,18 @@ function submitForm() {
|
||||||
|
|
||||||
/** 删除按钮操作 */
|
/** 删除按钮操作 */
|
||||||
function handleDelete(row) {
|
function handleDelete(row) {
|
||||||
proxy.$modal.confirm('是否确认删除名称为"' + row.menuName + '"的数据项?').then(function() {
|
proxy.$modal.confirm('是否确认删除名称为"' + row.menuName + '"的数据项?').then(function () {
|
||||||
return delMenu(row.menuId)
|
return delMenu(row.menuId)
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
getList()
|
getList()
|
||||||
proxy.$modal.msgSuccess("删除成功")
|
proxy.$modal.msgSuccess("删除成功")
|
||||||
}).catch(() => {})
|
}).catch(() => { })
|
||||||
}
|
}
|
||||||
|
|
||||||
getList()
|
// 初始化
|
||||||
|
onMounted(() => {
|
||||||
|
bgStore.setBgImage(otherbg)
|
||||||
|
getList()
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
@ -1,63 +1,39 @@
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true">
|
<div class="searchPanel">
|
||||||
|
<el-form :model="queryParams" ref="queryRef" class="searchPanelForm" v-show="showSearch" :inline="true">
|
||||||
<el-form-item label="用户名称" prop="userName">
|
<el-form-item label="用户名称" prop="userName">
|
||||||
<el-input
|
<el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px"
|
||||||
v-model="queryParams.userName"
|
@keyup.enter="handleQuery" />
|
||||||
placeholder="请输入用户名称"
|
|
||||||
clearable
|
|
||||||
style="width: 240px"
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="手机号码" prop="phonenumber">
|
<el-form-item label="手机号码" prop="phonenumber">
|
||||||
<el-input
|
<el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 240px"
|
||||||
v-model="queryParams.phonenumber"
|
@keyup.enter="handleQuery" />
|
||||||
placeholder="请输入手机号码"
|
|
||||||
clearable
|
|
||||||
style="width: 240px"
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
<el-row :gutter="10" class="mb8">
|
<el-card>
|
||||||
<el-col :span="1.5">
|
<template #header>
|
||||||
<el-button
|
<div class="card-header">
|
||||||
type="primary"
|
<span>系统管理</span> <span class="subHeaderTitle">- 角色管理 - 分配用户</span>
|
||||||
plain
|
</div>
|
||||||
icon="Plus"
|
</template>
|
||||||
@click="openSelectUser"
|
|
||||||
v-hasPermi="['system:role:add']"
|
<el-row :gutter="10" class="my_row">
|
||||||
>添加用户</el-button>
|
<el-col :span="24">
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="openSelectUser"
|
||||||
|
v-hasPermi="['system:role:add']">添加用户</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" :disabled="multiple" @click="cancelAuthUserAll"
|
||||||
|
v-hasPermi="['system:role:remove']">批量取消授权</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleClose">关闭</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="resetQuery">重置</el-button>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="danger"
|
|
||||||
plain
|
|
||||||
icon="CircleClose"
|
|
||||||
:disabled="multiple"
|
|
||||||
@click="cancelAuthUserAll"
|
|
||||||
v-hasPermi="['system:role:remove']"
|
|
||||||
>批量取消授权</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="warning"
|
|
||||||
plain
|
|
||||||
icon="Close"
|
|
||||||
@click="handleClose"
|
|
||||||
>关闭</el-button>
|
|
||||||
</el-col>
|
|
||||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
|
<el-table v-loading="loading" :data="userList" height="calc(100vh - 362px)"
|
||||||
|
@selection-change="handleSelectionChange">
|
||||||
<el-table-column type="selection" width="55" align="center" />
|
<el-table-column type="selection" width="55" align="center" />
|
||||||
<el-table-column label="用户名称" prop="userName" :show-overflow-tooltip="true" />
|
<el-table-column label="用户名称" prop="userName" :show-overflow-tooltip="true" />
|
||||||
<el-table-column label="用户昵称" prop="nickName" :show-overflow-tooltip="true" />
|
<el-table-column label="用户昵称" prop="nickName" :show-overflow-tooltip="true" />
|
||||||
|
|
@ -75,25 +51,29 @@
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-button link type="primary" icon="CircleClose" @click="cancelAuthUser(scope.row)" v-hasPermi="['system:role:remove']">取消授权</el-button>
|
<el-button link type="primary" icon="CircleClose" @click="cancelAuthUser(scope.row)"
|
||||||
|
v-hasPermi="['system:role:remove']">取消授权</el-button>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
|
||||||
<pagination
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
|
||||||
v-show="total > 0"
|
v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||||
:total="total"
|
|
||||||
v-model:page="queryParams.pageNum"
|
|
||||||
v-model:limit="queryParams.pageSize"
|
|
||||||
@pagination="getList"
|
|
||||||
/>
|
|
||||||
<select-user ref="selectRef" :roleId="queryParams.roleId" @ok="handleQuery" />
|
<select-user ref="selectRef" :roleId="queryParams.roleId" @ok="handleQuery" />
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="AuthUser">
|
<script setup name="AuthUser">
|
||||||
|
import { onMounted, ref } from 'vue';
|
||||||
import selectUser from "./selectUser"
|
import selectUser from "./selectUser"
|
||||||
import { allocatedUserList, authUserCancel, authUserCancelAll } from "@/api/system/role"
|
import { allocatedUserList, authUserCancel, authUserCancelAll } from "@/api/system/role"
|
||||||
|
import { useBackgroundStore } from '@/store/modules/background'
|
||||||
|
import otherbg from '@/assets/images/otherbg.png'
|
||||||
|
const bgStore = useBackgroundStore()
|
||||||
|
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
const { proxy } = getCurrentInstance()
|
const { proxy } = getCurrentInstance()
|
||||||
|
|
@ -160,7 +140,7 @@ function cancelAuthUser(row) {
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
getList()
|
getList()
|
||||||
proxy.$modal.msgSuccess("取消授权成功")
|
proxy.$modal.msgSuccess("取消授权成功")
|
||||||
}).catch(() => {})
|
}).catch(() => { })
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 批量取消授权按钮操作 */
|
/** 批量取消授权按钮操作 */
|
||||||
|
|
@ -172,8 +152,12 @@ function cancelAuthUserAll(row) {
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
getList()
|
getList()
|
||||||
proxy.$modal.msgSuccess("取消授权成功")
|
proxy.$modal.msgSuccess("取消授权成功")
|
||||||
}).catch(() => {})
|
}).catch(() => { })
|
||||||
}
|
}
|
||||||
|
|
||||||
getList()
|
// 初始化
|
||||||
|
onMounted(() => {
|
||||||
|
bgStore.setBgImage(otherbg)
|
||||||
|
getList()
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -1,111 +1,61 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true" label-width="68px">
|
<div class="searchPanel">
|
||||||
|
<el-form :model="queryParams" ref="queryRef" v-show="showSearch" class="searchPanelForm" :inline="true">
|
||||||
<el-form-item label="角色名称" prop="roleName">
|
<el-form-item label="角色名称" prop="roleName">
|
||||||
<el-input
|
<el-input v-model="queryParams.roleName" placeholder="请输入角色名称" clearable style="min-width: 60px"
|
||||||
v-model="queryParams.roleName"
|
@keyup.enter="handleQuery" />
|
||||||
placeholder="请输入角色名称"
|
|
||||||
clearable
|
|
||||||
style="width: 240px"
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="权限字符" prop="roleKey">
|
<el-form-item label="权限字符" prop="roleKey">
|
||||||
<el-input
|
<el-input v-model="queryParams.roleKey" placeholder="请输入权限字符" clearable style="min-width: 60px"
|
||||||
v-model="queryParams.roleKey"
|
@keyup.enter="handleQuery" />
|
||||||
placeholder="请输入权限字符"
|
|
||||||
clearable
|
|
||||||
style="width: 240px"
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="状态" prop="status">
|
<el-form-item label="状态" prop="status">
|
||||||
<el-select
|
<el-select v-model="queryParams.status" placeholder="角色状态" clearable style="min-width: 86px">
|
||||||
v-model="queryParams.status"
|
<el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||||
placeholder="角色状态"
|
|
||||||
clearable
|
|
||||||
style="width: 240px"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="dict in sys_normal_disable"
|
|
||||||
:key="dict.value"
|
|
||||||
:label="dict.label"
|
|
||||||
:value="dict.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="创建时间" style="width: 308px">
|
<el-form-item label="创建时间" style="width: 308px">
|
||||||
<el-date-picker
|
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD" type="daterange" range-separator="-"
|
||||||
v-model="dateRange"
|
start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
||||||
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="Search" @click="handleQuery">搜索</el-button>
|
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<el-row :gutter="10" class="mb8">
|
</div>
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
<el-card>
|
||||||
type="primary"
|
<template #header>
|
||||||
plain
|
<div class="card-header">
|
||||||
icon="Plus"
|
<span>系统管理</span> <span class="subHeaderTitle">- 角色管理</span>
|
||||||
@click="handleAdd"
|
</div>
|
||||||
v-hasPermi="['system:role:add']"
|
</template>
|
||||||
>新增</el-button>
|
|
||||||
|
<el-row :gutter="10" class="my_row">
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleAdd"
|
||||||
|
v-hasPermi="['system:role:add']">新增</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" :disabled="single" @click="handleUpdate"
|
||||||
|
v-hasPermi="['system:role:edit']">修改</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" :disabled="multiple" @click="handleDelete"
|
||||||
|
v-hasPermi="['system:role:remove']">删除</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleExport"
|
||||||
|
v-hasPermi="['system:role:export']">导出</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="resetQuery">重置</el-button>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="success"
|
|
||||||
plain
|
|
||||||
icon="Edit"
|
|
||||||
:disabled="single"
|
|
||||||
@click="handleUpdate"
|
|
||||||
v-hasPermi="['system:role:edit']"
|
|
||||||
>修改</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="danger"
|
|
||||||
plain
|
|
||||||
icon="Delete"
|
|
||||||
:disabled="multiple"
|
|
||||||
@click="handleDelete"
|
|
||||||
v-hasPermi="['system:role:remove']"
|
|
||||||
>删除</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button
|
|
||||||
type="warning"
|
|
||||||
plain
|
|
||||||
icon="Download"
|
|
||||||
@click="handleExport"
|
|
||||||
v-hasPermi="['system:role:export']"
|
|
||||||
>导出</el-button>
|
|
||||||
</el-col>
|
|
||||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<!-- 表格数据 -->
|
<!-- 表格数据 -->
|
||||||
<el-table v-loading="loading" :data="roleList" @selection-change="handleSelectionChange">
|
<el-table v-loading="loading" :data="roleList" height="calc(100vh - 362px)"
|
||||||
|
@selection-change="handleSelectionChange">
|
||||||
<el-table-column type="selection" width="55" align="center" />
|
<el-table-column type="selection" width="55" align="center" />
|
||||||
<el-table-column label="角色编号" prop="roleId" width="120" />
|
<el-table-column label="角色编号" prop="roleId" />
|
||||||
<el-table-column label="角色名称" prop="roleName" :show-overflow-tooltip="true" width="150" />
|
<el-table-column label="角色名称" prop="roleName" :show-overflow-tooltip="true" />
|
||||||
<el-table-column label="权限字符" prop="roleKey" :show-overflow-tooltip="true" width="150" />
|
<el-table-column label="权限字符" prop="roleKey" :show-overflow-tooltip="true" />
|
||||||
<el-table-column label="显示顺序" prop="roleSort" width="100" />
|
<el-table-column label="显示顺序" prop="roleSort" />
|
||||||
<el-table-column label="状态" align="center" width="100">
|
<el-table-column label="状态" align="center">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-switch
|
<el-switch v-model="scope.row.status" active-value="0" inactive-value="1"
|
||||||
v-model="scope.row.status"
|
@change="handleStatusChange(scope.row)"></el-switch>
|
||||||
active-value="0"
|
|
||||||
inactive-value="1"
|
|
||||||
@change="handleStatusChange(scope.row)"
|
|
||||||
></el-switch>
|
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="创建时间" align="center" prop="createTime">
|
<el-table-column label="创建时间" align="center" prop="createTime">
|
||||||
|
|
@ -116,32 +66,33 @@
|
||||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-tooltip content="修改" placement="top" v-if="scope.row.roleId !== 1">
|
<el-tooltip content="修改" placement="top" v-if="scope.row.roleId !== 1">
|
||||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:role:edit']"></el-button>
|
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
|
||||||
|
v-hasPermi="['system:role:edit']"></el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<el-tooltip content="删除" placement="top" v-if="scope.row.roleId !== 1">
|
<el-tooltip content="删除" placement="top" v-if="scope.row.roleId !== 1">
|
||||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:role:remove']"></el-button>
|
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
|
||||||
|
v-hasPermi="['system:role:remove']"></el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<el-tooltip content="数据权限" placement="top" v-if="scope.row.roleId !== 1">
|
<el-tooltip content="数据权限" placement="top" v-if="scope.row.roleId !== 1">
|
||||||
<el-button link type="primary" icon="CircleCheck" @click="handleDataScope(scope.row)" v-hasPermi="['system:role:edit']"></el-button>
|
<el-button link type="primary" icon="CircleCheck" @click="handleDataScope(scope.row)"
|
||||||
|
v-hasPermi="['system:role:edit']"></el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<el-tooltip content="分配用户" placement="top" v-if="scope.row.roleId !== 1">
|
<el-tooltip content="分配用户" placement="top" v-if="scope.row.roleId !== 1">
|
||||||
<el-button link type="primary" icon="User" @click="handleAuthUser(scope.row)" v-hasPermi="['system:role:edit']"></el-button>
|
<el-button link type="primary" icon="User" @click="handleAuthUser(scope.row)"
|
||||||
|
v-hasPermi="['system:role:edit']"></el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
|
|
||||||
<pagination
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
|
||||||
v-show="total > 0"
|
v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||||
:total="total"
|
</el-card>
|
||||||
v-model:page="queryParams.pageNum"
|
|
||||||
v-model:limit="queryParams.pageSize"
|
|
||||||
@pagination="getList"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<!-- 添加或修改角色配置对话框 -->
|
<!-- 添加或修改角色配置对话框 -->
|
||||||
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
|
<el-dialog :title="title" v-model="open" width="800px" class="my_dialog" append-to-body :destroy-on-close="true"
|
||||||
<el-form ref="roleRef" :model="form" :rules="rules" label-width="100px">
|
:close-on-click-modal="false">
|
||||||
|
<el-form ref="roleRef" :model="form" :rules="rules" label-width="120px" class="myInsertForm">
|
||||||
<el-form-item label="角色名称" prop="roleName">
|
<el-form-item label="角色名称" prop="roleName">
|
||||||
<el-input v-model="form.roleName" placeholder="请输入角色名称" />
|
<el-input v-model="form.roleName" placeholder="请输入角色名称" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
@ -161,27 +112,18 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="状态">
|
<el-form-item label="状态">
|
||||||
<el-radio-group v-model="form.status">
|
<el-radio-group v-model="form.status">
|
||||||
<el-radio
|
<el-radio v-for="dict in sys_normal_disable" :key="dict.value" :value="dict.value">{{ dict.label
|
||||||
v-for="dict in sys_normal_disable"
|
}}</el-radio>
|
||||||
:key="dict.value"
|
|
||||||
:value="dict.value"
|
|
||||||
>{{ dict.label }}</el-radio>
|
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="菜单权限">
|
<el-form-item label="菜单权限">
|
||||||
<el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox>
|
<el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox>
|
||||||
<el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选</el-checkbox>
|
<el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选</el-checkbox>
|
||||||
<el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event, 'menu')">父子联动</el-checkbox>
|
<el-checkbox v-model="form.menuCheckStrictly"
|
||||||
<el-tree
|
@change="handleCheckedTreeConnect($event, 'menu')">父子联动</el-checkbox>
|
||||||
class="tree-border"
|
<el-tree class="tree-border" :data="menuOptions" show-checkbox ref="menuRef" node-key="id"
|
||||||
:data="menuOptions"
|
:check-strictly="!form.menuCheckStrictly" empty-text="加载中，请稍候"
|
||||||
show-checkbox
|
:props="{ label: 'label', children: 'children' }"></el-tree>
|
||||||
ref="menuRef"
|
|
||||||
node-key="id"
|
|
||||||
:check-strictly="!form.menuCheckStrictly"
|
|
||||||
empty-text="加载中，请稍候"
|
|
||||||
:props="{ label: 'label', children: 'children' }"
|
|
||||||
></el-tree>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="备注">
|
<el-form-item label="备注">
|
||||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
|
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
|
||||||
|
|
@ -196,8 +138,9 @@
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
|
||||||
<!-- 分配角色数据权限对话框 -->
|
<!-- 分配角色数据权限对话框 -->
|
||||||
<el-dialog :title="title" v-model="openDataScope" width="500px" append-to-body>
|
<el-dialog :title="title" v-model="openDataScope" width="650px" class="my_dialog" append-to-body
|
||||||
<el-form :model="form" label-width="80px">
|
:destroy-on-close="true" :close-on-click-modal="false">
|
||||||
|
<el-form :model="form" label-width="80px" class="myInsertForm">
|
||||||
<el-form-item label="角色名称">
|
<el-form-item label="角色名称">
|
||||||
<el-input v-model="form.roleName" :disabled="true" />
|
<el-input v-model="form.roleName" :disabled="true" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
@ -206,29 +149,18 @@
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="权限范围">
|
<el-form-item label="权限范围">
|
||||||
<el-select v-model="form.dataScope" @change="dataScopeSelectChange">
|
<el-select v-model="form.dataScope" @change="dataScopeSelectChange">
|
||||||
<el-option
|
<el-option v-for="item in dataScopeOptions" :key="item.value" :label="item.label"
|
||||||
v-for="item in dataScopeOptions"
|
:value="item.value"></el-option>
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value"
|
|
||||||
></el-option>
|
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="数据权限" v-show="form.dataScope == 2">
|
<el-form-item label="数据权限" v-show="form.dataScope == 2">
|
||||||
<el-checkbox v-model="deptExpand" @change="handleCheckedTreeExpand($event, 'dept')">展开/折叠</el-checkbox>
|
<el-checkbox v-model="deptExpand" @change="handleCheckedTreeExpand($event, 'dept')">展开/折叠</el-checkbox>
|
||||||
<el-checkbox v-model="deptNodeAll" @change="handleCheckedTreeNodeAll($event, 'dept')">全选/全不选</el-checkbox>
|
<el-checkbox v-model="deptNodeAll" @change="handleCheckedTreeNodeAll($event, 'dept')">全选/全不选</el-checkbox>
|
||||||
<el-checkbox v-model="form.deptCheckStrictly" @change="handleCheckedTreeConnect($event, 'dept')">父子联动</el-checkbox>
|
<el-checkbox v-model="form.deptCheckStrictly"
|
||||||
<el-tree
|
@change="handleCheckedTreeConnect($event, 'dept')">父子联动</el-checkbox>
|
||||||
class="tree-border"
|
<el-tree class="tree-border" :data="deptOptions" show-checkbox default-expand-all ref="deptRef" node-key="id"
|
||||||
:data="deptOptions"
|
:check-strictly="!form.deptCheckStrictly" empty-text="加载中，请稍候"
|
||||||
show-checkbox
|
:props="{ label: 'label', children: 'children' }"></el-tree>
|
||||||
default-expand-all
|
|
||||||
ref="deptRef"
|
|
||||||
node-key="id"
|
|
||||||
:check-strictly="!form.deptCheckStrictly"
|
|
||||||
empty-text="加载中，请稍候"
|
|
||||||
:props="{ label: 'label', children: 'children' }"
|
|
||||||
></el-tree>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
|
|
@ -242,8 +174,12 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="Role">
|
<script setup name="Role">
|
||||||
|
import { onMounted, ref } from 'vue';
|
||||||
import { addRole, changeRoleStatus, dataScope, delRole, getRole, listRole, updateRole, deptTreeSelect } from "@/api/system/role"
|
import { addRole, changeRoleStatus, dataScope, delRole, getRole, listRole, updateRole, deptTreeSelect } from "@/api/system/role"
|
||||||
import { roleMenuTreeselect, treeselect as menuTreeselect } from "@/api/system/menu"
|
import { roleMenuTreeselect, treeselect as menuTreeselect } from "@/api/system/menu"
|
||||||
|
import { useBackgroundStore } from '@/store/modules/background'
|
||||||
|
import otherbg from '@/assets/images/otherbg.png'
|
||||||
|
const bgStore = useBackgroundStore()
|
||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const { proxy } = getCurrentInstance()
|
const { proxy } = getCurrentInstance()
|
||||||
|
|
@ -327,7 +263,7 @@ function handleDelete(row) {
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
getList()
|
getList()
|
||||||
proxy.$modal.msgSuccess("删除成功")
|
proxy.$modal.msgSuccess("删除成功")
|
||||||
}).catch(() => {})
|
}).catch(() => { })
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 导出按钮操作 */
|
/** 导出按钮操作 */
|
||||||
|
|
@ -580,5 +516,9 @@ function cancelDataScope() {
|
||||||
reset()
|
reset()
|
||||||
}
|
}
|
||||||
|
|
||||||
getList()
|
// 初始化
|
||||||
|
onMounted(() => {
|
||||||
|
bgStore.setBgImage(otherbg)
|
||||||
|
getList()
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -1,32 +1,24 @@
|
||||||
<template>
|
<template>
|
||||||
<!-- 授权用户 -->
|
<!-- 授权用户 -->
|
||||||
<el-dialog title="选择用户" v-model="visible" width="800px" top="5vh" append-to-body>
|
<el-dialog title="选择用户" v-model="visible" width="900px" top="5vh" class="my_dialog" append-to-body
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true">
|
:destroy-on-close="true" :close-on-click-modal="false">
|
||||||
|
<el-form :model="queryParams" ref="queryRef" :inline="true" class="myInsertForm">
|
||||||
<el-form-item label="用户名称" prop="userName">
|
<el-form-item label="用户名称" prop="userName">
|
||||||
<el-input
|
<el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 180px"
|
||||||
v-model="queryParams.userName"
|
@keyup.enter="handleQuery" />
|
||||||
placeholder="请输入用户名称"
|
|
||||||
clearable
|
|
||||||
style="width: 180px"
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="手机号码" prop="phonenumber">
|
<el-form-item label="手机号码" prop="phonenumber">
|
||||||
<el-input
|
<el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 180px"
|
||||||
v-model="queryParams.phonenumber"
|
@keyup.enter="handleQuery" />
|
||||||
placeholder="请输入手机号码"
|
|
||||||
clearable
|
|
||||||
style="width: 180px"
|
|
||||||
@keyup.enter="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
<el-button type="primary" class="primaryBtn" @click="handleQuery">搜索</el-button>
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
<el-button type="primary" class="primaryBtn" @click="resetQuery">重置</el-button>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-table @row-click="clickRow" ref="refTable" :data="userList" @selection-change="handleSelectionChange" height="260px">
|
<el-table @row-click="clickRow" ref="refTable" :data="userList" @selection-change="handleSelectionChange"
|
||||||
|
height="260px">
|
||||||
<el-table-column type="selection" width="55"></el-table-column>
|
<el-table-column type="selection" width="55"></el-table-column>
|
||||||
<el-table-column label="用户名称" prop="userName" :show-overflow-tooltip="true" />
|
<el-table-column label="用户名称" prop="userName" :show-overflow-tooltip="true" />
|
||||||
<el-table-column label="用户昵称" prop="nickName" :show-overflow-tooltip="true" />
|
<el-table-column label="用户昵称" prop="nickName" :show-overflow-tooltip="true" />
|
||||||
|
|
@ -43,13 +35,8 @@
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
<pagination
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
|
||||||
v-show="total > 0"
|
v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||||
:total="total"
|
|
||||||
v-model:page="queryParams.pageNum"
|
|
||||||
v-model:limit="queryParams.pageSize"
|
|
||||||
@pagination="getList"
|
|
||||||
/>
|
|
||||||
</el-row>
|
</el-row>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<div class="dialog-footer">
|
<div class="dialog-footer">
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,19 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
|
<el-card>
|
||||||
|
<template #header>
|
||||||
|
<div class="card-header">
|
||||||
|
<span>系统管理</span> <span class="subHeaderTitle">- 用户管理 - 分配角色</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<el-row :gutter="10" class="my_row">
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="submitForm()">提交</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="close()">返回</el-button>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
|
|
||||||
<h4 class="form-header h4">基本信息</h4>
|
<h4 class="form-header h4">基本信息</h4>
|
||||||
<el-form :model="form" label-width="80px">
|
<el-form :model="form" label-width="80px">
|
||||||
<el-row>
|
<el-row>
|
||||||
|
|
@ -17,17 +31,19 @@
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<h4 class="form-header h4">角色信息</h4>
|
<h4 class="form-header h4">角色信息</h4>
|
||||||
<el-table v-loading="loading" :row-key="getRowKey" @row-click="clickRow" ref="roleRef" @selection-change="handleSelectionChange" :data="roles.slice((pageNum - 1) * pageSize, pageNum * pageSize)">
|
<el-table v-loading="loading" height="calc(100vh - 450px)" :row-key="getRowKey" @row-click="clickRow" ref="roleRef"
|
||||||
<el-table-column label="序号" width="55" type="index" align="center">
|
@selection-change="handleSelectionChange" :data="roles.slice((pageNum - 1) * pageSize, pageNum * pageSize)">
|
||||||
|
<el-table-column label="序号" width="70" type="index" align="center">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<span>{{ (pageNum - 1) * pageSize + scope.$index + 1 }}</span>
|
<span>{{ (pageNum - 1) * pageSize + scope.$index + 1 }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column type="selection" :reserve-selection="true" :selectable="checkSelectable" width="55"></el-table-column>
|
<el-table-column type="selection" :reserve-selection="true" :selectable="checkSelectable"
|
||||||
|
width="55"></el-table-column>
|
||||||
<el-table-column label="角色编号" align="center" prop="roleId" />
|
<el-table-column label="角色编号" align="center" prop="roleId" />
|
||||||
<el-table-column label="角色名称" align="center" prop="roleName" />
|
<el-table-column label="角色名称" align="center" prop="roleName" />
|
||||||
<el-table-column label="权限字符" align="center" prop="roleKey" />
|
<el-table-column label="权限字符" align="center" prop="roleKey" />
|
||||||
<el-table-column label="创建时间" align="center" prop="createTime" width="180">
|
<el-table-column label="创建时间" align="center" prop="createTime">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -36,17 +52,17 @@
|
||||||
|
|
||||||
<pagination v-show="total > 0" :total="total" v-model:page="pageNum" v-model:limit="pageSize" />
|
<pagination v-show="total > 0" :total="total" v-model:page="pageNum" v-model:limit="pageSize" />
|
||||||
|
|
||||||
<el-form label-width="100px">
|
</el-card>
|
||||||
<div style="text-align: center;margin-left:-120px;margin-top:30px;">
|
|
||||||
<el-button type="primary" @click="submitForm()">提交</el-button>
|
|
||||||
<el-button @click="close()">返回</el-button>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup name="AuthRole">
|
<script setup name="AuthRole">
|
||||||
import { getAuthRole, updateAuthRole } from "@/api/system/user"
|
import { getAuthRole, updateAuthRole } from "@/api/system/user"
|
||||||
|
import { useBackgroundStore } from '@/store/modules/background'
|
||||||
|
import otherbg from '@/assets/images/otherbg.png'
|
||||||
|
const bgStore = useBackgroundStore()
|
||||||
|
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
const { proxy } = getCurrentInstance()
|
const { proxy } = getCurrentInstance()
|
||||||
|
|
@ -102,6 +118,7 @@ function submitForm() {
|
||||||
}
|
}
|
||||||
|
|
||||||
(() => {
|
(() => {
|
||||||
|
bgStore.setBgImage(otherbg)
|
||||||
const userId = route.params && route.params.userId
|
const userId = route.params && route.params.userId
|
||||||
if (userId) {
|
if (userId) {
|
||||||
loading.value = true
|
loading.value = true
|
||||||
|
|
|
||||||
|
|
@ -1,79 +1,75 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-row :gutter="20">
|
<div class="searchPanel">
|
||||||
<splitpanes :horizontal="appStore.device === 'mobile'" class="default-theme">
|
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" class="searchPanelForm">
|
||||||
<!--部门数据-->
|
<el-form-item label="部门">
|
||||||
<pane size="16">
|
<el-tree-select v-model="queryParams.deptId" :data="deptOptions" clearable
|
||||||
<el-col>
|
:props="{ value: 'id', label: 'label', children: 'children' }" value-key="id" placeholder="请选择部门"
|
||||||
<div class="head-container">
|
check-strictly style="width: 140px" />
|
||||||
<el-input v-model="deptName" placeholder="请输入部门名称" clearable prefix-icon="Search" style="margin-bottom: 20px" />
|
</el-form-item>
|
||||||
</div>
|
|
||||||
<div class="head-container">
|
|
||||||
<el-tree :data="deptOptions" :props="{ label: 'label', children: 'children' }" :expand-on-click-node="false" :filter-node-method="filterNode" ref="deptTreeRef" node-key="id" highlight-current default-expand-all @node-click="handleNodeClick" />
|
|
||||||
</div>
|
|
||||||
</el-col>
|
|
||||||
</pane>
|
|
||||||
<!--用户数据-->
|
|
||||||
<pane size="84">
|
|
||||||
<el-col>
|
|
||||||
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
|
|
||||||
<el-form-item label="用户名称" prop="userName">
|
<el-form-item label="用户名称" prop="userName">
|
||||||
<el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 240px" @keyup.enter="handleQuery" />
|
<el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable style="width: 140px"
|
||||||
|
@keyup.enter="handleQuery" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="手机号码" prop="phonenumber">
|
<el-form-item label="手机号码" prop="phonenumber">
|
||||||
<el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 240px" @keyup.enter="handleQuery" />
|
<el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable style="width: 140px"
|
||||||
|
@keyup.enter="handleQuery" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="状态" prop="status">
|
<el-form-item label="状态" prop="status">
|
||||||
<el-select v-model="queryParams.status" placeholder="用户状态" clearable style="width: 240px">
|
<el-select v-model="queryParams.status" placeholder="用户状态" clearable style="min-width: 86px">
|
||||||
<el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
|
<el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="创建时间" style="width: 308px">
|
<el-form-item label="创建时间" style="width: 308px">
|
||||||
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD" type="daterange" range-separator="-"
|
||||||
</el-form-item>
|
start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
|
||||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
<el-row :gutter="10" class="mb8">
|
<el-card>
|
||||||
<el-col :span="1.5">
|
<template #header>
|
||||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:user:add']">新增</el-button>
|
<div class="card-header">
|
||||||
|
<span>系统管理</span> <span class="subHeaderTitle">- 用户管理</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<el-row :gutter="10" class="my_row">
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleAdd"
|
||||||
|
v-hasPermi="['system:user:add']">新增</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" :disabled="single" @click="handleUpdate"
|
||||||
|
v-hasPermi="['system:user:edit']">修改</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" :disabled="multiple" @click="handleDelete"
|
||||||
|
v-hasPermi="['system:user:remove']">删除</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleImport"
|
||||||
|
v-hasPermi="['system:user:import']">导入</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleExport"
|
||||||
|
v-hasPermi="['system:user:export']">导出</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button type="primary" class="primaryBtn" @click="resetQuery">重置</el-button>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate" v-hasPermi="['system:user:edit']">修改</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete" v-hasPermi="['system:user:remove']">删除</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button type="info" plain icon="Upload" @click="handleImport" v-hasPermi="['system:user:import']">导入</el-button>
|
|
||||||
</el-col>
|
|
||||||
<el-col :span="1.5">
|
|
||||||
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['system:user:export']">导出</el-button>
|
|
||||||
</el-col>
|
|
||||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
|
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
|
<el-table v-loading="loading" height="calc(100vh - 362px)" :data="userList"
|
||||||
|
@selection-change="handleSelectionChange">
|
||||||
<el-table-column type="selection" width="50" align="center" />
|
<el-table-column type="selection" width="50" align="center" />
|
||||||
<el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
|
<el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
|
||||||
<el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
|
<el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[1].visible"
|
||||||
<el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
|
:show-overflow-tooltip="true" />
|
||||||
<el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
|
<el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible"
|
||||||
<el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
|
:show-overflow-tooltip="true" />
|
||||||
|
<el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible"
|
||||||
|
:show-overflow-tooltip="true" />
|
||||||
|
<el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible"
|
||||||
|
width="120" />
|
||||||
<el-table-column label="状态" align="center" key="status" v-if="columns[5].visible">
|
<el-table-column label="状态" align="center" key="status" v-if="columns[5].visible">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-switch
|
<el-switch v-model="scope.row.status" active-value="0" inactive-value="1"
|
||||||
v-model="scope.row.status"
|
@change="handleStatusChange(scope.row)"></el-switch>
|
||||||
active-value="0"
|
|
||||||
inactive-value="1"
|
|
||||||
@change="handleStatusChange(scope.row)"
|
|
||||||
></el-switch>
|
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[6].visible" width="160">
|
<el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[6].visible" width="210">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -81,29 +77,34 @@
|
||||||
<el-table-column label="操作" align="center" width="150" class-name="small-padding fixed-width">
|
<el-table-column label="操作" align="center" width="150" class-name="small-padding fixed-width">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-tooltip content="修改" placement="top" v-if="scope.row.userId !== 1">
|
<el-tooltip content="修改" placement="top" v-if="scope.row.userId !== 1">
|
||||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:user:edit']"></el-button>
|
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
|
||||||
|
v-hasPermi="['system:user:edit']"></el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<el-tooltip content="删除" placement="top" v-if="scope.row.userId !== 1">
|
<el-tooltip content="删除" placement="top" v-if="scope.row.userId !== 1">
|
||||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:user:remove']"></el-button>
|
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
|
||||||
|
v-hasPermi="['system:user:remove']"></el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<el-tooltip content="重置密码" placement="top" v-if="scope.row.userId !== 1">
|
<el-tooltip content="重置密码" placement="top" v-if="scope.row.userId !== 1">
|
||||||
<el-button link type="primary" icon="Key" @click="handleResetPwd(scope.row)" v-hasPermi="['system:user:resetPwd']"></el-button>
|
<el-button link type="primary" icon="Key" @click="handleResetPwd(scope.row)"
|
||||||
|
v-hasPermi="['system:user:resetPwd']"></el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
<el-tooltip content="分配角色" placement="top" v-if="scope.row.userId !== 1">
|
<el-tooltip content="分配角色" placement="top" v-if="scope.row.userId !== 1">
|
||||||
<el-button link type="primary" icon="CircleCheck" @click="handleAuthRole(scope.row)" v-hasPermi="['system:user:edit']"></el-button>
|
<el-button link type="primary" icon="CircleCheck" @click="handleAuthRole(scope.row)"
|
||||||
|
v-hasPermi="['system:user:edit']"></el-button>
|
||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
|
||||||
</el-col>
|
v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||||
</pane>
|
|
||||||
</splitpanes>
|
</el-card>
|
||||||
</el-row>
|
|
||||||
|
|
||||||
<!-- 添加或修改用户配置对话框 -->
|
<!-- 添加或修改用户配置对话框 -->
|
||||||
<el-dialog :title="title" v-model="open" width="600px" append-to-body>
|
<el-dialog :title="title" v-model="open" width="800px" class="my_dialog" append-to-body :destroy-on-close="true"
|
||||||
<el-form :model="form" :rules="rules" ref="userRef" label-width="80px">
|
:close-on-click-modal="false">
|
||||||
|
<el-form :model="form" :rules="rules" ref="userRef" label-width="120px" class="myInsertForm">
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label="用户昵称" prop="nickName">
|
<el-form-item label="用户昵称" prop="nickName">
|
||||||
|
|
@ -112,7 +113,9 @@
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label="归属部门" prop="deptId">
|
<el-form-item label="归属部门" prop="deptId">
|
||||||
<el-tree-select v-model="form.deptId" :data="enabledDeptOptions" :props="{ value: 'id', label: 'label', children: 'children' }" value-key="id" placeholder="请选择归属部门" check-strictly />
|
<el-tree-select v-model="form.deptId" :data="enabledDeptOptions"
|
||||||
|
:props="{ value: 'id', label: 'label', children: 'children' }" value-key="id" placeholder="请选择归属部门"
|
||||||
|
check-strictly />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
@ -144,14 +147,16 @@
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label="用户性别">
|
<el-form-item label="用户性别">
|
||||||
<el-select v-model="form.sex" placeholder="请选择">
|
<el-select v-model="form.sex" placeholder="请选择">
|
||||||
<el-option v-for="dict in sys_user_sex" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
|
<el-option v-for="dict in sys_user_sex" :key="dict.value" :label="dict.label"
|
||||||
|
:value="dict.value"></el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label="状态">
|
<el-form-item label="状态">
|
||||||
<el-radio-group v-model="form.status">
|
<el-radio-group v-model="form.status">
|
||||||
<el-radio v-for="dict in sys_normal_disable" :key="dict.value" :value="dict.value">{{ dict.label }}</el-radio>
|
<el-radio v-for="dict in sys_normal_disable" :key="dict.value" :value="dict.value">{{ dict.label
|
||||||
|
}}</el-radio>
|
||||||
</el-radio-group>
|
</el-radio-group>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
@ -160,14 +165,16 @@
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label="岗位">
|
<el-form-item label="岗位">
|
||||||
<el-select v-model="form.postIds" multiple placeholder="请选择">
|
<el-select v-model="form.postIds" multiple placeholder="请选择">
|
||||||
<el-option v-for="item in postOptions" :key="item.postId" :label="item.postName" :value="item.postId" :disabled="item.status == 1"></el-option>
|
<el-option v-for="item in postOptions" :key="item.postId" :label="item.postName" :value="item.postId"
|
||||||
|
:disabled="item.status == 1"></el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label="角色">
|
<el-form-item label="角色">
|
||||||
<el-select v-model="form.roleIds" multiple placeholder="请选择">
|
<el-select v-model="form.roleIds" multiple placeholder="请选择">
|
||||||
<el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName" :value="item.roleId" :disabled="item.status == 1"></el-option>
|
<el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName" :value="item.roleId"
|
||||||
|
:disabled="item.status == 1"></el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
|
|
@ -189,8 +196,11 @@
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
|
||||||
<!-- 用户导入对话框 -->
|
<!-- 用户导入对话框 -->
|
||||||
<el-dialog :title="upload.title" v-model="upload.open" width="400px" append-to-body>
|
<el-dialog :title="upload.title" v-model="upload.open" width="650px" class="my_dialog" append-to-body
|
||||||
<el-upload ref="uploadRef" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
|
:destroy-on-close="true" :close-on-click-modal="false">
|
||||||
|
<el-upload ref="uploadRef" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
|
||||||
|
:action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
|
||||||
|
:on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
|
||||||
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
|
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
|
||||||
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
|
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
|
||||||
<template #tip>
|
<template #tip>
|
||||||
|
|
@ -199,7 +209,8 @@
|
||||||
<el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据
|
<el-checkbox v-model="upload.updateSupport" />是否更新已经存在的用户数据
|
||||||
</div>
|
</div>
|
||||||
<span>仅允许导入xls、xlsx格式文件。</span>
|
<span>仅允许导入xls、xlsx格式文件。</span>
|
||||||
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link>
|
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
|
||||||
|
@click="importTemplate">下载模板</el-link>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</el-upload>
|
</el-upload>
|
||||||
|
|
@ -219,6 +230,9 @@ import useAppStore from '@/store/modules/app'
|
||||||
import { changeUserStatus, listUser, resetUserPwd, delUser, getUser, updateUser, addUser, deptTreeSelect } from "@/api/system/user"
|
import { changeUserStatus, listUser, resetUserPwd, delUser, getUser, updateUser, addUser, deptTreeSelect } from "@/api/system/user"
|
||||||
import { Splitpanes, Pane } from "splitpanes"
|
import { Splitpanes, Pane } from "splitpanes"
|
||||||
import "splitpanes/dist/splitpanes.css"
|
import "splitpanes/dist/splitpanes.css"
|
||||||
|
import { useBackgroundStore } from '@/store/modules/background'
|
||||||
|
import otherbg from '@/assets/images/otherbg.png'
|
||||||
|
const bgStore = useBackgroundStore()
|
||||||
|
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const appStore = useAppStore()
|
const appStore = useAppStore()
|
||||||
|
|
@ -359,14 +373,14 @@ function handleDelete(row) {
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
getList()
|
getList()
|
||||||
proxy.$modal.msgSuccess("删除成功")
|
proxy.$modal.msgSuccess("删除成功")
|
||||||
}).catch(() => {})
|
}).catch(() => { })
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 导出按钮操作 */
|
/** 导出按钮操作 */
|
||||||
function handleExport() {
|
function handleExport() {
|
||||||
proxy.download("system/user/export", {
|
proxy.download("system/user/export", {
|
||||||
...queryParams.value,
|
...queryParams.value,
|
||||||
},`user_${new Date().getTime()}.xlsx`)
|
}, `user_${new Date().getTime()}.xlsx`)
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 用户状态修改 */
|
/** 用户状态修改 */
|
||||||
|
|
@ -418,7 +432,7 @@ function handleResetPwd(row) {
|
||||||
resetUserPwd(row.userId, value).then(response => {
|
resetUserPwd(row.userId, value).then(response => {
|
||||||
proxy.$modal.msgSuccess("修改成功，新密码是：" + value)
|
proxy.$modal.msgSuccess("修改成功，新密码是：" + value)
|
||||||
})
|
})
|
||||||
}).catch(() => {})
|
}).catch(() => { })
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 选择条数 */
|
/** 选择条数 */
|
||||||
|
|
@ -534,6 +548,7 @@ function submitForm() {
|
||||||
}
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
|
bgStore.setBgImage(otherbg)
|
||||||
getDeptTree()
|
getDeptTree()
|
||||||
getList()
|
getList()
|
||||||
proxy.getConfigKey("sys.user.initPassword").then(response => {
|
proxy.getConfigKey("sys.user.initPassword").then(response => {
|
||||||
|
|
@ -541,3 +556,24 @@ onMounted(() => {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.el-checkbox__inner {
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-upload-dragger .el-upload__text,
|
||||||
|
.el-upload__tip {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #525252;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-link__inner {
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user