88 lines
1.5 KiB
Vue
88 lines
1.5 KiB
Vue
|
<template>
|
||
|
|
<next-tree
|
||
|
|
ref="nextTreeRef"
|
||
|
|
check-strictly
|
||
|
|
func-mode="radio"
|
||
|
|
select-parent
|
||
|
|
:if-search="false"
|
||
|
|
:tree-data="treeData"
|
||
|
|
theme-color="#3377ff"
|
||
|
|
page-height="92vh"
|
||
|
|
:label-key="'name'"
|
||
|
|
:value-key="'id'"
|
||
|
|
:children-key="'children'"
|
||
|
|
@confirm="fnTreeConfirm"
|
||
|
|
@cancel="fnTreeCancel"
|
||
|
|
></next-tree>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { getDepartmentTree } from "@/api";
|
||
|
|
|
||
|
|
export default {
|
||
|
|
props: {
|
||
|
|
value: {
|
||
|
|
type: String,
|
||
|
|
default: "",
|
||
|
|
},
|
||
|
|
visible: {
|
||
|
|
type: Boolean,
|
||
|
|
required: true,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
treeData: [],
|
||
|
|
};
|
||
|
|
},
|
||
|
|
|
||
|
|
watch: {
|
||
|
|
visible: {
|
||
|
|
handler: function (newVal, oldVal) {
|
||
|
|
if (newVal) {
|
||
|
|
this.$nextTick(() => {
|
||
|
|
if (this.$refs.nextTreeRef) {
|
||
|
|
this.$refs.nextTreeRef._show();
|
||
|
|
this.$refs.nextTreeRef.checkedFunc(this.value);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
this.$nextTick(() => {
|
||
|
|
if (this.$refs.nextTreeRef) {
|
||
|
|
this.$refs.nextTreeRef._hide();
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
},
|
||
|
|
immediate: true,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
|
||
|
|
mounted() {
|
||
|
|
if (this.visible) {
|
||
|
|
// this.fnGetData(); // 请求数据接口
|
||
|
|
}
|
||
|
|
},
|
||
|
|
|
||
|
|
methods: {
|
||
|
|
// 结构树弹框确定
|
||
|
|
fnTreeConfirm(evt) {
|
||
|
|
this.$emit("confirm", evt);
|
||
|
|
this.$emit("update:visible", false);
|
||
|
|
},
|
||
|
|
// 关闭结构树弹框
|
||
|
|
fnTreeCancel() {
|
||
|
|
this.$emit("update:visible", false);
|
||
|
|
},
|
||
|
|
async fnGetData() {
|
||
|
|
const resData = await getDepartmentTree({
|
||
|
|
loading: false,
|
||
|
|
});
|
||
|
|
this.treeData = JSON.parse(resData.zTreeNodes);
|
||
|
|
},
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="scss"></style>
|