<template>
<el-cascader
v-if="typelist.length>0"
ref="cascaderAddr"
:key="modalKey"
v-model="ruleForm.classId"
:show-all-levels="false"
placeholder="请选择药品分类"
clearable
:options="typelist"
:props="props"
@change="changecascader"
/>
</template>
<script>
import { getClasses, getOTCClasses, getUnits } from '@/api/common'
import { addDrug, findDrug, updateDrug, selectDrugStoreInfo } from '@/api/drugs'
import axios from 'axios'
import { getToken } from '@/utils/auth'
export default {
data() {
return {
modalKey: 0,
options: [],
props: {
value: 'classId',
label: 'name',
children: 'children',
lazy: true,
checkStrictly: true,
lazyLoad(node, resolve) {
if (node.data.classId) {
getClasses({ parentId: node.data.classId }).then(res => {
if (Number(res.code) === 0) {
resolve(res.data)
} else {
resolve(null)
}
})
} else {
resolve(null)
}
}
}
}
},
created() {
const that = this
this.$nextTick(function() {
if (that.drugid !== 0) {
that.findDrug()
}
})
},
methods: {
changecascader(e) {
const that = this
setTimeout(function() {
that.$refs.cascaderAddr.toggleDropDownVisible()
}, 500)
},
// 获取详情
findDrug() {
findDrug({ id: this.drugid }).then(res => {
if (Number(res.code) === 0) {
this.ruleForm = res.data
this.fn2()
}
})
},
// 同步组装数据
async fn2() {
// this.ruleForm.classTree为接口拿到的已选择id组
for (var i = 0; i < this.ruleForm.classTree.length; i++) {
var item = this.ruleForm.classTree[i]
var data = await (function() {
return new Promise(function(res, rej) {
var resdata = axios.get(process.env.VUE_APP_BASE_API + '/common/classes',
{
params: { parentId: item.classId },
headers: {
'Authorization': getToken()
}
})
res(resdata)
})
}())
if (Number(data.data.code) === 0) {
if (item.classId === 0) {
this.typelist = data.data.data
} else {
if (data.data.data.length > 0) {
this.getItemchildren(this.typelist, item.classId, data.data.data)
}
}
}
// key必须加上，才能重新渲染组件
this.modalKey++
}
},
// 递归遍历循环赋值分类列表数据
getItemchildren(childrenData, classId, resData) {
return new Promise((resolve, reject) => {
if (childrenData.length > 0) {
childrenData.forEach(childrenItem => {
if (childrenItem.classId === classId) {
childrenItem.children = resData
} else {
if (childrenItem.children) {
this.getItemchildren(childrenItem.children, classId, resData)
}
}
})
}
})
},
}
}
</script>
