Merge branch 'main' of https://github.com/vbenjs/vue-vben-admin into dev
This commit is contained in:
@@ -36,7 +36,7 @@ export interface VbenButtonGroupProps
|
||||
btnClass?: any;
|
||||
gap?: number;
|
||||
multiple?: boolean;
|
||||
options?: { label: CustomRenderType; value: ValueType }[];
|
||||
options?: { [key: string]: any; label: CustomRenderType; value: ValueType }[];
|
||||
showIcon?: boolean;
|
||||
size?: 'large' | 'middle' | 'small';
|
||||
}
|
||||
|
@@ -119,7 +119,7 @@ async function onBtnClick(value: ValueType) {
|
||||
<CircleCheckBig v-else-if="innerValue.includes(btn.value)" />
|
||||
<Circle v-else />
|
||||
</div>
|
||||
<slot name="option" :label="btn.label" :value="btn.value">
|
||||
<slot name="option" :label="btn.label" :value="btn.value" :data="btn">
|
||||
<VbenRenderContent :content="btn.label" />
|
||||
</slot>
|
||||
</Button>
|
||||
@@ -127,6 +127,9 @@ async function onBtnClick(value: ValueType) {
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
.vben-check-button-group {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
&:deep(.size-large) button {
|
||||
.icon-wrapper {
|
||||
margin-right: 0.3rem;
|
||||
@@ -159,5 +162,16 @@ async function onBtnClick(value: ValueType) {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.no-gap > :deep(button):nth-of-type(1) {
|
||||
border-right-width: 0;
|
||||
}
|
||||
|
||||
&.no-gap {
|
||||
:deep(button + button) {
|
||||
margin-right: -1px;
|
||||
border-left-width: 1px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@@ -224,15 +224,20 @@ defineExpose({
|
||||
:class="
|
||||
cn('cursor-pointer', getNodeClass?.(item), {
|
||||
'data-[selected]:bg-accent': !multiple,
|
||||
'cursor-not-allowed': disabled,
|
||||
})
|
||||
"
|
||||
v-bind="
|
||||
Object.assign(item.bind, {
|
||||
onfocus: disabled ? 'this.blur()' : undefined,
|
||||
})
|
||||
"
|
||||
v-bind="item.bind"
|
||||
@select="
|
||||
(event) => {
|
||||
if (event.detail.originalEvent.type === 'click') {
|
||||
event.preventDefault();
|
||||
}
|
||||
onSelect(item, event.detail.isSelected);
|
||||
!disabled && onSelect(item, event.detail.isSelected);
|
||||
}
|
||||
"
|
||||
@toggle="
|
||||
@@ -240,7 +245,7 @@ defineExpose({
|
||||
if (event.detail.originalEvent.type === 'click') {
|
||||
event.preventDefault();
|
||||
}
|
||||
onToggle(item);
|
||||
!disabled && onToggle(item);
|
||||
}
|
||||
"
|
||||
class="tree-node focus:ring-grass8 my-0.5 flex items-center rounded px-2 py-1 outline-none focus:ring-2"
|
||||
@@ -262,10 +267,11 @@ defineExpose({
|
||||
<Checkbox
|
||||
v-if="multiple"
|
||||
:checked="isSelected"
|
||||
:disabled="disabled"
|
||||
:indeterminate="isIndeterminate"
|
||||
@click="
|
||||
() => {
|
||||
handleSelect();
|
||||
!disabled && handleSelect();
|
||||
// onSelect(item, !isSelected);
|
||||
}
|
||||
"
|
||||
@@ -276,7 +282,7 @@ defineExpose({
|
||||
(_event) => {
|
||||
// $event.stopPropagation();
|
||||
// $event.preventDefault();
|
||||
handleSelect();
|
||||
!disabled && handleSelect();
|
||||
// onSelect(item, !isSelected);
|
||||
}
|
||||
"
|
||||
|
Reference in New Issue
Block a user