forked from github/dataease
feat: 数据集增加表名字段复制 代码优化 仪表板样式调整
This commit is contained in:
dataeaseShu
parent
dbc650f22b
commit
a5c84554db
@ -1219,15 +1219,7 @@ div:focus {
|
||||
}
|
||||
}
|
||||
|
||||
.user-drawer,
|
||||
.user-drawer-task {
|
||||
.el-drawer__body-cont {
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
overflow: auto;
|
||||
width: 100%;
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
.de-user-drawer {
|
||||
|
||||
.el-drawer__header {
|
||||
padding: 16px 24px;
|
||||
@ -1269,8 +1261,10 @@ div:focus {
|
||||
}
|
||||
|
||||
.el-drawer__body {
|
||||
padding: 12px 24px 24px 24px;
|
||||
position: relative;
|
||||
padding: 16px 24px;
|
||||
position: unset;
|
||||
overflow-y: auto;
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
|
||||
.filter {
|
||||
@ -1320,37 +1314,6 @@ div:focus {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
border-radius: 4px;
|
||||
padding: 5px 26px 5px 26px;
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
letter-spacing: 0px;
|
||||
text-align: center;
|
||||
border: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.normal {
|
||||
color: #1f2329;
|
||||
border: 1px solid #bbbfc4;
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.foot {
|
||||
position: absolute;
|
||||
height: 80px;
|
||||
width: 100%;
|
||||
padding: 24px;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
text-align: right;
|
||||
background-color: #fff;
|
||||
box-shadow: 0px -1px 4px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
}
|
||||
|
||||
.user-popper {
|
||||
@ -1586,4 +1549,87 @@ div:focus {
|
||||
margin-right: 9px;
|
||||
width: 16px !important;
|
||||
height: 12px !important;
|
||||
}
|
||||
|
||||
.filter-texts {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 17px 0;
|
||||
font-family: "PingFang SC";
|
||||
font-weight: 400;
|
||||
|
||||
.sum {
|
||||
color: #1f2329;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #999999;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.text {
|
||||
max-width: 280px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
padding: 1px 22px 1px 6px;
|
||||
display: inline-block;
|
||||
align-items: center;
|
||||
color: #0c296e;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
border-radius: 2px;
|
||||
margin: 0;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
i {
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.clear-btn {
|
||||
color: #646a73;
|
||||
}
|
||||
|
||||
.clear-btn:hover {
|
||||
color: #3370ff;
|
||||
}
|
||||
|
||||
.filter-texts-container::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.arrow-filter {
|
||||
font-size: 16px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
cursor: pointer;
|
||||
color: #646a73;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.arrow-filter:hover {
|
||||
background: rgba(31, 35, 41, 0.1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-right.arrow-filter {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-left.arrow-filter {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.filter-texts-container {
|
||||
flex: 1;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
@ -3,7 +3,7 @@ import { getCustomTheme, getSize } from '@/views/chart/chart/common/common_table
|
||||
import { DEFAULT_COLOR_CASE, DEFAULT_TOTAL } from '@/views/chart/chart/chart'
|
||||
import { formatterItem, valueFormatter } from '@/views/chart/chart/formatter'
|
||||
import { hexColorToRGBA } from '@/views/chart/chart/util'
|
||||
|
||||
import Vue from 'vue'
|
||||
export function baseTableInfo(s2, container, chart, action, tableData) {
|
||||
const containerDom = document.getElementById(container)
|
||||
|
||||
@ -12,6 +12,7 @@ export function baseTableInfo(s2, container, chart, action, tableData) {
|
||||
if (!fields || fields.length === 0) {
|
||||
if (s2) {
|
||||
s2.destroy()
|
||||
destroyS2()
|
||||
}
|
||||
return
|
||||
}
|
||||
@ -130,6 +131,7 @@ export function baseTableInfo(s2, container, chart, action, tableData) {
|
||||
// 开始渲染
|
||||
if (s2) {
|
||||
s2.destroy()
|
||||
destroyS2
|
||||
}
|
||||
s2 = new TableSheet(containerDom, s2DataConfig, s2Options)
|
||||
|
||||
@ -152,6 +154,7 @@ export function baseTableNormal(s2, container, chart, action, tableData) {
|
||||
if (!fields || fields.length === 0) {
|
||||
if (s2) {
|
||||
s2.destroy()
|
||||
destroyS2
|
||||
}
|
||||
return
|
||||
}
|
||||
@ -257,6 +260,7 @@ export function baseTableNormal(s2, container, chart, action, tableData) {
|
||||
// 开始渲染
|
||||
if (s2) {
|
||||
s2.destroy()
|
||||
destroyS2()
|
||||
}
|
||||
s2 = new TableSheet(containerDom, s2DataConfig, s2Options)
|
||||
|
||||
@ -293,6 +297,7 @@ export function baseTablePivot(s2, container, chart, action, tableData) {
|
||||
if (!fields || fields.length === 0) {
|
||||
if (s2) {
|
||||
s2.destroy()
|
||||
destroyS2()
|
||||
}
|
||||
return
|
||||
}
|
||||
@ -414,6 +419,7 @@ export function baseTablePivot(s2, container, chart, action, tableData) {
|
||||
// 开始渲染
|
||||
if (s2) {
|
||||
s2.destroy()
|
||||
destroyS2()
|
||||
}
|
||||
s2 = new PivotSheet(containerDom, s2DataConfig, s2Options)
|
||||
|
||||
@ -427,6 +433,13 @@ export function baseTablePivot(s2, container, chart, action, tableData) {
|
||||
return s2
|
||||
}
|
||||
|
||||
function destroyS2(s2) {
|
||||
for (const i in s2) {
|
||||
Vue.$delete(s2, i)
|
||||
}
|
||||
s2 = null
|
||||
}
|
||||
|
||||
function getCurrentField(valueFieldList, field) {
|
||||
let list = []
|
||||
let res = null
|
||||
|
||||
@ -220,6 +220,7 @@ export default {
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearInterval(this.scrollTimer)
|
||||
this.destroyS2()
|
||||
},
|
||||
methods: {
|
||||
initData() {
|
||||
@ -262,6 +263,13 @@ export default {
|
||||
})
|
||||
}
|
||||
},
|
||||
destroyS2() {
|
||||
if (!this.myChart) return
|
||||
for (const i in this.myChart) {
|
||||
this.$delete(this.myChart, i)
|
||||
}
|
||||
this.myChart = null
|
||||
},
|
||||
drawView() {
|
||||
const chart = this.chart
|
||||
// type
|
||||
@ -287,6 +295,7 @@ export default {
|
||||
if (this.myChart) {
|
||||
this.antVRenderStatus = false
|
||||
this.myChart.destroy()
|
||||
this.destroyS2()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -125,7 +125,10 @@
|
||||
v-if="dataSource"
|
||||
style="margin-top: 16px"
|
||||
>
|
||||
<span>
|
||||
<span
|
||||
:title="(showTable && dataTable) || selectedDatasource.name"
|
||||
class="grey-name"
|
||||
>
|
||||
<svg-icon icon-class="db-de" />
|
||||
{{ (showTable && dataTable) || selectedDatasource.name }}
|
||||
</span>
|
||||
@ -154,7 +157,17 @@
|
||||
class="table-or-field"
|
||||
@click="typeSwitch(ele)"
|
||||
>
|
||||
{{ ele.name }}
|
||||
<span
|
||||
:title="ele.name"
|
||||
class="name"
|
||||
>{{ ele.name }}</span>
|
||||
<i
|
||||
v-clipboard:copy="ele.name"
|
||||
v-clipboard:success="onCopy"
|
||||
v-clipboard:error="onError"
|
||||
class="el-icon-document-copy"
|
||||
@click.stop
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
@ -164,9 +177,19 @@
|
||||
<div
|
||||
v-for="ele in fieldData"
|
||||
:key="ele.fieldName"
|
||||
class="table-or-field"
|
||||
class="table-or-field field"
|
||||
>
|
||||
{{ ele.fieldName }}
|
||||
<span
|
||||
:title="ele.fieldName"
|
||||
class="name"
|
||||
>{{ ele.fieldName }}</span>
|
||||
<i
|
||||
v-clipboard:copy="ele.fieldName"
|
||||
v-clipboard:success="onCopy"
|
||||
v-clipboard:error="onError"
|
||||
class="el-icon-document-copy"
|
||||
@click.stop
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -238,7 +261,7 @@
|
||||
v-closePress
|
||||
:title="dialogTitle"
|
||||
:visible.sync="showVariableMgm"
|
||||
custom-class="user-drawer sql-dataset-drawer"
|
||||
custom-class="de-user-drawer sql-dataset-drawer"
|
||||
size="840px"
|
||||
direction="rtl"
|
||||
>
|
||||
@ -735,6 +758,10 @@ export default {
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
onCopy(e) {
|
||||
this.openMessageSuccess('commons.copy_success')
|
||||
},
|
||||
onError(e) {},
|
||||
showSQL(val) {
|
||||
this.sql = val || ''
|
||||
},
|
||||
@ -902,9 +929,13 @@ export default {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
:nth-child(2)p {
|
||||
margin-top: 16px;
|
||||
.grey-name {
|
||||
max-width: 80%;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.grey {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
@ -928,6 +959,23 @@ export default {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 4px;
|
||||
padding-right: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
i {
|
||||
display: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.name {
|
||||
cursor: pointer;
|
||||
width: 90%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
&.field {
|
||||
color: var(--deTextPrimary, #1f2329);
|
||||
@ -938,6 +986,9 @@ export default {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
i {
|
||||
display: block;
|
||||
}
|
||||
background: rgba(31, 35, 41, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
@ -80,7 +80,7 @@
|
||||
v-closePress
|
||||
:title="$t('chart.select_dataset')"
|
||||
:visible.sync="selectDsDialog"
|
||||
custom-class="user-drawer sql-dataset-drawer"
|
||||
custom-class="de-user-drawer sql-dataset-drawer"
|
||||
size="600px"
|
||||
direction="rtl"
|
||||
>
|
||||
@ -116,7 +116,7 @@
|
||||
: $t('dataset.edit_union_relation')
|
||||
"
|
||||
:visible.sync="editUnion"
|
||||
custom-class="user-drawer union-dataset-drawer"
|
||||
custom-class="de-user-drawer union-dataset-drawer"
|
||||
size="840px"
|
||||
direction="rtl"
|
||||
>
|
||||
|
||||
@ -82,7 +82,7 @@
|
||||
v-closePress
|
||||
:title="$t('chart.select_dataset')"
|
||||
:visible.sync="selectDsDialog"
|
||||
custom-class="user-drawer sql-dataset-drawer"
|
||||
custom-class="de-user-drawer sql-dataset-drawer"
|
||||
size="600px"
|
||||
direction="rtl"
|
||||
>
|
||||
@ -114,7 +114,7 @@
|
||||
v-if="editField"
|
||||
:title="$t('dataset.field_select')"
|
||||
:visible.sync="editField"
|
||||
custom-class="user-drawer sql-dataset-drawer"
|
||||
custom-class="de-user-drawer sql-dataset-drawer"
|
||||
size="840px"
|
||||
v-closePress
|
||||
direction="rtl"
|
||||
|
||||
@ -72,7 +72,7 @@
|
||||
: $t('dataset.edit_union_relation')
|
||||
"
|
||||
:visible.sync="editUnion"
|
||||
custom-class="user-drawer union-dataset-drawer"
|
||||
custom-class="de-user-drawer union-dataset-drawer"
|
||||
size="840px"
|
||||
direction="rtl"
|
||||
>
|
||||
|
||||
@ -213,7 +213,7 @@
|
||||
v-closePress
|
||||
:title="$t('dataset.task.record')"
|
||||
:visible.sync="userDrawer"
|
||||
custom-class="user-drawer-task"
|
||||
custom-class="de-user-drawer"
|
||||
size="840px"
|
||||
direction="rtl"
|
||||
>
|
||||
@ -285,7 +285,7 @@
|
||||
v-closePress
|
||||
:title="header"
|
||||
:visible.sync="update_task"
|
||||
custom-class="user-drawer update-drawer-task"
|
||||
custom-class="de-user-drawer update-drawer-task"
|
||||
size="680px"
|
||||
direction="rtl"
|
||||
>
|
||||
@ -1139,7 +1139,7 @@ export default {
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.user-drawer-task {
|
||||
.de-user-drawer {
|
||||
.el-table::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
|
||||
@ -12,6 +12,7 @@
|
||||
/>
|
||||
<template v-if="showInput">
|
||||
<el-input
|
||||
ref="editerName"
|
||||
v-model="table.name"
|
||||
@blur="nameBlur"
|
||||
/>
|
||||
@ -23,11 +24,15 @@
|
||||
{{ $t('deDataset.already_exists') }}
|
||||
</div>
|
||||
</template>
|
||||
<span
|
||||
v-else
|
||||
:class="[{ 'show-point': ['sql', 'union'].includes(datasetType) }]"
|
||||
@click="handleClick"
|
||||
>{{ datasetName }}</span>
|
||||
<template v-else>
|
||||
<span>{{ datasetName }}</span>
|
||||
<i
|
||||
v-if="['sql', 'union'].includes(datasetType)"
|
||||
style="margin-left: 5px"
|
||||
class="el-icon-edit"
|
||||
@click="handleClick"
|
||||
/>
|
||||
</template>
|
||||
</span>
|
||||
<span class="oprate">
|
||||
<span
|
||||
@ -184,6 +189,9 @@ export default {
|
||||
handleClick() {
|
||||
if (['sql', 'union'].includes(this.datasetType)) {
|
||||
this.showInput = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.editerName.focus()
|
||||
})
|
||||
}
|
||||
},
|
||||
nameRepeat(value) {
|
||||
@ -261,10 +269,6 @@ export default {
|
||||
padding: 0 24px;
|
||||
box-shadow: 0 2px 2px 0 rgb(0 0 0 / 10%);
|
||||
|
||||
.show-point {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.name {
|
||||
font-family: PingFang SC;
|
||||
font-size: 16px;
|
||||
|
||||
@ -457,7 +457,7 @@
|
||||
<!--移动分组-->
|
||||
<el-drawer
|
||||
:visible.sync="moveGroup"
|
||||
custom-class="user-drawer sql-dataset-drawer"
|
||||
custom-class="de-user-drawer sql-dataset-drawer"
|
||||
size="600px"
|
||||
direction="rtl"
|
||||
>
|
||||
@ -495,7 +495,7 @@
|
||||
<!--移动数据集-->
|
||||
<el-drawer
|
||||
:visible.sync="moveDs"
|
||||
custom-class="user-drawer sql-dataset-drawer"
|
||||
custom-class="de-user-drawer sql-dataset-drawer"
|
||||
size="600px"
|
||||
direction="rtl"
|
||||
>
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
/>
|
||||
</el-tabs>
|
||||
<div class="tabs-container">
|
||||
<div class="msg-cont">
|
||||
<div class="msg-cont de-serach-table">
|
||||
<el-row class="top-operate">
|
||||
<el-col :span="12">
|
||||
<template v-if="tabActive === 'unread'">
|
||||
@ -324,18 +324,6 @@ export default {
|
||||
.table-container {
|
||||
height: calc(100% - 50px);
|
||||
}
|
||||
.top-operate {
|
||||
margin-bottom: 16px;
|
||||
.right-user {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.name-email-search {
|
||||
width: 240px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style scoped lang="scss">
|
||||
.organization {
|
||||
|
||||
@ -29,7 +29,10 @@
|
||||
:class="[{ select: activeTemplate === ele.id }]"
|
||||
@click="nodeClick(ele)"
|
||||
>
|
||||
<svg-icon icon-class="scene" />
|
||||
<svg-icon
|
||||
style="margin-right: 9px"
|
||||
icon-class="scene"
|
||||
/>
|
||||
<span>{{ ele.name }}</span>
|
||||
<span
|
||||
class="more"
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
v-closePress
|
||||
:title="$t('user.filter_method')"
|
||||
:visible.sync="userDrawer"
|
||||
custom-class="user-drawer-task"
|
||||
custom-class="de-user-drawer"
|
||||
size="680px"
|
||||
direction="rtl"
|
||||
>
|
||||
|
||||
@ -1,14 +1,16 @@
|
||||
<template>
|
||||
<el-row style="text-align: left">
|
||||
<el-row
|
||||
style="text-align: left"
|
||||
class="de-serach-table"
|
||||
>
|
||||
<el-row class="top-operate">
|
||||
<el-col :span="12">
|
||||
<el-button
|
||||
<deBtn
|
||||
v-show="position==='templateLog'"
|
||||
class="btn"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
@click="applyNew()"
|
||||
>{{ $t('commons.create') }}</el-button>
|
||||
>{{ $t('commons.create') }}</deBtn>
|
||||
<span> </span>
|
||||
</el-col>
|
||||
<el-col
|
||||
@ -300,107 +302,4 @@ export default {
|
||||
.table-container-filter {
|
||||
height: calc(100% - 110px);
|
||||
}
|
||||
.filter-texts {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 17px 0;
|
||||
font-family: "PingFang SC";
|
||||
font-weight: 400;
|
||||
|
||||
.sum {
|
||||
color: #1f2329;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #999999;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.text {
|
||||
max-width: 280px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
padding: 1px 22px 1px 6px;
|
||||
display: inline-block;
|
||||
align-items: center;
|
||||
color: #0c296e;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
border-radius: 2px;
|
||||
margin: 0;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
i {
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.clear-btn {
|
||||
color: #646a73;
|
||||
}
|
||||
|
||||
.clear-btn:hover {
|
||||
color: #3370ff;
|
||||
}
|
||||
|
||||
.filter-texts-container::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.arrow-filter {
|
||||
font-size: 16px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
cursor: pointer;
|
||||
color: #646a73;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.arrow-filter:hover {
|
||||
background: rgba(31, 35, 41, 0.1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-right.arrow-filter {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-left.arrow-filter {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.filter-texts-container {
|
||||
flex: 1;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
.top-operate {
|
||||
margin-bottom: 16px;
|
||||
.right-user {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
|
||||
.de-button {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.el-input--medium .el-input__icon {
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.name-email-search {
|
||||
width: 240px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,33 +1,34 @@
|
||||
<template xmlns:el-col="http://www.w3.org/1999/html">
|
||||
<el-col style="padding: 0 5px 0 5px;">
|
||||
<el-col style="padding: 1px 24px 16px 24px">
|
||||
<el-col>
|
||||
<el-row style="margin-bottom: 10px">
|
||||
<el-col :span="16">
|
||||
<el-col :span="24">
|
||||
<el-input
|
||||
v-model="filterText"
|
||||
size="mini"
|
||||
size="small"
|
||||
:placeholder="$t('commons.search')"
|
||||
prefix-icon="el-icon-search"
|
||||
clearable
|
||||
class="main-area-input"
|
||||
/>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-dropdown>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="primary"
|
||||
>
|
||||
<el-select
|
||||
slot="append"
|
||||
v-model="searchType"
|
||||
:placeholder="searchMap[searchType]"
|
||||
>
|
||||
{{ searchMap[searchType] }}<i class="el-icon-arrow-down el-icon--right" />
|
||||
</el-button>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item @click.native="searchTypeClick('all')">全部</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="searchTypeClick('folder')">目录</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
<el-option
|
||||
:label="$t('commons.all')"
|
||||
value="all"
|
||||
/>
|
||||
<el-option
|
||||
:label="$t('commons.folder')"
|
||||
value="folder"
|
||||
/>
|
||||
</el-select>
|
||||
</el-input>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-row class="de-tree">
|
||||
<span class="header-title">{{ $t('panel.default_panel') }}</span>
|
||||
<div class="block">
|
||||
<el-tree
|
||||
@ -111,7 +112,7 @@
|
||||
/>
|
||||
</span>
|
||||
</el-row>
|
||||
<el-col class="custom-tree-container">
|
||||
<el-col class="custom-tree-container de-tree">
|
||||
<div class="block">
|
||||
<el-tree
|
||||
ref="panel_list_tree"
|
||||
@ -1049,6 +1050,15 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
.main-area-input {
|
||||
::v-deep.el-input-group__append {
|
||||
width: 70px;
|
||||
background: transparent;
|
||||
.el-input__inner {
|
||||
padding-left: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.header-title {
|
||||
font-size: 14px;
|
||||
flex: 1;
|
||||
@ -1092,12 +1102,4 @@ export default {
|
||||
/*display: inline;*/
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.unpublished {
|
||||
color: #b2b2b2
|
||||
}
|
||||
|
||||
.publish {
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@ -193,7 +193,7 @@
|
||||
import { basicInfo, updateInfo } from '@/api/system/basic'
|
||||
import { ldapStatus, oidcStatus, casStatus } from '@/api/user'
|
||||
import bus from '@/utils/bus'
|
||||
import operater from './operater'
|
||||
import operater from './Operater'
|
||||
import msgCfm from '@/components/msgCfm'
|
||||
import PluginCom from '@/views/system/plugin/PluginCom'
|
||||
export default {
|
||||
|
||||
@ -182,7 +182,7 @@
|
||||
<script>
|
||||
import { engineInfo, validate, save } from '@/api/system/engine'
|
||||
import i18n from '@/lang'
|
||||
import operater from './operater'
|
||||
import operater from './Operater'
|
||||
import msgCfm from '@/components/msgCfm'
|
||||
import dePwd from '@/components/deCustomCm/dePwd.vue'
|
||||
export default {
|
||||
|
||||
@ -130,7 +130,7 @@
|
||||
|
||||
<script>
|
||||
import { emailInfo, updateInfo, validate } from '@/api/system/email'
|
||||
import operater from './operater'
|
||||
import operater from './Operater'
|
||||
import msgCfm from '@/components/msgCfm'
|
||||
import dePwd from '@/components/deCustomCm/dePwd.vue'
|
||||
export default {
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
v-closePress
|
||||
:title="$t('user.filter_method')"
|
||||
:visible.sync="userDrawer"
|
||||
custom-class="user-drawer-task"
|
||||
custom-class="de-user-drawer"
|
||||
size="680px"
|
||||
direction="rtl"
|
||||
>
|
||||
|
||||
@ -1,5 +1,8 @@
|
||||
<template>
|
||||
<de-layout-content :header="$t('log.title')">
|
||||
<de-layout-content
|
||||
class="de-serach-table"
|
||||
:header="$t('log.title')"
|
||||
>
|
||||
<el-row class="top-operate">
|
||||
<el-col :span="12">
|
||||
<deBtn
|
||||
@ -304,107 +307,4 @@ export default {
|
||||
.table-container-filter {
|
||||
height: calc(100% - 110px);
|
||||
}
|
||||
.filter-texts {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 17px 0;
|
||||
font-family: "PingFang SC";
|
||||
font-weight: 400;
|
||||
|
||||
.sum {
|
||||
color: #1f2329;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #999999;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.text {
|
||||
max-width: 280px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
padding: 1px 22px 1px 6px;
|
||||
display: inline-block;
|
||||
align-items: center;
|
||||
color: #0c296e;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
border-radius: 2px;
|
||||
margin: 0;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
i {
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.clear-btn {
|
||||
color: #646a73;
|
||||
}
|
||||
|
||||
.clear-btn:hover {
|
||||
color: #3370ff;
|
||||
}
|
||||
|
||||
.filter-texts-container::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.arrow-filter {
|
||||
font-size: 16px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
cursor: pointer;
|
||||
color: #646a73;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.arrow-filter:hover {
|
||||
background: rgba(31, 35, 41, 0.1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-right.arrow-filter {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-left.arrow-filter {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.filter-texts-container {
|
||||
flex: 1;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
.top-operate {
|
||||
margin-bottom: 16px;
|
||||
.right-user {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
|
||||
.de-button {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.el-input--medium .el-input__icon {
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.name-email-search {
|
||||
width: 240px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="dataset-on-time">
|
||||
<div class="dataset-on-time de-serach-table">
|
||||
<el-row class="top-operate">
|
||||
<el-col :span="10">
|
||||
<deBtn
|
||||
@ -244,11 +244,11 @@
|
||||
key="__operation"
|
||||
:label="$t('commons.operating')"
|
||||
fixed="right"
|
||||
width="84"
|
||||
width="100"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
class="text-btn mar3 mar6"
|
||||
class="de-text-btn mar3 mar6"
|
||||
type="text"
|
||||
@click="selectDataset(scope.row)"
|
||||
>{{
|
||||
@ -367,7 +367,7 @@ import { formatOrders } from '@/utils/index'
|
||||
import { datasetTaskList, post } from '@/api/dataset/dataset'
|
||||
import { hasDataPermission } from '@/utils/permission'
|
||||
import GridTable from '@/components/gridTable/index.vue'
|
||||
import filterUser from './filterUser.vue'
|
||||
import filterUser from './FilterUser.vue'
|
||||
import msgCfm from '@/components/msgCfm/index'
|
||||
import _ from 'lodash'
|
||||
import keyEnter from '@/components/msgCfm/keyEnter.js'
|
||||
@ -743,22 +743,6 @@ export default {
|
||||
.table-container {
|
||||
height: calc(100% - 50px);
|
||||
|
||||
.text-btn {
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
letter-spacing: 0px;
|
||||
text-align: center;
|
||||
margin-left: 2px;
|
||||
border: none;
|
||||
padding: 2px 4px;
|
||||
}
|
||||
|
||||
.text-btn:hover {
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
}
|
||||
|
||||
.mar6 {
|
||||
margin-right: 6px;
|
||||
}
|
||||
@ -771,109 +755,6 @@ export default {
|
||||
.table-container-filter {
|
||||
height: calc(100% - 110px);
|
||||
}
|
||||
.filter-texts {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 17px 0;
|
||||
font-family: "PingFang SC";
|
||||
font-weight: 400;
|
||||
|
||||
.sum {
|
||||
color: #1f2329;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #999999;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.text {
|
||||
max-width: 280px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
padding: 1px 22px 1px 6px;
|
||||
display: inline-block;
|
||||
align-items: center;
|
||||
color: #0c296e;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
border-radius: 2px;
|
||||
margin: 0;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
i {
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.clear-btn {
|
||||
color: #646a73;
|
||||
}
|
||||
|
||||
.clear-btn:hover {
|
||||
color: #3370ff;
|
||||
}
|
||||
|
||||
.filter-texts-container::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.arrow-filter {
|
||||
font-size: 16px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
cursor: pointer;
|
||||
color: #646a73;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.arrow-filter:hover {
|
||||
background: rgba(31, 35, 41, 0.1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-right.arrow-filter {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-left.arrow-filter {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.filter-texts-container {
|
||||
flex: 1;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
.top-operate {
|
||||
margin-bottom: 16px;
|
||||
.right-user {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
|
||||
.de-button {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.el-input--medium .el-input__icon {
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.name-email-search {
|
||||
width: 240px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.list-colums-slect {
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="dataset-on-time">
|
||||
<div class="dataset-on-time de-serach-table">
|
||||
<el-row class="top-operate">
|
||||
<el-col :span="10">
|
||||
<deBtn
|
||||
@ -176,7 +176,7 @@ import {
|
||||
} from '@/utils/index'
|
||||
import { exportExcel, post } from '@/api/dataset/dataset'
|
||||
import GridTable from '@/components/gridTable/index.vue'
|
||||
import filterUser from './filterUserRecord.vue'
|
||||
import filterUser from './FilterUserRecord.vue'
|
||||
import _ from 'lodash'
|
||||
import keyEnter from '@/components/msgCfm/keyEnter.js'
|
||||
|
||||
@ -453,29 +453,6 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.el-divider--horizontal {
|
||||
margin: 12px 0;
|
||||
}
|
||||
|
||||
.el-radio {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.el-radio ::v-deep .el-radio__label {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.dialog-css ::v-deep .el-dialog__header {
|
||||
padding: 20px 20px 0;
|
||||
}
|
||||
|
||||
.dialog-css ::v-deep .el-dialog__body {
|
||||
padding: 10px 20px 20px;
|
||||
}
|
||||
|
||||
.el-form-item {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.err-msg {
|
||||
font-size: 12px;
|
||||
word-break: normal;
|
||||
@ -485,10 +462,6 @@ export default {
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 12px;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.dataset-on-time {
|
||||
@ -501,136 +474,9 @@ span {
|
||||
}
|
||||
.table-container {
|
||||
height: calc(100% - 50px);
|
||||
|
||||
.text-btn {
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
letter-spacing: 0px;
|
||||
text-align: center;
|
||||
margin-left: 2px;
|
||||
border: none;
|
||||
padding: 2px 4px;
|
||||
}
|
||||
|
||||
.text-btn:hover {
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
}
|
||||
|
||||
.mar6 {
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
.mar3 {
|
||||
margin-left: -3px;
|
||||
}
|
||||
}
|
||||
|
||||
.table-container-filter {
|
||||
height: calc(100% - 110px);
|
||||
}
|
||||
.filter-texts {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 17px 0;
|
||||
font-family: "PingFang SC";
|
||||
font-weight: 400;
|
||||
|
||||
.sum {
|
||||
color: #1f2329;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #999999;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.text {
|
||||
max-width: 280px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
padding: 1px 22px 1px 6px;
|
||||
display: inline-block;
|
||||
align-items: center;
|
||||
color: #0c296e;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
border-radius: 2px;
|
||||
margin: 0;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
i {
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.clear-btn {
|
||||
color: #646a73;
|
||||
}
|
||||
|
||||
.clear-btn:hover {
|
||||
color: #3370ff;
|
||||
}
|
||||
|
||||
.filter-texts-container::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.arrow-filter {
|
||||
font-size: 16px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
cursor: pointer;
|
||||
color: #646a73;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.arrow-filter:hover {
|
||||
background: rgba(31, 35, 41, 0.1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-right.arrow-filter {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-left.arrow-filter {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.filter-texts-container {
|
||||
flex: 1;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
.top-operate {
|
||||
margin-bottom: 16px;
|
||||
.right-user {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
|
||||
.de-button {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.el-input--medium .el-input__icon {
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.name-email-search {
|
||||
width: 240px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
v-closePress
|
||||
:title="$t('user.filter_method')"
|
||||
:visible.sync="userDrawer"
|
||||
custom-class="user-drawer-task"
|
||||
custom-class="de-user-drawer"
|
||||
size="680px"
|
||||
direction="rtl"
|
||||
>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
v-closePress
|
||||
:title="$t('user.filter_method')"
|
||||
:visible.sync="userDrawer"
|
||||
custom-class="user-drawer-task"
|
||||
custom-class="de-user-drawer"
|
||||
size="680px"
|
||||
direction="rtl"
|
||||
>
|
||||
|
||||
@ -1,54 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-switch
|
||||
v-model="value"
|
||||
active-text="当前用户"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ComplexCondition } from 'fit2cloud-ui/src/components/search-bar/model'
|
||||
|
||||
export default {
|
||||
name: 'CustomCondition',
|
||||
props: {
|
||||
// eslint-disable-next-line vue/require-default-prop
|
||||
field: String,
|
||||
// eslint-disable-next-line vue/require-default-prop
|
||||
label: String,
|
||||
// eslint-disable-next-line vue/require-default-prop
|
||||
defaultOperator: String,
|
||||
// eslint-disable-next-line vue/require-default-prop
|
||||
options: Array
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
value: undefined,
|
||||
operator: 'isCurrentUser',
|
||||
operatorLabel: '是当前用户'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
valueLabel() {
|
||||
return this.value ? '是' : '否'
|
||||
}
|
||||
},
|
||||
// 自定义搜索控件的2个方法
|
||||
methods: {
|
||||
init() { // 初始化方法，在打开复合搜索界面时会被调用
|
||||
// 例如清空之前填写的内容
|
||||
this.value = undefined
|
||||
},
|
||||
getCondition() { // 点击确认时调用
|
||||
const { field, label, operator, operatorLabel, value, valueLabel } = this
|
||||
// 必须返回ComplexCondition类型的对象
|
||||
return new ComplexCondition({ field, label, operator, operatorLabel, value, valueLabel })
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -3,7 +3,7 @@
|
||||
v-closePress
|
||||
:title="$t('user.filter_method')"
|
||||
:visible.sync="userDrawer"
|
||||
custom-class="user-drawer"
|
||||
custom-class="de-user-drawer"
|
||||
size="680px"
|
||||
direction="rtl"
|
||||
>
|
||||
@ -115,20 +115,19 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="foot">
|
||||
<el-button
|
||||
class="btn normal"
|
||||
<div class="de-foot">
|
||||
<deBtn
|
||||
secondary
|
||||
@click="reset"
|
||||
>{{
|
||||
$t("commons.reset")
|
||||
}}</el-button>
|
||||
<el-button
|
||||
}}</deBtn>
|
||||
<deBtn
|
||||
type="primary"
|
||||
class="btn"
|
||||
@click="search"
|
||||
>{{
|
||||
$t("commons.adv_search.search")
|
||||
}}</el-button>
|
||||
}}</deBtn>
|
||||
</div>
|
||||
</el-drawer>
|
||||
</template>
|
||||
|
||||
@ -1,298 +0,0 @@
|
||||
<template>
|
||||
<layout-content
|
||||
:header="$t('user.import_ldap') "
|
||||
back-name="system-user"
|
||||
>
|
||||
<el-form
|
||||
ref="importUserForm"
|
||||
:model="form"
|
||||
:rules="rule"
|
||||
size="small"
|
||||
label-width="auto"
|
||||
label-position="right"
|
||||
>
|
||||
|
||||
<el-form-item
|
||||
:label="$t('commons.user')"
|
||||
prop="userIds"
|
||||
>
|
||||
<el-select
|
||||
ref="userSelect"
|
||||
v-model="form.userIds"
|
||||
filterable
|
||||
style="width: 100%"
|
||||
multiple
|
||||
:placeholder="$t('commons.please_select')"
|
||||
@change="changeUser"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in users"
|
||||
:key="item.userName"
|
||||
:disabled="item.disabled"
|
||||
:label="item.nickName"
|
||||
:value="item.userName"
|
||||
>
|
||||
<span>{{ item.nickName + (item.disabled ? '(已存在)':'') }}</span>
|
||||
<!-- <span><el-checkbox v-model="item.checked">{{ item.nickName }}</el-checkbox></span> -->
|
||||
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item
|
||||
:label="$t('commons.organization')"
|
||||
prop="deptId"
|
||||
>
|
||||
<treeselect
|
||||
ref="deptTreeSelect"
|
||||
v-model="form.deptId"
|
||||
:options="depts"
|
||||
:load-options="loadDepts"
|
||||
:auto-load-root-options="false"
|
||||
:placeholder="$t('user.choose_org')"
|
||||
:no-children-text="$t('commons.treeselect.no_children_text')"
|
||||
:no-options-text="$t('commons.treeselect.no_options_text')"
|
||||
:no-results-text="$t('commons.treeselect.no_results_text')"
|
||||
@open="filterData"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('commons.role')"
|
||||
prop="roleIds"
|
||||
>
|
||||
<el-select
|
||||
ref="roleSelect"
|
||||
v-model="form.roleIds"
|
||||
filterable
|
||||
style="width: 100%"
|
||||
multiple
|
||||
:placeholder="$t('commons.please_select')"
|
||||
@remove-tag="deleteTag"
|
||||
@change="changeRole"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in roles"
|
||||
:key="item.name"
|
||||
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item
|
||||
:label="$t('commons.status')"
|
||||
prop="enabled"
|
||||
>
|
||||
<el-radio-group
|
||||
v-model="form.enabled"
|
||||
style="width: 140px"
|
||||
>
|
||||
<el-radio :label="1">{{ $t('commons.enable') }}</el-radio>
|
||||
<el-radio :label="0">{{ $t('commons.disable') }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="save"
|
||||
>{{ $t('commons.confirm') }}</el-button>
|
||||
<el-button @click="cancel">{{ $t('commons.cancel') }}</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
</layout-content>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import LayoutContent from '@/components/business/LayoutContent'
|
||||
import { getDeptTree, treeByDeptId } from '@/api/system/dept'
|
||||
import { allRoles, ldapUsers, saveLdapUser, existLdapUsers } from '@/api/system/user'
|
||||
export default {
|
||||
|
||||
components: { LayoutContent },
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
roles: [{
|
||||
id: ''
|
||||
}]
|
||||
},
|
||||
rule: {
|
||||
userIds: [{ required: true, message: this.$t('user.select_users'), trigger: 'change' }],
|
||||
roleIds: [{ required: true, message: this.$t('user.input_roles'), trigger: 'change' }],
|
||||
deptId: [],
|
||||
enable: []
|
||||
|
||||
},
|
||||
defaultForm: { deptId: null, enabled: 1, roleIds: [2] },
|
||||
depts: null,
|
||||
roles: [],
|
||||
roleDatas: [],
|
||||
userRoles: [],
|
||||
users: [],
|
||||
exitsUsers: []
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.initRoles()
|
||||
this.remoteMethod()
|
||||
this.getExistUsers()
|
||||
this.create()
|
||||
},
|
||||
mounted() {
|
||||
this.bindKey()
|
||||
},
|
||||
destroyed() {
|
||||
this.unBindKey()
|
||||
},
|
||||
methods: {
|
||||
entryKey(event) {
|
||||
const keyCode = event.keyCode
|
||||
if (keyCode === 13) {
|
||||
this.save()
|
||||
}
|
||||
},
|
||||
bindKey() {
|
||||
document.addEventListener('keypress', this.entryKey)
|
||||
},
|
||||
unBindKey() {
|
||||
document.removeEventListener('keypress', this.entryKey)
|
||||
},
|
||||
|
||||
create() {
|
||||
this.depts = null
|
||||
this.form = Object.assign({}, this.defaultForm)
|
||||
},
|
||||
|
||||
initRoles() {
|
||||
allRoles().then(res => {
|
||||
this.roles = res.data
|
||||
})
|
||||
},
|
||||
|
||||
// 获取弹窗内部门数据
|
||||
loadDepts({ action, parentNode, callback }) {
|
||||
if (action === 'LOAD_ROOT_OPTIONS' && !this.form.deptId) {
|
||||
const _self = this
|
||||
treeByDeptId(0).then(res => {
|
||||
const results = res.data.map(node => {
|
||||
if (node.hasChildren && !node.children) {
|
||||
node.children = null
|
||||
}
|
||||
return node
|
||||
})
|
||||
_self.depts = results
|
||||
callback()
|
||||
})
|
||||
}
|
||||
|
||||
if (action === 'LOAD_CHILDREN_OPTIONS') {
|
||||
const _self = this
|
||||
getDeptTree(parentNode.id).then(res => {
|
||||
parentNode.children = res.data.map(function(obj) {
|
||||
return _self.normalizer(obj)
|
||||
})
|
||||
callback()
|
||||
})
|
||||
}
|
||||
},
|
||||
normalizer(node) {
|
||||
if (node.hasChildren) {
|
||||
node.children = null
|
||||
}
|
||||
return {
|
||||
id: node.deptId,
|
||||
label: node.name,
|
||||
children: node.children
|
||||
}
|
||||
},
|
||||
deleteTag(value) {
|
||||
this.userRoles.forEach(function(data, index) {
|
||||
if (data.id === value) {
|
||||
this.userRoles.splice(index, value)
|
||||
}
|
||||
}.bind(this))
|
||||
},
|
||||
changeRole(value) {
|
||||
this.userRoles = []
|
||||
value.forEach(function(data, index) {
|
||||
const role = { id: data }
|
||||
this.userRoles.push(role)
|
||||
}.bind(this))
|
||||
},
|
||||
cancel() {
|
||||
this.$refs.importUserForm.resetFields()
|
||||
},
|
||||
save() {
|
||||
this.$refs.importUserForm.validate(valid => {
|
||||
if (valid) {
|
||||
const checkedUsers = this.users.filter(user => user.checked)
|
||||
const param = {
|
||||
users: checkedUsers,
|
||||
deptId: this.form.deptId,
|
||||
roleIds: this.form.roleIds,
|
||||
enabled: this.form.enabled
|
||||
}
|
||||
const method = saveLdapUser
|
||||
method(param).then(res => {
|
||||
this.$success(this.$t('commons.save_success'))
|
||||
this.backToList()
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
backToList() {
|
||||
this.$router.push({ name: 'system-user' })
|
||||
},
|
||||
filterData(instanceId) {
|
||||
this.$refs.roleSelect && this.$refs.roleSelect.blur && this.$refs.roleSelect.blur()
|
||||
if (!this.depts) {
|
||||
return
|
||||
}
|
||||
const results = this.depts.map(node => {
|
||||
if (node.hasChildren) {
|
||||
node.children = null
|
||||
}
|
||||
return node
|
||||
})
|
||||
this.depts = results
|
||||
},
|
||||
remoteMethod() {
|
||||
this.users = []
|
||||
existLdapUsers().then(resout => {
|
||||
this.exitsUsers = resout.data
|
||||
ldapUsers().then(res => {
|
||||
if (res && res.data) {
|
||||
this.users = res.data.map(item => {
|
||||
if (this.exitsUsers.some(existUser => existUser.username === item.userName)) {
|
||||
item.disabled = true
|
||||
}
|
||||
return item
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
changeUser(values) {
|
||||
this.users.forEach(user => {
|
||||
user.checked = false
|
||||
if (values.includes(user.userName)) {
|
||||
user.checked = true
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
getExistUsers() {
|
||||
/* existLdapUsers().then(res => {
|
||||
this.exitsUsers = res.data
|
||||
}) */
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,14 +1,13 @@
|
||||
<template>
|
||||
<de-layout-content>
|
||||
<de-layout-content class="de-serach-table">
|
||||
<el-row class="top-operate">
|
||||
<el-col :span="12">
|
||||
<el-button
|
||||
<deBtn
|
||||
v-permission="['user:add']"
|
||||
class="btn"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
@click="create"
|
||||
>{{ $t("user.create") }}</el-button>
|
||||
>{{ $t("user.create") }}</deBtn>
|
||||
|
||||
<plugin-com
|
||||
v-if="isPluginLoaded"
|
||||
@ -32,25 +31,23 @@
|
||||
@blur="initSearch"
|
||||
@clear="initSearch"
|
||||
/>
|
||||
<el-button
|
||||
v-btnPress="filterColor"
|
||||
class="normal btn"
|
||||
:class="[filterTexts.length ? 'active-btn filter-not-null' : 'filter-zero']"
|
||||
<deBtn
|
||||
:secondary="!cacheCondition.length"
|
||||
:plain="!!cacheCondition.length"
|
||||
icon="iconfont icon-icon-filter"
|
||||
@click="filterShow"
|
||||
>{{ $t('user.filter') }}<template v-if="filterTexts.length">
|
||||
({{ filterTexts.length }})
|
||||
</template>
|
||||
</el-button>
|
||||
</deBtn>
|
||||
<el-dropdown
|
||||
trigger="click"
|
||||
:hide-on-click="false"
|
||||
>
|
||||
<el-button
|
||||
v-btnPress
|
||||
class="normal btn filter-zero"
|
||||
<deBtn
|
||||
secondary
|
||||
icon="el-icon-setting"
|
||||
>{{ $t('user.list') }}</el-button>
|
||||
>{{ $t('user.list') }}</deBtn>
|
||||
<el-dropdown-menu
|
||||
slot="dropdown"
|
||||
class="list-colums-slect"
|
||||
@ -246,7 +243,7 @@
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
v-permission="['user:edit']"
|
||||
class="text-btn mr2"
|
||||
class="de-text-btn mr2"
|
||||
type="text"
|
||||
@click="edit(scope.row)"
|
||||
>{{ $t("commons.edit") }}</el-button>
|
||||
@ -277,34 +274,30 @@
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="foot">
|
||||
<!-- <el-button class="btn normal">{{
|
||||
$t("fu.search_bar.cancel")
|
||||
}}</el-button> -->
|
||||
<el-button
|
||||
<deBtn
|
||||
type="primary"
|
||||
class="btn"
|
||||
@click="resetPwd(scope.row.userId)"
|
||||
>{{ $t("fu.search_bar.ok") }}</el-button>
|
||||
>{{ $t("fu.search_bar.ok") }}</deBtn>
|
||||
</div>
|
||||
|
||||
<el-button
|
||||
slot="reference"
|
||||
v-permission="['user:editPwd']"
|
||||
class="text-btn mar16"
|
||||
class="de-text-btn mar16"
|
||||
type="text"
|
||||
>{{ $t("member.edit_password") }}</el-button>
|
||||
</el-popover>
|
||||
<el-button
|
||||
v-if="scope.row.id !== 1"
|
||||
v-permission="['user:del']"
|
||||
class="text-btn"
|
||||
class="de-text-btn"
|
||||
type="text"
|
||||
@click="del(scope.row)"
|
||||
>{{ $t("commons.delete") }}</el-button>
|
||||
<el-button
|
||||
v-if="scope.row.locked"
|
||||
v-permission="['user:edit']"
|
||||
class="text-btn"
|
||||
class="de-text-btn"
|
||||
type="text"
|
||||
@click="unlock(scope.row)"
|
||||
>{{ $t("commons.unlock") }}</el-button>
|
||||
@ -326,41 +319,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import userEditer from './userEditer.vue'
|
||||
const columnOptions = [
|
||||
{
|
||||
label: 'ID',
|
||||
props: 'username'
|
||||
},
|
||||
{
|
||||
label: 'commons.nick_name',
|
||||
props: 'nickName'
|
||||
},
|
||||
{
|
||||
label: 'user.source',
|
||||
props: 'from'
|
||||
},
|
||||
{
|
||||
label: 'commons.email',
|
||||
props: 'email'
|
||||
},
|
||||
{
|
||||
label: 'commons.organization',
|
||||
props: 'dept'
|
||||
},
|
||||
{
|
||||
label: 'commons.role',
|
||||
props: 'roles'
|
||||
},
|
||||
{
|
||||
label: 'commons.status',
|
||||
props: 'status'
|
||||
},
|
||||
{
|
||||
label: 'commons.create_time',
|
||||
props: 'createTime'
|
||||
}
|
||||
]
|
||||
import userEditer from './UserEditer.vue'
|
||||
import { columnOptions } from './options'
|
||||
import DeLayoutContent from '@/components/business/DeLayoutContent'
|
||||
import { addOrder, formatOrders } from '@/utils/index'
|
||||
import { pluginLoaded, defaultPwd } from '@/api/user'
|
||||
@ -375,7 +335,7 @@ import {
|
||||
unLock
|
||||
} from '@/api/system/user'
|
||||
import { mapGetters } from 'vuex'
|
||||
import filterUser from './filterUser.vue'
|
||||
import filterUser from './FilterUser.vue'
|
||||
import GridTable from '@/components/gridTable/index.vue'
|
||||
import PluginCom from '@/views/system/plugin/PluginCom'
|
||||
import _ from 'lodash'
|
||||
@ -433,10 +393,7 @@ export default {
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['user']),
|
||||
filterColor() {
|
||||
return this.filterTexts.length ? 'rgba(51, 112, 255, 0.15)' : '#EFF0F1'
|
||||
}
|
||||
...mapGetters(['user'])
|
||||
},
|
||||
watch: {
|
||||
filterTexts: {
|
||||
@ -691,25 +648,6 @@ export default {
|
||||
.table-container {
|
||||
height: calc(100% - 50px);
|
||||
|
||||
.text-btn {
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
letter-spacing: 0px;
|
||||
text-align: center;
|
||||
margin-left: 2px;
|
||||
border: none;
|
||||
padding: 2px 4px;
|
||||
}
|
||||
|
||||
.text-btn:hover {
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
}
|
||||
.disable-btn {
|
||||
color: #bbbfc4;
|
||||
}
|
||||
|
||||
.mar16 {
|
||||
margin: 0 -2px 0 4px;
|
||||
}
|
||||
@ -722,149 +660,6 @@ export default {
|
||||
.table-container-filter {
|
||||
height: calc(100% - 110px);
|
||||
}
|
||||
.filter-texts {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 17px 0;
|
||||
font-family: "PingFang SC";
|
||||
font-weight: 400;
|
||||
|
||||
.sum {
|
||||
color: #1f2329;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #999999;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.text {
|
||||
max-width: 280px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
padding: 1px 22px 1px 6px;
|
||||
display: inline-block;
|
||||
align-items: center;
|
||||
color: #0c296e;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
border-radius: 2px;
|
||||
margin: 0;
|
||||
margin-right: 8px;
|
||||
position: relative;
|
||||
i {
|
||||
position: absolute;
|
||||
right: 2px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.clear-btn {
|
||||
color: #646a73;
|
||||
}
|
||||
|
||||
.clear-btn:hover {
|
||||
color: #3370ff;
|
||||
}
|
||||
|
||||
.filter-texts-container::-webkit-scrollbar { display: none; }
|
||||
|
||||
.arrow-filter {
|
||||
font-size: 16px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
cursor: pointer;
|
||||
color: #646A73;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.arrow-filter:hover {
|
||||
background: rgba(31, 35, 41, 0.1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-right.arrow-filter {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.el-icon-arrow-left.arrow-filter {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.filter-texts-container {
|
||||
flex: 1;
|
||||
overflow-x: auto;
|
||||
white-space: nowrap;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
.top-operate {
|
||||
margin-bottom: 16px;
|
||||
|
||||
.btn {
|
||||
border-radius: 4px;
|
||||
padding: 5px 12px;
|
||||
//styleName: 中文/桌面端/正文 14 22 Regular;
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
letter-spacing: 0px;
|
||||
text-align: center;
|
||||
border: none;
|
||||
box-sizing: border-box;
|
||||
|
||||
::v-deep span {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.normal {
|
||||
color: var(----deTextPrimary, #1F2329);
|
||||
border: 1px solid var(--deBorderBase, #BBBFC4);
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.filter-not-null:focus {
|
||||
background: rgba(51, 112, 255, 0.1);
|
||||
}
|
||||
|
||||
.filter-not-null:hover {
|
||||
background: rgba(51, 112, 255, 0.1) !important;
|
||||
}
|
||||
|
||||
.filter-zero:focus {
|
||||
background: #F5F6F7;
|
||||
}
|
||||
|
||||
.filter-zero:hover {
|
||||
background: #F5F6F7 !important;
|
||||
}
|
||||
|
||||
.right-user {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
|
||||
.el-input--medium .el-input__icon {
|
||||
line-height: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.name-email-search {
|
||||
width: 240px;
|
||||
}
|
||||
|
||||
.active-btn {
|
||||
border-color: #3370ff;
|
||||
color: #3370ff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.reset-pwd {
|
||||
|
||||
34
frontend/src/views/system/user/options.js
Normal file
34
frontend/src/views/system/user/options.js
Normal file
@ -0,0 +1,34 @@
|
||||
export const columnOptions = [
|
||||
{
|
||||
label: 'ID',
|
||||
props: 'username'
|
||||
},
|
||||
{
|
||||
label: 'commons.nick_name',
|
||||
props: 'nickName'
|
||||
},
|
||||
{
|
||||
label: 'user.source',
|
||||
props: 'from'
|
||||
},
|
||||
{
|
||||
label: 'commons.email',
|
||||
props: 'email'
|
||||
},
|
||||
{
|
||||
label: 'commons.organization',
|
||||
props: 'dept'
|
||||
},
|
||||
{
|
||||
label: 'commons.role',
|
||||
props: 'roles'
|
||||
},
|
||||
{
|
||||
label: 'commons.status',
|
||||
props: 'status'
|
||||
},
|
||||
{
|
||||
label: 'commons.create_time',
|
||||
props: 'createTime'
|
||||
}
|
||||
]
|
||||
@ -1,390 +0,0 @@
|
||||
<template>
|
||||
<layout-content>
|
||||
<div style="width: 100%;display: flex;justify-content: center;">
|
||||
<el-card class="box-card about-card">
|
||||
<div class="form-header">
|
||||
<span>{{ $t('commons.personal_info') }}</span>
|
||||
</div>
|
||||
<el-form
|
||||
ref="createUserForm"
|
||||
:model="form"
|
||||
:rules="rule"
|
||||
size="small"
|
||||
label-width="auto"
|
||||
label-position="right"
|
||||
>
|
||||
<el-form-item
|
||||
label="ID"
|
||||
prop="username"
|
||||
>
|
||||
<el-input
|
||||
v-model="form.username"
|
||||
disabled
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('commons.phone')"
|
||||
prop="phone"
|
||||
>
|
||||
<el-input
|
||||
v-model="form.phone"
|
||||
:disabled="formType!=='modify'"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('commons.nick_name')"
|
||||
prop="nickName"
|
||||
>
|
||||
<el-input
|
||||
v-model="form.nickName"
|
||||
:disabled="formType!=='modify'"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('commons.email')"
|
||||
prop="email"
|
||||
>
|
||||
<el-input
|
||||
v-model="form.email"
|
||||
:disabled="formType!=='modify'"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item :label="$t('commons.status')">
|
||||
<el-radio-group
|
||||
v-model="form.enabled"
|
||||
disabled
|
||||
style="width: 140px"
|
||||
>
|
||||
<el-radio :label="1">{{ $t('commons.enable') }}</el-radio>
|
||||
<el-radio :label="0">{{ $t('commons.disable') }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
disabled
|
||||
:label="$t('commons.organization')"
|
||||
prop="dept"
|
||||
>
|
||||
<treeselect
|
||||
v-model="form.deptId"
|
||||
disabled
|
||||
:options="depts"
|
||||
:load-options="loadDepts"
|
||||
:auto-load-root-options="false"
|
||||
:placeholder="$t('user.choose_org')"
|
||||
:no-children-text="$t('commons.treeselect.no_children_text')"
|
||||
:no-options-text="$t('commons.treeselect.no_options_text')"
|
||||
:no-results-text="$t('commons.treeselect.no_results_text')"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('commons.role')"
|
||||
prop="roleIds"
|
||||
>
|
||||
<el-select
|
||||
v-model="form.roleIds"
|
||||
disabled
|
||||
style="width: 100%"
|
||||
multiple
|
||||
:placeholder="$t('commons.please_select')"
|
||||
@remove-tag="deleteTag"
|
||||
@change="changeRole"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in roles"
|
||||
:key="item.name"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<plugin-com
|
||||
v-if="isPluginLoaded"
|
||||
ref="AuthenticationBind"
|
||||
:user-id="form.userId"
|
||||
:form-type="formType"
|
||||
component-name="AuthenticationBind"
|
||||
/>
|
||||
|
||||
<!--提供修改个人电话，邮箱和昵称的功能-->
|
||||
<el-form-item v-if="formType!=='modify'">
|
||||
<el-button @click="formType = 'modify'">修改个人信息</el-button>
|
||||
</el-form-item>
|
||||
<el-form-item v-else>
|
||||
<el-button
|
||||
v-if="formType==='modify'"
|
||||
type="primary"
|
||||
@click="save"
|
||||
>保存</el-button>
|
||||
<el-button
|
||||
v-if="formType==='modify'"
|
||||
@click="reset"
|
||||
>取消</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<div
|
||||
slot="footer"
|
||||
style="margin-left: 30px;"
|
||||
class="dialog-footer"
|
||||
>
|
||||
<el-button
|
||||
v-if="formType==='modify'"
|
||||
type="text"
|
||||
@click="reset"
|
||||
>{{ $t('commons.cancel') }}</el-button>
|
||||
<el-button
|
||||
v-if="formType==='modify'"
|
||||
type="primary"
|
||||
@click="save"
|
||||
>{{ $t('commons.confirm') }}</el-button>
|
||||
<el-button
|
||||
v-if="formType!=='modify'"
|
||||
type="primary"
|
||||
@click="edit"
|
||||
>{{ $t('commons.edit') }}</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
</layout-content>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import LayoutContent from '@/components/business/LayoutContent'
|
||||
import Treeselect from '@riophae/vue-treeselect'
|
||||
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
|
||||
import { PHONE_REGEX } from '@/utils/validate'
|
||||
import { LOAD_CHILDREN_OPTIONS, LOAD_ROOT_OPTIONS } from '@riophae/vue-treeselect'
|
||||
import { getDeptTree, treeByDeptId } from '@/api/system/dept'
|
||||
import { allRoles } from '@/api/system/user'
|
||||
import { updatePerson, personInfo } from '@/api/system/user'
|
||||
import { pluginLoaded } from '@/api/user'
|
||||
import PluginCom from '@/views/system/plugin/PluginCom'
|
||||
import Cookies from 'js-cookie'
|
||||
export default {
|
||||
|
||||
components: { LayoutContent, Treeselect, PluginCom },
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
roles: [{
|
||||
id: ''
|
||||
}]
|
||||
},
|
||||
rule: {
|
||||
username: [
|
||||
{ required: true, message: this.$t('user.input_id'), trigger: 'blur' },
|
||||
{ min: 1, max: 50, message: this.$t('commons.input_limit', [1, 50]), trigger: 'blur' },
|
||||
{
|
||||
required: true,
|
||||
pattern: '^[^\u4e00-\u9fa5]+$',
|
||||
message: this.$t('user.special_characters_are_not_supported'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
nickName: [
|
||||
{ required: true, message: this.$t('user.input_name'), trigger: 'blur' },
|
||||
{ min: 2, max: 50, message: this.$t('commons.input_limit', [2, 50]), trigger: 'blur' },
|
||||
{
|
||||
required: true,
|
||||
message: this.$t('user.special_characters_are_not_supported'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
phone: [
|
||||
{
|
||||
pattern: PHONE_REGEX,
|
||||
message: this.$t('user.mobile_number_format_is_incorrect'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
email: [
|
||||
{ required: true, message: this.$t('user.input_email'), trigger: 'blur' },
|
||||
{
|
||||
required: true,
|
||||
pattern: /^[a-zA-Z0-9_._-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/,
|
||||
message: this.$t('user.email_format_is_incorrect'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
password: [
|
||||
{ required: true, message: this.$t('user.input_password'), trigger: 'blur' },
|
||||
{
|
||||
required: true,
|
||||
pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[^]{8,30}$/,
|
||||
message: this.$t('member.password_format_is_incorrect'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
newPassword: [
|
||||
{ required: true, message: this.$t('user.input_password'), trigger: 'blur' },
|
||||
{
|
||||
required: true,
|
||||
pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[^]{8,30}$/,
|
||||
message: this.$t('member.password_format_is_incorrect'),
|
||||
trigger: 'blur'
|
||||
}
|
||||
]
|
||||
|
||||
},
|
||||
defaultForm: { id: null, username: null, nickName: null, gender: '男', email: null, enabled: 1, deptId: null, phone: null, roleIds: [] },
|
||||
depts: null,
|
||||
roles: [],
|
||||
roleDatas: [],
|
||||
userRoles: [],
|
||||
formType: 'add',
|
||||
isPluginLoaded: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('app/toggleSideBarHide', true)
|
||||
})
|
||||
},
|
||||
created() {
|
||||
this.$store.dispatch('app/toggleSideBarHide', true)
|
||||
this.showError()
|
||||
this.queryPerson()
|
||||
this.initRoles()
|
||||
},
|
||||
beforeCreate() {
|
||||
pluginLoaded().then(res => {
|
||||
this.isPluginLoaded = res.success && res.data
|
||||
}).catch(() => {
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
showError() {
|
||||
const errKeys = ['WecomError', 'DingtalkError', 'LarkError']
|
||||
errKeys.forEach(key => {
|
||||
const msg = Cookies.get(key)
|
||||
if (msg) {
|
||||
this.$error(msg)
|
||||
Cookies.remove(key)
|
||||
}
|
||||
})
|
||||
},
|
||||
queryPerson() {
|
||||
personInfo().then(res => {
|
||||
const info = res.data
|
||||
this.form = info
|
||||
const roles = info.roles
|
||||
this.form['roleIds'] = roles.map(role => role.id)
|
||||
if (this.form.deptId === 0) {
|
||||
this.form.deptId = null
|
||||
}
|
||||
this.initDeptTree()
|
||||
})
|
||||
},
|
||||
|
||||
edit() {
|
||||
this.formType = 'modify'
|
||||
},
|
||||
initRoles() {
|
||||
allRoles().then(res => {
|
||||
this.roles = res.data
|
||||
})
|
||||
},
|
||||
initDeptTree() {
|
||||
treeByDeptId(this.form.deptId || 0).then(res => {
|
||||
const results = res.data.map(node => {
|
||||
if (node.hasChildren && !node.children) {
|
||||
node.children = null
|
||||
// delete node.children
|
||||
}
|
||||
return node
|
||||
})
|
||||
this.depts = results
|
||||
})
|
||||
},
|
||||
// 获取弹窗内部门数据
|
||||
loadDepts({ action, parentNode, callback }) {
|
||||
if (action === LOAD_ROOT_OPTIONS && !this.form.deptId) {
|
||||
const _self = this
|
||||
treeByDeptId(0).then(res => {
|
||||
const results = res.data.map(node => {
|
||||
if (node.hasChildren && !node.children) {
|
||||
node.children = null
|
||||
}
|
||||
return node
|
||||
})
|
||||
_self.depts = results
|
||||
callback()
|
||||
})
|
||||
}
|
||||
|
||||
if (action === LOAD_CHILDREN_OPTIONS) {
|
||||
const _self = this
|
||||
getDeptTree(parentNode.id).then(res => {
|
||||
parentNode.children = res.data.map(function(obj) {
|
||||
return _self.normalizer(obj)
|
||||
})
|
||||
callback()
|
||||
})
|
||||
}
|
||||
},
|
||||
normalizer(node) {
|
||||
if (node.hasChildren) {
|
||||
node.children = null
|
||||
}
|
||||
return {
|
||||
id: node.deptId,
|
||||
label: node.name,
|
||||
children: node.children
|
||||
}
|
||||
},
|
||||
deleteTag(value) {
|
||||
this.userRoles.forEach(function(data, index) {
|
||||
if (data.id === value) {
|
||||
this.userRoles.splice(index, value)
|
||||
}
|
||||
}.bind(this))
|
||||
},
|
||||
changeRole(value) {
|
||||
this.userRoles = []
|
||||
value.forEach(function(data, index) {
|
||||
const role = { id: data }
|
||||
this.userRoles.push(role)
|
||||
}.bind(this))
|
||||
},
|
||||
reset() {
|
||||
this.formType = 'add'
|
||||
this.queryPerson()
|
||||
// 清空表单提示
|
||||
this.$refs.createUserForm.clearValidate()
|
||||
},
|
||||
save() {
|
||||
this.$refs.createUserForm.validate(valid => {
|
||||
if (valid) {
|
||||
updatePerson(this.form).then(res => {
|
||||
this.$success(this.$t('commons.save_success'))
|
||||
this.reset()
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.about-card {
|
||||
background: inherit;
|
||||
margin-top: 5%;
|
||||
flex-direction: row;
|
||||
width: 640px;
|
||||
min-width: 640px;
|
||||
height: auto;
|
||||
position: relative;
|
||||
::v-deep div.el-card__header {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
.form-header {
|
||||
line-height: 60px;
|
||||
font-size: 18px;
|
||||
}
|
||||
</style>
|
||||
@ -214,19 +214,18 @@
|
||||
slot="footer"
|
||||
class="dialog-footer"
|
||||
>
|
||||
<el-button
|
||||
class="btn normal"
|
||||
<deBtn
|
||||
secondary
|
||||
@click="reset"
|
||||
>{{
|
||||
$t("commons.cancel")
|
||||
}}</el-button>
|
||||
<el-button
|
||||
class="btn"
|
||||
}}</deBtn>
|
||||
<deBtn
|
||||
type="primary"
|
||||
@click="save"
|
||||
>{{
|
||||
$t("commons.confirm")
|
||||
}}</el-button>
|
||||
}}</deBtn>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
@ -636,25 +635,6 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
border-radius: 4px;
|
||||
padding: 5px 26px 5px 26px;
|
||||
font-family: PingFang SC;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 20px;
|
||||
letter-spacing: 0px;
|
||||
text-align: center;
|
||||
border: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.normal {
|
||||
color: #1f2329;
|
||||
border: 1px solid #bbbfc4;
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.form-gender-select {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user