cxc-szcx-uniapp/uni_modules/trq-depart-select/components/trq-depart-select/trq-depart-select.vue

86 lines
2.1 KiB
Vue

<template>
<view v-if="returnCodeOrID === 'orgCode'">
<uni-data-picker v-model="selectDepartID" ref="depart" :openSearch="true" :ellipsis="true"
placeholder="请选择单位code" popup-title="请选择单位" :localdata="departList" @nodeclick="onnodeclick"
@popupclosed="onpopupclosed" @change="onchange" :map="{'text':'title','value':'orgCode'}"></uni-data-picker>
</view>
<view v-else>
<uni-data-picker v-model="selectDepartID" ref="depart" :openSearch="true" :ellipsis="true" placeholder="请选择单位id"
popup-title="请选择单位" :localdata="departList" @nodeclick="onnodeclick" @popupclosed="onpopupclosed"
@change="onchange" :map="{'text':'title','value':'id'}"></uni-data-picker>
</view>
</template>
<script setup>
import {
useStore
} from '@/store';
import {
queryDepByCode,
queryZbDepByLdhth
} from '@/api/depart.js'
import {
queryMyDeptTreeListApi
} from '@/api/api.js'
import {
onReady,
onLoad
} from '@dcloudio/uni-app';
import {
reactive,
ref,
defineEmits,
defineProps
} from 'vue';
const store = useStore()
const props = defineProps({
returnCodeOrID: {
type: String,
default: "orgCode"
}
})
let departList = ref([])
let selectDepartID = ref("") //当前选中的单位ID
let selectDepartIDS = ref([]) //选中的级联单位ID数组
let tempSelectDepartID = ref("") //临时选择的单位ID
let departInfo = ref({}) //"单位的全部信息"
let $emit = defineEmits(['change']);
const getDepartList = () => {
queryMyDeptTreeListApi().then((res) => {
if (res.success) {
// console.log(res)
departList.value = res.result
}
}).catch((err) => {
console.log(err);
})
}
const onnodeclick = ((e) => {
departInfo.value = e;
if (props.returnCodeOrID = "orgCode") {
tempSelectDepartID.value = e.orgCode
} else {
tempSelectDepartID.value = e.value
}
})
const onchange = ((e) => {
$emit('change', e.detail.value[e.detail.value.length - 1].value, {})
})
const onpopupclosed = ((e) => {
selectDepartID.value = tempSelectDepartID.value
$emit('change', selectDepartID.value, departInfo)
})
onLoad((e) => {
getDepartList();
})
</script>
<style>
</style>