<!-- 关联算法和综合业务 -->
|
<template>
|
<div class="task-algorithm" v-if="showAlgorithm">
|
<el-select
|
class="ztzf-select"
|
:teleported="false"
|
:style="{ width: pxToRem(setWidth) }"
|
v-model="ai_types"
|
multiple
|
collapse-tags
|
collapse-tags-tooltip
|
placeholder="支持多项选择"
|
clearable
|
@change="handleAlgorithmChange"
|
>
|
<el-option v-for="item in taskAlgorithm" :key="item.id" :label="item.dictValue" :value="item.dictKey" />
|
</el-select>
|
</div>
|
<div class="task-business" v-if="showBusiness">
|
<el-select class="ztzf-select"
|
:teleported="false"
|
:style="{ width: pxToRem(setWidth) }"
|
v-model="industry_type"
|
placeholder="请选择类型"
|
clearable
|
@change="handleBusinessChange"
|
>
|
<el-option v-for="item in taskBusiness" :key="item.id" :label="item.dictValue" :value="item.dictKey" />
|
</el-select>
|
</div>
|
</template>
|
|
<script setup>
|
import { getMultipleDictionary } from '@/api/job/task'
|
import { pxToRem } from '@/utils/rem';
|
|
// 接收父组件传参
|
const props = defineProps({
|
showAlgorithm: {
|
type: Boolean,
|
default: false,
|
},
|
showBusiness: {
|
type: Boolean,
|
default: false,
|
},
|
setWidth: {
|
type: String,
|
default: '100%',
|
},
|
})
|
|
// 算法
|
let ai_types = ref('')
|
let taskAlgorithm = ref([])
|
// 综合业务
|
let industry_type = ref('')
|
let taskBusiness = ref([])
|
|
// 请求字典字段
|
const requestDictionary = () => {
|
getMultipleDictionary('SF,HYLB').then(res => {
|
if (res.code !== 0) {
|
// 处理数据
|
taskAlgorithm.value = res.data.data['SF']
|
taskBusiness.value = res.data.data['HYLB']
|
}
|
})
|
}
|
const emit = defineEmits(['algorithmChange', 'businessChange'])
|
// 算法选择事件
|
const handleAlgorithmChange = value => {
|
emit('algorithmChange', value)
|
}
|
// 业务选择事件
|
const handleBusinessChange = value => {
|
emit('businessChange', value)
|
}
|
|
const clear = () => {
|
ai_types.value = [] // 清空算法选择
|
handleAlgorithmChange(ai_types.value)
|
}
|
|
defineExpose({
|
clear,
|
})
|
|
onMounted(() => {
|
requestDictionary()
|
})
|
</script>
|
<style scoped lang="scss">
|
// :deep(.el-tag, .el-tag.el-tag--primary),
|
// :deep(.el-tag.el-tag--info) {
|
// --el-tag-bg-color: none !important;
|
// --el-tag-border-color: none !important;
|
// --el-tag-hover-color: none !important;
|
// color: #fff !important;
|
// }
|
::v-deep(.ztzf-select) {
|
.el-select__wrapper {
|
z-index: 1111;
|
|
/* 修改 Tooltip 面板样式 */
|
.el-popper.is-light {
|
background: #fff !important;
|
// box-shadow: none !important;
|
// border: none !important;
|
border-radius: 4px !important;
|
|
.el-select__selection {
|
max-width: 240px !important;
|
|
.el-select__selected-item {
|
.el-tag {
|
// background: #fff !important;
|
// color: #000;
|
}
|
}
|
}
|
|
.el-popper__arrow::before {
|
// background: #fff !important;
|
// border: 1px solid #8d8b8b !important;
|
}
|
}
|
}
|
}
|
</style>
|
