107 lines
2.4 KiB
Vue
107 lines
2.4 KiB
Vue
/** * 单选人员 */
|
||
<template>
|
||
<u-picker
|
||
:show="show"
|
||
ref="uPicker"
|
||
:columns="columns"
|
||
:closeOnClickOverlay="true"
|
||
keyName="label"
|
||
@close="show = false"
|
||
@cancel="show = false"
|
||
@confirm="confirm"
|
||
@change="changeHandler"
|
||
></u-picker>
|
||
</template>
|
||
|
||
<script>
|
||
import { GetOrganTree, GetBillList } from '@/api/system/assembly.js';
|
||
export default {
|
||
data() {
|
||
return {
|
||
show: false,
|
||
columns: [[], []],
|
||
columnData: []
|
||
};
|
||
},
|
||
|
||
components: {},
|
||
|
||
computed: {},
|
||
|
||
mounted() {},
|
||
|
||
created() {
|
||
this.init();
|
||
},
|
||
|
||
methods: {
|
||
changeHandler(e) {
|
||
const {
|
||
columnIndex,
|
||
value,
|
||
values, // values为当前变化列的数组内容
|
||
index,
|
||
// 微信小程序无法将picker实例传出来，只能通过ref操作
|
||
picker = this.$refs.uPicker
|
||
} = e;
|
||
// 当第一列值发生变化时，变化第二列(后一列)对应的选项
|
||
if (columnIndex === 0) {
|
||
// picker为选择器this实例，变化第二列对应的选项
|
||
picker.setColumnValues(1, this.columnData[index]);
|
||
}
|
||
},
|
||
// 回调参数为包含columnIndex、value、values
|
||
confirm(e) {
|
||
this.$emit('confirm',e.value)
|
||
this.show = false;
|
||
},
|
||
async init() {
|
||
const res = await GetOrganTree({ companyID: 'null' });
|
||
let item = await GetBillList({ departmentID: '', limit: '999', page: '1' });
|
||
item.data[1].forEach(el => {
|
||
el.label = el.p_PersonName
|
||
})
|
||
this.columns[0].push(...this.treeToArray(JSON.parse(res.data[0])));
|
||
let keys = item.data[1].map((val) => {
|
||
return val.o_OrganName;
|
||
});
|
||
keys = [...new Set(keys)];
|
||
let data = {};
|
||
keys.forEach((el) => {
|
||
data[el] = [];
|
||
});
|
||
item.data[1].map((e) => {
|
||
keys.some((value) => {
|
||
if (e.o_OrganName == value) {
|
||
data[value].push(e);
|
||
return;
|
||
}
|
||
});
|
||
});
|
||
let treatment = this.sort(this.treeToArray(JSON.parse(res.data[0])),data)
|
||
this.columns[1] = data[this.treeToArray(JSON.parse(res.data[0]))[0].label]
|
||
this.columnData.push(...treatment)
|
||
},
|
||
// 数据扁平
|
||
treeToArray(items) {
|
||
let children = [];
|
||
items.forEach((item) => {
|
||
children.push(item);
|
||
if (item.children) {
|
||
children = children.concat(this.treeToArray(item.children));
|
||
}
|
||
});
|
||
return children;
|
||
},
|
||
sort(item,data) {
|
||
let list = []
|
||
item.forEach(el => {
|
||
list.push(data[el.label])
|
||
})
|
||
return list
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
<style scoped lang="scss"></style>
|