Skip to content

Commit

Permalink
fix: resolve issue with disabled property in options not working (#6595)
Browse files Browse the repository at this point in the history
#### What type of PR is this?

/kind bug
/area ui

#### What this PR does / why we need it:

解决 formkit select 组件中,option 使用 `attrs: { disabled: true }` 无效的问题。

#### How to test it?

测试在 formkit select 组件中,option 设置 disabled 属性是否有效。

#### Which issue(s) this PR fixes:

Fixed #6592 

#### Does this PR introduce a user-facing change?
```release-note
解决 formkit select 组件的 Option 设置 disabled 无效的问题
```
  • Loading branch information
LIlGG authored Sep 6, 2024
1 parent 51609ab commit 6cdd2a7
Show file tree
Hide file tree
Showing 3 changed files with 14 additions and 9 deletions.
5 changes: 1 addition & 4 deletions ui/src/formkit/inputs/select/SelectMain.vue
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import {
watch,
type PropType,
} from "vue";
import { isFalse } from "./isFalse";
import SelectContainer from "./SelectContainer.vue";
export interface SelectProps {
Expand Down Expand Up @@ -238,10 +239,6 @@ const initSelectProps = () => {
}
};
const isFalse = (value: string | boolean | undefined | null) => {
return [undefined, null, "false", false].includes(value);
};
const isLoading = ref(false);
const isFetchingMore = ref(false);
const page = ref(1);
Expand Down
15 changes: 10 additions & 5 deletions ui/src/formkit/inputs/select/SelectOption.vue
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import { vScroll } from "@vueuse/components";
import { useEventListener, type UseScrollReturn } from "@vueuse/core";
import { computed, ref, watch } from "vue";
import SelectOptionItem from "./SelectOptionItem.vue";
import { isFalse } from "./isFalse";
const props = defineProps<{
options: Array<Record<string, unknown> & { label: string; value: string }>;
Expand Down Expand Up @@ -81,7 +82,7 @@ const handleSelected = (index: number) => {
}
}
selectedIndex.value = index;
if (option) {
if (option && !isDisabled(option)) {
emit("selected", option);
}
};
Expand Down Expand Up @@ -112,11 +113,15 @@ const reachMaximumLimit = computed(() => {
return false;
});
const isDisabled = (option: { label: string; value: string }) => {
const isDisabled = (
option: Record<string, unknown> & { label: string; value: string }
) => {
const attrs = option.attrs as Record<string, unknown>;
return (
reachMaximumLimit.value &&
selectedValues.value &&
!selectedValues.value.includes(option.value)
(reachMaximumLimit.value &&
selectedValues.value &&
!selectedValues.value.includes(option.value)) ||
!isFalse(attrs?.disabled as string | boolean | undefined)
);
};
Expand Down
3 changes: 3 additions & 0 deletions ui/src/formkit/inputs/select/isFalse.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
export const isFalse = (value: string | boolean | undefined | null) => {
return [undefined, null, "false", false].includes(value);
};

0 comments on commit 6cdd2a7

Please sign in to comment.