Skip to content

I
ibzrt
提交 4c9dbcca 编写于 作者: lzlhxj's avatar lzlhxj
浏览文件
操作

统一代码注释

上级 835b2d2f
显示空白字符变更
内嵌 并排
正在显示 包含 1573 行增加 和 1131 行删除
app_Web/src/components/app-message-popover/app-message-popover.vue
浏览文件 @ 4c9dbcca
...@@ -6,28 +6,69 @@ ...@@ -6,28 +6,69 @@
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"> <el-tab-pane
<template v-for="(myTask,index) in myTasks"> :label="
myTasks.length == 0
? myTasksLabel
: myTasksLabel + '(' + myTasks.length + ')'
"
name="first"
style="height: 300px; overflow: auto"
:draggable="false"
>
<template v-for="(myTask, index) in myTasks">
<template v-if="index < taskShowCnt"> <template v-if="index < taskShowCnt">
<el-row class="Row" :key="index" :draggable="false"> <el-row class="Row" :key="index" :draggable="false">
<el-col :span="3" class="column1" :draggable="false"> <el-col :span="3" class="column1" :draggable="false">
<el-avatar icon="el-icon-s-check" size="small" :draggable="false" style="color: white;background-color: #409eff;"></el-avatar> <el-avatar
icon="el-icon-s-check"
size="small"
:draggable="false"
style="color: white; background-color: #409eff"
></el-avatar>
</el-col> </el-col>
<el-col :span="21" class="column2" :draggable="false"> <el-col :span="21" class="column2" :draggable="false">
<el-row :draggable="false"> <el-row :draggable="false">
<el-col :span="16" :draggable="false" style="width: 65%;"> <el-col :span="16" :draggable="false" style="width: 65%">
<div class="process-definition-name" :draggable="false"><strong>{{myTask.processDefinitionName}}</strong></div> <div class="process-definition-name" :draggable="false">
<div class="description" :draggable="false">{{myTask.description}}</div> <strong>{{ myTask.processDefinitionName }}</strong>
<div class="createtime" :draggable="false">{{ formatDate(myTask.createTime, 'MM-DD hh:mm') }}</div> </div>
<div class="description" :draggable="false">
{{ myTask.description }}
</div>
<div class="createtime" :draggable="false">
{{ formatDate(myTask.createTime, "MM-DD hh:mm") }}
</div>
</el-col> </el-col>
<el-col :span="5" :draggable="false" style='display: flex; align-items: center'> <el-col
<el-tag :type="myTask.name.indexOf('驳回')!=-1?'danger':(myTask.name.indexOf('成功')!=-1?'success':(myTask.name.indexOf('取消')!=-1?'info':'-'))" :span="5"
size="small" @click="handleTag(myTask)" :draggable="false"
style="cursor: pointer;overflow: hidden;text-overflow: ellipsis;" :draggable="false"> style="display: flex; align-items: center"
{{myTask.name}} >
<el-tag
:type="
myTask.name.indexOf('驳回') != -1
? 'danger'
: myTask.name.indexOf('成功') != -1
? 'success'
: myTask.name.indexOf('取消') != -1
? 'info'
: '-'
"
size="small"
@click="handleTag(myTask)"
style="
cursor: pointer;
overflow: hidden;
text-overflow: ellipsis;
"
:draggable="false"
>
{{ myTask.name }}
</el-tag> </el-tag>
</el-col> </el-col>
</el-row> </el-row>
...@@ -36,32 +77,76 @@ ...@@ -36,32 +77,76 @@
</template> </template>
</template> </template>
<template> <template>
<div class='show-more' @click="showMore('taskShowCnt')"> <div class="show-more" @click="showMore('taskShowCnt')">
<label v-if="taskShowCnt < myTasks.length ">{{ this.$t('components.appMessagePopover.loadMore') }}</label> <label v-if="taskShowCnt < myTasks.length">{{
<label v-else>{{ this.$t('components.appMessagePopover.noMore') }}</label> this.$t("components.appMessagePopover.loadMore")
}}</label>
<label v-else>{{
this.$t("components.appMessagePopover.noMore")
}}</label>
</div> </div>
</template> </template>
</el-tab-pane> </el-tab-pane>
<!-- 消息 --> <!-- 消息 -->
<el-tab-pane :label="myMsgs.length==0?myMsgsLabel:(myMsgsLabel+'('+myMsgs.length+')')" name="second" :style="{height: '300px',overflow: 'auto'}" :draggable="false"> <el-tab-pane
<template v-for="(myMsg,index) in myMsgs"> :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"> <template v-if="index < msgShowCnt">
<el-row class="Row" :key="index" :draggable="false"> <el-row class="Row" :key="index" :draggable="false">
<el-col :span="3" class="column1" :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-avatar
icon="el-icon-chat-dot-square"
size="small"
:draggable="false"
style="color: white; background-color: orange"
></el-avatar>
</el-col> </el-col>
<el-col :span="21" class="column2" :draggable="false"> <el-col :span="21" class="column2" :draggable="false">
<el-row :draggable="false"> <el-row :draggable="false">
<el-col :span="16" :draggable="false" style="width: 65%;"> <el-col :span="16" :draggable="false" style="width: 65%">
<div class="process-definition-name" :draggable="false"><strong>{{myMsg.processDefinitionName}}</strong></div> <div class="process-definition-name" :draggable="false">
<div class="description" :draggable="false">{{myMsg.description}}</div> <strong>{{ myMsg.processDefinitionName }}</strong>
<div class="createtime" :draggable="false">{{ formatDate(myMsg.createTime, 'MM-DD hh:mm') }}</div> </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>
<el-col :span="5" :draggable="false" style='display: flex; align-items: center'> <el-col
<el-tag :type="myMsg.name.indexOf('驳回')!=-1?'danger':(myMsg.name.indexOf('成功')!=-1?'success':(myMsg.name.indexOf('取消')!=-1?'info':'-'))" :span="5"
size="small" @click="handleTag(myMsg)" :draggable="false"
style="cursor: pointer;overflow: hidden;text-overflow: ellipsis;" :draggable="false"> style="display: flex; align-items: center"
{{myMsg.name}} >
<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-tag>
</el-col> </el-col>
</el-row> </el-row>
...@@ -70,62 +155,115 @@ ...@@ -70,62 +155,115 @@
</template> </template>
</template> </template>
<template> <template>
<div class='show-more' @click="showMore('msgShowCnt')"> <div class="show-more" @click="showMore('msgShowCnt')">
<label v-if="msgShowCnt < myTasks.length ">{{ this.$t('components.appMessagePopover.loadMore') }}</label> <label v-if="msgShowCnt < myTasks.length">{{
<label v-else>{{ this.$t('components.appMessagePopover.noMore') }}</label> this.$t("components.appMessagePopover.loadMore")
}}</label>
<label v-else>{{
this.$t("components.appMessagePopover.noMore")
}}</label>
</div> </div>
</template> </template>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
<i id="bellBtn" size="20" slot="reference" class='el-icon-bell'></i> <i id="bellBtn" size="20" slot="reference" class="el-icon-bell"></i>
</el-popover> </el-popover>
</el-badge> </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({}) @Component({})
export default class AppMessagePopover extends Vue { export default class AppMessagePopover extends Vue {
/**
// 是否显示小圆点 * 是否显示小圆点
public showIsDot: any = false; *
// 默认显示的tab页 * @type {boolean}
public default_tab_pane: any = "first"; * @memberof AppMessagePopover
// 待办列表 */
public myTasks: any = []; public showIsDot: boolean = false;
// 待办面板标签
public myTasksLabel: any = "待办"; /**
// 待办面板显示条数 * 默认显示的tab页
public taskShowCnt:number = 0; *
// 消息列表 * @type {string}
public myMsgs: any = []; * @memberof AppMessagePopover
// 消息面板标签 */
public myMsgsLabel: any = "消息"; public default_tab_pane: string = "first";
// 信息面板显示条数
public msgShowCnt:number = 0; /**
* 待办列表
*
* @type {Array<*>}
* @memberof AppMessagePopover
*/
public myTasks: Array<any> = [];
/**
* 待办面板标签
*
* @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创建 * vue创建
*
* @memberof AppMessagePopover
*/ */
created(): void {} created(): void {}
/** /**
* vue挂载 * vue挂载
*
* @memberof AppMessagePopover
*/ */
mounted(): void { mounted(): void {
// 首次获取待办列表 // 首次获取待办列表
this.getMyTasks(); this.getMyTasks();
// 定时器:每隔１分钟重新获取待办列表 // 定时器:每隔１分钟重新获取待办列表
const timer = setInterval(()=>{ const timer = setInterval(() => {
this.getMyTasks(); this.getMyTasks();
},60000); }, 60000);
// 监听定时器,在vue销毁前清除定时器 // 监听定时器,在vue销毁前清除定时器
this.$once('hook:beforeDestroy',()=>{ this.$once("hook:beforeDestroy", () => {
// 清除定时器 // 清除定时器
clearInterval(timer); clearInterval(timer);
}); });
...@@ -133,10 +271,14 @@ ...@@ -133,10 +271,14 @@
/** /**
* 获取待办列表 * 获取待办列表
*
* @memberof AppMessagePopover
*/ */
public getMyTasks() { public getMyTasks() {
let url: any = '/wfcore/mytasks'; let url: any = "/wfcore/mytasks";
this.$http.get(url).then((response: any) => { this.$http
.get(url)
.then((response: any) => {
if (response && response.status == 200) { if (response && response.status == 200) {
const data: any = response.data; const data: any = response.data;
if (data && data.length > 0) { if (data && data.length > 0) {
...@@ -148,15 +290,18 @@ ...@@ -148,15 +290,18 @@
// 获取消息列表 // 获取消息列表
this.getMyMsgs(); this.getMyMsgs();
} }
}).catch((error: any) => {
console.warn("加载数据错误");
}) })
.catch((error: any) => {
console.warn("加载数据错误");
});
} }
/** /**
* 获取消息列表 * 获取消息列表
*
* @memberof AppMessagePopover
*/ */
public getMyMsgs(){ public getMyMsgs() {
// TODO:接口获取消息列表，这里用的待办数据 // TODO:接口获取消息列表，这里用的待办数据
this.myMsgs = this.myTasks; this.myMsgs = this.myTasks;
if (this.myMsgs.length > 0 && this.myTasks.length == 0) { if (this.myMsgs.length > 0 && this.myTasks.length == 0) {
...@@ -167,18 +312,24 @@ ...@@ -167,18 +312,24 @@
/** /**
* 点击标签事件 * 点击标签事件
*
* @memberof AppMessagePopover
*/ */
public handleTag(data: any) { public handleTag(data: any) {
if (!data) return this.$message.error("未获取到标签内容"); if (!data) return this.$message.error("未获取到标签内容");
// 拼接要打开的窗口地址 // 拼接要打开的窗口地址
const baseUrl:any = Environment.BaseUrl; const baseUrl: any = Environment.BaseUrl;
const openUrl:any = baseUrl + `/wfcore/mytasks/${data.processDefinitionKey}/web/${data.processInstanceBusinessKey}/usertasks/${data.taskDefinitionKey}`; const openUrl: any =
baseUrl +
`/wfcore/mytasks/${data.processDefinitionKey}/web/${data.processInstanceBusinessKey}/usertasks/${data.taskDefinitionKey}`;
// 打开新窗口 // 打开新窗口
window.open(openUrl,'_blank'); window.open(openUrl, "_blank");
} }
/** /**
* 销毁之前 * vue销毁之前
*
* @memberof AppMessagePopover
*/ */
beforeDestroy(): void { beforeDestroy(): void {
// 清空数据 // 清空数据
...@@ -189,9 +340,11 @@ ...@@ -189,9 +340,11 @@
/** /**
* 时间格式转换 * 时间格式转换
*
* @memberof AppMessagePopover
*/ */
public formatDate(date: string, format: string) { public formatDate(date: string, format: string) {
if(date && format) { if (date && format) {
return moment(date).format(format); return moment(date).format(format);
} }
return date; return date;
...@@ -199,27 +352,34 @@ ...@@ -199,27 +352,34 @@
/** /**
* 加载更多 * 加载更多
*
* @memberof AppMessagePopover
*/ */
public showMore(cnt: string) { public showMore(cnt: string) {
if(Object.is('taskShowCnt', cnt)) { if (Object.is("taskShowCnt", cnt)) {
this.taskShowCnt + 10 < this.myTasks.length ? this.taskShowCnt += 10 : this.taskShowCnt += this.myTasks.length-this.taskShowCnt; this.taskShowCnt + 10 < this.myTasks.length
? (this.taskShowCnt += 10)
: (this.taskShowCnt += this.myTasks.length - this.taskShowCnt);
} }
if(Object.is('msgShowCnt', cnt)) { if (Object.is("msgShowCnt", cnt)) {
this.msgShowCnt + 10 < this.myMsgs.length ? this.msgShowCnt += 10 : this.msgShowCnt += this.myMsgs.length-this.msgShowCnt; this.msgShowCnt + 10 < this.myMsgs.length
? (this.msgShowCnt += 10)
: (this.msgShowCnt += this.myMsgs.length - this.msgShowCnt);
} }
} }
/** /**
* 弹出框 显示/隐藏 时显示条数初始化 * 弹出框 显示/隐藏 时显示条数初始化
*
* @memberof AppMessagePopover
*/ */
public initTabCnt() { public initTabCnt() {
this.taskShowCnt = this.myTasks.length >= 10 ? 10 : this.myTasks.length; this.taskShowCnt = this.myTasks.length >= 10 ? 10 : this.myTasks.length;
this.msgShowCnt = this.myMsgs.length >= 10 ? 10 : this.myMsgs.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"
>
<card
class="view-card view-no-caption view-no-toolbar"
:dis-hover="true"
:padding="0"
:bordered="false"
>
<div class="content-container pickup-view"> <div class="content-container pickup-view">
<div class="translate-contant"> <div class="translate-contant">
<!--应用菜单--> <!--应用菜单-->
<div class="center" :style="{width : '33%',border:'1px solid #dcdee2', margin: '0 16px 0 0'}"> <div
<context-menu-container class='design-tree-container'> class="center"
:style="{
width: '33%',
border: '1px solid #dcdee2',
margin: '0 16px 0 0',
}"
>
<context-menu-container class="design-tree-container">
<div> <div>
<div style="margin: 20px 20px 0 20px;"> <div style="margin: 20px 20px 0 20px">
<el-input size="small" placeholder="搜索应用菜单..." v-model="CDtreefilterText" @input="filterChangeCDtree"> <el-input
size="small"
placeholder="搜索应用菜单..."
v-model="CDtreefilterText"
@input="filterChangeCDtree"
>
<i slot="prefix" class="el-input__icon el-icon-search"></i> <i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input> </el-input>
</div> </div>
...@@ -32,11 +51,23 @@ ...@@ -32,11 +51,23 @@
</context-menu-container> </context-menu-container>
</div> </div>
<!--数据能力--> <!--数据能力-->
<div class="center" :style="{width : '33%',border:'1px solid #dcdee2', margin: '0 16px 0 0' }"> <div
<context-menu-container class='design-tree-container'> class="center"
:style="{
width: '33%',
border: '1px solid #dcdee2',
margin: '0 16px 0 0',
}"
>
<context-menu-container class="design-tree-container">
<div> <div>
<div style="margin: 20px 20px 0 20px;"> <div style="margin: 20px 20px 0 20px">
<el-input size="small" placeholder="搜索数据能力..." v-model="QXtreefilterText" @input="filterChangeQXtree"> <el-input
size="small"
placeholder="搜索数据能力..."
v-model="QXtreefilterText"
@input="filterChangeQXtree"
>
<i slot="prefix" class="el-input__icon el-icon-search"></i> <i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input> </el-input>
</div> </div>
...@@ -60,11 +91,19 @@ ...@@ -60,11 +91,19 @@
</context-menu-container> </context-menu-container>
</div> </div>
<!--自定义资源--> <!--自定义资源-->
<div class="center" :style="{width : '33%',border:'1px solid #dcdee2' }"> <div
<context-menu-container class='design-tree-container'> class="center"
:style="{ width: '33%', border: '1px solid #dcdee2' }"
>
<context-menu-container class="design-tree-container">
<div> <div>
<div style="margin: 20px 20px 0 20px;"> <div style="margin: 20px 20px 0 20px">
<el-input size="small" placeholder="搜索自定义资源..." v-model="ZYtreefilterText" @input="filterChangeZYtree"> <el-input
size="small"
placeholder="搜索自定义资源..."
v-model="ZYtreefilterText"
@input="filterChangeZYtree"
>
<i slot="prefix" class="el-input__icon el-icon-search"></i> <i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input> </el-input>
</div> </div>
...@@ -88,112 +127,202 @@ ...@@ -88,112 +127,202 @@
</context-menu-container> </context-menu-container>
</div> </div>
</div> </div>
</div> </div>
</card> </card>
</div> </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', {fullPath: to.fullPath, viewtag: vm.viewtag}); vm.$store.commit("addCurPageViewtag", {
fullPath: to.fullPath,
viewtag: vm.viewtag,
});
}); });
}, },
}) })
export default class SYS_ROLE_PERMISSIONCustomView extends Vue { export default class SYS_ROLE_PERMISSIONCustomView extends Vue {
/**
* 应用菜单树搜索文本
*
* @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
public CDtreefilterText: string = "";
/**
* 数据能力树搜索文本
*
* @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
public QXtreefilterText: string = "";
// 应用菜单树搜索文本 /**
public CDtreefilterText:any = ''; * 自定义资源树搜索文本
// 数据能力树搜索文本 *
public QXtreefilterText:any = ''; * @type {string}
// 自定义资源树搜索文本 * @memberof SYS_ROLE_PERMISSIONCustomView
public ZYtreefilterText:any = ''; */
public ZYtreefilterText: string = "";
/** /**
* 过滤节点 * 过滤节点
*
* @param {value={string}}
* @param {data={*}}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public fiterNode(value:any,data:any){ public fiterNode(value: string, data: any) {
if (!value) return true; if (!value) return true;
return data.label.indexOf(value) !==-1; return data.label.indexOf(value) !== -1;
} }
/** /**
*　应用菜单树搜索触发 * 应用菜单树搜索触发
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public filterChangeCDtree(){ public filterChangeCDtree() {
const CDtree:any = this.$refs.CDtree; const CDtree: any = this.$refs.CDtree;
CDtree.filter(this.CDtreefilterText); CDtree.filter(this.CDtreefilterText);
} }
/** /**
*　数据能力树搜索触发 * 数据能力树搜索触发
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public filterChangeQXtree(){ public filterChangeQXtree() {
const QXtree:any = this.$refs.QXtree; const QXtree: any = this.$refs.QXtree;
QXtree.filter(this.QXtreefilterText); QXtree.filter(this.QXtreefilterText);
} }
/** /**
*　自定义资源树搜索触发 * 自定义资源树搜素触发
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public filterChangeZYtree(){ public filterChangeZYtree() {
const ZYtree:any = this.$refs.ZYtree; const ZYtree: any = this.$refs.ZYtree;
ZYtree.filter(this.ZYtreefilterText); ZYtree.filter(this.ZYtreefilterText);
} }
/**
* 应用菜单数据
*
* @type {Array<*>}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
protected CDdata: Array<any> = [];
/*应用菜单数据*/ /**
protected CDdata: any = []; * 数据能力数据
/*数据能力数据*/ *
protected QXdata: any = []; * @type {Array<*>}
/*自定义资源数据*/ * @memberof SYS_ROLE_PERMISSIONCustomView
protected ZYdata: any = []; */
/*默认选中节点*/ protected QXdata: Array<any> = [];
protected defaultCheckedNodes: any = [];
/*应用菜单数据默认展开节点*/ /**
protected CDdataexpandedKeys: any = []; * 自定义资源数据
/*数据能力数据默认展开节点*/ *
protected QXdataexpandedKeys: any = []; * @type {Array<*>}
/*自定义资源数据默认展开节点*/ * @memberof SYS_ROLE_PERMISSIONCustomView
protected ZYdataexpandedKeys: any = []; */
protected ZYdata: Array<any> = [];
/**
* 默认选中节点
*
* @type {Array<*>}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
protected defaultCheckedNodes: Array<any> = [];
/**
* 应用菜单数据默认展开节点
*
* @type {Array<*>}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
protected CDdataexpandedKeys: Array<any> = [];
/**
* 数据能力数据默认展开节点
*
* @type {Array<*>}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
protected QXdataexpandedKeys: Array<any> = [];
/**
* 自定义资源数据默认展开节点
*
* @type {Array<*>}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/
protected ZYdataexpandedKeys: Array<any> = [];
/** /**
* 树显示说明：子树为节点对象的children,节点标签为节点对象的label * 树显示说明：子树为节点对象的children,节点标签为节点对象的label
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
protected defaultProps: any = { protected defaultProps: any = {
children: 'children', children: "children",
label: 'label' label: "label",
} };
/** /**
* 选中数据 * 选中数据
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
protected selectData: any = {}; protected selectData: any = {};
/** /**
* 初始选中的数据 * 初始选中的数据
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
protected ininselectData: any = {}; protected ininselectData: any = {};
/** /**
* 视图选中数据 * 视图选中数据
*
* @type {Array<*>}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public viewSelections: any[] = []; public viewSelections: any[] = [];
/** /**
* 父数据 * 父数据
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
protected parentData: any = {}; protected parentData: any = {};
/** /**
* 父数据主键 * 父数据主键
*
* @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
protected srfparentkey: any; protected srfparentkey: any;
...@@ -201,23 +330,23 @@ ...@@ -201,23 +330,23 @@
* 视图标识 * 视图标识
* *
* @type {string} * @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public viewtag: string = 'e791be173ed0f4bbe9cce942b6edde63'; public viewtag: string = "e791be173ed0f4bbe9cce942b6edde63";
/** /**
* 是否嵌入关系界面 * 是否嵌入关系界面
* *
* @type {boolean} * @type {boolean}
* @memberof SYS_USER_ROLEGridViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
@Prop({default:false}) public isformDruipart?: boolean; @Prop({ default: false }) public isformDruipart?: boolean;
/** /**
* 界面关系通讯对象 * 界面关系通讯对象
* *
* @type {Subject<ViewState>} * @type {Subject<ViewState>}
* @memberof SYS_USER_ROLEGridViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
@Prop() public formDruipart?: Subject<ViewState>; @Prop() public formDruipart?: Subject<ViewState>;
...@@ -225,23 +354,23 @@ ...@@ -225,23 +354,23 @@
* 应用上下文 * 应用上下文
* *
* @type {*} * @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public context:any = {}; public context: any = {};
/** /**
* 视图参数 * 视图参数
* *
* @type {*} * @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public viewparams:any = {}; public viewparams: any = {};
/** /**
* 传入视图上下文 * 传入视图上下文
* *
* @type {string} * @type {string}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
@Prop() public viewdata!: string; @Prop() public viewdata!: string;
...@@ -249,7 +378,7 @@ ...@@ -249,7 +378,7 @@
* 视图默认使用 * 视图默认使用
* *
* @type {boolean} * @type {boolean}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
@Prop({ default: true }) public viewDefaultUsage!: boolean; @Prop({ default: true }) public viewDefaultUsage!: boolean;
...@@ -257,39 +386,47 @@ ...@@ -257,39 +386,47 @@
* 自定义视图导航上下文集合 * 自定义视图导航上下文集合
* *
* @type {*} * @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public customViewNavContexts:any ={}; public customViewNavContexts: any = {};
/** /**
* 自定义视图导航参数集合 * 自定义视图导航参数集合
* *
* @type {*} * @type {*}
* @memberof SYS_ROLE_PERMISSIONCustomViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public customViewParams:any ={}; public customViewParams: any = {};
/** /**
* 解析视图参数 * 解析视图参数
* *
* @public * @public
* @memberof SYS_ROLE_PERMISSIONCustomViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public parseViewParam(): void { public parseViewParam(): void {
for(let key in this.context){ for (let key in this.context) {
delete this.context[key]; delete this.context[key];
} }
if (!this.viewDefaultUsage && this.viewdata && !Object.is(this.viewdata, '')) { if (
!this.viewDefaultUsage &&
this.viewdata &&
!Object.is(this.viewdata, "")
) {
Object.assign(this.context, JSON.parse(this.viewdata)); Object.assign(this.context, JSON.parse(this.viewdata));
if(this.context && this.context.srfparentdename){ if (this.context && this.context.srfparentdename) {
Object.assign(this.viewparams,{srfparentdename:this.context.srfparentdename}); Object.assign(this.viewparams, {
srfparentdename: this.context.srfparentdename,
});
} }
if(this.context && this.context.srfparentkey){ if (this.context && this.context.srfparentkey) {
Object.assign(this.viewparams,{srfparentkey:this.context.srfparentkey}); Object.assign(this.viewparams, {
srfparentkey: this.context.srfparentkey,
});
} }
this.handleCustomViewData(); this.handleCustomViewData();
return; return;
} }
const path = (this.$route.matched[this.$route.matched.length - 1]).path; const path = this.$route.matched[this.$route.matched.length - 1].path;
const keys: Array<any> = []; const keys: Array<any> = [];
const curReg = this.$pathToRegExp.pathToRegexp(path, keys); const curReg = this.$pathToRegExp.pathToRegexp(path, keys);
const matchArray = curReg.exec(this.$route.path); const matchArray = curReg.exec(this.$route.path);
...@@ -297,88 +434,99 @@ ...@@ -297,88 +434,99 @@
keys.forEach((item: any, index: number) => { keys.forEach((item: any, index: number) => {
Object.defineProperty(tempValue, item.name, { Object.defineProperty(tempValue, item.name, {
enumerable: true, enumerable: true,
value: matchArray[index + 1] value: matchArray[index + 1],
}); });
}); });
this.$viewTool.formatRouteParams(tempValue,this.$route,this.context,this.viewparams); this.$viewTool.formatRouteParams(
if(this.$store.getters.getAppData() && this.$store.getters.getAppData().context){ tempValue,
Object.assign(this.context,this.$store.getters.getAppData().context); this.$route,
this.context,
this.viewparams
);
if (
this.$store.getters.getAppData() &&
this.$store.getters.getAppData().context
) {
Object.assign(this.context, this.$store.getters.getAppData().context);
} }
//初始化视图唯一标识 //初始化视图唯一标识
Object.assign(this.context,{srfsessionid:this.$util.createUUID()}); Object.assign(this.context, { srfsessionid: this.$util.createUUID() });
this.handleCustomViewData(); this.handleCustomViewData();
} }
/** /**
* 处理自定义视图数据 * 处理自定义视图数据
* *
* @memberof SYS_ROLE_PERMISSIONCustomViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public handleCustomViewData(){ public handleCustomViewData() {
if(Object.keys(this.customViewNavContexts).length > 0){ if (Object.keys(this.customViewNavContexts).length > 0) {
Object.keys(this.customViewNavContexts).forEach((item:any) =>{ Object.keys(this.customViewNavContexts).forEach((item: any) => {
let tempContext:any = {}; let tempContext: any = {};
let curNavContext:any = this.customViewNavContexts[item]; let curNavContext: any = this.customViewNavContexts[item];
this.handleCustomDataLogic(curNavContext,tempContext,item); this.handleCustomDataLogic(curNavContext, tempContext, item);
Object.assign(this.context,tempContext); Object.assign(this.context, tempContext);
}) });
} }
if(Object.keys(this.customViewParams).length > 0){ if (Object.keys(this.customViewParams).length > 0) {
Object.keys(this.customViewParams).forEach((item:any) =>{ Object.keys(this.customViewParams).forEach((item: any) => {
let tempParam:any = {}; let tempParam: any = {};
let curNavParam:any = this.customViewParams[item]; let curNavParam: any = this.customViewParams[item];
this.handleCustomDataLogic(curNavParam,tempParam,item); this.handleCustomDataLogic(curNavParam, tempParam, item);
Object.assign(this.viewparams,tempParam); Object.assign(this.viewparams, tempParam);
}) });
} }
} }
/** /**
* 处理自定义视图数据逻辑 * 处理自定义视图数据逻辑
* *
* @memberof SYS_ROLE_PERMISSIONCustomViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public handleCustomDataLogic(curNavData:any,tempData:any,item:string){ public handleCustomDataLogic(curNavData: any, tempData: any, item: string) {
// 直接值直接赋值 // 直接值直接赋值
if(curNavData.isRawValue){ if (curNavData.isRawValue) {
if(Object.is(curNavData.value,"null") || Object.is(curNavData.value,"")){ if (
Object.is(curNavData.value, "null") ||
Object.is(curNavData.value, "")
) {
Object.defineProperty(tempData, item.toLowerCase(), { Object.defineProperty(tempData, item.toLowerCase(), {
value: null, value: null,
writable : true, writable: true,
enumerable : true, enumerable: true,
configurable : true configurable: true,
}); });
}else{ } else {
Object.defineProperty(tempData, item.toLowerCase(), { Object.defineProperty(tempData, item.toLowerCase(), {
value: curNavData.value, value: curNavData.value,
writable : true, writable: true,
enumerable : true, enumerable: true,
configurable : true configurable: true,
}); });
} }
}else{ } else {
// 先从导航上下文取数，没有再从导航参数（URL）取数，如果导航上下文和导航参数都没有则为null // 先从导航上下文取数，没有再从导航参数（URL）取数，如果导航上下文和导航参数都没有则为null
if(this.context[(curNavData.value).toLowerCase()]){ if (this.context[curNavData.value.toLowerCase()]) {
Object.defineProperty(tempData, item.toLowerCase(), { Object.defineProperty(tempData, item.toLowerCase(), {
value: this.context[(curNavData.value).toLowerCase()], value: this.context[curNavData.value.toLowerCase()],
writable : true, writable: true,
enumerable : true, enumerable: true,
configurable : true configurable: true,
}); });
}else{ } else {
if(this.viewparams[(curNavData.value).toLowerCase()]){ if (this.viewparams[curNavData.value.toLowerCase()]) {
Object.defineProperty(tempData, item.toLowerCase(), { Object.defineProperty(tempData, item.toLowerCase(), {
value: this.viewparams[(curNavData.value).toLowerCase()], value: this.viewparams[curNavData.value.toLowerCase()],
writable : true, writable: true,
enumerable : true, enumerable: true,
configurable : true configurable: true,
}); });
}else{ } else {
Object.defineProperty(tempData, item.toLowerCase(), { Object.defineProperty(tempData, item.toLowerCase(), {
value: null, value: null,
writable : true, writable: true,
enumerable : true, enumerable: true,
configurable : true configurable: true,
}); });
} }
} }
...@@ -387,6 +535,8 @@ ...@@ -387,6 +535,8 @@
/** /**
* vue 创建 * vue 创建
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public created() { public created() {
this.afterCreated(); this.afterCreated();
...@@ -395,28 +545,34 @@ ...@@ -395,28 +545,34 @@
/** /**
* 执行created后的逻辑 * 执行created后的逻辑
* *
* @memberof SYS_USER_ROLEGridViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public afterCreated(){ public afterCreated() {
const secondtag = this.$util.createUUID(); const secondtag = this.$util.createUUID();
this.$store.commit('viewaction/createdView', { viewtag: this.viewtag, secondtag: secondtag }); this.$store.commit("viewaction/createdView", {
viewtag: this.viewtag,
secondtag: secondtag,
});
this.viewtag = secondtag; this.viewtag = secondtag;
this.parseViewParam(); this.parseViewParam();
const _this: any = this; const _this: any = this;
// 获取父数据 // 获取父数据
if (_this && _this.viewdata) { if (_this && _this.viewdata) {
if (typeof _this.viewdata == "string") {
_this.parentData = JSON.parse(_this.viewdata); _this.parentData = JSON.parse(_this.viewdata);
} else {
_this.parentData = _this.viewdata;
}
} }
if (_this.parentData && _this.parentData.sysrole) { if (_this.parentData && _this.parentData.sysrole) {
// console.log("当前角色id：" + _this.parentData.sysrole); // console.log("当前角色id：" + _this.parentData.sysrole);
_this.srfparentkey = _this.parentData.sysrole; _this.srfparentkey = _this.parentData.sysrole;
} }
// 监听父页面 // 监听父页面
if(this.formDruipart){ if (this.formDruipart) {
this.formDruipart.subscribe((res:any) =>{ this.formDruipart.subscribe((res: any) => {
if(Object.is(res.action,'load')){ if (Object.is(res.action, "load")) {
// 如果是新建角色保存，需要从res中获取父数据主键 // 如果是新建角色保存，需要从res中获取父数据主键
if (res.data) { if (res.data) {
let parentData = res.data; let parentData = res.data;
...@@ -424,22 +580,22 @@ ...@@ -424,22 +580,22 @@
} }
// 父数据保存时调用当前视图的事件 // 父数据保存时调用当前视图的事件
if(this.selectData.length>0){ if (this.selectData.length > 0) {
// 选中了数据 // 选中了数据
this.onClickOk(); this.onClickOk();
}else{ } else {
// 没选中数据 // 没选中数据
this.onClear(); this.onClear();
} }
} }
}); });
} }
} }
/** /**
* vue 挂载 * vue 挂载
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public mounted() { public mounted() {
this.initTree(); this.initTree();
...@@ -447,14 +603,18 @@ ...@@ -447,14 +603,18 @@
/** /**
* 初始化树 * 初始化树
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
private initTree() { private initTree() {
const _this = this; const _this = this;
// get全部菜单和数据能力和自定义资源的请求路径 // get全部菜单和数据能力和自定义资源的请求路径
const url = `sysroles/`+_this.srfparentkey+`/sysrolepermissions/tree`; const url: string = `sysroles/${_this.srfparentkey}/sysrolepermissions/tree`;
this.$http.get(url).then((response: any) => { this.$http
.get(url)
.then((response: any) => {
if (!response || response.status !== 200) { if (!response || response.status !== 200) {
this.$Notice.error({title: '错误', desc: response.message}); this.$Notice.error({ title: "错误", desc: response.message });
return; return;
} else { } else {
// 给树赋值，数据结构在后台已经按照eltree格式化 // 给树赋值，数据结构在后台已经按照eltree格式化
...@@ -475,7 +635,7 @@ ...@@ -475,7 +635,7 @@
} }
// 设置默认选中节点，即当前角色所有权限 // 设置默认选中节点，即当前角色所有权限
this.$nextTick(()=>{ 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;
...@@ -485,61 +645,61 @@ ...@@ -485,61 +645,61 @@
ZYtree.setCheckedNodes(_this.defaultCheckedNodes); ZYtree.setCheckedNodes(_this.defaultCheckedNodes);
// 保存初始选中的节点数据，便于后续保存时比较 // 保存初始选中的节点数据，便于后续保存时比较
const arr = CDtree.getCheckedNodes().concat(QXtree.getCheckedNodes()).concat(ZYtree.getCheckedNodes()); const arr = CDtree.getCheckedNodes()
.concat(QXtree.getCheckedNodes())
.concat(ZYtree.getCheckedNodes());
this.ininselectData = arr; this.ininselectData = arr;
}); });
} }
}).catch((e) => { })
console.log(e); .catch((e: any) => {
console.error(typeof e == "string" ? e : JSON.stringify(e));
}); });
} }
/** /**
* 销毁之前 * vue销毁之前
* *
* @memberof SYS_ROLE_PERMISSIONCustomViewBase * @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
public beforeDestroy() { public beforeDestroy() {
// 清空选中数据 // 清空选中数据
this.selectData = {}; this.selectData = {};
// 清空视图选中数据 // 清空视图选中数据
this.viewSelections = []; this.viewSelections = [];
this.$store.commit('viewaction/removeView', this.viewtag); this.$store.commit("viewaction/removeView", this.viewtag);
} }
/** /**
* 处理选中节点 * 处理选中节点
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
protected handleCheckChange() { protected handleCheckChange() {
// console.log("SYS_PERMISSIONMPickupView执行了handleCheckChange")
// 获取当前三棵树 // 获取当前三棵树
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()); const arr = CDtree.getCheckedNodes()
.concat(QXtree.getCheckedNodes())
.concat(ZYtree.getCheckedNodes());
this.selectData = arr; this.selectData = arr;
// console.log("选中的node:" + JSON.stringify(this.selectData)); // console.log("选中的node:" + JSON.stringify(this.selectData));
} }
/** /**
* 容器模型 * 保存角色权限
*/ *
public containerModel: any = { * @memberof SYS_ROLE_PERMISSIONCustomView
view_okbtn: {name: 'okbtn', type: 'button', text: '确定', disabled: true},
};
/**
* 确定
*/ */
public onClickOk(): void { public onClickOk(): void {
// 处理选中的数据 // 处理选中的数据
if (this.selectData && this.selectData.length > 0) { if (this.selectData && this.selectData.length > 0) {
// 判断选中的数据和初始数据 // 判断选中的数据和初始数据
if (JSON.stringify(this.selectData) == JSON.stringify(this.ininselectData)) { if (
JSON.stringify(this.selectData) == JSON.stringify(this.ininselectData)
) {
return; return;
} }
this.selectData.forEach((item: any) => { this.selectData.forEach((item: any) => {
...@@ -549,20 +709,25 @@ ...@@ -549,20 +709,25 @@
_item.permissionid = _itemTemp.id; _item.permissionid = _itemTemp.id;
_item.permissiontype = _itemTemp.type; _item.permissiontype = _itemTemp.type;
_item.permissionname = _itemTemp.fullName; _item.permissionname = _itemTemp.fullName;
Object.assign(_item, {_select: false}) Object.assign(_item, { _select: false });
this.viewSelections.push(_item); this.viewSelections.push(_item);
} }
}); });
// 保存选中的权限信息 // 保存选中的权限信息
let url = '/sysroles/'+this.srfparentkey+'/sysrolepermissions/refreshbatch'; let url: string = `/sysroles/${this.srfparentkey}/sysrolepermissions/refreshbatch`;
this.$http.post(url,this.viewSelections).then((response: any) => { this.$http
.post(url, this.viewSelections)
.then((response: any) => {
if (!(!response || response.status !== 200)) { if (!(!response || response.status !== 200)) {
} else { this.$Notice.error({ title: "错误", desc: response.message });
this.$Notice.error({title: '错误', desc: response.message});
return; return;
} }
}).catch((e) => { })
.catch((e: any) => {
console.error(
"保存角色权限失败：" + typeof e == "string" ? e : JSON.stringify(e)
);
}); });
} }
// 清空视图选中数据，避免重复添加 // 清空视图选中数据，避免重复添加
...@@ -570,28 +735,34 @@ ...@@ -570,28 +735,34 @@
} }
/** /**
* 清除 * 清除角色权限
*
* @memberof SYS_ROLE_PERMISSIONCustomView
*/ */
private onClear(){ private onClear() {
// 未选中数据,即没有赋予任何权限，需要清除当前角色的所有权限 // 未选中数据,即没有赋予任何权限，需要清除当前角色的所有权限
if (this.selectData.length==0) { if (this.selectData.length == 0) {
// 保存选中的权限信息 // 保存选中的权限信息
let url = '/sysroles/'+this.srfparentkey+'/sysrolepermissions/refreshbatch'; let url: string = `/sysroles/${this.srfparentkey}/sysrolepermissions/refreshbatch`;
this.$http.post(url,[]).then((response: any) => { this.$http
.post(url, [])
.then((response: any) => {
if (!(!response || response.status !== 200)) { if (!(!response || response.status !== 200)) {
} else { this.$Notice.error({ title: "错误", desc: response.message });
this.$Notice.error({title: '错误', desc: response.message});
return; return;
} }
}).catch((e) => { })
.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
size="small"
placeholder="搜索..."
v-model="filerText"
@input="filterChange"
>
<i slot="prefix" class="el-input__icon el-icon-search"></i> <i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input> </el-input>
<el-tree <el-tree
...@@ -17,10 +22,18 @@ ...@@ -17,10 +22,18 @@
:props="this.defaultProps" :props="this.defaultProps"
@node-click="handleNodeClick" @node-click="handleNodeClick"
> >
<span class="custom-tree-node" slot-scope="{node, data}"> <span class="custom-tree-node" slot-scope="{ node, data }">
<i v-if="node.isLeaf" class="fa fa-building-o" style="margin-right: 2px;"></i> <i
<i v-if="!node.isLeaf" class="fa fa-building" style="margin-right: 2px;"></i> v-if="node.isLeaf"
<span>{{node.label}}</span> 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> </span>
</el-tree> </el-tree>
</context-menu-container> </context-menu-container>
...@@ -28,48 +41,80 @@ ...@@ -28,48 +41,80 @@
</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 {
/**
* 过滤文本
*
* @type {string}
* @memberof DeptTree
*/
public filerText: string = "";
//　过滤文本
public filerText: any = '';
/** /**
* 过滤节点 * 过滤节点
*
* @param {string} value 过滤文本
* @param {*} data 树数据
* @memberof DeptTree
*/ */
public filterNode(value:any,data:any){ public filterNode(value: string, data: any) {
if (!value) return true; if (!value) return true;
return data.label.indexOf(value) !==-1; return data.label.indexOf(value) !== -1;
} }
/** /**
*　树搜索触发 * 树搜索触发
*
* @memberof DeptTree
*/ */
public filterChange(){ public filterChange() {
const DeptTree:any = this.$refs.DeptTree; const DeptTree: any = this.$refs.DeptTree;
DeptTree.filter(this.filerText); DeptTree.filter(this.filerText);
} }
/*树数据*/ /**
public TreeData: any = []; * 树数据
*
* @type {Array<*>}
* @memberof DeptTree
*/
public TreeData: Array<any> = [];
/*树显示说明：子树为节点对象的children,节点标签为节点对象的label*/ /**
* 树显示说明：子树为节点对象的children,节点标签为节点对象的label
*
* @type {*}
* @memberof DeptTree
*/
public defaultProps: any = { public defaultProps: any = {
children: 'children', children: "children",
label: 'label' label: "label",
} };
/*默认展开节点*/ /**
public defaultExpandedKeys: any = []; * 默认展开节点
* @type {Array<*>}
* @memberof DeptTree
*/
public defaultExpandedKeys: Array<any> = [];
/*当前登录人信息*/ /**
* 当前登录人信息
*
* @type {*}
* @memberof DeptTree
*/
public curUserContext: any = {}; public curUserContext: any = {};
/** /**
* vue 创建 * vue 创建
*
* @memberof DeptTree
*/ */
public created() { public created() {
var _this: any = this; var _this: any = this;
...@@ -81,6 +126,8 @@ ...@@ -81,6 +126,8 @@
/** /**
* vue 挂载 * vue 挂载
*
* @memberof DeptTree
*/ */
public mounted() { public mounted() {
this.initTree(); this.initTree();
...@@ -88,54 +135,63 @@ ...@@ -88,54 +135,63 @@
/** /**
* 初始化树 * 初始化树
*
* @memberof DeptTree
*/ */
private initTree() { private initTree() {
const _this = this; const _this = this;
// 获取当前登录人的身份 // 获取当前登录人的身份
const userStr = localStorage.getItem('user'); const userStr = localStorage.getItem("user");
let user: any = {}; let user: any = {};
if (userStr) { if (userStr) {
user = JSON.parse(userStr); user = JSON.parse(userStr);
} }
// 获取当前登录人所处组织的部门及下级组织的部门 // 获取当前登录人所处组织的部门及下级组织的部门
let url = ''; let url: string = "";
// 判断是否超级用户 // 判断是否超级用户
if (user.superuser==1) { if (user.superuser == 1) {
// 获取所有组织的部门及下级组织的部门 // 获取所有组织的部门及下级组织的部门
url = 'sysorganizations/alls/suborg/sysdepartments/picker'; url = "sysorganizations/alls/suborg/sysdepartments/picker";
}else { } else {
// 获取当前登录人所在组织的部门及下级组织的部门 // 获取当前登录人所在组织的部门及下级组织的部门
if (_this.curUserContext && _this.curUserContext.srforgid) { if (_this.curUserContext && _this.curUserContext.srforgid) {
url = 'sysorganizations/' + _this.curUserContext.srforgid + '/suborg/sysdepartments/picker'; url =
}else { "sysorganizations/" +
this.$Notice.error({title: '错误', desc: '当前登录人组织为空'}); _this.curUserContext.srforgid +
"/suborg/sysdepartments/picker";
} else {
this.$Notice.error({ title: "错误", desc: "当前登录人组织为空" });
} }
} }
this.$http.get(url).then((response: any) => { this.$http
.get(url)
.then((response: any) => {
if (!response || response.status !== 200) { if (!response || response.status !== 200) {
this.$Notice.error({title: '错误', desc: response.message}); this.$Notice.error({ title: "错误", desc: response.message });
return; return;
} else { } else {
// 给树赋值，数据结构在后台已经按照eltree格式化 // 给树赋值，数据结构在后台已经按照eltree格式化
_this.TreeData = response.data; _this.TreeData = response.data;
if (response.data && response.data.length > 0) { if (response.data && response.data.length > 0) {
// 设置默认选中第一个节点，即高亮显示 // 设置默认选中第一个节点，即高亮显示
this.$nextTick(function(){ this.$nextTick(function () {
let deptTree:any = this.$refs.DeptTree; let deptTree: any = this.$refs.DeptTree;
deptTree.setCurrentKey(response.data[0].id); deptTree.setCurrentKey(response.data[0].id);
}) });
// 默认加载第一个节点的右侧视图，调用选中数据变更事件 // 默认加载第一个节点的右侧视图，调用选中数据变更事件
_this.selectionChange(response.data[0]); _this.selectionChange(response.data[0]);
} }
} }
}).catch((e:any) => { })
.catch((e: any) => {
console.log(e); console.log(e);
}); });
} }
/** /**
* 处理点击节点 * 处理点击节点
*
* @memberof DeptTree
*/ */
protected handleNodeClick() { protected handleNodeClick() {
// 获取当前树 // 获取当前树
...@@ -143,7 +199,7 @@ ...@@ -143,7 +199,7 @@
// 获取点击状态的节点 // 获取点击状态的节点
let node = DeptTree.getCurrentNode(); let node = DeptTree.getCurrentNode();
// console.log("选中的node:" + JSON.stringify(node)); // console.log("选中的node:" + JSON.stringify(node));
// if (node.isLeaf && node.isLeaf == true)
// 选中数据变更事件 // 选中数据变更事件
this.selectionChange(node); this.selectionChange(node);
} }
...@@ -151,20 +207,21 @@ ...@@ -151,20 +207,21 @@
/** /**
* 选中数据变更事件 * 选中数据变更事件
* *
* @public * @param {*} 节点对应node对象
* @param {*} node 节点对应node对象 * @memberof DeptTree
* @memberof OrgTree
*/ */
public selectionChange(node: any) { public selectionChange(node: any) {
// 获取右侧视图渲染数据需要的参数 // 获取右侧视图渲染数据需要的参数
let temp = JSON.parse(JSON.stringify(node)); let temp = JSON.parse(JSON.stringify(node));
let srfappctx: any = {}; let srfappctx: any = {};
if (node.disabled == true) {// 单位 if (node.disabled == true) {
// 单位
temp.id = "Dept;" + node.id; temp.id = "Dept;" + node.id;
temp.srfparentdename = "SysOrganization"; temp.srfparentdename = "SysOrganization";
temp.sysorganization = node.id; temp.sysorganization = node.id;
srfappctx.sysorganization = temp.sysorganization; srfappctx.sysorganization = temp.sysorganization;
}else {// 部门 } else {
// 部门
temp.id = "Dept;" + node.id; temp.id = "Dept;" + node.id;
temp.srfparentdename = "SysDepartment"; temp.srfparentdename = "SysDepartment";
temp.sysdepartment = node.id; temp.sysdepartment = node.id;
...@@ -178,11 +235,10 @@ ...@@ -178,11 +235,10 @@
temp.srfappctx = srfappctx; temp.srfappctx = srfappctx;
// 抛出参数 // 抛出参数
let selectiondata: any = [temp]; let selectiondata: any = [temp];
this.$emit('selectionchange', selectiondata); 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
size="small"
placeholder="搜索..."
v-model="filerText"
@input="filterChange"
>
<i slot="prefix" class="el-input__icon el-icon-search"></i> <i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-input> </el-input>
<el-tree <el-tree
...@@ -17,10 +22,18 @@ ...@@ -17,10 +22,18 @@
:props="this.defaultProps" :props="this.defaultProps"
@node-click="handleNodeClick" @node-click="handleNodeClick"
> >
<span class="custom-tree-node" slot-scope="{node, data}"> <span class="custom-tree-node" slot-scope="{ node, data }">
<i v-if="node.isLeaf" class="fa fa-building-o" style="margin-right: 2px;"></i> <i
<i v-if="!node.isLeaf" class="fa fa-building" style="margin-right: 2px;"></i> v-if="node.isLeaf"
<span>{{node.label}}</span> 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> </span>
</el-tree> </el-tree>
</context-menu-container> </context-menu-container>
...@@ -28,48 +41,81 @@ ...@@ -28,48 +41,81 @@
</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 {
/**
* 过滤文本
*
* @type {string}
* @memberof OrgTree
*/
public filerText: string = "";
//　过滤文本
public filerText: any = '';
/** /**
* 过滤节点 * 过滤节点
*
* @param {string} value 过滤文本
* @param {*} data 树数据
* @memberof OrgTree
*/ */
public filterNode(value:any,data:any){ public filterNode(value: string, data: any) {
if (!value) return true; if (!value) return true;
return data.label.indexOf(value) !==-1; return data.label.indexOf(value) !== -1;
} }
/** /**
*　树搜索触发 * 树搜索触发
*
* @memberof OrgTree
*/ */
public filterChange(){ public filterChange() {
const OrgTree:any = this.$refs.OrgTree; const OrgTree: any = this.$refs.OrgTree;
OrgTree.filter(this.filerText); OrgTree.filter(this.filerText);
} }
/*树数据*/ /**
public TreeData: any = []; * 树数据
*
* @type {Array<*>}
* @memberof OrgTree
*/
public TreeData: Array<any> = [];
/*树显示说明：子树为节点对象的children,节点标签为节点对象的label*/ /**
* 树显示说明：子树为节点对象的children,节点标签为节点对象的label
*
* @type {*}
* @memberof OrgTree
*/
public defaultProps: any = { public defaultProps: any = {
children: 'children', children: "children",
label: 'label' label: "label",
} };
/*默认展开节点*/ /**
public defaultExpandedKeys: any = []; * 默认展开节点
*
* @type {Array<*>}
* @memberof OrgTree
*/
public defaultExpandedKeys: Array<any> = [];
/*当前登录人信息*/ /**
* 当前登录人信息
*
* @type {*}
* @memberof OrgTree
*/
public curUserContext: any = {}; public curUserContext: any = {};
/** /**
* vue 创建 * vue 创建
*
* @memberof OrgTree
*/ */
public created() { public created() {
var _this: any = this; var _this: any = this;
...@@ -81,6 +127,8 @@ ...@@ -81,6 +127,8 @@
/** /**
* vue 挂载 * vue 挂载
*
* @memberof OrgTree
*/ */
public mounted() { public mounted() {
this.initTree(); this.initTree();
...@@ -88,53 +136,62 @@ ...@@ -88,53 +136,62 @@
/** /**
* 初始化树 * 初始化树
*
* @memberof OrgTree
*/ */
private initTree() { private initTree() {
const _this = this; const _this = this;
// 获取当前登录人的身份 // 获取当前登录人的身份
const userStr = localStorage.getItem('user'); const userStr = localStorage.getItem("user");
let user: any = {}; let user: any = {};
if (userStr) { if (userStr) {
user = JSON.parse(userStr); user = JSON.parse(userStr);
} }
// 获取当前登录人所处组织及其下级组织 // 获取当前登录人所处组织及其下级组织
let url = ''; let url: string = "";
if (user.superuser==1) { if (user.superuser == 1) {
// 获取所有组织 // 获取所有组织
url = 'sysorganizations/alls/suborg/picker'; url = "sysorganizations/alls/suborg/picker";
}else { } else {
if (_this.curUserContext && _this.curUserContext.srforgid) { if (_this.curUserContext && _this.curUserContext.srforgid) {
url = 'sysorganizations/' + _this.curUserContext.srforgid + '/suborg/picker'; url =
"sysorganizations/" +
_this.curUserContext.srforgid +
"/suborg/picker";
} else { } else {
this.$Notice.error({title: '错误', desc: '当前登录人组织为空'}); this.$Notice.error({ title: "错误", desc: "当前登录人组织为空" });
} }
} }
this.$http.get(url).then((response: any) => { this.$http
.get(url)
.then((response: any) => {
if (!response || response.status !== 200) { if (!response || response.status !== 200) {
this.$Notice.error({title: '错误', desc: response.message}); this.$Notice.error({ title: "错误", desc: response.message });
return; return;
} else { } else {
// 给树赋值，数据结构在后台已经按照eltree格式化 // 给树赋值，数据结构在后台已经按照eltree格式化
_this.TreeData = response.data; _this.TreeData = response.data;
if (response.data && response.data.length > 0) { if (response.data && response.data.length > 0) {
// 设置默认选中第一个节点，即高亮显示 // 设置默认选中第一个节点，即高亮显示
this.$nextTick(function(){ this.$nextTick(function () {
let orgTree:any = this.$refs.OrgTree; let orgTree: any = this.$refs.OrgTree;
orgTree.setCurrentKey(response.data[0].id); orgTree.setCurrentKey(response.data[0].id);
}) });
// 默认加载第一个节点的右侧视图，调用选中数据变更事件 // 默认加载第一个节点的右侧视图，调用选中数据变更事件
_this.selectionChange(response.data[0]); _this.selectionChange(response.data[0]);
} }
} }
}).catch((e:any) => { })
.catch((e: any) => {
console.log(e); console.log(e);
}); });
} }
/** /**
* 处理点击节点 * 处理点击节点
*
* @memberof OrgTree
*/ */
protected handleNodeClick() { protected handleNodeClick() {
// 获取当前树 // 获取当前树
...@@ -142,7 +199,7 @@ ...@@ -142,7 +199,7 @@
// 获取点击状态的节点 // 获取点击状态的节点
let node = OrgTree.getCurrentNode(); let node = OrgTree.getCurrentNode();
// console.log("选中的node:" + JSON.stringify(node)); // console.log("选中的node:" + JSON.stringify(node));
// if (node.isLeaf && node.isLeaf == true)
// 选中数据变更事件 // 选中数据变更事件
this.selectionChange(node); this.selectionChange(node);
} }
...@@ -150,7 +207,6 @@ ...@@ -150,7 +207,6 @@
/** /**
* 选中数据变更事件 * 选中数据变更事件
* *
* @public
* @param {*} node 节点对应node对象 * @param {*} node 节点对应node对象
* @memberof OrgTree * @memberof OrgTree
*/ */
...@@ -169,13 +225,12 @@ ...@@ -169,13 +225,12 @@
temp.srfappctx = srfappctx; temp.srfappctx = srfappctx;
// 抛出参数 // 抛出参数
let selectiondata: any = [temp]; let selectiondata: any = [temp];
this.$emit('selectionchange', selectiondata); 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 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或