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>
|