提交 b1e1c6b3 编写于 作者: jlj05024111@163.com's avatar jlj05024111@163.com

feat: 更新开关编辑器

上级 3cc25775
......@@ -119,6 +119,7 @@ import {
IBizGridRadio,
IBizGridPicker,
GridEditor,
IBizSwitch,
} from './components/editor';
export const AppRegister = {
......@@ -229,6 +230,7 @@ export const AppRegister = {
v.component('IBizImageUpload', IBizImageUpload);
v.component('QuickSearch', QuickSearch);
v.component('NotSupportedEditor', NotSupportedEditor);
v.component('IBizSwitch', IBizSwitch);
// 注册表格编辑器
v.component('IBizGridInput', IBizGridInput);
v.component('IBizGridSpan', IBizGridSpan);
......
......@@ -9,3 +9,4 @@ export * from './data-picker';
export * from './upload';
export * from './date-range';
export { NotSupportedEditor } from './not-supported-editor/not-supported-editor';
export * from './switch';
import {
getGridSwitchProps,
useGridCellEditor,
useNamespace,
} from '@ibiz-template/vue-util';
import { defineComponent, h } from 'vue';
export const IBizGridSwitch = defineComponent({
name: 'IBizGridSwitch',
props: getGridSwitchProps(),
setup(props, { emit }) {
const ns = useNamespace('grid-switch');
const { isInfoMode, componentRef, autoFocus, onOperateChange, onChange } =
useGridCellEditor(props, { emit });
return {
ns,
isInfoMode,
autoFocus,
componentRef,
onOperateChange,
onChange,
};
},
render() {
return (
<grid-editor
disabled={this.disabled}
readonly={this.readonly}
ref='componentRef'
class={this.ns.b()}
>
{h('IBizSwitch', {
props: {
...this.$props,
readonly: this.isInfoMode,
disabled: this.disabled,
autoFocus: this.autoFocus,
},
on: {
change: this.onChange,
operate: this.onOperateChange,
},
})}
</grid-editor>
);
},
});
export { IBizSwitch } from './switch/switch';
import { getSwitchProps, useNamespace } from '@ibiz-template/vue-util';
import { defineComponent, ref, watch } from 'vue';
export const IBizSwitch = defineComponent({
name: 'IBIzSwitch',
props: getSwitchProps(),
setup(props, { emit }) {
const ns = useNamespace('switch');
const currentVal = ref(false);
watch(
() => props.value,
(newVal, oldVal) => {
if (newVal !== oldVal) {
if (!newVal) {
currentVal.value = false;
} else {
// eslint-disable-next-line eqeqeq
currentVal.value = props.value == 1;
}
}
},
{ immediate: true },
);
const onChange = (value: boolean) => {
const emitValue = value === true ? 1 : 0;
emit('change', emitValue);
};
return {
ns,
currentVal,
onChange,
};
},
render() {
return (
<div class={this.ns.b()}>
<i-switch
v-mode={this.currentVal}
onOn-change={this.onChange}
></i-switch>
</div>
);
},
});
......@@ -7,6 +7,7 @@ import { DatePickerEditorProvider } from './date-picker-provider';
import { FileUploaderEditorProvider } from './file-uploader-provider';
import { DataPickerEditorProvider } from './data-picker-provider';
import { DateRangeEditorProvider } from './date-range-provider';
import { SwitchProvider } from './switch-provider';
/**
* 预置默认的编辑器适配器
......@@ -101,6 +102,7 @@ export function presetEditorProvider(): void {
'ADDRESSPICKUP_AC',
new DataPickerEditorProvider('ADDRESSPICKUP'),
);
editorRegister.register('SWITCH', new SwitchProvider());
}
export {
......@@ -111,4 +113,5 @@ export {
DatePickerEditorProvider,
FileUploaderEditorProvider,
DataPickerEditorProvider,
SwitchProvider,
};
import {
FormItemController,
GridEditItemController,
IEditorProvider,
SwitchEditorController,
} from '@ibiz-template/controller';
import { SwitchEditorModel } from '@ibiz-template/model';
export class SwitchProvider implements IEditorProvider {
formEditor: string = 'IBizSwitch';
gridEditor: string = 'IBizGridSwitch';
async createController(
editorModel: SwitchEditorModel,
parentController: FormItemController | GridEditItemController,
): Promise<SwitchEditorController> {
const c = new SwitchEditorController(editorModel, parentController);
await c.init();
return c;
}
}
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册