<template> <div> <span>分类:</span> <a-tree-select v-model="breedId" show-search style="width: 200px" :tree-data="medicalTypeList" :replaceFields="replaceFields" treeNodeFilterProp="title" :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }" placeholder="选择分类" allow-clear :disabled="disabled" @change="medicalTypeChange" @click="getMedicalType" ></a-tree-select> <span style="margin-left: 20px">品种名称:</span> <a-select style="width: 200px" placeholder="选择品种名称" @change="medicalNameChange" v-model="medicalId" :disabled="disabled"> <a-select-option v-for="item in medicalNameList" :key="item.id" :dropdownMatchSelectWidth="false" > {{ item.medicineName }} </a-select-option> </a-select> <span style="margin-left: 20px" v-if="enableBatch">生产批次:</span> <a-select style="width: 200px" v-if="enableBatch" placeholder="选择生产批次" v-model="batchId" :disabled="disabled"> <a-select-option v-for="item in medicalBatchList" :key="item.id"> {{ item.batchNumber }} </a-select-option> </a-select> </div> </template> <script> import {toTree} from "../../utils/common"; export default { name: "medicalAllSelect", props: { enableBatch: false, }, data() { return { breedId: null, medicalId: undefined, batchId: undefined, medicalTypeList: [], medicalNameList: [], medicalBatchList: [], replaceFields: { title: 'typeName', key: 'id', value: 'id', children: 'children', }, disabled: false } }, created() { this.getMedicalType(); }, methods: { getMedicalType() { let params = {}; this.$api.common.fetchMedicalType(params).then(({code, data}) => { this.medicalTypeList = toTree(data, '0', 'parentId', 'id'); }); }, medicalTypeChange(breedId) { if (this.$api.utils.isBlank(breedId)) { return; } this.$api.stockManage.fetchMedicineByType({breedId: breedId}).then(({data = []}) => { this.medicalNameList = data; this.medicalId = null; this.batchId = null; }) }, medicalNameChange(medicalId) { if (!this.enableBatch) { return; } this.$api.stockManage.fetchBatchByTypeAName({medicalId: medicalId}).then(({data = []}) => { this.medicalBatchList = data; this.batchId = null; }); }, getValue() { let content = [this.breedId, this.medicalId, this.batchId]; return content; }, setValue(values, isDisabled = false) { this.disabled = isDisabled; this.breedId = values[0]; this.medicalId = values[1]; this.batchId = values[2]; }, }, } </script> <style scoped> </style>