<template> <view> <u-modal :show="modelShow" title="选择所属端" showCancelButton cancelText="返回" @cancel="fnModalCancel" @confirm="fnModalConfirm"> <u-radio-group v-model="type" placement="column"> <u-radio :customStyle="{marginBottom: '8px'}" label="企业端" name="0"/> <u-radio :customStyle="{marginBottom: '8px'}" label="监管端" name="1"/> <u-radio :customStyle="{marginBottom: '8px'}" label="相关方端" name="2"/> </u-radio-group> </u-modal> <next-tree v-if="!modelShow" uiMode="page" ref="nextTreeRef" checkStrictly funcMode="radio" selectParent :ifSearch="false" :treeData="treeData" themeColor="#2a56f7" page-height="92vh" labelKey="DEPARTMENT_NAME" valueKey="DEPARTMENT_ID" childrenKey="nodes" @change="fnTreeChange" > <template #fixedBottomBar> <view style="padding: 20upx;margin-bottom: 20upx;"> <u-button type="primary" text="确定" @click="fnTreeConfirm"/> </view> </template> </next-tree> </view> </template> <script> import {getDepartmentTree} from "@/api"; export default { data() { return { modelShow: true, type: '', CORP_ID: '', treeData: [], treeSelectData: [] } }, onLoad(query) { this.CORP_ID = query.CORP_ID }, methods: { fnModalCancel() { uni.navigateBack() }, fnModalConfirm() { if (!this.type) { uni.$u.toast('请选择所属端') return } this.modelShow = false this.fnGetDepartmentTree() }, async fnGetDepartmentTree() { let CORP_ID = '' if (this.type === '0') CORP_ID = this.CORP_ID if (this.type === '2') CORP_ID = '' let resData = await getDepartmentTree({TYPE: this.type, CORP_ID}) this.treeData = resData.tree.tree }, fnTreeChange(event) { this.treeSelectData = event }, fnTreeConfirm() { if (this.treeSelectData.length === 0) { uni.$u.toast('请选择部门') return } this.getOpenerEventChannel().emit("confirm", { DEPARTMENT_NAME: this.treeSelectData[0].DEPARTMENT_NAME, DEPARTMENT_ID: this.treeSelectData[0].DEPARTMENT_ID, CORP_ID: this.CORP_ID, TYPE: this.type }); uni.navigateBack(); } }, } </script> <style scoped lang="scss"> </style>