feat: 行权限
This commit is contained in:
taojinlong
parent
9620cd7136
commit
566a317005
@ -1228,6 +1228,7 @@ public class DataSetTableService {
|
||||
dataSetDetail.setTable(table);
|
||||
if (ObjectUtils.isNotEmpty(table)) {
|
||||
Datasource datasource = datasourceMapper.selectByPrimaryKey(table.getDataSourceId());
|
||||
datasource.setConfiguration(null);
|
||||
dataSetDetail.setDatasource(datasource);
|
||||
}
|
||||
return dataSetDetail;
|
||||
|
||||
@ -1014,6 +1014,7 @@ export default {
|
||||
field_check: '选中',
|
||||
update_info: '更新信息',
|
||||
join_view: '数据关联',
|
||||
row_permissions: '行权限',
|
||||
text: '文本',
|
||||
time: '时间',
|
||||
value: '数值',
|
||||
|
||||
35
frontend/src/views/dataset/data/RowPermissions.vue
Normal file
35
frontend/src/views/dataset/data/RowPermissions.vue
Normal file
@ -0,0 +1,35 @@
|
||||
<template>
|
||||
<de-main-container style="height: calc(100vh - 56px)">
|
||||
<auth-config />
|
||||
</de-main-container>
|
||||
</template>
|
||||
<script>
|
||||
import DeMainContainer from '@/components/dataease/DeMainContainer'
|
||||
import AuthConfig from './authConfig'
|
||||
|
||||
export default {
|
||||
name: 'RowPermissions',
|
||||
components: { DeMainContainer, AuthConfig },
|
||||
data () {
|
||||
return {
|
||||
authorityType: 'authConfig'
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
},
|
||||
mounted () {
|
||||
},
|
||||
methods: {
|
||||
executeAxios (param) {
|
||||
this.$emit('execute-axios', param)
|
||||
},
|
||||
handleClick () {
|
||||
console.log('===>handleClick')
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
@ -56,6 +56,9 @@
|
||||
<el-tab-pane v-if="table.type !== 'custom' && !(table.type === 'sql' && table.mode === 0)" :label="$t('dataset.join_view')" name="joinView">
|
||||
<union-view :param="param" :table="table" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="$t('dataset.row_permissions')" name="rowPermissions">
|
||||
<row-permissions :param="param" :table="table" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane v-if="table.mode === 1 && (table.type === 'excel' || table.type === 'db' || table.type === 'sql')" :label="$t('dataset.update_info')" name="updateInfo">
|
||||
<update-info v-if="tabActive=='updateInfo'" :param="param" :table="table" />
|
||||
</el-tab-pane>
|
||||
@ -69,11 +72,12 @@ import TabDataPreview from './TabDataPreview'
|
||||
import UpdateInfo from './UpdateInfo'
|
||||
import DatasetChartDetail from '../common/DatasetChartDetail'
|
||||
import UnionView from './UnionView'
|
||||
import RowPermissions from './RowPermissions'
|
||||
import FieldEdit from './FieldEdit'
|
||||
|
||||
export default {
|
||||
name: 'ViewTable',
|
||||
components: { FieldEdit, UnionView, DatasetChartDetail, UpdateInfo, TabDataPreview },
|
||||
components: {RowPermissions, FieldEdit, UnionView, DatasetChartDetail, UpdateInfo, TabDataPreview },
|
||||
props: {
|
||||
param: {
|
||||
type: Object,
|
||||
|
||||
226
frontend/src/views/dataset/data/authConfig.vue
Normal file
226
frontend/src/views/dataset/data/authConfig.vue
Normal file
@ -0,0 +1,226 @@
|
||||
<template>
|
||||
<de-container style="height: auto">
|
||||
<de-aside-container style="height: auto">
|
||||
<el-button v-show="!showTargetSearchInput" class="de-icon" icon="el-icon-search" circle size="mini" @click="showTargetSearchWidget" />
|
||||
<div v-show="showTargetSearchInput" class="de-input">
|
||||
<el-input v-model="targetFilterText" class="main-area-input">
|
||||
<el-button slot="append" icon="el-icon-close" @click="closeTargetSearchWidget" />
|
||||
</el-input>
|
||||
</div>
|
||||
<el-tabs v-model="targetActiveName" :class="{'de-search-header': showTargetSearchInput}" @tab-click="handleClick">
|
||||
<el-tab-pane v-for="(targetInfo, index) in targetInfoArray" :key="index" :lazy="true" :label="targetInfo.tabName" :name="targetInfo.authType">
|
||||
<lazy-tree
|
||||
v-if="targetActiveName===targetInfo.authType"
|
||||
:active-name="targetActiveName"
|
||||
:filter-text="targetFilterText"
|
||||
:data-info="targetInfo"
|
||||
highlight-current
|
||||
@nodeClick="authNodeClick"
|
||||
@execute-axios="executeAxios"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</de-aside-container>
|
||||
<de-main-container class="de-main-container-auth">
|
||||
<el-button v-show="!showSourceSearchInput" class="de-icon" icon="el-icon-search" circle size="mini" @click="showSourceSearchWidget" />
|
||||
<div v-show="showSourceSearchInput" class="de-input">
|
||||
<el-input v-model="sourceFilterText" class="main-area-input">
|
||||
<el-button slot="append" icon="el-icon-close" @click="closeSourceSearchWidget" />
|
||||
</el-input>
|
||||
</div>
|
||||
<el-tabs v-model="sourceActiveName" :class="{'de-search-header': showSourceSearchInput}" @tab-click="handleClick">
|
||||
<el-tab-pane v-for="(sourceInfo, index) in sourceInfoTabs" :key="index" :lazy="true" :label="sourceInfo.tabName" :name="sourceInfo.authType">
|
||||
<lazy-tree
|
||||
v-if="authCondition"
|
||||
:active-name="sourceActiveName"
|
||||
:filter-text="sourceFilterText"
|
||||
:data-info="sourceInfo"
|
||||
show-extent
|
||||
:auth-condition="authCondition"
|
||||
@execute-axios="executeAxios"
|
||||
:attach-active-name="targetActiveName"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</de-main-container>
|
||||
</de-container>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DeContainer from '@/components/dataease/DeContainer'
|
||||
import DeAsideContainer from '@/components/dataease/DeAsideContainer'
|
||||
import DeMainContainer from '@/components/dataease/DeMainContainer'
|
||||
import LazyTree from './components/LazyTree'
|
||||
|
||||
export default {
|
||||
name: 'Authority',
|
||||
components: { LazyTree, DeMainContainer, DeAsideContainer, DeContainer },
|
||||
props: {
|
||||
resourceId: {
|
||||
type: String,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
targetInfoArray:
|
||||
[
|
||||
{
|
||||
tabName: this.$t('auth.dept'),
|
||||
head: this.$t('auth.deptHead'),
|
||||
direction: 'target',
|
||||
authType: 'dept'
|
||||
},
|
||||
{
|
||||
tabName: this.$t('auth.role'),
|
||||
head: this.$t('auth.roleHead'),
|
||||
direction: 'target',
|
||||
authType: 'role'
|
||||
},
|
||||
{
|
||||
tabName: this.$t('auth.user'),
|
||||
head: this.$t('auth.userHead'),
|
||||
direction: 'target',
|
||||
authType: 'user'
|
||||
}],
|
||||
sourceInfoArray:
|
||||
[
|
||||
{
|
||||
tabName: this.$t('auth.linkAuth'),
|
||||
head: this.$t('auth.linkAuthHead'),
|
||||
direction: 'source',
|
||||
authType: 'link',
|
||||
authTargets: 'dept,role,user'
|
||||
},
|
||||
{
|
||||
tabName: this.$t('auth.datasetAuth'),
|
||||
head: this.$t('auth.datasetAuthHead'),
|
||||
direction: 'source',
|
||||
authType: 'dataset',
|
||||
authTargets: 'dept,role,user'
|
||||
},
|
||||
{
|
||||
tabName: this.$t('auth.chartAuth'),
|
||||
head: this.$t('auth.chartAuthHead'),
|
||||
direction: 'source',
|
||||
authType: 'chart',
|
||||
authTargets: 'dept,role,user'
|
||||
},
|
||||
{
|
||||
tabName: this.$t('auth.panelAuth'),
|
||||
head: this.$t('auth.panelAuthHead'),
|
||||
direction: 'source',
|
||||
authType: 'panel',
|
||||
authTargets: 'dept,role,user'
|
||||
},
|
||||
{
|
||||
tabName: this.$t('auth.menuAuth'),
|
||||
head: this.$t('auth.menuAuthHead'),
|
||||
direction: 'source',
|
||||
authType: 'menu',
|
||||
authTargets: 'dept,role,user'
|
||||
}
|
||||
],
|
||||
targetActiveName: null,
|
||||
sourceActiveName: null,
|
||||
showSourceSearchInput: false,
|
||||
showTargetSearchInput: false,
|
||||
sourceFilterText: '',
|
||||
targetFilterText: '',
|
||||
timeMachine: null,
|
||||
authCondition: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
sourceInfoTabs () {
|
||||
const tabs = []
|
||||
this.sourceInfoArray.forEach(item => {
|
||||
if (item.authTargets.indexOf(this.targetActiveName) > -1) {
|
||||
tabs.push(item)
|
||||
}
|
||||
})
|
||||
return tabs
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.targetActiveName = this.targetInfoArray[0].authType
|
||||
this.sourceActiveName = this.sourceInfoArray[0].authType
|
||||
},
|
||||
|
||||
methods: {
|
||||
executeAxios (param) {
|
||||
this.$emit('execute-axios', param)
|
||||
},
|
||||
handleClick (tab, event) {
|
||||
},
|
||||
showSourceSearchWidget () {
|
||||
this.showSourceSearchInput = true
|
||||
},
|
||||
closeSourceSearchWidget () {
|
||||
this.sourceFilterText = ''
|
||||
this.showSourceSearchInput = false
|
||||
},
|
||||
showTargetSearchWidget () {
|
||||
this.showTargetSearchInput = true
|
||||
},
|
||||
closeTargetSearchWidget () {
|
||||
this.targetFilterText = ''
|
||||
this.showTargetSearchInput = false
|
||||
},
|
||||
save () {
|
||||
this.$refs[this.activeName].save()
|
||||
this.$emit('close-grant', 0)
|
||||
},
|
||||
cancel () {
|
||||
this.$refs[this.activeName].cancel()
|
||||
this.$emit('close-grant', 0)
|
||||
},
|
||||
authNodeClick (val) {
|
||||
console.log('authNodeClick')
|
||||
this.authCondition = val
|
||||
},
|
||||
clickAuth (auth) {
|
||||
console.log('clickAuth')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.de-tab {
|
||||
border:1px solid #E6E6E6;
|
||||
min-height:200px !important;
|
||||
max-height:300px !important;
|
||||
overflow:auto;
|
||||
}
|
||||
.de-icon {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 15px;
|
||||
z-index: 99;
|
||||
}
|
||||
.el-input-group__append{
|
||||
background-color: #ffffff;
|
||||
}
|
||||
.el-input__inner{
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.auth-root-class {
|
||||
margin: 15px 0px 5px;
|
||||
text-align: right;
|
||||
}
|
||||
.de-main-container-auth{
|
||||
border: 1px solid #E6E6E6;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.blackTheme .de-main-container-auth {
|
||||
border-color: #495865;
|
||||
}
|
||||
|
||||
// ::-webkit-scrollbar {
|
||||
|
||||
// }
|
||||
</style>
|
||||
373
frontend/src/views/dataset/data/components/LazyTree.vue
Normal file
373
frontend/src/views/dataset/data/components/LazyTree.vue
Normal file
@ -0,0 +1,373 @@
|
||||
<template xmlns:el-col="http://www.w3.org/1999/html">
|
||||
<el-col v-loading="loading" class="tree-main">
|
||||
<el-row v-if="showExtent" class="tree-head">
|
||||
<span style="float: left;padding-left: 10px">{{ dataInfo.head }}</span>
|
||||
<span v-for="auth in defaultAuthDetails" :key="auth.privilegeName" class="auth-span">
|
||||
{{ auth.privilegeName }}
|
||||
</span>
|
||||
</el-row>
|
||||
<el-row style="margin-top: 5px">
|
||||
<el-tree
|
||||
:props="defaultProps"
|
||||
:load="loadNodes"
|
||||
:data="treeData"
|
||||
:node-key="defaultProps.id"
|
||||
:highlight-current="highlightCurrent"
|
||||
:default-expanded-keys="expandedKey"
|
||||
lazy
|
||||
@node-click="nodeClick"
|
||||
>
|
||||
<span slot-scope="{ node, data }" class="custom-tree-node">
|
||||
<span>
|
||||
<span style="margin-left: 6px" v-html="data.name" />
|
||||
</span>
|
||||
<span v-if="showExtent" @click.stop>
|
||||
<div v-if="authDetails[data.id]">
|
||||
<span v-for="auth in authDetails[data.id]" :key="auth.privilegeType" class="auth-span">
|
||||
<!-- 1-{{ auth.privilegeType }}-{{ auth.privilegeValue }}-->
|
||||
<a href="javascript:;" @click="clickAuth(data.id,auth)">
|
||||
<svg-icon style="width: 25px;height: 25px" :icon-class="auth.privilegeValue===1?'lock_open':'lock_closed'" />
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<div v-else>
|
||||
<span v-for="auth in defaultAuthDetails" :key="auth.privilegeType" class="auth-span">
|
||||
<!--2-{{ auth.privilegeType }}-{{ auth.privilegeValue }}-->
|
||||
<a href="javascript:;" @click="clickAuth(data.id,auth)">
|
||||
<svg-icon style="width: 25px;height: 25px" :icon-class="auth.privilegeValue===1?'lock_open':'lock_closed'" />
|
||||
</a>
|
||||
</span>
|
||||
</div></span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import { authChange, authDetails, authDetailsModel, authModel } from '@/api/system/sysAuth'
|
||||
// import { execute } from '@/de-base/api/de-api'
|
||||
export default {
|
||||
name: 'LazyTree',
|
||||
components: { },
|
||||
props: {
|
||||
filterText: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: ''
|
||||
},
|
||||
authCondition: {
|
||||
type: Object,
|
||||
required: false
|
||||
},
|
||||
dataInfo: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
activeName: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
attachActiveName: String,
|
||||
defaultProps: {
|
||||
type: Object,
|
||||
required: false,
|
||||
default: function () {
|
||||
return {
|
||||
children: 'children',
|
||||
label: 'name',
|
||||
id: 'id',
|
||||
parentId: 'pid',
|
||||
isLeaf: 'leaf'
|
||||
}
|
||||
}
|
||||
},
|
||||
showExtent: Boolean,
|
||||
highlightCurrent: Boolean
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
loading: false,
|
||||
treeData: [],
|
||||
changeIndex: 0,
|
||||
timeMachine: null,
|
||||
expandedKey: [], // 展开节点 搜索时默认展开父级节点
|
||||
defaultCondition: { // pid 是0的时候 查询的是顶级的节点
|
||||
pid: '0'
|
||||
},
|
||||
authDetails: {},
|
||||
defaultAuthDetails: [],
|
||||
searchStatus: false, // 当前是否在搜索状态 （搜索状态 展开不加载子节点）
|
||||
// 当前已经加载的节点ID 备用（当前把当前authTarget的所有授权加载进来）
|
||||
loadedNodeIds: new Set()
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
},
|
||||
watch: {
|
||||
filterText (val) {
|
||||
this.expandedKey = []
|
||||
if (val && val.length > 0) {
|
||||
this.searchStatus = true
|
||||
}
|
||||
// 当组件名和 activeName 相等时 才进行查询
|
||||
if (this.dataInfo.authType === this.activeName) {
|
||||
this.destroyTimeMachine()
|
||||
this.changeIndex++
|
||||
this.filterNode(this.changeIndex)
|
||||
}
|
||||
},
|
||||
authCondition: {
|
||||
handler (newVal, oldVla) {
|
||||
this.loadAuth()
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
activeName: {
|
||||
handler (newVal, oldVla) {
|
||||
this.loadAuth()
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
attachActiveName: {
|
||||
handler (newVal, oldVla) {
|
||||
this.authDetails = {}
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
created () {
|
||||
// 初始化授权模板
|
||||
if (this.showExtent) {
|
||||
this.executeAxios('/plugin/auth/authDetailsModel/' + this.dataInfo.authType, 'get', {}, res => {
|
||||
this.defaultAuthDetails = res.data
|
||||
})
|
||||
// authDetailsModel(this.dataInfo.authType).then(res => {
|
||||
// this.defaultAuthDetails = res.data
|
||||
// })
|
||||
this.loadAuth()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
executeAxios (url, type, data, callBack) {
|
||||
const param = {
|
||||
url: url,
|
||||
type: type,
|
||||
data: data,
|
||||
callBack: callBack
|
||||
}
|
||||
this.$emit('execute-axios', param)
|
||||
// if (process.env.NODE_ENV === 'development') {
|
||||
// execute(param).then(res => {
|
||||
// if (param.callBack) {
|
||||
// param.callBack(res)
|
||||
// }
|
||||
// }).catch(e => {
|
||||
// if (param.error) {
|
||||
// param.error(e)
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
},
|
||||
loadAuth () {
|
||||
if (this.authCondition && this.showExtent) {
|
||||
let authQueryCondition = {}
|
||||
if (this.dataInfo.direction === 'source') {
|
||||
// 当前为授权数据 获取当前authTarget 的授权信息 authSource
|
||||
authQueryCondition = {
|
||||
authTarget: this.authCondition.id,
|
||||
authTargetType: this.authCondition.type,
|
||||
authSourceType: this.dataInfo.authType
|
||||
}
|
||||
} else {
|
||||
authQueryCondition = {
|
||||
authSource: this.authCondition.id,
|
||||
authSourceType: this.authCondition.type
|
||||
}
|
||||
}
|
||||
this.executeAxios('/plugin/auth/authDetails', 'post', authQueryCondition, res => {
|
||||
this.authDetails = res.data
|
||||
})
|
||||
// authDetails(authQueryCondition).then(res => {
|
||||
// this.authDetails = res.data
|
||||
// })
|
||||
}
|
||||
},
|
||||
loadNodes (node, resolve) {
|
||||
if (!this.searchStatus) {
|
||||
if (node.level === 0) {
|
||||
const queryCondition = {
|
||||
modelType: this.dataInfo.authType,
|
||||
...this.defaultCondition
|
||||
}
|
||||
this.executeAxios('/plugin/auth/authModels', 'post', queryCondition, res => {
|
||||
const data = res.data
|
||||
resolve(data)
|
||||
})
|
||||
// authModel(queryCondition).then(res => {
|
||||
// const data = res.data
|
||||
// resolve(data)
|
||||
// })
|
||||
} else {
|
||||
const queryCondition = {
|
||||
modelType: this.dataInfo.authType
|
||||
}
|
||||
queryCondition[this.defaultProps.parentId] = node.data[this.defaultProps.id]
|
||||
this.executeAxios('/plugin/auth/authModels', 'post', queryCondition, res => {
|
||||
const data = res.data
|
||||
resolve(data)
|
||||
})
|
||||
// authModel(queryCondition).then(res => {
|
||||
// const data = res.data
|
||||
// resolve(data)
|
||||
// })
|
||||
}
|
||||
} else {
|
||||
resolve(node.data.children)
|
||||
}
|
||||
},
|
||||
filterNode (index) {
|
||||
this.timeMachine = setTimeout(() => {
|
||||
if (index === this.changeIndex) {
|
||||
const queryCondition = {
|
||||
withExtend: 'parent',
|
||||
modelType: this.dataInfo.authType
|
||||
}
|
||||
queryCondition[this.defaultProps.label] = this.filterText
|
||||
this.executeAxios('/plugin/auth/authModels', 'post', queryCondition, res => {
|
||||
// 高亮显示
|
||||
this.highlights(res.data)
|
||||
this.treeData = this.buildTree(res.data)
|
||||
// 恢复searchStatus 状态 可以允许继续展开父级
|
||||
this.$nextTick(() => (this.searchStatus = false))
|
||||
})
|
||||
// authModel(queryCondition).then(res => {
|
||||
// // 高亮显示
|
||||
// this.highlights(res.data)
|
||||
// this.treeData = this.buildTree(res.data)
|
||||
// // 恢复searchStatus 状态 可以允许继续展开父级
|
||||
// this.$nextTick(() => (this.searchStatus = false))
|
||||
// })
|
||||
}
|
||||
this.destroyTimeMachine()
|
||||
}, 1500)
|
||||
},
|
||||
nodeClick (data, node) {
|
||||
this.$emit('nodeClick', { id: data.id, type: this.dataInfo.authType })
|
||||
},
|
||||
destroyTimeMachine () {
|
||||
this.timeMachine && clearTimeout(this.timeMachine)
|
||||
this.timeMachine = null
|
||||
},
|
||||
buildTree (arrs) {
|
||||
const idMapping = arrs.reduce((acc, el, i) => {
|
||||
acc[el[this.defaultProps.id]] = i
|
||||
return acc
|
||||
}, {})
|
||||
const roots = []
|
||||
arrs.forEach(el => {
|
||||
// 判断根节点 ###
|
||||
if (el[this.defaultProps.parentId] === null || el[this.defaultProps.parentId] === 0 || el[this.defaultProps.parentId] === '0') {
|
||||
roots.push(el)
|
||||
return
|
||||
}
|
||||
// 用映射表找到父元素
|
||||
const parentEl = arrs[idMapping[el[this.defaultProps.parentId]]]
|
||||
// 把当前元素添加到父元素的`children`数组中
|
||||
parentEl.children = [...(parentEl.children || []), el]
|
||||
|
||||
// 设置展开节点 如果没有子节点则不进行展开
|
||||
if (parentEl.children.length > 0) {
|
||||
this.expandedKey.push(parentEl[this.defaultProps.id])
|
||||
}
|
||||
})
|
||||
return roots
|
||||
},
|
||||
// 权限修改
|
||||
clickAuth (dataId, auth) {
|
||||
let authChangeCondition = {}
|
||||
if (this.dataInfo.direction === 'source') { // 当前为授权数据
|
||||
authChangeCondition = {
|
||||
authSource: dataId,
|
||||
authSourceType: this.dataInfo.authType,
|
||||
authTarget: this.authCondition.id,
|
||||
authTargetType: this.authCondition.type,
|
||||
authDetail: auth
|
||||
|
||||
}
|
||||
} else {
|
||||
authChangeCondition = {
|
||||
authTarget: dataId,
|
||||
authTargetType: this.dataInfo.authType,
|
||||
authSource: this.authCondition.id,
|
||||
authSourceType: this.authCondition.type,
|
||||
authDetail: auth
|
||||
}
|
||||
}
|
||||
this.loading = true
|
||||
this.executeAxios('/plugin/auth/authChange', 'post', authChangeCondition, res => {
|
||||
// 重新加载权限
|
||||
this.loadAuth()
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// 高亮显示搜索内容
|
||||
highlights (data) {
|
||||
if (data && this.filterText && this.filterText.length > 0) {
|
||||
const replaceReg = new RegExp(this.filterText, 'g')// 匹配关键字正则
|
||||
const replaceString = '<span style="color: #faaa39">' + this.filterText + '</span>' // 高亮替换v-html值
|
||||
data.forEach(item => {
|
||||
item.name = item.name.replace(replaceReg, replaceString) // 开始替换
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding-left: 8px;
|
||||
}
|
||||
.tree-main{
|
||||
height: calc(100vh - 210px);
|
||||
border: 1px solid #e6e6e6;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.blackTheme .tree-main {
|
||||
border-color: var(--TableBorderColor) !important;
|
||||
}
|
||||
/* .tree-head{
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
border-bottom: 1px solid #e6e6e6;
|
||||
background-color: #f7f8fa;
|
||||
font-size: 12px;
|
||||
color: #3d4d66 ;
|
||||
} */
|
||||
|
||||
.tree-head{
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
border-bottom: 1px solid var(--TableBorderColor, #e6e6e6);
|
||||
background-color: var(--SiderBG, #f7f8fa);
|
||||
font-size: 12px;
|
||||
color: var(--TableColor, #3d4d66) ;
|
||||
}
|
||||
|
||||
.auth-span{
|
||||
float: right;
|
||||
width:50px;
|
||||
margin-right: 30px
|
||||
}
|
||||
.highlights-text {
|
||||
color: #faaa39 !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user