<template>
|
<div>
|
<el-select
|
style="width: 170px; margin-right: 10px"
|
clearable
|
v-model="state.industrialChainId"
|
placeholder="请选择行业领域"
|
@change="industrialChainIdCh"
|
@clear="industrialChainIdClear"
|
class="hangye"
|
>
|
<el-option
|
v-for="item in state.directionData"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id"
|
/>
|
</el-select>
|
<el-tree-select
|
ref="areaIdTreeRef"
|
v-model="state.importantAreaIdList"
|
:data="state.regionData"
|
placeholder="请选择单位工程"
|
multiple
|
collapse-tags
|
collapse-tags-tooltip
|
clearable
|
:default-expand-all="true"
|
:render-after-expand="false"
|
show-checkbox
|
style="width: 170px;"
|
@change="importantAreaCh"
|
@clear="importantAreaClear"
|
/>
|
</div>
|
</template>
|
<script setup lang="ts">
|
import productService from '@/api/zhongjian/productApi' // 接口文件
|
import optionService from '@/api/zhongjian/optionApi' // 接口文件
|
import achievementService from '@/api/zhongjian/achievementApi' // 接口文件
|
|
const state = reactive<any>({
|
directionData:[],
|
regionData:[],
|
industrialChainId: '', // 行业领域
|
importantDistrictIdList:[], // 单位工程二级
|
importantAreaIdList:[],
|
currentType:'product'
|
})
|
const areaIdTreeRef=ref()
|
const emit = defineEmits(['returnData'])
|
|
// 行业领域下拉change
|
const industrialChainIdCh = () => {
|
if (state.industrialChainId != '') {
|
// 单位工程
|
categoryListUrlqyFun()
|
}
|
importantAreaClear()
|
state.regionData = []
|
}
|
const importantAreaClear=()=>{
|
state.importantAreaIdList = []
|
areaIdTreeRef.value.setCheckedKeys([])
|
emit("returnData",{
|
industrialChainId: state.industrialChainId,
|
importantDistrictIdList:[],
|
importantAreaIdList:[],
|
})
|
}
|
// 行业领域清空
|
const industrialChainIdClear = () => {
|
state.importantAreaIdList = []
|
state.regionData = []
|
emit("returnData",{
|
industrialChainId:'',
|
importantDistrictIdList:[],
|
importantAreaIdList:[],
|
})
|
}
|
|
const importantAreaCh=()=>{
|
let checkedKeys = areaIdTreeRef.value!.getCheckedNodes(false, true)
|
if(checkedKeys&&checkedKeys.length>0&& state.importantAreaIdList.length>0){
|
state.importantDistrictIdList=[]
|
checkedKeys.forEach((item:any)=>{
|
if(item.children&&item.children.length>0){
|
state.importantDistrictIdList.push(item.value)
|
}
|
})
|
}
|
emit("returnData",{
|
industrialChainId: state.industrialChainId,
|
importantDistrictIdList:state.importantDistrictIdList,
|
importantAreaIdList:state.importantAreaIdList,
|
})
|
}
|
|
// 下拉数据-行业领域
|
const categoryListUrlFun = () => {
|
const searchList = {
|
parentCode: 'business_direction',
|
}
|
if(state.currentType=='benchmark'){
|
// 标杆
|
optionService.getResourceCategories({ ...searchList }).then((res: any) => {
|
if (res.code == 200) {
|
state.directionData = [...res.data]
|
}
|
})
|
}else if(state.currentType=="knowledge"){
|
// 知识
|
achievementService.getResourceCategories({ ...searchList }).then((res: any) => {
|
if (res.code == 200) {
|
state.directionData = [...res.data]
|
}
|
})
|
}else if(state.currentType=="product"){
|
// 产品
|
productService.getProductDict({ ...searchList }).then((res: any) => {
|
if (res.code == 200) {
|
state.directionData = [...res.data]
|
}
|
})
|
}
|
}
|
// 下拉数据-单位工程
|
const categoryListUrlqyFun = () => {
|
const param={parentIdList: [state.industrialChainId]}
|
if(state.currentType=='benchmark'){
|
// 标杆
|
optionService.getResourceCategories({ ...param }).then((res: any) => {
|
let data=handleIndustryData(res.data)
|
state.regionData = data
|
})
|
}else if(state.currentType=="knowledge"){
|
// 知识
|
achievementService.getResourceCategories({ ...param}).then((res: any) => {
|
if (res.code == 200) {
|
let data=handleIndustryData(res.data)
|
state.regionData = data
|
}
|
})
|
}else if(state.currentType=="product"){
|
// 产品
|
productService.getResourceCategory({...param}).then((res: any) => {
|
let data=handleIndustryData(res.data)
|
state.regionData = data
|
})
|
}
|
}
|
const handleIndustryChildData=(parentItem:any,childList:any)=>{
|
if(childList&& childList.length>0){
|
let data=childList.map((item:any)=>{
|
return {
|
parentId:parentItem.id,
|
parentName:parentItem.name,
|
label:item.name,
|
value:item.id,
|
children:item.children?handleIndustryChildData(item,item.children):[]
|
}
|
})
|
return data
|
}
|
}
|
const handleIndustryData=(list:any)=>{
|
if(list&& list.length>0){
|
let data=list.map((item:any)=>{
|
return {
|
label:item.name,
|
value:item.id,
|
parentId:item.parentId,
|
parentName:item.parentName,
|
children:item.children?handleIndustryChildData(item,item.children):[]
|
}
|
})
|
return data
|
}
|
}
|
const clearData=()=>{
|
state.regionData=[]
|
state.importantAreaIdList=[]
|
state.importantDistrictIdList=[]
|
state.industrialChainId=''
|
}
|
const getData=(currentType:string)=>{
|
state.currentType=currentType
|
// 下拉数据-行业领域
|
categoryListUrlFun()
|
}
|
defineExpose({
|
clearData,
|
getData
|
})
|
</script>
|
