Skip to content
项目
群组
代码片段
帮助
正在加载...
帮助
提交反馈
为 GitLab 提交贡献
登录
切换导航
I
ibzrt
项目
项目
详情
动态
版本
周期分析
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
统计图
议题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
计划
统计图
Wiki
Wiki
代码片段
代码片段
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
统计图
创建新议题
作业
提交
议题看板
打开侧边栏
ibiz4jteam
ibzrt
提交
4c9dbcca
提交
4c9dbcca
编写于
10月 27, 2020
作者:
lzlhxj
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
统一代码注释
上级
835b2d2f
变更
4
隐藏空白字符变更
内嵌
并排
正在显示
4 个修改的文件
包含
1573 行增加
和
1131 行删除
+1573
-1131
app-message-popover.vue
...rc/components/app-message-popover/app-message-popover.vue
+366
-206
sys-role-permission-custom-view.vue
...ermission-custom-view/sys-role-permission-custom-view.vue
+749
-578
dept-tree-treeview.vue
.../sys-department/dept-tree-treeview/dept-tree-treeview.vue
+234
-178
org-tree-treeview.vue
.../sys-organization/org-tree-treeview/org-tree-treeview.vue
+224
-169
未找到文件。
app_Web/src/components/app-message-popover/app-message-popover.vue
浏览文件 @
4c9dbcca
<
template
>
<
template
>
<!-- 消息弹出框绘制开始 -->
<!-- 消息弹出框绘制开始 -->
<el-badge
:is-dot=
"showIsDot"
class=
"app-message-popover"
>
<el-badge
:is-dot=
"showIsDot"
class=
"app-message-popover"
>
<el-popover
<el-popover
placement=
"bottom"
placement=
"bottom"
trigger=
"click"
trigger=
"click"
width=
"400"
width=
"400"
@
show=
"initTabCnt"
@
show=
"initTabCnt"
@
hide=
"initTabCnt"
>
@
hide=
"initTabCnt"
<el-tabs
:value=
"default_tab_pane"
:stretch=
"true"
>
>
<!-- 待办 -->
<el-tabs
:value=
"default_tab_pane"
:stretch=
"true"
>
<el-tab-pane
:label=
"myTasks.length==0?myTasksLabel:(myTasksLabel+'('+myTasks.length+')')"
name=
"first"
style=
"height: 300px; overflow: auto"
:draggable=
"false"
>
<!-- 待办 -->
<template
v-for=
"(myTask,index) in myTasks"
>
<el-tab-pane
<template
v-if=
"index
<
taskShowCnt
"
>
:label=
"
<el-row
class=
"Row"
:key=
"index"
:draggable=
"false"
>
myTasks.length == 0
<el-col
:span=
"3"
class=
"column1"
:draggable=
"false"
>
? myTasksLabel
<el-avatar
icon=
"el-icon-s-check"
size=
"small"
:draggable=
"false"
style=
"color: white;background-color: #409eff;"
></el-avatar>
: myTasksLabel + '(' + myTasks.length + ')'
</el-col>
"
<el-col
:span=
"21"
class=
"column2"
:draggable=
"false"
>
name=
"first"
<el-row
:draggable=
"false"
>
style=
"height: 300px; overflow: auto"
<el-col
:span=
"16"
:draggable=
"false"
style=
"width: 65%;"
>
:draggable=
"false"
<div
class=
"process-definition-name"
:draggable=
"false"
><strong>
{{
myTask
.
processDefinitionName
}}
</strong></div>
>
<div
class=
"description"
:draggable=
"false"
>
{{
myTask
.
description
}}
</div>
<template
v-for=
"(myTask, index) in myTasks"
>
<div
class=
"createtime"
:draggable=
"false"
>
{{
formatDate
(
myTask
.
createTime
,
'MM-DD hh:mm'
)
}}
</div>
<template
v-if=
"index
<
taskShowCnt
"
>
</el-col>
<el-row
class=
"Row"
:key=
"index"
:draggable=
"false"
>
<el-col
:span=
"5"
:draggable=
"false"
style=
'display: flex; align-items: center'
>
<el-col
:span=
"3"
class=
"column1"
:draggable=
"false"
>
<el-tag
:type=
"myTask.name.indexOf('驳回')!=-1?'danger':(myTask.name.indexOf('成功')!=-1?'success':(myTask.name.indexOf('取消')!=-1?'info':'-'))"
<el-avatar
size=
"small"
@
click=
"handleTag(myTask)"
icon=
"el-icon-s-check"
style=
"cursor: pointer;overflow: hidden;text-overflow: ellipsis;"
:draggable=
"false"
>
size=
"small"
{{
myTask
.
name
}}
:draggable=
"false"
</el-tag>
style=
"color: white; background-color: #409eff"
</el-col>
></el-avatar>
</el-row>
</el-col>
</el-col>
<el-col
:span=
"21"
class=
"column2"
:draggable=
"false"
>
</el-row>
<el-row
:draggable=
"false"
>
</
template
>
<el-col
:span=
"16"
:draggable=
"false"
style=
"width: 65%"
>
</template>
<div
class=
"process-definition-name"
:draggable=
"false"
>
<
template
>
<strong>
{{
myTask
.
processDefinitionName
}}
</strong>
<div
class=
'show-more'
@
click=
"showMore('taskShowCnt')"
>
</div>
<label
v-if=
"taskShowCnt
<
myTasks
.
length
"
>
{{
this
.
$t
(
'components.appMessagePopover.loadMore'
)
}}
</label>
<div
class=
"description"
:draggable=
"false"
>
<label
v-else
>
{{
this
.
$t
(
'components.appMessagePopover.noMore'
)
}}
</label>
{{
myTask
.
description
}}
</div>
</div>
</
template
>
<div
class=
"createtime"
:draggable=
"false"
>
</el-tab-pane>
{{
formatDate
(
myTask
.
createTime
,
"MM-DD hh:mm"
)
}}
<!-- 消息 -->
</div>
<el-tab-pane
:label=
"myMsgs.length==0?myMsgsLabel:(myMsgsLabel+'('+myMsgs.length+')')"
name=
"second"
:style=
"{height: '300px',overflow: 'auto'}"
:draggable=
"false"
>
</el-col>
<
template
v-for=
"(myMsg,index) in myMsgs"
>
<el-col
<template
v-if=
"index
<
msgShowCnt
"
>
:span=
"5"
<el-row
class=
"Row"
:key=
"index"
:draggable=
"false"
>
:draggable=
"false"
<el-col
:span=
"3"
class=
"column1"
:draggable=
"false"
>
style=
"display: flex; align-items: center"
<el-avatar
icon=
"el-icon-chat-dot-square"
size=
"small"
:draggable=
"false"
style=
"color: white;background-color: orange;"
></el-avatar>
>
</el-col>
<el-tag
<el-col
:span=
"21"
class=
"column2"
:draggable=
"false"
>
:type=
"
<el-row
:draggable=
"false"
>
myTask.name.indexOf('驳回') != -1
<el-col
:span=
"16"
:draggable=
"false"
style=
"width: 65%;"
>
? 'danger'
<div
class=
"process-definition-name"
:draggable=
"false"
><strong>
{{
myMsg
.
processDefinitionName
}}
</strong></div>
: myTask.name.indexOf('成功') != -1
<div
class=
"description"
:draggable=
"false"
>
{{
myMsg
.
description
}}
</div>
? 'success'
<div
class=
"createtime"
:draggable=
"false"
>
{{
formatDate
(
myMsg
.
createTime
,
'MM-DD hh:mm'
)
}}
</div>
: myTask.name.indexOf('取消') != -1
</el-col>
? 'info'
<el-col
:span=
"5"
:draggable=
"false"
style=
'display: flex; align-items: center'
>
: '-'
<el-tag
:type=
"myMsg.name.indexOf('驳回')!=-1?'danger':(myMsg.name.indexOf('成功')!=-1?'success':(myMsg.name.indexOf('取消')!=-1?'info':'-'))"
"
size=
"small"
@
click=
"handleTag(myMsg)"
size=
"small"
style=
"cursor: pointer;overflow: hidden;text-overflow: ellipsis;"
:draggable=
"false"
>
@
click=
"handleTag(myTask)"
{{
myMsg
.
name
}}
style=
"
</el-tag>
cursor: pointer;
</el-col>
overflow: hidden;
</el-row>
text-overflow: ellipsis;
</el-col>
"
</el-row>
:draggable=
"false"
</
template
>
>
</template>
{{
myTask
.
name
}}
<
template
>
</el-tag>
<div
class=
'show-more'
@
click=
"showMore('msgShowCnt')"
>
</el-col>
<label
v-if=
"msgShowCnt
<
myTasks
.
length
"
>
{{
this
.
$t
(
'components.appMessagePopover.loadMore'
)
}}
</label>
</el-row>
<label
v-else
>
{{
this
.
$t
(
'components.appMessagePopover.noMore'
)
}}
</label>
</el-col>
</div>
</el-row>
</
template
>
</
template
>
</el-tab-pane>
</template>
</el-tabs>
<
template
>
<i
id=
"bellBtn"
size=
"20"
slot=
"reference"
class=
'el-icon-bell'
></i>
<div
class=
"show-more"
@
click=
"showMore('taskShowCnt')"
>
</el-popover>
<label
v-if=
"taskShowCnt
<
myTasks
.
length
"
>
{{
</el-badge>
this
.
$t
(
"components.appMessagePopover.loadMore"
)
<!-- 消息弹出框绘制结束 -->
}}
</label>
<label
v-else
>
{{
this
.
$t
(
"components.appMessagePopover.noMore"
)
}}
</label>
</div>
</
template
>
</el-tab-pane>
<!-- 消息 -->
<el-tab-pane
:label=
"
myMsgs.length == 0
? myMsgsLabel
: myMsgsLabel + '(' + myMsgs.length + ')'
"
name=
"second"
:style=
"{ height: '300px', overflow: 'auto' }"
:draggable=
"false"
>
<
template
v-for=
"(myMsg, index) in myMsgs"
>
<template
v-if=
"index
<
msgShowCnt
"
>
<el-row
class=
"Row"
:key=
"index"
:draggable=
"false"
>
<el-col
:span=
"3"
class=
"column1"
:draggable=
"false"
>
<el-avatar
icon=
"el-icon-chat-dot-square"
size=
"small"
:draggable=
"false"
style=
"color: white; background-color: orange"
></el-avatar>
</el-col>
<el-col
:span=
"21"
class=
"column2"
:draggable=
"false"
>
<el-row
:draggable=
"false"
>
<el-col
:span=
"16"
:draggable=
"false"
style=
"width: 65%"
>
<div
class=
"process-definition-name"
:draggable=
"false"
>
<strong>
{{
myMsg
.
processDefinitionName
}}
</strong>
</div>
<div
class=
"description"
:draggable=
"false"
>
{{
myMsg
.
description
}}
</div>
<div
class=
"createtime"
:draggable=
"false"
>
{{
formatDate
(
myMsg
.
createTime
,
"MM-DD hh:mm"
)
}}
</div>
</el-col>
<el-col
:span=
"5"
:draggable=
"false"
style=
"display: flex; align-items: center"
>
<el-tag
:type=
"
myMsg.name.indexOf('驳回') != -1
? 'danger'
: myMsg.name.indexOf('成功') != -1
? 'success'
: myMsg.name.indexOf('取消') != -1
? 'info'
: '-'
"
size=
"small"
@
click=
"handleTag(myMsg)"
style=
"
cursor: pointer;
overflow: hidden;
text-overflow: ellipsis;
"
:draggable=
"false"
>
{{
myMsg
.
name
}}
</el-tag>
</el-col>
</el-row>
</el-col>
</el-row>
</
template
>
</template>
<
template
>
<div
class=
"show-more"
@
click=
"showMore('msgShowCnt')"
>
<label
v-if=
"msgShowCnt
<
myTasks
.
length
"
>
{{
this
.
$t
(
"components.appMessagePopover.loadMore"
)
}}
</label>
<label
v-else
>
{{
this
.
$t
(
"components.appMessagePopover.noMore"
)
}}
</label>
</div>
</
template
>
</el-tab-pane>
</el-tabs>
<i
id=
"bellBtn"
size=
"20"
slot=
"reference"
class=
"el-icon-bell"
></i>
</el-popover>
</el-badge>
<!-- 消息弹出框绘制结束 -->
</template>
</template>
<
script
lang=
"ts"
>
<
script
lang=
"ts"
>
import
{
Vue
,
Component
,
Prop
,
Model
,
Emit
}
from
"vue-property-decorator"
;
import
{
Vue
,
Component
,
Prop
,
Model
,
Emit
}
from
"vue-property-decorator"
;
import
{
Subject
}
from
"rxjs"
;
import
{
Subject
}
from
"rxjs"
;
import
{
Environment
}
from
'@/environments/environment'
;
import
{
Environment
}
from
"@/environments/environment"
;
import
moment
from
'moment'
;
import
moment
from
"moment"
;
@
Component
({})
export
default
class
AppMessagePopover
extends
Vue
{
// 是否显示小圆点
public
showIsDot
:
any
=
false
;
// 默认显示的tab页
public
default_tab_pane
:
any
=
"first"
;
// 待办列表
public
myTasks
:
any
=
[];
// 待办面板标签
public
myTasksLabel
:
any
=
"待办"
;
// 待办面板显示条数
public
taskShowCnt
:
number
=
0
;
// 消息列表
public
myMsgs
:
any
=
[];
// 消息面板标签
public
myMsgsLabel
:
any
=
"消息"
;
// 信息面板显示条数
public
msgShowCnt
:
number
=
0
;
/**
* vue创建
*/
created
():
void
{}
/**
* vue挂载
*/
mounted
():
void
{
// 首次获取待办列表
this
.
getMyTasks
();
// 定时器:每隔1分钟重新获取待办列表
const
timer
=
setInterval
(()
=>
{
this
.
getMyTasks
();
},
60000
);
// 监听定时器,在vue销毁前清除定时器
this
.
$once
(
'hook:beforeDestroy'
,()
=>
{
// 清除定时器
clearInterval
(
timer
);
});
}
/**
@
Component
({})
* 获取待办列表
export
default
class
AppMessagePopover
extends
Vue
{
*/
/**
public
getMyTasks
()
{
* 是否显示小圆点
let
url
:
any
=
'/wfcore/mytasks'
;
*
this
.
$http
.
get
(
url
).
then
((
response
:
any
)
=>
{
* @type {boolean}
if
(
response
&&
response
.
status
==
200
)
{
* @memberof AppMessagePopover
const
data
:
any
=
response
.
data
;
*/
if
(
data
&&
data
.
length
>
0
)
{
public
showIsDot
:
boolean
=
false
;
this
.
myTasks
=
data
;
this
.
showIsDot
=
true
;
}
else
{
this
.
myTasks
=
[];
}
// 获取消息列表
this
.
getMyMsgs
();
}
}).
catch
((
error
:
any
)
=>
{
console
.
warn
(
"加载数据错误"
);
})
}
/**
/**
* 获取消息列表
* 默认显示的tab页
*/
*
public
getMyMsgs
(){
* @type {string}
// TODO:接口获取消息列表,这里用的待办数据
* @memberof AppMessagePopover
this
.
myMsgs
=
this
.
myTasks
;
*/
if
(
this
.
myMsgs
.
length
>
0
&&
this
.
myTasks
.
length
==
0
)
{
public
default_tab_pane
:
string
=
"first"
;
// 显示小圆点
this
.
showIsDot
=
true
;
}
}
/**
/**
* 点击标签事件
* 待办列表
*/
*
public
handleTag
(
data
:
any
)
{
* @type {Array<*>}
if
(
!
data
)
return
this
.
$message
.
error
(
"未获取到标签内容"
);
* @memberof AppMessagePopover
// 拼接要打开的窗口地址
*/
const
baseUrl
:
any
=
Environment
.
BaseUrl
;
public
myTasks
:
Array
<
any
>
=
[];
const
openUrl
:
any
=
baseUrl
+
`/wfcore/mytasks/
${
data
.
processDefinitionKey
}
/web/
${
data
.
processInstanceBusinessKey
}
/usertasks/
${
data
.
taskDefinitionKey
}
`
;
// 打开新窗口
/**
window
.
open
(
openUrl
,
'_blank'
);
* 待办面板标签
}
*
* @type {string}
* @memberof AppMessagePopover
*/
public
myTasksLabel
:
string
=
"待办"
;
/**
* 待办面板显示条数
*
* @type {number}
* @memberof AppMessagePopover
*/
public
taskShowCnt
:
number
=
0
;
/**
* 消息列表
* @type {Array<*>}
* @memberof AppMessagePopover
*/
public
myMsgs
:
Array
<
any
>
=
[];
/**
* 消息面板标签
*
* @type {string}
* @memberof AppMessagePopover
*/
public
myMsgsLabel
:
string
=
"消息"
;
/**
* 信息面板显示条数
*
* @type {number}
* @memberof AppMessagePopover
*/
public
msgShowCnt
:
number
=
0
;
/**
* vue创建
*
* @memberof AppMessagePopover
*/
created
():
void
{}
/**
/**
* 销毁之前
* vue挂载
*/
*
beforeDestroy
():
void
{
* @memberof AppMessagePopover
// 清空数据
*/
this
.
showIsDot
=
false
;
mounted
():
void
{
// 首次获取待办列表
this
.
getMyTasks
();
// 定时器:每隔1分钟重新获取待办列表
const
timer
=
setInterval
(()
=>
{
this
.
getMyTasks
();
},
60000
);
// 监听定时器,在vue销毁前清除定时器
this
.
$once
(
"hook:beforeDestroy"
,
()
=>
{
// 清除定时器
clearInterval
(
timer
);
});
}
/**
* 获取待办列表
*
* @memberof AppMessagePopover
*/
public
getMyTasks
()
{
let
url
:
any
=
"/wfcore/mytasks"
;
this
.
$http
.
get
(
url
)
.
then
((
response
:
any
)
=>
{
if
(
response
&&
response
.
status
==
200
)
{
const
data
:
any
=
response
.
data
;
if
(
data
&&
data
.
length
>
0
)
{
this
.
myTasks
=
data
;
this
.
showIsDot
=
true
;
}
else
{
this
.
myTasks
=
[];
this
.
myTasks
=
[];
this
.
myMsgs
=
[];
}
// 获取消息列表
this
.
getMyMsgs
();
}
}
})
.
catch
((
error
:
any
)
=>
{
console
.
warn
(
"加载数据错误"
);
});
}
/**
/**
* 时间格式转换
* 获取消息列表
*/
*
public
formatDate
(
date
:
string
,
format
:
string
)
{
* @memberof AppMessagePopover
if
(
date
&&
format
)
{
*/
return
moment
(
date
).
format
(
format
);
public
getMyMsgs
()
{
}
// TODO:接口获取消息列表,这里用的待办数据
return
date
;
this
.
myMsgs
=
this
.
myTasks
;
}
if
(
this
.
myMsgs
.
length
>
0
&&
this
.
myTasks
.
length
==
0
)
{
// 显示小圆点
this
.
showIsDot
=
true
;
}
}
/**
/**
* 加载更多
* 点击标签事件
*/
*
public
showMore
(
cnt
:
string
)
{
* @memberof AppMessagePopover
if
(
Object
.
is
(
'taskShowCnt'
,
cnt
))
{
*/
this
.
taskShowCnt
+
10
<
this
.
myTasks
.
length
?
this
.
taskShowCnt
+=
10
:
this
.
taskShowCnt
+=
this
.
myTasks
.
length
-
this
.
taskShowCnt
;
public
handleTag
(
data
:
any
)
{
}
if
(
!
data
)
return
this
.
$message
.
error
(
"未获取到标签内容"
);
if
(
Object
.
is
(
'msgShowCnt'
,
cnt
))
{
// 拼接要打开的窗口地址
this
.
msgShowCnt
+
10
<
this
.
myMsgs
.
length
?
this
.
msgShowCnt
+=
10
:
this
.
msgShowCnt
+=
this
.
myMsgs
.
length
-
this
.
msgShowCnt
;
const
baseUrl
:
any
=
Environment
.
BaseUrl
;
}
const
openUrl
:
any
=
}
baseUrl
+
`/wfcore/mytasks/
${
data
.
processDefinitionKey
}
/web/
${
data
.
processInstanceBusinessKey
}
/usertasks/
${
data
.
taskDefinitionKey
}
`
;
// 打开新窗口
window
.
open
(
openUrl
,
"_blank"
);
}
/**
/**
* 弹出框 显示/隐藏 时显示条数初始化
* vue销毁之前
*/
*
public
initTabCnt
()
{
* @memberof AppMessagePopover
this
.
taskShowCnt
=
this
.
myTasks
.
length
>=
10
?
10
:
this
.
myTasks
.
length
;
*/
this
.
msgShowCnt
=
this
.
myMsgs
.
length
>=
10
?
10
:
this
.
myMsgs
.
length
;
beforeDestroy
():
void
{
}
// 清空数据
this
.
showIsDot
=
false
;
this
.
myTasks
=
[];
this
.
myMsgs
=
[];
}
/**
* 时间格式转换
*
* @memberof AppMessagePopover
*/
public
formatDate
(
date
:
string
,
format
:
string
)
{
if
(
date
&&
format
)
{
return
moment
(
date
).
format
(
format
);
}
}
return
date
;
}
/**
* 加载更多
*
* @memberof AppMessagePopover
*/
public
showMore
(
cnt
:
string
)
{
if
(
Object
.
is
(
"taskShowCnt"
,
cnt
))
{
this
.
taskShowCnt
+
10
<
this
.
myTasks
.
length
?
(
this
.
taskShowCnt
+=
10
)
:
(
this
.
taskShowCnt
+=
this
.
myTasks
.
length
-
this
.
taskShowCnt
);
}
if
(
Object
.
is
(
"msgShowCnt"
,
cnt
))
{
this
.
msgShowCnt
+
10
<
this
.
myMsgs
.
length
?
(
this
.
msgShowCnt
+=
10
)
:
(
this
.
msgShowCnt
+=
this
.
myMsgs
.
length
-
this
.
msgShowCnt
);
}
}
/**
* 弹出框 显示/隐藏 时显示条数初始化
*
* @memberof AppMessagePopover
*/
public
initTabCnt
()
{
this
.
taskShowCnt
=
this
.
myTasks
.
length
>=
10
?
10
:
this
.
myTasks
.
length
;
this
.
msgShowCnt
=
this
.
myMsgs
.
length
>=
10
?
10
:
this
.
myMsgs
.
length
;
}
}
</
script
>
</
script
>
<
style
lang=
'less'
>
<
style
lang=
'less'
>
@import "app-message-popover.less";
@import "app-message-popover.less";
</
style
>
</
style
>
\ No newline at end of file
app_Web/src/pages/uaa/sys-role-permission-custom-view/sys-role-permission-custom-view.vue
浏览文件 @
4c9dbcca
<
template
>
<
template
>
<div
class=
"view-container dempickupview sys-permissionmpickup-view view-permissionmp-center"
>
<div
<card
class=
'view-card view-no-caption view-no-toolbar'
:dis-hover=
"true"
:padding=
"0"
:bordered=
"false"
>
class=
"view-container dempickupview sys-permissionmpickup-view view-permissionmp-center"
<div
class=
"content-container pickup-view"
>
>
<div
class=
"translate-contant"
>
<card
<!--应用菜单-->
class=
"view-card view-no-caption view-no-toolbar"
<div
class=
"center"
:style=
"
{width : '33%',border:'1px solid #dcdee2', margin: '0 16px 0 0'}">
:dis-hover=
"true"
<context-menu-container
class=
'design-tree-container'
>
:padding=
"0"
<div>
:bordered=
"false"
<div
style=
"margin: 20px 20px 0 20px;"
>
>
<el-input
size=
"small"
placeholder=
"搜索应用菜单..."
v-model=
"CDtreefilterText"
@
input=
"filterChangeCDtree"
>
<div
class=
"content-container pickup-view"
>
<i
slot=
"prefix"
class=
"el-input__icon el-icon-search"
></i>
<div
class=
"translate-contant"
>
</el-input>
<!--应用菜单-->
</div>
<div
<div
class=
"roll"
>
class=
"center"
<el-tree
:style=
"
{
:filter-node-method=
"fiterNode"
width: '33%',
class=
"tre"
border: '1px solid #dcdee2',
:data=
"this.CDdata"
margin: '0 16px 0 0',
ref=
"CDtree"
}"
show-checkbox
>
node-key=
"id"
<context-menu-container
class=
"design-tree-container"
>
:default-expand-all=
"false"
<div>
highlight-current
<div
style=
"margin: 20px 20px 0 20px"
>
:default-expanded-keys=
"this.CDdataexpandedKeys"
<el-input
:props=
"this.defaultProps"
size=
"small"
@
check-change=
"handleCheckChange"
placeholder=
"搜索应用菜单..."
>
v-model=
"CDtreefilterText"
</el-tree>
@
input=
"filterChangeCDtree"
</div>
>
</div>
<i
slot=
"prefix"
class=
"el-input__icon el-icon-search"
></i>
</context-menu-container>
</el-input>
</div>
<!--数据能力-->
<div
class=
"center"
:style=
"
{width : '33%',border:'1px solid #dcdee2', margin: '0 16px 0 0' }">
<context-menu-container
class=
'design-tree-container'
>
<div>
<div
style=
"margin: 20px 20px 0 20px;"
>
<el-input
size=
"small"
placeholder=
"搜索数据能力..."
v-model=
"QXtreefilterText"
@
input=
"filterChangeQXtree"
>
<i
slot=
"prefix"
class=
"el-input__icon el-icon-search"
></i>
</el-input>
</div>
<div
class=
"roll"
>
<el-tree
:filter-node-method=
"fiterNode"
class=
"tre"
:data=
"this.QXdata"
ref=
"QXtree"
show-checkbox
node-key=
"id"
:default-expand-all=
"false"
highlight-current
:default-expanded-keys=
"this.QXdataexpandedKeys"
:props=
"this.defaultProps"
@
check-change=
"handleCheckChange"
>
</el-tree>
</div>
</div>
</context-menu-container>
</div>
<!--自定义资源-->
<div
class=
"center"
:style=
"
{width : '33%',border:'1px solid #dcdee2' }">
<context-menu-container
class=
'design-tree-container'
>
<div>
<div
style=
"margin: 20px 20px 0 20px;"
>
<el-input
size=
"small"
placeholder=
"搜索自定义资源..."
v-model=
"ZYtreefilterText"
@
input=
"filterChangeZYtree"
>
<i
slot=
"prefix"
class=
"el-input__icon el-icon-search"
></i>
</el-input>
</div>
<div
class=
"roll"
>
<el-tree
:filter-node-method=
"fiterNode"
class=
"tre"
:data=
"this.ZYdata"
ref=
"ZYtree"
show-checkbox
node-key=
"id"
:default-expand-all=
"false"
highlight-current
:default-expanded-keys=
"this.ZYdataexpandedKeys"
:props=
"this.defaultProps"
@
check-change=
"handleCheckChange"
>
</el-tree>
</div>
</div>
</context-menu-container>
</div>
</div>
</div>
<div
class=
"roll"
>
</div>
<el-tree
</card>
:filter-node-method=
"fiterNode"
</div>
class=
"tre"
:data=
"this.CDdata"
ref=
"CDtree"
show-checkbox
node-key=
"id"
:default-expand-all=
"false"
highlight-current
:default-expanded-keys=
"this.CDdataexpandedKeys"
:props=
"this.defaultProps"
@
check-change=
"handleCheckChange"
>
</el-tree>
</div>
</div>
</context-menu-container>
</div>
<!--数据能力-->
<div
class=
"center"
:style=
"
{
width: '33%',
border: '1px solid #dcdee2',
margin: '0 16px 0 0',
}"
>
<context-menu-container
class=
"design-tree-container"
>
<div>
<div
style=
"margin: 20px 20px 0 20px"
>
<el-input
size=
"small"
placeholder=
"搜索数据能力..."
v-model=
"QXtreefilterText"
@
input=
"filterChangeQXtree"
>
<i
slot=
"prefix"
class=
"el-input__icon el-icon-search"
></i>
</el-input>
</div>
<div
class=
"roll"
>
<el-tree
:filter-node-method=
"fiterNode"
class=
"tre"
:data=
"this.QXdata"
ref=
"QXtree"
show-checkbox
node-key=
"id"
:default-expand-all=
"false"
highlight-current
:default-expanded-keys=
"this.QXdataexpandedKeys"
:props=
"this.defaultProps"
@
check-change=
"handleCheckChange"
>
</el-tree>
</div>
</div>
</context-menu-container>
</div>
<!--自定义资源-->
<div
class=
"center"
:style=
"
{ width: '33%', border: '1px solid #dcdee2' }"
>
<context-menu-container
class=
"design-tree-container"
>
<div>
<div
style=
"margin: 20px 20px 0 20px"
>
<el-input
size=
"small"
placeholder=
"搜索自定义资源..."
v-model=
"ZYtreefilterText"
@
input=
"filterChangeZYtree"
>
<i
slot=
"prefix"
class=
"el-input__icon el-icon-search"
></i>
</el-input>
</div>
<div
class=
"roll"
>
<el-tree
:filter-node-method=
"fiterNode"
class=
"tre"
:data=
"this.ZYdata"
ref=
"ZYtree"
show-checkbox
node-key=
"id"
:default-expand-all=
"false"
highlight-current
:default-expanded-keys=
"this.ZYdataexpandedKeys"
:props=
"this.defaultProps"
@
check-change=
"handleCheckChange"
>
</el-tree>
</div>
</div>
</context-menu-container>
</div>
</div>
</div>
</card>
</div>
</
template
>
</
template
>
<
script
lang=
'tsx'
>
<
script
lang=
'tsx'
>
import
{
Component
,
Prop
,
Vue
}
from
'vue-property-decorator'
;
import
{
Component
,
Prop
,
Vue
}
from
"vue-property-decorator"
;
import
view_pickupviewpanel
import
view_pickupviewpanel
from
"@widgets/sys-permission/mpickup-viewpickupviewpanel-pickupviewpanel/mpickup-viewpickupviewpanel-pickupviewpanel.vue"
;
from
'@widgets/sys-permission/mpickup-viewpickupviewpanel-pickupviewpanel/mpickup-viewpickupviewpanel-pickupviewpanel.vue'
;
import
ContextMenuContainer
from
"@components/context-menu-container/context-menu-container.vue"
;
import
ContextMenuContainer
from
"@components/context-menu-container/context-menu-container.vue"
;
import
{
Subject
}
from
"rxjs"
;
import
{
Subject
}
from
"rxjs"
;
@
Component
({
@
Component
({
components
:
{
components
:
{
ContextMenuContainer
,
ContextMenuContainer
,
view_pickupviewpanel
,
view_pickupviewpanel
,
},
},
beforeRouteEnter
:
(
to
:
any
,
from
:
any
,
next
:
any
)
=>
{
beforeRouteEnter
:
(
to
:
any
,
from
:
any
,
next
:
any
)
=>
{
next
((
vm
:
any
)
=>
{
next
((
vm
:
any
)
=>
{
vm
.
$store
.
commit
(
"addCurPageViewtag"
,
{
vm
.
$store
.
commit
(
'addCurPageViewtag'
,
{
fullPath
:
to
.
fullPath
,
viewtag
:
vm
.
viewtag
});
fullPath
:
to
.
fullPath
,
});
viewtag
:
vm
.
viewtag
,
},
});
})
});
export
default
class
SYS_ROLE_PERMISSIONCustomView
extends
Vue
{
},
})
export
default
class
SYS_ROLE_PERMISSIONCustomView
extends
Vue
{
// 应用菜单树搜索文本
/**
public
CDtreefilterText
:
any
=
''
;
* 应用菜单树搜索文本
// 数据能力树搜索文本
*
public
QXtreefilterText
:
any
=
''
;
* @type {string}
// 自定义资源树搜索文本
* @memberof SYS_ROLE_PERMISSIONCustomView
public
ZYtreefilterText
:
any
=
''
;
*/
public
CDtreefilterText
:
string
=
""
;
/**
* 过滤节点
/**
*/
* 数据能力树搜索文本
public
fiterNode
(
value
:
any
,
data
:
any
){
*
if
(
!
value
)
return
true
;
* @type {string}
return
data
.
label
.
indexOf
(
value
)
!==-
1
;
* @memberof SYS_ROLE_PERMISSIONCustomView
}
*/
/**
public
QXtreefilterText
:
string
=
""
;
* 应用菜单树搜索触发
*/
/**
public
filterChangeCDtree
(){
* 自定义资源树搜索文本
const
CDtree
:
any
=
this
.
$refs
.
CDtree
;
*
CDtree
.
filter
(
this
.
CDtreefilterText
);
* @type {string}
}
* @memberof SYS_ROLE_PERMISSIONCustomView
/**
*/
* 数据能力树搜索触发
public
ZYtreefilterText
:
string
=
""
;
*/
public
filterChangeQXtree
(){
/**
const
QXtree
:
any
=
this
.
$refs
.
QXtree
;
* 过滤节点
QXtree
.
filter
(
this
.
QXtreefilterText
);
*
}
* @param {value={string}}
/**
* @param {data={*}}
* 自定义资源树搜索触发
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
*/
public
filterChangeZYtree
(){
public
fiterNode
(
value
:
string
,
data
:
any
)
{
const
ZYtree
:
any
=
this
.
$refs
.
ZYtree
;
if
(
!
value
)
return
true
;
ZYtree
.
filter
(
this
.
ZYtreefilterText
);
return
data
.
label
.
indexOf
(
value
)
!==
-
1
;
}
}
/**
/*应用菜单数据*/
* 应用菜单树搜索触发
protected
CDdata
:
any
=
[];
*
/*数据能力数据*/
* @memberof SYS_ROLE_PERMISSIONCustomView
protected
QXdata
:
any
=
[];
*/
/*自定义资源数据*/
public
filterChangeCDtree
()
{
protected
ZYdata
:
any
=
[];
const
CDtree
:
any
=
this
.
$refs
.
CDtree
;
/*默认选中节点*/
CDtree
.
filter
(
this
.
CDtreefilterText
);
protected
defaultCheckedNodes
:
any
=
[];
}
/*应用菜单数据默认展开节点*/
protected
CDdataexpandedKeys
:
any
=
[];
/**
/*数据能力数据默认展开节点*/
* 数据能力树搜索触发
protected
QXdataexpandedKeys
:
any
=
[];
*
/*自定义资源数据默认展开节点*/
* @memberof SYS_ROLE_PERMISSIONCustomView
protected
ZYdataexpandedKeys
:
any
=
[];
*/
public
filterChangeQXtree
()
{
/**
const
QXtree
:
any
=
this
.
$refs
.
QXtree
;
* 树显示说明:子树为节点对象的children,节点标签为节点对象的label
QXtree
.
filter
(
this
.
QXtreefilterText
);
*/
}
protected
defaultProps
:
any
=
{
children
:
'children'
,
/**
label
:
'label'
* 自定义资源树搜素触发
}
*
/**
* @memberof SYS_ROLE_PERMISSIONCustomView
* 选中数据
*/
*/
public
filterChangeZYtree
()
{
protected
selectData
:
any
=
{};
const
ZYtree
:
any
=
this
.
$refs
.
ZYtree
;
/**
ZYtree
.
filter
(
this
.
ZYtreefilterText
);
* 初始选中的数据
}
*/
protected
ininselectData
:
any
=
{};
/**
* 应用菜单数据
/**
*
* 视图选中数据
* @type {Array<*>}
*/
* @memberof SYS_ROLE_PERMISSIONCustomView
public
viewSelections
:
any
[]
=
[];
*/
protected
CDdata
:
Array
<
any
>
=
[];
/**
* 父数据
/**
*/
* 数据能力数据
protected
parentData
:
any
=
{};
*
/**
* @type {Array<*>}
* 父数据主键
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
*/
protected
srfparentkey
:
any
;
protected
QXdata
:
Array
<
any
>
=
[];
/**
/**
* 视图标识
* 自定义资源数据
*
*
* @type {string}
* @type {Array<*>}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
*/
public
viewtag
:
string
=
'e791be173ed0f4bbe9cce942b6edde63'
;
protected
ZYdata
:
Array
<
any
>
=
[];
/**
/**
* 是否嵌入关系界面
* 默认选中节点
*
*
* @type {boolean}
* @type {Array<*>}
* @memberof SYS_USER_ROLEGridViewBase
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
*/
@
Prop
({
default
:
false
})
public
isformDruipart
?:
boolean
;
protected
defaultCheckedNodes
:
Array
<
any
>
=
[];
/**
/**
* 界面关系通讯对象
* 应用菜单数据默认展开节点
*
*
* @type {Subject<ViewState>}
* @type {Array<*>}
* @memberof SYS_USER_ROLEGridViewBase
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
*/
@
Prop
()
public
formDruipart
?:
Subject
<
ViewState
>
;
protected
CDdataexpandedKeys
:
Array
<
any
>
=
[];
/**
/**
* 应用上下文
* 数据能力数据默认展开节点
*
*
* @type {*}
* @type {Array<*>}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
*/
public
context
:
any
=
{};
protected
QXdataexpandedKeys
:
Array
<
any
>
=
[];
/**
/**
* 视图参数
* 自定义资源数据默认展开节点
*
*
* @type {*}
* @type {Array<*>}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
*/
public
viewparams
:
any
=
{};
protected
ZYdataexpandedKeys
:
Array
<
any
>
=
[];
/**
/**
* 传入视图上下文
* 树显示说明:子树为节点对象的children,节点标签为节点对象的label
*
*
* @type {string}
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
*/
@
Prop
()
public
viewdata
!
:
string
;
protected
defaultProps
:
any
=
{
children
:
"children"
,
/**
label
:
"label"
,
* 视图默认使用
};
*
* @type {boolean}
/**
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
* 选中数据
*/
*
@
Prop
({
default
:
true
})
public
viewDefaultUsage
!
:
boolean
;
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomView
/**
*/
* 自定义视图导航上下文集合
protected
selectData
:
any
=
{};
*
* @type {*}
/**
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
* 初始选中的数据
*/
*
public
customViewNavContexts
:
any
=
{};
* @type {*}
/**
* @memberof SYS_ROLE_PERMISSIONCustomView
* 自定义视图导航参数集合
*/
*
protected
ininselectData
:
any
=
{};
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
/**
*/
* 视图选中数据
public
customViewParams
:
any
=
{};
*
* @type {Array<*>}
/**
* @memberof SYS_ROLE_PERMISSIONCustomView
* 解析视图参数
*/
*
public
viewSelections
:
any
[]
=
[];
* @public
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
/**
*/
* 父数据
public
parseViewParam
():
void
{
*
for
(
let
key
in
this
.
context
){
* @type {*}
delete
this
.
context
[
key
];
* @memberof SYS_ROLE_PERMISSIONCustomView
}
*/
if
(
!
this
.
viewDefaultUsage
&&
this
.
viewdata
&&
!
Object
.
is
(
this
.
viewdata
,
''
))
{
protected
parentData
:
any
=
{};
Object
.
assign
(
this
.
context
,
JSON
.
parse
(
this
.
viewdata
));
if
(
this
.
context
&&
this
.
context
.
srfparentdename
){
/**
Object
.
assign
(
this
.
viewparams
,{
srfparentdename
:
this
.
context
.
srfparentdename
});
* 父数据主键
}
*
if
(
this
.
context
&&
this
.
context
.
srfparentkey
){
* @type {*}
Object
.
assign
(
this
.
viewparams
,{
srfparentkey
:
this
.
context
.
srfparentkey
});
* @memberof SYS_ROLE_PERMISSIONCustomView
}
*/
this
.
handleCustomViewData
();
protected
srfparentkey
:
any
;
return
;
}
/**
const
path
=
(
this
.
$route
.
matched
[
this
.
$route
.
matched
.
length
-
1
]).
path
;
* 视图标识
const
keys
:
Array
<
any
>
=
[];
*
const
curReg
=
this
.
$pathToRegExp
.
pathToRegexp
(
path
,
keys
);
* @type {string}
const
matchArray
=
curReg
.
exec
(
this
.
$route
.
path
);
* @memberof SYS_ROLE_PERMISSIONCustomView
let
tempValue
:
Object
=
{};
*/
keys
.
forEach
((
item
:
any
,
index
:
number
)
=>
{
public
viewtag
:
string
=
"e791be173ed0f4bbe9cce942b6edde63"
;
Object
.
defineProperty
(
tempValue
,
item
.
name
,
{
enumerable
:
true
,
/**
value
:
matchArray
[
index
+
1
]
* 是否嵌入关系界面
});
*
});
* @type {boolean}
this
.
$viewTool
.
formatRouteParams
(
tempValue
,
this
.
$route
,
this
.
context
,
this
.
viewparams
);
* @memberof SYS_ROLE_PERMISSIONCustomView
if
(
this
.
$store
.
getters
.
getAppData
()
&&
this
.
$store
.
getters
.
getAppData
().
context
){
*/
Object
.
assign
(
this
.
context
,
this
.
$store
.
getters
.
getAppData
().
context
);
@
Prop
({
default
:
false
})
public
isformDruipart
?:
boolean
;
}
//初始化视图唯一标识
/**
Object
.
assign
(
this
.
context
,{
srfsessionid
:
this
.
$util
.
createUUID
()});
* 界面关系通讯对象
this
.
handleCustomViewData
();
*
}
* @type {Subject<ViewState>}
* @memberof SYS_ROLE_PERMISSIONCustomView
/**
*/
* 处理自定义视图数据
@
Prop
()
public
formDruipart
?:
Subject
<
ViewState
>
;
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
/**
*/
* 应用上下文
public
handleCustomViewData
(){
*
if
(
Object
.
keys
(
this
.
customViewNavContexts
).
length
>
0
){
* @type {*}
Object
.
keys
(
this
.
customViewNavContexts
).
forEach
((
item
:
any
)
=>
{
* @memberof SYS_ROLE_PERMISSIONCustomView
let
tempContext
:
any
=
{};
*/
let
curNavContext
:
any
=
this
.
customViewNavContexts
[
item
];
public
context
:
any
=
{};
this
.
handleCustomDataLogic
(
curNavContext
,
tempContext
,
item
);
Object
.
assign
(
this
.
context
,
tempContext
);
/**
})
* 视图参数
}
*
if
(
Object
.
keys
(
this
.
customViewParams
).
length
>
0
){
* @type {*}
Object
.
keys
(
this
.
customViewParams
).
forEach
((
item
:
any
)
=>
{
* @memberof SYS_ROLE_PERMISSIONCustomView
let
tempParam
:
any
=
{};
*/
let
curNavParam
:
any
=
this
.
customViewParams
[
item
];
public
viewparams
:
any
=
{};
this
.
handleCustomDataLogic
(
curNavParam
,
tempParam
,
item
);
Object
.
assign
(
this
.
viewparams
,
tempParam
);
/**
})
* 传入视图上下文
}
*
}
* @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomView
/**
*/
* 处理自定义视图数据逻辑
@
Prop
()
public
viewdata
!
:
string
;
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
/**
*/
* 视图默认使用
public
handleCustomDataLogic
(
curNavData
:
any
,
tempData
:
any
,
item
:
string
){
*
// 直接值直接赋值
* @type {boolean}
if
(
curNavData
.
isRawValue
){
* @memberof SYS_ROLE_PERMISSIONCustomView
if
(
Object
.
is
(
curNavData
.
value
,
"null"
)
||
Object
.
is
(
curNavData
.
value
,
""
)){
*/
Object
.
defineProperty
(
tempData
,
item
.
toLowerCase
(),
{
@
Prop
({
default
:
true
})
public
viewDefaultUsage
!
:
boolean
;
value
:
null
,
writable
:
true
,
/**
enumerable
:
true
,
* 自定义视图导航上下文集合
configurable
:
true
*
});
* @type {*}
}
else
{
* @memberof SYS_ROLE_PERMISSIONCustomView
Object
.
defineProperty
(
tempData
,
item
.
toLowerCase
(),
{
*/
value
:
curNavData
.
value
,
public
customViewNavContexts
:
any
=
{};
writable
:
true
,
/**
enumerable
:
true
,
* 自定义视图导航参数集合
configurable
:
true
*
});
* @type {*}
}
* @memberof SYS_ROLE_PERMISSIONCustomView
}
else
{
*/
// 先从导航上下文取数,没有再从导航参数(URL)取数,如果导航上下文和导航参数都没有则为null
public
customViewParams
:
any
=
{};
if
(
this
.
context
[(
curNavData
.
value
).
toLowerCase
()]){
Object
.
defineProperty
(
tempData
,
item
.
toLowerCase
(),
{
/**
value
:
this
.
context
[(
curNavData
.
value
).
toLowerCase
()],
* 解析视图参数
writable
:
true
,
*
enumerable
:
true
,
* @public
configurable
:
true
* @memberof SYS_ROLE_PERMISSIONCustomView
});
*/
}
else
{
public
parseViewParam
():
void
{
if
(
this
.
viewparams
[(
curNavData
.
value
).
toLowerCase
()]){
for
(
let
key
in
this
.
context
)
{
Object
.
defineProperty
(
tempData
,
item
.
toLowerCase
(),
{
delete
this
.
context
[
key
];
value
:
this
.
viewparams
[(
curNavData
.
value
).
toLowerCase
()],
}
writable
:
true
,
if
(
enumerable
:
true
,
!
this
.
viewDefaultUsage
&&
configurable
:
true
this
.
viewdata
&&
});
!
Object
.
is
(
this
.
viewdata
,
""
)
}
else
{
)
{
Object
.
defineProperty
(
tempData
,
item
.
toLowerCase
(),
{
Object
.
assign
(
this
.
context
,
JSON
.
parse
(
this
.
viewdata
));
value
:
null
,
if
(
this
.
context
&&
this
.
context
.
srfparentdename
)
{
writable
:
true
,
Object
.
assign
(
this
.
viewparams
,
{
enumerable
:
true
,
srfparentdename
:
this
.
context
.
srfparentdename
,
configurable
:
true
});
});
}
}
if
(
this
.
context
&&
this
.
context
.
srfparentkey
)
{
}
Object
.
assign
(
this
.
viewparams
,
{
}
srfparentkey
:
this
.
context
.
srfparentkey
,
}
});
}
/**
this
.
handleCustomViewData
();
* vue 创建
return
;
*/
}
public
created
()
{
const
path
=
this
.
$route
.
matched
[
this
.
$route
.
matched
.
length
-
1
].
path
;
this
.
afterCreated
();
const
keys
:
Array
<
any
>
=
[];
}
const
curReg
=
this
.
$pathToRegExp
.
pathToRegexp
(
path
,
keys
);
const
matchArray
=
curReg
.
exec
(
this
.
$route
.
path
);
/**
let
tempValue
:
Object
=
{};
* 执行created后的逻辑
keys
.
forEach
((
item
:
any
,
index
:
number
)
=>
{
*
Object
.
defineProperty
(
tempValue
,
item
.
name
,
{
* @memberof SYS_USER_ROLEGridViewBase
enumerable
:
true
,
*/
value
:
matchArray
[
index
+
1
],
public
afterCreated
(){
});
const
secondtag
=
this
.
$util
.
createUUID
();
});
this
.
$store
.
commit
(
'viewaction/createdView'
,
{
viewtag
:
this
.
viewtag
,
secondtag
:
secondtag
});
this
.
$viewTool
.
formatRouteParams
(
this
.
viewtag
=
secondtag
;
tempValue
,
this
.
parseViewParam
();
this
.
$route
,
this
.
context
,
const
_this
:
any
=
this
;
this
.
viewparams
// 获取父数据
);
if
(
_this
&&
_this
.
viewdata
)
{
if
(
_this
.
parentData
=
JSON
.
parse
(
_this
.
viewdata
);
this
.
$store
.
getters
.
getAppData
()
&&
}
this
.
$store
.
getters
.
getAppData
().
context
if
(
_this
.
parentData
&&
_this
.
parentData
.
sysrole
)
{
)
{
// console.log("当前角色id:" + _this.parentData.sysrole);
Object
.
assign
(
this
.
context
,
this
.
$store
.
getters
.
getAppData
().
context
);
_this
.
srfparentkey
=
_this
.
parentData
.
sysrole
;
}
}
//初始化视图唯一标识
// 监听父页面
Object
.
assign
(
this
.
context
,
{
srfsessionid
:
this
.
$util
.
createUUID
()
});
if
(
this
.
formDruipart
){
this
.
handleCustomViewData
();
this
.
formDruipart
.
subscribe
((
res
:
any
)
=>
{
}
if
(
Object
.
is
(
res
.
action
,
'load'
)){
/**
// 如果是新建角色保存,需要从res中获取父数据主键
* 处理自定义视图数据
if
(
res
.
data
)
{
*
let
parentData
=
res
.
data
;
* @memberof SYS_ROLE_PERMISSIONCustomView
this
.
srfparentkey
=
parentData
.
srfparentkey
;
*/
}
public
handleCustomViewData
()
{
if
(
Object
.
keys
(
this
.
customViewNavContexts
).
length
>
0
)
{
// 父数据保存时调用当前视图的事件
Object
.
keys
(
this
.
customViewNavContexts
).
forEach
((
item
:
any
)
=>
{
if
(
this
.
selectData
.
length
>
0
){
let
tempContext
:
any
=
{};
// 选中了数据
let
curNavContext
:
any
=
this
.
customViewNavContexts
[
item
];
this
.
onClickOk
();
this
.
handleCustomDataLogic
(
curNavContext
,
tempContext
,
item
);
}
else
{
Object
.
assign
(
this
.
context
,
tempContext
);
// 没选中数据
});
this
.
onClear
();
}
}
if
(
Object
.
keys
(
this
.
customViewParams
).
length
>
0
)
{
}
Object
.
keys
(
this
.
customViewParams
).
forEach
((
item
:
any
)
=>
{
});
let
tempParam
:
any
=
{};
}
let
curNavParam
:
any
=
this
.
customViewParams
[
item
];
this
.
handleCustomDataLogic
(
curNavParam
,
tempParam
,
item
);
}
Object
.
assign
(
this
.
viewparams
,
tempParam
);
});
}
/**
}
* vue 挂载
*/
/**
public
mounted
()
{
* 处理自定义视图数据逻辑
this
.
initTree
();
*
}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
/**
public
handleCustomDataLogic
(
curNavData
:
any
,
tempData
:
any
,
item
:
string
)
{
* 初始化树
// 直接值直接赋值
*/
if
(
curNavData
.
isRawValue
)
{
private
initTree
()
{
if
(
const
_this
=
this
;
Object
.
is
(
curNavData
.
value
,
"null"
)
||
// get全部菜单和数据能力和自定义资源的请求路径
Object
.
is
(
curNavData
.
value
,
""
)
const
url
=
`sysroles/`
+
_this
.
srfparentkey
+
`/sysrolepermissions/tree`
;
)
{
this
.
$http
.
get
(
url
).
then
((
response
:
any
)
=>
{
Object
.
defineProperty
(
tempData
,
item
.
toLowerCase
(),
{
if
(
!
response
||
response
.
status
!==
200
)
{
value
:
null
,
this
.
$Notice
.
error
({
title
:
'错误'
,
desc
:
response
.
message
});
writable
:
true
,
return
;
enumerable
:
true
,
}
else
{
configurable
:
true
,
// 给树赋值,数据结构在后台已经按照eltree格式化
});
_this
.
CDdata
=
response
.
data
.
APPMENU
;
}
else
{
_this
.
QXdata
=
response
.
data
.
OPPRIV
;
Object
.
defineProperty
(
tempData
,
item
.
toLowerCase
(),
{
_this
.
ZYdata
=
response
.
data
.
UNIRES
;
value
:
curNavData
.
value
,
_this
.
defaultCheckedNodes
=
response
.
data
.
SELECTED
;
writable
:
true
,
enumerable
:
true
,
// 设置默认第一级展开
configurable
:
true
,
for
(
let
i
=
0
;
i
<
_this
.
CDdata
.
length
;
i
++
)
{
});
_this
.
CDdataexpandedKeys
.
push
(
_this
.
CDdata
[
i
].
id
);
}
}
}
else
{
for
(
let
i
=
0
;
i
<
_this
.
QXdata
.
length
;
i
++
)
{
// 先从导航上下文取数,没有再从导航参数(URL)取数,如果导航上下文和导航参数都没有则为null
_this
.
QXdataexpandedKeys
.
push
(
_this
.
QXdata
[
i
].
id
);
if
(
this
.
context
[
curNavData
.
value
.
toLowerCase
()])
{
}
Object
.
defineProperty
(
tempData
,
item
.
toLowerCase
(),
{
for
(
let
i
=
0
;
i
<
_this
.
ZYdata
.
length
;
i
++
)
{
value
:
this
.
context
[
curNavData
.
value
.
toLowerCase
()],
_this
.
ZYdataexpandedKeys
.
push
(
_this
.
ZYdata
[
i
].
id
);
writable
:
true
,
}
enumerable
:
true
,
configurable
:
true
,
// 设置默认选中节点,即当前角色所有权限
});
this
.
$nextTick
(()
=>
{
}
else
{
const
CDtree
:
any
=
this
.
$refs
.
CDtree
;
if
(
this
.
viewparams
[
curNavData
.
value
.
toLowerCase
()])
{
const
QXtree
:
any
=
this
.
$refs
.
QXtree
;
Object
.
defineProperty
(
tempData
,
item
.
toLowerCase
(),
{
const
ZYtree
:
any
=
this
.
$refs
.
ZYtree
;
value
:
this
.
viewparams
[
curNavData
.
value
.
toLowerCase
()],
writable
:
true
,
CDtree
.
setCheckedNodes
(
_this
.
defaultCheckedNodes
);
enumerable
:
true
,
QXtree
.
setCheckedNodes
(
_this
.
defaultCheckedNodes
);
configurable
:
true
,
ZYtree
.
setCheckedNodes
(
_this
.
defaultCheckedNodes
);
});
}
else
{
// 保存初始选中的节点数据,便于后续保存时比较
Object
.
defineProperty
(
tempData
,
item
.
toLowerCase
(),
{
const
arr
=
CDtree
.
getCheckedNodes
().
concat
(
QXtree
.
getCheckedNodes
()).
concat
(
ZYtree
.
getCheckedNodes
());
value
:
null
,
this
.
ininselectData
=
arr
;
writable
:
true
,
});
enumerable
:
true
,
configurable
:
true
,
});
}
}).
catch
((
e
)
=>
{
console
.
log
(
e
);
});
}
}
}
/**
}
* 销毁之前
}
*
* @memberof SYS_ROLE_PERMISSIONCustomViewBase
/**
*/
* vue 创建
public
beforeDestroy
()
{
*
// 清空选中数据
* @memberof SYS_ROLE_PERMISSIONCustomView
this
.
selectData
=
{};
*/
// 清空视图选中数据
public
created
()
{
this
.
viewSelections
=
[];
this
.
afterCreated
();
this
.
$store
.
commit
(
'viewaction/removeView'
,
this
.
viewtag
);
}
/**
* 执行created后的逻辑
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
public
afterCreated
()
{
const
secondtag
=
this
.
$util
.
createUUID
();
this
.
$store
.
commit
(
"viewaction/createdView"
,
{
viewtag
:
this
.
viewtag
,
secondtag
:
secondtag
,
});
this
.
viewtag
=
secondtag
;
this
.
parseViewParam
();
const
_this
:
any
=
this
;
// 获取父数据
if
(
_this
&&
_this
.
viewdata
)
{
if
(
typeof
_this
.
viewdata
==
"string"
)
{
_this
.
parentData
=
JSON
.
parse
(
_this
.
viewdata
);
}
else
{
_this
.
parentData
=
_this
.
viewdata
;
}
}
if
(
_this
.
parentData
&&
_this
.
parentData
.
sysrole
)
{
// console.log("当前角色id:" + _this.parentData.sysrole);
_this
.
srfparentkey
=
_this
.
parentData
.
sysrole
;
}
// 监听父页面
if
(
this
.
formDruipart
)
{
this
.
formDruipart
.
subscribe
((
res
:
any
)
=>
{
if
(
Object
.
is
(
res
.
action
,
"load"
))
{
// 如果是新建角色保存,需要从res中获取父数据主键
if
(
res
.
data
)
{
let
parentData
=
res
.
data
;
this
.
srfparentkey
=
parentData
.
srfparentkey
;
}
// 父数据保存时调用当前视图的事件
if
(
this
.
selectData
.
length
>
0
)
{
// 选中了数据
this
.
onClickOk
();
}
else
{
// 没选中数据
this
.
onClear
();
}
}
}
});
}
/**
}
* 处理选中节点
*/
/**
protected
handleCheckChange
()
{
* vue 挂载
// console.log("SYS_PERMISSIONMPickupView执行了handleCheckChange")
*
// 获取当前三棵树
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
public
mounted
()
{
this
.
initTree
();
}
/**
* 初始化树
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
private
initTree
()
{
const
_this
=
this
;
// get全部菜单和数据能力和自定义资源的请求路径
const
url
:
string
=
`sysroles/
${
_this
.
srfparentkey
}
/sysrolepermissions/tree`
;
this
.
$http
.
get
(
url
)
.
then
((
response
:
any
)
=>
{
if
(
!
response
||
response
.
status
!==
200
)
{
this
.
$Notice
.
error
({
title
:
"错误"
,
desc
:
response
.
message
});
return
;
}
else
{
// 给树赋值,数据结构在后台已经按照eltree格式化
_this
.
CDdata
=
response
.
data
.
APPMENU
;
_this
.
QXdata
=
response
.
data
.
OPPRIV
;
_this
.
ZYdata
=
response
.
data
.
UNIRES
;
_this
.
defaultCheckedNodes
=
response
.
data
.
SELECTED
;
// 设置默认第一级展开
for
(
let
i
=
0
;
i
<
_this
.
CDdata
.
length
;
i
++
)
{
_this
.
CDdataexpandedKeys
.
push
(
_this
.
CDdata
[
i
].
id
);
}
for
(
let
i
=
0
;
i
<
_this
.
QXdata
.
length
;
i
++
)
{
_this
.
QXdataexpandedKeys
.
push
(
_this
.
QXdata
[
i
].
id
);
}
for
(
let
i
=
0
;
i
<
_this
.
ZYdata
.
length
;
i
++
)
{
_this
.
ZYdataexpandedKeys
.
push
(
_this
.
ZYdata
[
i
].
id
);
}
// 设置默认选中节点,即当前角色所有权限
this
.
$nextTick
(()
=>
{
const
CDtree
:
any
=
this
.
$refs
.
CDtree
;
const
CDtree
:
any
=
this
.
$refs
.
CDtree
;
const
QXtree
:
any
=
this
.
$refs
.
QXtree
;
const
QXtree
:
any
=
this
.
$refs
.
QXtree
;
const
ZYtree
:
any
=
this
.
$refs
.
ZYtree
;
const
ZYtree
:
any
=
this
.
$refs
.
ZYtree
;
// 获取选中状态的节点
const
arr
=
CDtree
.
getCheckedNodes
().
concat
(
QXtree
.
getCheckedNodes
()).
concat
(
ZYtree
.
getCheckedNodes
());
this
.
selectData
=
arr
;
// console.log("选中的node:" + JSON.stringify(this.selectData));
}
/**
* 容器模型
*/
public
containerModel
:
any
=
{
view_okbtn
:
{
name
:
'okbtn'
,
type
:
'button'
,
text
:
'确定'
,
disabled
:
true
},
};
/**
* 确定
*/
public
onClickOk
():
void
{
// 处理选中的数据
if
(
this
.
selectData
&&
this
.
selectData
.
length
>
0
)
{
// 判断选中的数据和初始数据
if
(
JSON
.
stringify
(
this
.
selectData
)
==
JSON
.
stringify
(
this
.
ininselectData
))
{
return
;
}
this
.
selectData
.
forEach
((
item
:
any
)
=>
{
let
_itemTemp
:
any
=
JSON
.
parse
(
JSON
.
stringify
(
item
));
let
_item
:
any
=
{};
if
(
_itemTemp
.
type
)
{
_item
.
permissionid
=
_itemTemp
.
id
;
_item
.
permissiontype
=
_itemTemp
.
type
;
_item
.
permissionname
=
_itemTemp
.
fullName
;
Object
.
assign
(
_item
,
{
_select
:
false
})
this
.
viewSelections
.
push
(
_item
);
}
});
// 保存选中的权限信息
let
url
=
'/sysroles/'
+
this
.
srfparentkey
+
'/sysrolepermissions/refreshbatch'
;
this
.
$http
.
post
(
url
,
this
.
viewSelections
).
then
((
response
:
any
)
=>
{
if
(
!
(
!
response
||
response
.
status
!==
200
))
{
}
else
{
this
.
$Notice
.
error
({
title
:
'错误'
,
desc
:
response
.
message
});
return
;
}
}).
catch
((
e
)
=>
{
});
}
// 清空视图选中数据,避免重复添加
this
.
viewSelections
=
[];
}
/**
CDtree
.
setCheckedNodes
(
_this
.
defaultCheckedNodes
);
* 清除
QXtree
.
setCheckedNodes
(
_this
.
defaultCheckedNodes
);
*/
ZYtree
.
setCheckedNodes
(
_this
.
defaultCheckedNodes
);
private
onClear
(){
// 未选中数据,即没有赋予任何权限,需要清除当前角色的所有权限
if
(
this
.
selectData
.
length
==
0
)
{
// 保存选中的权限信息
let
url
=
'/sysroles/'
+
this
.
srfparentkey
+
'/sysrolepermissions/refreshbatch'
;
this
.
$http
.
post
(
url
,[]).
then
((
response
:
any
)
=>
{
if
(
!
(
!
response
||
response
.
status
!==
200
))
{
}
else
{
this
.
$Notice
.
error
({
title
:
'错误'
,
desc
:
response
.
message
});
return
;
}
}).
catch
((
e
)
=>
{
});
}
// 保存初始选中的节点数据,便于后续保存时比较
const
arr
=
CDtree
.
getCheckedNodes
()
.
concat
(
QXtree
.
getCheckedNodes
())
.
concat
(
ZYtree
.
getCheckedNodes
());
this
.
ininselectData
=
arr
;
});
}
}
})
.
catch
((
e
:
any
)
=>
{
console
.
error
(
typeof
e
==
"string"
?
e
:
JSON
.
stringify
(
e
));
});
}
/**
* vue销毁之前
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
public
beforeDestroy
()
{
// 清空选中数据
this
.
selectData
=
{};
// 清空视图选中数据
this
.
viewSelections
=
[];
this
.
$store
.
commit
(
"viewaction/removeView"
,
this
.
viewtag
);
}
/**
* 处理选中节点
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
protected
handleCheckChange
()
{
// 获取当前三棵树
const
CDtree
:
any
=
this
.
$refs
.
CDtree
;
const
QXtree
:
any
=
this
.
$refs
.
QXtree
;
const
ZYtree
:
any
=
this
.
$refs
.
ZYtree
;
// 获取选中状态的节点
const
arr
=
CDtree
.
getCheckedNodes
()
.
concat
(
QXtree
.
getCheckedNodes
())
.
concat
(
ZYtree
.
getCheckedNodes
());
this
.
selectData
=
arr
;
// console.log("选中的node:" + JSON.stringify(this.selectData));
}
/**
* 保存角色权限
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
public
onClickOk
():
void
{
// 处理选中的数据
if
(
this
.
selectData
&&
this
.
selectData
.
length
>
0
)
{
// 判断选中的数据和初始数据
if
(
JSON
.
stringify
(
this
.
selectData
)
==
JSON
.
stringify
(
this
.
ininselectData
)
)
{
return
;
}
this
.
selectData
.
forEach
((
item
:
any
)
=>
{
let
_itemTemp
:
any
=
JSON
.
parse
(
JSON
.
stringify
(
item
));
let
_item
:
any
=
{};
if
(
_itemTemp
.
type
)
{
_item
.
permissionid
=
_itemTemp
.
id
;
_item
.
permissiontype
=
_itemTemp
.
type
;
_item
.
permissionname
=
_itemTemp
.
fullName
;
Object
.
assign
(
_item
,
{
_select
:
false
});
this
.
viewSelections
.
push
(
_item
);
}
});
// 保存选中的权限信息
let
url
:
string
=
`/sysroles/
${
this
.
srfparentkey
}
/sysrolepermissions/refreshbatch`
;
this
.
$http
.
post
(
url
,
this
.
viewSelections
)
.
then
((
response
:
any
)
=>
{
if
(
!
(
!
response
||
response
.
status
!==
200
))
{
this
.
$Notice
.
error
({
title
:
"错误"
,
desc
:
response
.
message
});
return
;
}
})
.
catch
((
e
:
any
)
=>
{
console
.
error
(
"保存角色权限失败:"
+
typeof
e
==
"string"
?
e
:
JSON
.
stringify
(
e
)
);
});
}
// 清空视图选中数据,避免重复添加
this
.
viewSelections
=
[];
}
/**
* 清除角色权限
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
private
onClear
()
{
// 未选中数据,即没有赋予任何权限,需要清除当前角色的所有权限
if
(
this
.
selectData
.
length
==
0
)
{
// 保存选中的权限信息
let
url
:
string
=
`/sysroles/
${
this
.
srfparentkey
}
/sysrolepermissions/refreshbatch`
;
this
.
$http
.
post
(
url
,
[])
.
then
((
response
:
any
)
=>
{
if
(
!
(
!
response
||
response
.
status
!==
200
))
{
this
.
$Notice
.
error
({
title
:
"错误"
,
desc
:
response
.
message
});
return
;
}
})
.
catch
((
e
:
any
)
=>
{
console
.
error
(
"清除角色权限失败,"
+
typeof
e
==
"string"
?
e
:
JSON
.
stringify
(
e
)
);
});
}
}
}
}
</
script
>
</
script
>
<
style
lang=
'less'
>
<
style
lang=
'less'
>
@import './sys-role-permission-custom-view'
;
@import "./sys-role-permission-custom-view"
;
</
style
>
</
style
>
\ No newline at end of file
app_Web/src/widgets/sys-department/dept-tree-treeview/dept-tree-treeview.vue
浏览文件 @
4c9dbcca
<
template
>
<
template
>
<div
class=
"design-tree-container"
>
<div
class=
"design-tree-container"
>
<context-menu-container>
<context-menu-container>
<el-input
size=
"small"
placeholder=
"搜索..."
v-model=
"filerText"
@
input=
"filterChange"
>
<el-input
<i
slot=
"prefix"
class=
"el-input__icon el-icon-search"
></i>
size=
"small"
</el-input>
placeholder=
"搜索..."
<el-tree
v-model=
"filerText"
:filter-node-method=
"filterNode"
@
input=
"filterChange"
class=
"tre"
>
:data=
"this.TreeData"
<i
slot=
"prefix"
class=
"el-input__icon el-icon-search"
></i>
ref=
"DeptTree"
</el-input>
:show-checkbox=
"false"
<el-tree
node-key=
"id"
:filter-node-method=
"filterNode"
:default-expand-all=
"false"
class=
"tre"
highlight-current
:data=
"this.TreeData"
:default-expanded-keys=
"this.defaultExpandedKeys"
ref=
"DeptTree"
:props=
"this.defaultProps"
:show-checkbox=
"false"
@
node-click=
"handleNodeClick"
node-key=
"id"
>
:default-expand-all=
"false"
<span
class=
"custom-tree-node"
slot-scope=
"
{node, data}">
highlight-current
<i
v-if=
"node.isLeaf"
class=
"fa fa-building-o"
style=
"margin-right: 2px;"
></i>
:default-expanded-keys=
"this.defaultExpandedKeys"
<i
v-if=
"!node.isLeaf"
class=
"fa fa-building"
style=
"margin-right: 2px;"
></i>
:props=
"this.defaultProps"
<span>
{{
node
.
label
}}
</span>
@
node-click=
"handleNodeClick"
</span>
>
</el-tree>
<span
class=
"custom-tree-node"
slot-scope=
"
{ node, data }">
</context-menu-container>
<i
</div>
v-if=
"node.isLeaf"
class=
"fa fa-building-o"
style=
"margin-right: 2px"
></i>
<i
v-if=
"!node.isLeaf"
class=
"fa fa-building"
style=
"margin-right: 2px"
></i>
<span>
{{
node
.
label
}}
</span>
</span>
</el-tree>
</context-menu-container>
</div>
</
template
>
</
template
>
<
script
lang=
'tsx'
>
<
script
lang=
'tsx'
>
import
{
Component
,
Vue
}
from
'vue-property-decorator'
;
import
{
Component
,
Vue
}
from
"vue-property-decorator"
;
@
Component
({
@
Component
({
components
:
{},
components
:
{}
})
})
export
default
class
DeptTree
extends
Vue
{
export
default
class
DeptTree
extends
Vue
{
/**
* 过滤文本
// 过滤文本
*
public
filerText
:
any
=
''
;
* @type {string}
/**
* @memberof DeptTree
* 过滤节点
*/
*/
public
filerText
:
string
=
""
;
public
filterNode
(
value
:
any
,
data
:
any
){
if
(
!
value
)
return
true
;
/**
return
data
.
label
.
indexOf
(
value
)
!==-
1
;
* 过滤节点
}
*
/**
* @param {string} value 过滤文本
* 树搜索触发
* @param {*} data 树数据
*/
* @memberof DeptTree
public
filterChange
(){
*/
const
DeptTree
:
any
=
this
.
$refs
.
DeptTree
;
public
filterNode
(
value
:
string
,
data
:
any
)
{
DeptTree
.
filter
(
this
.
filerText
);
if
(
!
value
)
return
true
;
}
return
data
.
label
.
indexOf
(
value
)
!==
-
1
;
}
/*树数据*/
public
TreeData
:
any
=
[];
/**
* 树搜索触发
/*树显示说明:子树为节点对象的children,节点标签为节点对象的label*/
*
public
defaultProps
:
any
=
{
* @memberof DeptTree
children
:
'children'
,
*/
label
:
'label'
public
filterChange
()
{
}
const
DeptTree
:
any
=
this
.
$refs
.
DeptTree
;
DeptTree
.
filter
(
this
.
filerText
);
/*默认展开节点*/
}
public
defaultExpandedKeys
:
any
=
[];
/**
/*当前登录人信息*/
* 树数据
public
curUserContext
:
any
=
{};
*
* @type {Array<*>}
/**
* @memberof DeptTree
* vue 创建
*/
*/
public
TreeData
:
Array
<
any
>
=
[];
public
created
()
{
var
_this
:
any
=
this
;
/**
// 获取当前登录人信息
* 树显示说明:子树为节点对象的children,节点标签为节点对象的label
if
(
_this
&&
_this
.
$attrs
&&
_this
.
$attrs
.
context
)
{
*
_this
.
curUserContext
=
_this
.
$attrs
.
context
;
* @type {*}
}
* @memberof DeptTree
}
*/
public
defaultProps
:
any
=
{
/**
children
:
"children"
,
* vue 挂载
label
:
"label"
,
*/
};
public
mounted
()
{
this
.
initTree
();
/**
}
* 默认展开节点
* @type {Array<*>}
/**
* @memberof DeptTree
* 初始化树
*/
*/
public
defaultExpandedKeys
:
Array
<
any
>
=
[];
private
initTree
()
{
const
_this
=
this
;
/**
// 获取当前登录人的身份
* 当前登录人信息
const
userStr
=
localStorage
.
getItem
(
'user'
);
*
let
user
:
any
=
{};
* @type {*}
if
(
userStr
)
{
* @memberof DeptTree
user
=
JSON
.
parse
(
userStr
);
*/
}
public
curUserContext
:
any
=
{};
// 获取当前登录人所处组织的部门及下级组织的部门
let
url
=
''
;
/**
// 判断是否超级用户
* vue 创建
if
(
user
.
superuser
==
1
)
{
*
// 获取所有组织的部门及下级组织的部门
* @memberof DeptTree
url
=
'sysorganizations/alls/suborg/sysdepartments/picker'
;
*/
}
else
{
public
created
()
{
// 获取当前登录人所在组织的部门及下级组织的部门
var
_this
:
any
=
this
;
if
(
_this
.
curUserContext
&&
_this
.
curUserContext
.
srforgid
)
{
// 获取当前登录人信息
url
=
'sysorganizations/'
+
_this
.
curUserContext
.
srforgid
+
'/suborg/sysdepartments/picker'
;
if
(
_this
&&
_this
.
$attrs
&&
_this
.
$attrs
.
context
)
{
}
else
{
_this
.
curUserContext
=
_this
.
$attrs
.
context
;
this
.
$Notice
.
error
({
title
:
'错误'
,
desc
:
'当前登录人组织为空'
});
}
}
}
}
this
.
$http
.
get
(
url
).
then
((
response
:
any
)
=>
{
/**
if
(
!
response
||
response
.
status
!==
200
)
{
* vue 挂载
this
.
$Notice
.
error
({
title
:
'错误'
,
desc
:
response
.
message
});
*
return
;
* @memberof DeptTree
}
else
{
*/
// 给树赋值,数据结构在后台已经按照eltree格式化
public
mounted
()
{
_this
.
TreeData
=
response
.
data
;
this
.
initTree
();
if
(
response
.
data
&&
response
.
data
.
length
>
0
)
{
}
// 设置默认选中第一个节点,即高亮显示
this
.
$nextTick
(
function
(){
/**
let
deptTree
:
any
=
this
.
$refs
.
DeptTree
;
* 初始化树
deptTree
.
setCurrentKey
(
response
.
data
[
0
].
id
);
*
})
* @memberof DeptTree
// 默认加载第一个节点的右侧视图,调用选中数据变更事件
*/
_this
.
selectionChange
(
response
.
data
[
0
]);
private
initTree
()
{
}
const
_this
=
this
;
}
// 获取当前登录人的身份
}).
catch
((
e
:
any
)
=>
{
const
userStr
=
localStorage
.
getItem
(
"user"
);
console
.
log
(
e
);
let
user
:
any
=
{};
if
(
userStr
)
{
user
=
JSON
.
parse
(
userStr
);
}
// 获取当前登录人所处组织的部门及下级组织的部门
let
url
:
string
=
""
;
// 判断是否超级用户
if
(
user
.
superuser
==
1
)
{
// 获取所有组织的部门及下级组织的部门
url
=
"sysorganizations/alls/suborg/sysdepartments/picker"
;
}
else
{
// 获取当前登录人所在组织的部门及下级组织的部门
if
(
_this
.
curUserContext
&&
_this
.
curUserContext
.
srforgid
)
{
url
=
"sysorganizations/"
+
_this
.
curUserContext
.
srforgid
+
"/suborg/sysdepartments/picker"
;
}
else
{
this
.
$Notice
.
error
({
title
:
"错误"
,
desc
:
"当前登录人组织为空"
});
}
}
this
.
$http
.
get
(
url
)
.
then
((
response
:
any
)
=>
{
if
(
!
response
||
response
.
status
!==
200
)
{
this
.
$Notice
.
error
({
title
:
"错误"
,
desc
:
response
.
message
});
return
;
}
else
{
// 给树赋值,数据结构在后台已经按照eltree格式化
_this
.
TreeData
=
response
.
data
;
if
(
response
.
data
&&
response
.
data
.
length
>
0
)
{
// 设置默认选中第一个节点,即高亮显示
this
.
$nextTick
(
function
()
{
let
deptTree
:
any
=
this
.
$refs
.
DeptTree
;
deptTree
.
setCurrentKey
(
response
.
data
[
0
].
id
);
});
});
// 默认加载第一个节点的右侧视图,调用选中数据变更事件
_this
.
selectionChange
(
response
.
data
[
0
]);
}
}
}
})
.
catch
((
e
:
any
)
=>
{
/**
console
.
log
(
e
);
* 处理点击节点
});
*/
}
protected
handleNodeClick
()
{
// 获取当前树
/**
const
DeptTree
:
any
=
this
.
$refs
.
DeptTree
;
* 处理点击节点
// 获取点击状态的节点
*
let
node
=
DeptTree
.
getCurrentNode
();
* @memberof DeptTree
// console.log("选中的node:" + JSON.stringify(node));
*/
// if (node.isLeaf && node.isLeaf == true)
protected
handleNodeClick
()
{
// 选中数据变更事件
// 获取当前树
this
.
selectionChange
(
node
);
const
DeptTree
:
any
=
this
.
$refs
.
DeptTree
;
}
// 获取点击状态的节点
let
node
=
DeptTree
.
getCurrentNode
();
/**
// console.log("选中的node:" + JSON.stringify(node));
* 选中数据变更事件
*
// 选中数据变更事件
* @public
this
.
selectionChange
(
node
);
* @param {*} node 节点对应node对象
}
* @memberof OrgTree
*/
/**
public
selectionChange
(
node
:
any
)
{
* 选中数据变更事件
// 获取右侧视图渲染数据需要的参数
*
let
temp
=
JSON
.
parse
(
JSON
.
stringify
(
node
));
* @param {*} 节点对应node对象
let
srfappctx
:
any
=
{};
* @memberof DeptTree
if
(
node
.
disabled
==
true
)
{
// 单位
*/
temp
.
id
=
"Dept;"
+
node
.
id
;
public
selectionChange
(
node
:
any
)
{
temp
.
srfparentdename
=
"SysOrganization"
;
// 获取右侧视图渲染数据需要的参数
temp
.
sysorganization
=
node
.
id
;
let
temp
=
JSON
.
parse
(
JSON
.
stringify
(
node
));
srfappctx
.
sysorganization
=
temp
.
sysorganization
;
let
srfappctx
:
any
=
{};
}
else
{
// 部门
if
(
node
.
disabled
==
true
)
{
temp
.
id
=
"Dept;"
+
node
.
id
;
// 单位
temp
.
srfparentdename
=
"SysDepartment"
;
temp
.
id
=
"Dept;"
+
node
.
id
;
temp
.
sysdepartment
=
node
.
id
;
temp
.
srfparentdename
=
"SysOrganization"
;
srfappctx
.
sysdepartment
=
temp
.
sysdepartment
;
temp
.
sysorganization
=
node
.
id
;
}
srfappctx
.
sysorganization
=
temp
.
sysorganization
;
temp
.
srfparentkey
=
node
.
id
;
}
else
{
temp
.
navparams
=
"{}"
;
// 部门
srfappctx
.
srfparentkey
=
temp
.
srfparentkey
;
temp
.
id
=
"Dept;"
+
node
.
id
;
srfappctx
.
srfparentdename
=
temp
.
srfparentdename
;
temp
.
srfparentdename
=
"SysDepartment"
;
temp
.
sysdepartment
=
node
.
id
;
temp
.
srfappctx
=
srfappctx
;
srfappctx
.
sysdepartment
=
temp
.
sysdepartment
;
// 抛出参数
let
selectiondata
:
any
=
[
temp
];
this
.
$emit
(
'selectionchange'
,
selectiondata
);
}
}
}
temp
.
srfparentkey
=
node
.
id
;
temp
.
navparams
=
"{}"
;
srfappctx
.
srfparentkey
=
temp
.
srfparentkey
;
srfappctx
.
srfparentdename
=
temp
.
srfparentdename
;
temp
.
srfappctx
=
srfappctx
;
// 抛出参数
let
selectiondata
:
any
=
[
temp
];
this
.
$emit
(
"selectionchange"
,
selectiondata
);
}
}
</
script
>
</
script
>
<
style
lang=
'less'
>
<
style
lang=
'less'
>
@import './dept-tree-treeview.less'
;
@import "./dept-tree-treeview.less"
;
</
style
>
</
style
>
\ No newline at end of file
app_Web/src/widgets/sys-organization/org-tree-treeview/org-tree-treeview.vue
浏览文件 @
4c9dbcca
<
template
>
<
template
>
<div
class=
"design-tree-container"
>
<div
class=
"design-tree-container"
>
<context-menu-container>
<context-menu-container>
<el-input
size=
"small"
placeholder=
"搜索..."
v-model=
"filerText"
@
input=
"filterChange"
>
<el-input
<i
slot=
"prefix"
class=
"el-input__icon el-icon-search"
></i>
size=
"small"
</el-input>
placeholder=
"搜索..."
<el-tree
v-model=
"filerText"
:filter-node-method=
"filterNode"
@
input=
"filterChange"
class=
"tre"
>
:data=
"this.TreeData"
<i
slot=
"prefix"
class=
"el-input__icon el-icon-search"
></i>
ref=
"OrgTree"
</el-input>
:show-checkbox=
"false"
<el-tree
node-key=
"id"
:filter-node-method=
"filterNode"
:default-expand-all=
"false"
class=
"tre"
highlight-current
:data=
"this.TreeData"
:default-expanded-keys=
"this.defaultExpandedKeys"
ref=
"OrgTree"
:props=
"this.defaultProps"
:show-checkbox=
"false"
@
node-click=
"handleNodeClick"
node-key=
"id"
>
:default-expand-all=
"false"
<span
class=
"custom-tree-node"
slot-scope=
"
{node, data}">
highlight-current
<i
v-if=
"node.isLeaf"
class=
"fa fa-building-o"
style=
"margin-right: 2px;"
></i>
:default-expanded-keys=
"this.defaultExpandedKeys"
<i
v-if=
"!node.isLeaf"
class=
"fa fa-building"
style=
"margin-right: 2px;"
></i>
:props=
"this.defaultProps"
<span>
{{
node
.
label
}}
</span>
@
node-click=
"handleNodeClick"
</span>
>
</el-tree>
<span
class=
"custom-tree-node"
slot-scope=
"
{ node, data }">
</context-menu-container>
<i
</div>
v-if=
"node.isLeaf"
class=
"fa fa-building-o"
style=
"margin-right: 2px"
></i>
<i
v-if=
"!node.isLeaf"
class=
"fa fa-building"
style=
"margin-right: 2px"
></i>
<span>
{{
node
.
label
}}
</span>
</span>
</el-tree>
</context-menu-container>
</div>
</
template
>
</
template
>
<
script
lang=
'tsx'
>
<
script
lang=
'tsx'
>
import
{
Component
,
Vue
}
from
'vue-property-decorator'
;
import
{
Component
,
Vue
}
from
"vue-property-decorator"
;
@
Component
({
@
Component
({
components
:
{}
components
:
{},
})
})
export
default
class
OrgTree
extends
Vue
{
export
default
class
OrgTree
extends
Vue
{
/**
// 过滤文本
* 过滤文本
public
filerText
:
any
=
''
;
*
/**
* @type {string}
* 过滤节点
* @memberof OrgTree
*/
*/
public
filterNode
(
value
:
any
,
data
:
any
){
public
filerText
:
string
=
""
;
if
(
!
value
)
return
true
;
return
data
.
label
.
indexOf
(
value
)
!==-
1
;
/**
}
* 过滤节点
/**
*
* 树搜索触发
* @param {string} value 过滤文本
*/
* @param {*} data 树数据
public
filterChange
(){
* @memberof OrgTree
const
OrgTree
:
any
=
this
.
$refs
.
OrgTree
;
*/
OrgTree
.
filter
(
this
.
filerText
);
public
filterNode
(
value
:
string
,
data
:
any
)
{
}
if
(
!
value
)
return
true
;
return
data
.
label
.
indexOf
(
value
)
!==
-
1
;
/*树数据*/
}
public
TreeData
:
any
=
[];
/**
/*树显示说明:子树为节点对象的children,节点标签为节点对象的label*/
* 树搜索触发
public
defaultProps
:
any
=
{
*
children
:
'children'
,
* @memberof OrgTree
label
:
'label'
*/
}
public
filterChange
()
{
const
OrgTree
:
any
=
this
.
$refs
.
OrgTree
;
/*默认展开节点*/
OrgTree
.
filter
(
this
.
filerText
);
public
defaultExpandedKeys
:
any
=
[];
}
/*当前登录人信息*/
/**
public
curUserContext
:
any
=
{};
* 树数据
*
* @type {Array<*>}
/**
* @memberof OrgTree
* vue 创建
*/
*/
public
TreeData
:
Array
<
any
>
=
[];
public
created
()
{
var
_this
:
any
=
this
;
/**
// 获取当前登录人信息
* 树显示说明:子树为节点对象的children,节点标签为节点对象的label
if
(
_this
&&
_this
.
$attrs
&&
_this
.
$attrs
.
context
)
{
*
_this
.
curUserContext
=
_this
.
$attrs
.
context
;
* @type {*}
}
* @memberof OrgTree
}
*/
public
defaultProps
:
any
=
{
/**
children
:
"children"
,
* vue 挂载
label
:
"label"
,
*/
};
public
mounted
()
{
this
.
initTree
();
/**
}
* 默认展开节点
*
* @type {Array<*>}
* @memberof OrgTree
*/
public
defaultExpandedKeys
:
Array
<
any
>
=
[];
/**
* 当前登录人信息
*
* @type {*}
* @memberof OrgTree
*/
public
curUserContext
:
any
=
{};
/**
* vue 创建
*
* @memberof OrgTree
*/
public
created
()
{
var
_this
:
any
=
this
;
// 获取当前登录人信息
if
(
_this
&&
_this
.
$attrs
&&
_this
.
$attrs
.
context
)
{
_this
.
curUserContext
=
_this
.
$attrs
.
context
;
}
}
/**
* vue 挂载
*
* @memberof OrgTree
*/
public
mounted
()
{
this
.
initTree
();
}
/**
* 初始化树
*
* @memberof OrgTree
*/
private
initTree
()
{
const
_this
=
this
;
// 获取当前登录人的身份
const
userStr
=
localStorage
.
getItem
(
"user"
);
let
user
:
any
=
{};
if
(
userStr
)
{
user
=
JSON
.
parse
(
userStr
);
}
// 获取当前登录人所处组织及其下级组织
let
url
:
string
=
""
;
if
(
user
.
superuser
==
1
)
{
// 获取所有组织
url
=
"sysorganizations/alls/suborg/picker"
;
}
else
{
if
(
_this
.
curUserContext
&&
_this
.
curUserContext
.
srforgid
)
{
url
=
"sysorganizations/"
+
_this
.
curUserContext
.
srforgid
+
"/suborg/picker"
;
}
else
{
this
.
$Notice
.
error
({
title
:
"错误"
,
desc
:
"当前登录人组织为空"
});
}
}
/**
this
.
$http
* 初始化树
.
get
(
url
)
*/
.
then
((
response
:
any
)
=>
{
private
initTree
()
{
if
(
!
response
||
response
.
status
!==
200
)
{
const
_this
=
this
;
this
.
$Notice
.
error
({
title
:
"错误"
,
desc
:
response
.
message
});
// 获取当前登录人的身份
return
;
const
userStr
=
localStorage
.
getItem
(
'user'
);
}
else
{
let
user
:
any
=
{};
// 给树赋值,数据结构在后台已经按照eltree格式化
if
(
userStr
)
{
_this
.
TreeData
=
response
.
data
;
user
=
JSON
.
parse
(
userStr
);
if
(
response
.
data
&&
response
.
data
.
length
>
0
)
{
}
// 设置默认选中第一个节点,即高亮显示
// 获取当前登录人所处组织及其下级组织
this
.
$nextTick
(
function
()
{
let
url
=
''
;
let
orgTree
:
any
=
this
.
$refs
.
OrgTree
;
if
(
user
.
superuser
==
1
)
{
orgTree
.
setCurrentKey
(
response
.
data
[
0
].
id
);
// 获取所有组织
url
=
'sysorganizations/alls/suborg/picker'
;
}
else
{
if
(
_this
.
curUserContext
&&
_this
.
curUserContext
.
srforgid
)
{
url
=
'sysorganizations/'
+
_this
.
curUserContext
.
srforgid
+
'/suborg/picker'
;
}
else
{
this
.
$Notice
.
error
({
title
:
'错误'
,
desc
:
'当前登录人组织为空'
});
}
}
this
.
$http
.
get
(
url
).
then
((
response
:
any
)
=>
{
if
(
!
response
||
response
.
status
!==
200
)
{
this
.
$Notice
.
error
({
title
:
'错误'
,
desc
:
response
.
message
});
return
;
}
else
{
// 给树赋值,数据结构在后台已经按照eltree格式化
_this
.
TreeData
=
response
.
data
;
if
(
response
.
data
&&
response
.
data
.
length
>
0
)
{
// 设置默认选中第一个节点,即高亮显示
this
.
$nextTick
(
function
(){
let
orgTree
:
any
=
this
.
$refs
.
OrgTree
;
orgTree
.
setCurrentKey
(
response
.
data
[
0
].
id
);
})
// 默认加载第一个节点的右侧视图,调用选中数据变更事件
_this
.
selectionChange
(
response
.
data
[
0
]);
}
}
}).
catch
((
e
:
any
)
=>
{
console
.
log
(
e
);
});
});
// 默认加载第一个节点的右侧视图,调用选中数据变更事件
_this
.
selectionChange
(
response
.
data
[
0
]);
}
}
}
})
.
catch
((
e
:
any
)
=>
{
/**
console
.
log
(
e
);
* 处理点击节点
});
*/
}
protected
handleNodeClick
()
{
// 获取当前树
/**
const
OrgTree
:
any
=
this
.
$refs
.
OrgTree
;
* 处理点击节点
// 获取点击状态的节点
*
let
node
=
OrgTree
.
getCurrentNode
();
* @memberof OrgTree
// console.log("选中的node:" + JSON.stringify(node));
*/
// if (node.isLeaf && node.isLeaf == true)
protected
handleNodeClick
()
{
// 选中数据变更事件
// 获取当前树
this
.
selectionChange
(
node
);
const
OrgTree
:
any
=
this
.
$refs
.
OrgTree
;
}
// 获取点击状态的节点
let
node
=
OrgTree
.
getCurrentNode
();
/**
// console.log("选中的node:" + JSON.stringify(node));
* 选中数据变更事件
*
// 选中数据变更事件
* @public
this
.
selectionChange
(
node
);
* @param {*} node 节点对应node对象
}
* @memberof OrgTree
*/
/**
public
selectionChange
(
node
:
any
)
{
* 选中数据变更事件
// 获取右侧视图渲染数据需要的参数
*
let
temp
=
JSON
.
parse
(
JSON
.
stringify
(
node
));
* @param {*} node 节点对应node对象
temp
.
id
=
"Org;"
+
node
.
id
;
* @memberof OrgTree
temp
.
srfparentdename
=
"SysOrganization"
;
*/
temp
.
srfparentkey
=
node
.
id
;
public
selectionChange
(
node
:
any
)
{
temp
.
navparams
=
"{}"
;
// 获取右侧视图渲染数据需要的参数
temp
.
sysorganization
=
node
.
id
;
let
temp
=
JSON
.
parse
(
JSON
.
stringify
(
node
));
let
srfappctx
:
any
=
{};
temp
.
id
=
"Org;"
+
node
.
id
;
srfappctx
.
srfparentkey
=
temp
.
srfparentkey
;
temp
.
srfparentdename
=
"SysOrganization"
;
srfappctx
.
srfparentdename
=
temp
.
srfparentdename
;
temp
.
srfparentkey
=
node
.
id
;
srfappctx
.
sysorganization
=
temp
.
sysorganization
;
temp
.
navparams
=
"{}"
;
temp
.
srfappctx
=
srfappctx
;
temp
.
sysorganization
=
node
.
id
;
// 抛出参数
let
srfappctx
:
any
=
{};
let
selectiondata
:
any
=
[
temp
];
srfappctx
.
srfparentkey
=
temp
.
srfparentkey
;
this
.
$emit
(
'selectionchange'
,
selectiondata
);
srfappctx
.
srfparentdename
=
temp
.
srfparentdename
;
}
srfappctx
.
sysorganization
=
temp
.
sysorganization
;
temp
.
srfappctx
=
srfappctx
;
}
// 抛出参数
let
selectiondata
:
any
=
[
temp
];
this
.
$emit
(
"selectionchange"
,
selectiondata
);
}
}
</
script
>
</
script
>
<
style
lang=
'less'
>
<
style
lang=
'less'
>
@import './org-tree-treeview.less'
;
@import "./org-tree-treeview.less"
;
</
style
>
</
style
>
\ No newline at end of file
编辑
预览
Markdown
格式
0%
请重试
or
添加新附件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
先完成此消息的编辑!
取消
想要评论请
注册
或
登录