fix(任务中心): 资源池级联选择器修复
This commit is contained in:
parent
5a9eb8c651
commit
5272fd1482
|
@ -460,7 +460,6 @@
|
|||
}
|
||||
}
|
||||
.arco-checkbox {
|
||||
padding-left: 0;
|
||||
.arco-checkbox-icon {
|
||||
border: 1px solid var(--color-text-input-border);
|
||||
}
|
||||
|
|
|
@ -141,13 +141,16 @@
|
|||
const cascader: Ref = ref(null);
|
||||
let selectedLabelObj: Record<string, any> = {}; // 存储已选的选项的label,用于多选时展示全部选项的 tooltip
|
||||
|
||||
const { maxTagCount, getOptionComputedStyle, calculateMaxTag } = useSelect({
|
||||
const { maxTagCount, getOptionComputedStyle, calculateMaxTag } = useSelect(
|
||||
{
|
||||
selectRef: cascader,
|
||||
selectVal: innerValue,
|
||||
isCascade: true,
|
||||
options: props.options,
|
||||
panelWidth: props.panelWidth,
|
||||
});
|
||||
},
|
||||
props
|
||||
);
|
||||
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
|
|
|
@ -1,3 +1,5 @@
|
|||
import type { MsCascaderProps } from '@/components/business/ms-cascader/index.vue';
|
||||
|
||||
import { calculateMaxDepth } from '@/utils';
|
||||
|
||||
import type { CascaderOption, SelectOptionData } from '@arco-design/web-vue';
|
||||
|
@ -17,7 +19,7 @@ export interface UseSelectOption {
|
|||
* @param selectRef 选择器 ref 对象
|
||||
* @param selectVal 选择器的 v-model
|
||||
*/
|
||||
export default function useSelect(config: UseSelectOption) {
|
||||
export default function useSelect(config: UseSelectOption, props?: MsCascaderProps) {
|
||||
const maxTagCount = ref(0);
|
||||
const selectWidth = ref(0);
|
||||
const selectViewInner = ref<HTMLElement | null>(null); // 输入框内容容器 DOM
|
||||
|
@ -55,7 +57,7 @@ export default function useSelect(config: UseSelectOption) {
|
|||
}
|
||||
|
||||
const getOptionComputedStyle = computed(() => {
|
||||
if (config.isCascade) {
|
||||
if (config.isCascade && selectWidth.value > 0) {
|
||||
// 减去 80px 是为了防止溢出,因为会出现单选框、右侧箭头
|
||||
return {
|
||||
width:
|
||||
|
@ -71,7 +73,7 @@ export default function useSelect(config: UseSelectOption) {
|
|||
});
|
||||
|
||||
watch(
|
||||
() => config.options,
|
||||
() => props?.options,
|
||||
(arr) => {
|
||||
if (config.isCascade && arr && arr.length > 0) {
|
||||
// 级联选择器的选项发生变化时,重新计算最大深度
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
:options="resourcePoolOptions"
|
||||
:placeholder="t('common.pleaseSelect')"
|
||||
option-size="small"
|
||||
class="w-[240px]"
|
||||
class="w-[300px]"
|
||||
:prefix="t('ms.taskCenter.resourcePool')"
|
||||
:virtual-list-props="{ height: 200 }"
|
||||
strictly
|
||||
|
|
Loading…
Reference in New Issue