@ibiz-template/mob-vue3-components 0.0.1-alpha.23 → 0.0.1-alpha.24
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.min.css +1 -1
- package/dist/index.system.min.js +2 -2
- package/dist/index.system.min.js.map +1 -1
- package/es/control/form/edit-form/edit-form.d.ts +16 -1
- package/es/control/form/edit-form/edit-form.mjs +26 -8
- package/es/control/form/edit-form/index.d.ts +15 -0
- package/es/control/form/form/form.d.ts +1 -5
- package/es/control/form/form/form.mjs +39 -15
- package/es/control/form/form/index.mjs +2 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-form/form-mdctrl-form.css +1 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-form/form-mdctrl-form.d.ts +18 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-form/form-mdctrl-form.mjs +73 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-md/form-mdctrl-md.css +1 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-md/form-mdctrl-md.d.ts +19 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-md/form-mdctrl-md.mjs +79 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/form-mdctrl-repeater.d.ts +15 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/form-mdctrl-repeater.mjs +50 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-multi-form/repeater-multi-form.d.ts +19 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-multi-form/repeater-multi-form.mjs +59 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-single-form/repeater-single-form.css +1 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-single-form/repeater-single-form.d.ts +29 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-single-form/repeater-single-form.mjs +54 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl.css +1 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl.d.ts +28 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl.mjs +67 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl.provider.d.ts +15 -0
- package/es/control/form/form-detail/form-mdctrl/form-mdctrl.provider.mjs +40 -0
- package/es/control/form/form-detail/form-mdctrl/index.d.ts +24 -0
- package/es/control/form/form-detail/form-mdctrl/index.mjs +20 -0
- package/es/control/form/form-detail/form-mdctrl/mdctrl-container/mdctrl-container.css +1 -0
- package/es/control/form/form-detail/form-mdctrl/mdctrl-container/mdctrl-container.d.ts +40 -0
- package/es/control/form/form-detail/form-mdctrl/mdctrl-container/mdctrl-container.mjs +94 -0
- package/es/control/form/form-detail/index.d.ts +1 -0
- package/es/control/form/form-detail/index.mjs +1 -0
- package/es/control/form/index.mjs +1 -0
- package/es/control/index.mjs +1 -0
- package/es/editor/upload/upload-editor.controller.mjs +2 -17
- package/es/panel-component/panel-button/index.d.ts +1 -1
- package/es/panel-component/panel-button/panel-button.d.ts +1 -1
- package/es/view/login-view/login-view.mjs +1 -1
- package/lib/control/form/edit-form/edit-form.cjs +26 -8
- package/lib/control/form/form/form.cjs +38 -14
- package/lib/control/form/form/index.cjs +2 -0
- package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-form/form-mdctrl-form.cjs +75 -0
- package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-form/form-mdctrl-form.css +1 -0
- package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-md/form-mdctrl-md.cjs +81 -0
- package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-md/form-mdctrl-md.css +1 -0
- package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/form-mdctrl-repeater.cjs +52 -0
- package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-multi-form/repeater-multi-form.cjs +61 -0
- package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-single-form/repeater-single-form.cjs +56 -0
- package/lib/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/repeater-single-form/repeater-single-form.css +1 -0
- package/lib/control/form/form-detail/form-mdctrl/form-mdctrl.cjs +72 -0
- package/lib/control/form/form-detail/form-mdctrl/form-mdctrl.css +1 -0
- package/lib/control/form/form-detail/form-mdctrl/form-mdctrl.provider.cjs +42 -0
- package/lib/control/form/form-detail/form-mdctrl/index.cjs +25 -0
- package/lib/control/form/form-detail/form-mdctrl/mdctrl-container/mdctrl-container.cjs +96 -0
- package/lib/control/form/form-detail/form-mdctrl/mdctrl-container/mdctrl-container.css +1 -0
- package/lib/control/form/form-detail/index.cjs +2 -0
- package/lib/control/form/index.cjs +6 -4
- package/lib/control/index.cjs +36 -34
- package/lib/editor/upload/upload-editor.controller.cjs +1 -16
- package/lib/view/login-view/login-view.cjs +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { EditFormController } from '@ibiz-template/runtime';
|
|
1
|
+
import { EditFormController, IControlProvider } from '@ibiz-template/runtime';
|
|
2
2
|
import { IDEEditForm } from '@ibiz/model-core';
|
|
3
3
|
import { PropType } from 'vue';
|
|
4
4
|
export declare const EditFormControl: import("vue").DefineComponent<{
|
|
@@ -14,6 +14,9 @@ export declare const EditFormControl: import("vue").DefineComponent<{
|
|
|
14
14
|
type: PropType<IParams>;
|
|
15
15
|
default: () => {};
|
|
16
16
|
};
|
|
17
|
+
provider: {
|
|
18
|
+
type: PropType<IControlProvider>;
|
|
19
|
+
};
|
|
17
20
|
isSimple: {
|
|
18
21
|
type: BooleanConstructor;
|
|
19
22
|
required: false;
|
|
@@ -22,6 +25,10 @@ export declare const EditFormControl: import("vue").DefineComponent<{
|
|
|
22
25
|
type: PropType<IData>;
|
|
23
26
|
required: false;
|
|
24
27
|
};
|
|
28
|
+
loadDefault: {
|
|
29
|
+
type: BooleanConstructor;
|
|
30
|
+
default: boolean;
|
|
31
|
+
};
|
|
25
32
|
}, {
|
|
26
33
|
c: EditFormController;
|
|
27
34
|
ns: import("@ibiz-template/core").Namespace;
|
|
@@ -38,6 +45,9 @@ export declare const EditFormControl: import("vue").DefineComponent<{
|
|
|
38
45
|
type: PropType<IParams>;
|
|
39
46
|
default: () => {};
|
|
40
47
|
};
|
|
48
|
+
provider: {
|
|
49
|
+
type: PropType<IControlProvider>;
|
|
50
|
+
};
|
|
41
51
|
isSimple: {
|
|
42
52
|
type: BooleanConstructor;
|
|
43
53
|
required: false;
|
|
@@ -46,7 +56,12 @@ export declare const EditFormControl: import("vue").DefineComponent<{
|
|
|
46
56
|
type: PropType<IData>;
|
|
47
57
|
required: false;
|
|
48
58
|
};
|
|
59
|
+
loadDefault: {
|
|
60
|
+
type: BooleanConstructor;
|
|
61
|
+
default: boolean;
|
|
62
|
+
};
|
|
49
63
|
}>>, {
|
|
50
64
|
params: IParams;
|
|
65
|
+
loadDefault: boolean;
|
|
51
66
|
isSimple: boolean;
|
|
52
67
|
}, {}>;
|
|
@@ -18,6 +18,9 @@ const EditFormControl = /* @__PURE__ */ defineComponent({
|
|
|
18
18
|
type: Object,
|
|
19
19
|
default: () => ({})
|
|
20
20
|
},
|
|
21
|
+
provider: {
|
|
22
|
+
type: Object
|
|
23
|
+
},
|
|
21
24
|
isSimple: {
|
|
22
25
|
type: Boolean,
|
|
23
26
|
required: false
|
|
@@ -25,17 +28,32 @@ const EditFormControl = /* @__PURE__ */ defineComponent({
|
|
|
25
28
|
data: {
|
|
26
29
|
type: Object,
|
|
27
30
|
required: false
|
|
31
|
+
},
|
|
32
|
+
loadDefault: {
|
|
33
|
+
type: Boolean,
|
|
34
|
+
default: true
|
|
28
35
|
}
|
|
29
36
|
},
|
|
30
|
-
setup() {
|
|
31
|
-
const c = useControlController((...args) => new EditFormController(...args)
|
|
32
|
-
|
|
33
|
-
if (newVal && newVal !== oldVal) {
|
|
34
|
-
c.state.isLoaded = true;
|
|
35
|
-
}
|
|
36
|
-
}, {
|
|
37
|
-
immediate: true
|
|
37
|
+
setup(props) {
|
|
38
|
+
const c = useControlController((...args) => new EditFormController(...args), {
|
|
39
|
+
excludePropsKeys: ["data"]
|
|
38
40
|
});
|
|
41
|
+
if (props.isSimple) {
|
|
42
|
+
c.evt.on("onMounted", () => {
|
|
43
|
+
c.setSimpleData(props.data || {});
|
|
44
|
+
});
|
|
45
|
+
watch(() => props.data, (newVal) => {
|
|
46
|
+
const changeVal = newVal || {};
|
|
47
|
+
const find = Object.keys(c.data).find((key) => {
|
|
48
|
+
return changeVal[key] !== c.data[key];
|
|
49
|
+
});
|
|
50
|
+
if (find) {
|
|
51
|
+
c.setSimpleData(changeVal);
|
|
52
|
+
}
|
|
53
|
+
}, {
|
|
54
|
+
deep: true
|
|
55
|
+
});
|
|
56
|
+
}
|
|
39
57
|
const ns = useNamespace(`control-${c.model.controlType.toLowerCase()}`);
|
|
40
58
|
c.evt.on("onCreated", () => {
|
|
41
59
|
const keys = Object.keys(c.details);
|
|
@@ -11,6 +11,9 @@ export declare const IBizEditFormControl: import("@ibiz-template/vue3-util").Typ
|
|
|
11
11
|
type: import("vue").PropType<IParams>;
|
|
12
12
|
default: () => {};
|
|
13
13
|
};
|
|
14
|
+
provider: {
|
|
15
|
+
type: import("vue").PropType<import("@ibiz-template/runtime").IControlProvider>;
|
|
16
|
+
};
|
|
14
17
|
isSimple: {
|
|
15
18
|
type: BooleanConstructor;
|
|
16
19
|
required: false;
|
|
@@ -19,6 +22,10 @@ export declare const IBizEditFormControl: import("@ibiz-template/vue3-util").Typ
|
|
|
19
22
|
type: import("vue").PropType<IData>;
|
|
20
23
|
required: false;
|
|
21
24
|
};
|
|
25
|
+
loadDefault: {
|
|
26
|
+
type: BooleanConstructor;
|
|
27
|
+
default: boolean;
|
|
28
|
+
};
|
|
22
29
|
}, {
|
|
23
30
|
c: import("@ibiz-template/runtime").EditFormController;
|
|
24
31
|
ns: import("@ibiz-template/core").Namespace;
|
|
@@ -35,6 +42,9 @@ export declare const IBizEditFormControl: import("@ibiz-template/vue3-util").Typ
|
|
|
35
42
|
type: import("vue").PropType<IParams>;
|
|
36
43
|
default: () => {};
|
|
37
44
|
};
|
|
45
|
+
provider: {
|
|
46
|
+
type: import("vue").PropType<import("@ibiz-template/runtime").IControlProvider>;
|
|
47
|
+
};
|
|
38
48
|
isSimple: {
|
|
39
49
|
type: BooleanConstructor;
|
|
40
50
|
required: false;
|
|
@@ -43,8 +53,13 @@ export declare const IBizEditFormControl: import("@ibiz-template/vue3-util").Typ
|
|
|
43
53
|
type: import("vue").PropType<IData>;
|
|
44
54
|
required: false;
|
|
45
55
|
};
|
|
56
|
+
loadDefault: {
|
|
57
|
+
type: BooleanConstructor;
|
|
58
|
+
default: boolean;
|
|
59
|
+
};
|
|
46
60
|
}>>, {
|
|
47
61
|
params: IParams;
|
|
62
|
+
loadDefault: boolean;
|
|
48
63
|
isSimple: boolean;
|
|
49
64
|
}, {}>>;
|
|
50
65
|
export default IBizEditFormControl;
|
|
@@ -13,11 +13,7 @@ export declare const FormControl: import("vue").DefineComponent<{
|
|
|
13
13
|
FormDetail: {
|
|
14
14
|
(_props: {
|
|
15
15
|
modelData: IDEFormDetail | IDEFormDetail[];
|
|
16
|
-
}): (VNode
|
|
17
|
-
[key: string]: any;
|
|
18
|
-
}> | VNode<import("vue").RendererNode, import("vue").RendererElement, {
|
|
19
|
-
[key: string]: any;
|
|
20
|
-
}>[] | undefined)[];
|
|
16
|
+
}): (VNode | VNode[] | undefined)[];
|
|
21
17
|
props: string[];
|
|
22
18
|
};
|
|
23
19
|
slotProps: IData;
|
|
@@ -1,9 +1,12 @@
|
|
|
1
|
-
import { renderSlot, createTextVNode, createVNode, resolveComponent, h, defineComponent } from 'vue';
|
|
1
|
+
import { isVNode, renderSlot, createTextVNode, createVNode, resolveComponent, h, defineComponent } from 'vue';
|
|
2
2
|
import { findChildFormDetails } from '@ibiz-template/runtime';
|
|
3
3
|
import { useNamespace } from '@ibiz-template/vue3-util';
|
|
4
4
|
import './form.css';
|
|
5
5
|
|
|
6
6
|
"use strict";
|
|
7
|
+
function _isSlot(s) {
|
|
8
|
+
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
|
|
9
|
+
}
|
|
7
10
|
const FormControl = /* @__PURE__ */ defineComponent({
|
|
8
11
|
name: "IBizFormControl",
|
|
9
12
|
props: {
|
|
@@ -77,23 +80,44 @@ const FormControl = /* @__PURE__ */ defineComponent({
|
|
|
77
80
|
};
|
|
78
81
|
},
|
|
79
82
|
render() {
|
|
83
|
+
const {
|
|
84
|
+
state,
|
|
85
|
+
model,
|
|
86
|
+
controlPanel
|
|
87
|
+
} = this.c;
|
|
88
|
+
const {
|
|
89
|
+
isCreated
|
|
90
|
+
} = state;
|
|
91
|
+
const slots = {};
|
|
92
|
+
if (isCreated) {
|
|
93
|
+
if (this.$slots.default) {
|
|
94
|
+
slots.default = () => {
|
|
95
|
+
return this.$slots.default({
|
|
96
|
+
...this.slotProps
|
|
97
|
+
});
|
|
98
|
+
};
|
|
99
|
+
} else {
|
|
100
|
+
const key = controlPanel ? model.name : "default";
|
|
101
|
+
slots[key] = () => {
|
|
102
|
+
return createVNode(resolveComponent("iBizFormPage"), {
|
|
103
|
+
"modelData": this.c.model,
|
|
104
|
+
"controller": this.c
|
|
105
|
+
}, {
|
|
106
|
+
default: () => {
|
|
107
|
+
var _a;
|
|
108
|
+
return [(_a = this.c.model.deformPages) == null ? void 0 : _a.map((page) => {
|
|
109
|
+
return this.renderByDetailType(page);
|
|
110
|
+
})];
|
|
111
|
+
}
|
|
112
|
+
});
|
|
113
|
+
};
|
|
114
|
+
}
|
|
115
|
+
}
|
|
80
116
|
return createVNode(resolveComponent("iBizControlBase"), {
|
|
81
117
|
"class": [this.ns.b()],
|
|
82
118
|
"controller": this.c
|
|
83
|
-
}, {
|
|
84
|
-
default: () => [
|
|
85
|
-
...this.slotProps
|
|
86
|
-
}) : createVNode(resolveComponent("iBizFormPage"), {
|
|
87
|
-
"modelData": this.c.model,
|
|
88
|
-
"controller": this.c
|
|
89
|
-
}, {
|
|
90
|
-
default: () => {
|
|
91
|
-
var _a;
|
|
92
|
-
return [(_a = this.c.model.deformPages) == null ? void 0 : _a.map((page) => {
|
|
93
|
-
return this.renderByDetailType(page);
|
|
94
|
-
})];
|
|
95
|
-
}
|
|
96
|
-
}), this.$slots.searchFooter && this.$slots.searchFooter({})]]
|
|
119
|
+
}, _isSlot(slots) ? slots : {
|
|
120
|
+
default: () => [slots]
|
|
97
121
|
});
|
|
98
122
|
}
|
|
99
123
|
});
|
|
@@ -9,6 +9,7 @@ import { IBizFormDRUIPart } from '../form-detail/form-druipart/index.mjs';
|
|
|
9
9
|
import { IBizFormRawItem } from '../form-detail/form-rawitem/index.mjs';
|
|
10
10
|
import { IBizFormTabPanel } from '../form-detail/form-tab-panel/index.mjs';
|
|
11
11
|
import { IBizFormTabPage } from '../form-detail/form-tab-page/index.mjs';
|
|
12
|
+
import { IBizFormMDCtrl } from '../form-detail/form-mdctrl/index.mjs';
|
|
12
13
|
|
|
13
14
|
"use strict";
|
|
14
15
|
const IBizFormControl = withInstall(FormControl, function(v) {
|
|
@@ -21,6 +22,7 @@ const IBizFormControl = withInstall(FormControl, function(v) {
|
|
|
21
22
|
v.use(IBizFormRawItem);
|
|
22
23
|
v.use(IBizFormTabPanel);
|
|
23
24
|
v.use(IBizFormTabPage);
|
|
25
|
+
v.use(IBizFormMDCtrl);
|
|
24
26
|
});
|
|
25
27
|
|
|
26
28
|
export { IBizFormControl, IBizFormControl as default };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.ibiz-form-mdctrl-form-item{display:flex}.ibiz-form-mdctrl-form-item__form{flex-grow:1}.ibiz-form-mdctrl-form-item-actions{flex-shrink:0;width:80px;text-align:center}.ibiz-form-mdctrl-form-item-actions .el-button+.el-button{margin-left:0}.ibiz-form-mdctrl-form-item-actions__btn{margin-top:var(--ibiz-spacing-tight)}.ibiz-form-mdctrl-form-no-data{width:100%;display:flex;justify-content:flex-end}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { EventBase, FormMDCtrlFormController } from '@ibiz-template/runtime';
|
|
2
|
+
import './form-mdctrl-form.scss';
|
|
3
|
+
export declare const FormMDCtrlForm: import("vue").DefineComponent<{
|
|
4
|
+
controller: {
|
|
5
|
+
type: typeof FormMDCtrlFormController;
|
|
6
|
+
required: true;
|
|
7
|
+
};
|
|
8
|
+
}, {
|
|
9
|
+
ns: import("@ibiz-template/core").Namespace;
|
|
10
|
+
showActions: import("vue").ComputedRef<boolean>;
|
|
11
|
+
onCreated: (id: string, event: EventBase) => void;
|
|
12
|
+
renderAddBtn: () => JSX.Element;
|
|
13
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
14
|
+
controller: {
|
|
15
|
+
type: typeof FormMDCtrlFormController;
|
|
16
|
+
required: true;
|
|
17
|
+
};
|
|
18
|
+
}>>, {}, {}>;
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
import { computed, resolveComponent, createTextVNode, createVNode, h, defineComponent } from 'vue';
|
|
2
|
+
import { FormMDCtrlFormController } from '@ibiz-template/runtime';
|
|
3
|
+
import { useNamespace } from '@ibiz-template/vue3-util';
|
|
4
|
+
import './form-mdctrl-form.css';
|
|
5
|
+
|
|
6
|
+
"use strict";
|
|
7
|
+
const FormMDCtrlForm = /* @__PURE__ */ defineComponent({
|
|
8
|
+
name: "IBizFormMDCtrlForm",
|
|
9
|
+
props: {
|
|
10
|
+
controller: {
|
|
11
|
+
type: FormMDCtrlFormController,
|
|
12
|
+
required: true
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
setup(props) {
|
|
16
|
+
const ns = useNamespace("form-mdctrl-form");
|
|
17
|
+
const showActions = computed(() => {
|
|
18
|
+
return props.controller.enableCreate || props.controller.enableDelete;
|
|
19
|
+
});
|
|
20
|
+
const renderAddBtn = () => {
|
|
21
|
+
return createVNode(resolveComponent("van-button"), {
|
|
22
|
+
"class": [ns.be("item-actions", "create"), ns.be("item-actions", "btn")],
|
|
23
|
+
"onClick": () => props.controller.create()
|
|
24
|
+
}, {
|
|
25
|
+
default: () => [createTextVNode("\u6DFB\u52A0")]
|
|
26
|
+
});
|
|
27
|
+
};
|
|
28
|
+
const onCreated = (id, event) => {
|
|
29
|
+
props.controller.setFormController(id, event.ctrl);
|
|
30
|
+
};
|
|
31
|
+
return {
|
|
32
|
+
ns,
|
|
33
|
+
showActions,
|
|
34
|
+
onCreated,
|
|
35
|
+
renderAddBtn
|
|
36
|
+
};
|
|
37
|
+
},
|
|
38
|
+
render() {
|
|
39
|
+
const {
|
|
40
|
+
state,
|
|
41
|
+
formProvider,
|
|
42
|
+
model
|
|
43
|
+
} = this.controller;
|
|
44
|
+
return createVNode(resolveComponent("iBizMDCtrlContainer"), {
|
|
45
|
+
"class": this.ns.b(),
|
|
46
|
+
"items": state.items || [],
|
|
47
|
+
"enableCreate": this.controller.enableCreate,
|
|
48
|
+
"enableDelete": this.controller.enableDelete,
|
|
49
|
+
"onAddClick": () => this.controller.create(),
|
|
50
|
+
"onRemoveClick": (item) => this.controller.remove(item.id)
|
|
51
|
+
}, {
|
|
52
|
+
item: ({
|
|
53
|
+
data
|
|
54
|
+
}) => {
|
|
55
|
+
if (!formProvider) {
|
|
56
|
+
return createVNode("div", null, [createTextVNode("\u672A\u627E\u5230\u8868\u5355\u7684\u9002\u914D\u5668")]);
|
|
57
|
+
}
|
|
58
|
+
const formComponent = h(resolveComponent(formProvider.component), {
|
|
59
|
+
class: this.ns.be("item", "form"),
|
|
60
|
+
modelData: model.contentControl,
|
|
61
|
+
context: data.context,
|
|
62
|
+
params: data.params,
|
|
63
|
+
onCreated: (event) => {
|
|
64
|
+
this.onCreated(data.id, event);
|
|
65
|
+
}
|
|
66
|
+
});
|
|
67
|
+
return formComponent;
|
|
68
|
+
}
|
|
69
|
+
});
|
|
70
|
+
}
|
|
71
|
+
});
|
|
72
|
+
|
|
73
|
+
export { FormMDCtrlForm };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.ibiz-form-mdctrl-md-content{flex-grow:1}.ibiz-form-mdctrl-md-actions{flex-shrink:0;text-align:center}.ibiz-form-mdctrl-md-actions .van-button+.van-button{margin-left:0}.ibiz-form-mdctrl-md-actions__btn{width:calc(100% - var(--ibiz-spacing-base) * 2);margin:0 var(--ibiz-spacing-base)}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { EventBase, FormMDCtrlMDController } from '@ibiz-template/runtime';
|
|
2
|
+
import './form-mdctrl-md.scss';
|
|
3
|
+
export declare const FormMDCtrlMD: import("vue").DefineComponent<{
|
|
4
|
+
controller: {
|
|
5
|
+
type: typeof FormMDCtrlMDController;
|
|
6
|
+
required: true;
|
|
7
|
+
};
|
|
8
|
+
}, {
|
|
9
|
+
ns: import("@ibiz-template/core").Namespace;
|
|
10
|
+
showActions: import("vue").ComputedRef<boolean>;
|
|
11
|
+
isSelected: import("vue").Ref<boolean>;
|
|
12
|
+
onCreated: (event: EventBase) => void;
|
|
13
|
+
onSelectionChange: (event: EventBase) => void;
|
|
14
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
15
|
+
controller: {
|
|
16
|
+
type: typeof FormMDCtrlMDController;
|
|
17
|
+
required: true;
|
|
18
|
+
};
|
|
19
|
+
}>>, {}, {}>;
|
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
import { computed, ref, resolveComponent, h, createTextVNode, createVNode, defineComponent } from 'vue';
|
|
2
|
+
import { FormMDCtrlMDController } from '@ibiz-template/runtime';
|
|
3
|
+
import { useNamespace } from '@ibiz-template/vue3-util';
|
|
4
|
+
import './form-mdctrl-md.css';
|
|
5
|
+
|
|
6
|
+
"use strict";
|
|
7
|
+
const FormMDCtrlMD = /* @__PURE__ */ defineComponent({
|
|
8
|
+
name: "IBizFormMDCtrlMD",
|
|
9
|
+
props: {
|
|
10
|
+
controller: {
|
|
11
|
+
type: FormMDCtrlMDController,
|
|
12
|
+
required: true
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
setup(props) {
|
|
16
|
+
const ns = useNamespace("form-mdctrl-md");
|
|
17
|
+
const showActions = computed(() => {
|
|
18
|
+
return props.controller.enableCreate || props.controller.enableDelete;
|
|
19
|
+
});
|
|
20
|
+
const onCreated = (event) => {
|
|
21
|
+
props.controller.setMDControl(event.ctrl);
|
|
22
|
+
};
|
|
23
|
+
const isSelected = ref(false);
|
|
24
|
+
const onSelectionChange = (event) => {
|
|
25
|
+
isSelected.value = event.data.length > 0;
|
|
26
|
+
};
|
|
27
|
+
return {
|
|
28
|
+
ns,
|
|
29
|
+
showActions,
|
|
30
|
+
isSelected,
|
|
31
|
+
onCreated,
|
|
32
|
+
onSelectionChange
|
|
33
|
+
};
|
|
34
|
+
},
|
|
35
|
+
render() {
|
|
36
|
+
const {
|
|
37
|
+
mdProvider,
|
|
38
|
+
model
|
|
39
|
+
} = this.controller;
|
|
40
|
+
const isLoaded = this.controller.form.state.isLoaded;
|
|
41
|
+
let controlComponent = null;
|
|
42
|
+
if (isLoaded) {
|
|
43
|
+
const controlProps = {
|
|
44
|
+
class: this.ns.b("content"),
|
|
45
|
+
modelData: model.contentControl,
|
|
46
|
+
context: this.controller.form.context,
|
|
47
|
+
params: this.controller.form.params,
|
|
48
|
+
onCreated: this.onCreated,
|
|
49
|
+
onSelectionChange: this.onSelectionChange
|
|
50
|
+
};
|
|
51
|
+
if (model.contentType === "GRID") {
|
|
52
|
+
controlProps.rowEditOpen = true;
|
|
53
|
+
}
|
|
54
|
+
controlComponent = h(resolveComponent(mdProvider.component), controlProps);
|
|
55
|
+
}
|
|
56
|
+
return createVNode("div", {
|
|
57
|
+
"class": this.ns.b()
|
|
58
|
+
}, [this.controller.enableCreate && createVNode(resolveComponent("van-button"), {
|
|
59
|
+
"class": [this.ns.be("actions", "create"), this.ns.be("actions", "btn")],
|
|
60
|
+
"size": "small",
|
|
61
|
+
"type": "primary",
|
|
62
|
+
"onClick": () => this.controller.create()
|
|
63
|
+
}, {
|
|
64
|
+
default: () => [createTextVNode("\u6DFB\u52A0")]
|
|
65
|
+
}), controlComponent, this.showActions && createVNode("div", {
|
|
66
|
+
"class": this.ns.b("actions")
|
|
67
|
+
}, [this.controller.enableDelete && createVNode(resolveComponent("van-button"), {
|
|
68
|
+
"type": "danger",
|
|
69
|
+
"size": "small",
|
|
70
|
+
"disabled": !this.isSelected,
|
|
71
|
+
"class": [this.ns.be("actions", "remove"), this.ns.be("actions", "btn")],
|
|
72
|
+
"onClick": () => this.controller.remove()
|
|
73
|
+
}, {
|
|
74
|
+
default: () => [createTextVNode("\u5220\u9664")]
|
|
75
|
+
})])]);
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
|
|
79
|
+
export { FormMDCtrlMD };
|
package/es/control/form/form-detail/form-mdctrl/form-mdctrl-repeater/form-mdctrl-repeater.d.ts
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { FormMDCtrlRepeaterController } from '@ibiz-template/runtime';
|
|
2
|
+
export declare const FormMDCtrlRepeater: import("vue").DefineComponent<{
|
|
3
|
+
controller: {
|
|
4
|
+
type: typeof FormMDCtrlRepeaterController;
|
|
5
|
+
required: true;
|
|
6
|
+
};
|
|
7
|
+
}, {
|
|
8
|
+
ns: import("@ibiz-template/core").Namespace;
|
|
9
|
+
onDataChange: (data: IData | IData[] | null) => void;
|
|
10
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
11
|
+
controller: {
|
|
12
|
+
type: typeof FormMDCtrlRepeaterController;
|
|
13
|
+
required: true;
|
|
14
|
+
};
|
|
15
|
+
}>>, {}, {}>;
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { createTextVNode, createVNode, defineComponent } from 'vue';
|
|
2
|
+
import { FormMDCtrlRepeaterController } from '@ibiz-template/runtime';
|
|
3
|
+
import { useNamespace } from '@ibiz-template/vue3-util';
|
|
4
|
+
import { RepeaterSingleForm } from './repeater-single-form/repeater-single-form.mjs';
|
|
5
|
+
import { RepeaterMultiForm } from './repeater-multi-form/repeater-multi-form.mjs';
|
|
6
|
+
|
|
7
|
+
"use strict";
|
|
8
|
+
const FormMDCtrlRepeater = /* @__PURE__ */ defineComponent({
|
|
9
|
+
name: "IBizFormMDCtrlRepeater",
|
|
10
|
+
props: {
|
|
11
|
+
controller: {
|
|
12
|
+
type: FormMDCtrlRepeaterController,
|
|
13
|
+
required: true
|
|
14
|
+
}
|
|
15
|
+
},
|
|
16
|
+
setup(props) {
|
|
17
|
+
const ns = useNamespace("form-mdctrl-repeater");
|
|
18
|
+
const onDataChange = (data) => {
|
|
19
|
+
props.controller.setValue(data);
|
|
20
|
+
};
|
|
21
|
+
return {
|
|
22
|
+
ns,
|
|
23
|
+
onDataChange
|
|
24
|
+
};
|
|
25
|
+
},
|
|
26
|
+
render() {
|
|
27
|
+
const classNames = [this.ns.b()];
|
|
28
|
+
switch (this.controller.repeaterStyle) {
|
|
29
|
+
case "MultiForm":
|
|
30
|
+
return createVNode(RepeaterMultiForm, {
|
|
31
|
+
"class": classNames,
|
|
32
|
+
"onChange": this.onDataChange,
|
|
33
|
+
"controller": this.controller
|
|
34
|
+
}, null);
|
|
35
|
+
case "SingleForm":
|
|
36
|
+
return createVNode(RepeaterSingleForm, {
|
|
37
|
+
"class": classNames,
|
|
38
|
+
"data": this.controller.value,
|
|
39
|
+
"controller": this.controller,
|
|
40
|
+
"onChange": this.onDataChange
|
|
41
|
+
}, null);
|
|
42
|
+
default:
|
|
43
|
+
return createVNode("div", {
|
|
44
|
+
"class": classNames
|
|
45
|
+
}, [createTextVNode("\u6682\u672A\u652F\u6301\u91CD\u590D\u5668\u6837\u5F0F"), this.controller.repeaterStyle]);
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
});
|
|
49
|
+
|
|
50
|
+
export { FormMDCtrlRepeater };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { FormMDCtrlRepeaterController } from '@ibiz-template/runtime';
|
|
2
|
+
export declare const RepeaterMultiForm: import("vue").DefineComponent<{
|
|
3
|
+
controller: {
|
|
4
|
+
type: typeof FormMDCtrlRepeaterController;
|
|
5
|
+
required: true;
|
|
6
|
+
};
|
|
7
|
+
}, {
|
|
8
|
+
ns: import("@ibiz-template/core").Namespace;
|
|
9
|
+
onValueChange: (value: IData, index: number) => void;
|
|
10
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
11
|
+
change: (_value: IData[]) => true;
|
|
12
|
+
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
13
|
+
controller: {
|
|
14
|
+
type: typeof FormMDCtrlRepeaterController;
|
|
15
|
+
required: true;
|
|
16
|
+
};
|
|
17
|
+
}>> & {
|
|
18
|
+
onChange?: ((_value: IData[]) => any) | undefined;
|
|
19
|
+
}, {}, {}>;
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { resolveComponent, createVNode, defineComponent } from 'vue';
|
|
2
|
+
import { FormMDCtrlRepeaterController } from '@ibiz-template/runtime';
|
|
3
|
+
import { useNamespace } from '@ibiz-template/vue3-util';
|
|
4
|
+
import { RepeaterSingleForm } from '../repeater-single-form/repeater-single-form.mjs';
|
|
5
|
+
|
|
6
|
+
"use strict";
|
|
7
|
+
const RepeaterMultiForm = /* @__PURE__ */ defineComponent({
|
|
8
|
+
name: "IBizRepeaterMultiForm",
|
|
9
|
+
props: {
|
|
10
|
+
controller: {
|
|
11
|
+
type: FormMDCtrlRepeaterController,
|
|
12
|
+
required: true
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
emits: {
|
|
16
|
+
change: (_value) => true
|
|
17
|
+
},
|
|
18
|
+
setup(props, {
|
|
19
|
+
emit
|
|
20
|
+
}) {
|
|
21
|
+
const ns = useNamespace("repeater-multi-form");
|
|
22
|
+
const onValueChange = (value, index) => {
|
|
23
|
+
const arrData = [...props.controller.value];
|
|
24
|
+
arrData[index] = value;
|
|
25
|
+
emit("change", arrData);
|
|
26
|
+
};
|
|
27
|
+
return {
|
|
28
|
+
ns,
|
|
29
|
+
onValueChange
|
|
30
|
+
};
|
|
31
|
+
},
|
|
32
|
+
render() {
|
|
33
|
+
const items = this.controller.value || [];
|
|
34
|
+
return createVNode(resolveComponent("iBizMDCtrlContainer"), {
|
|
35
|
+
"class": this.ns.b(),
|
|
36
|
+
"items": items,
|
|
37
|
+
"enableCreate": this.controller.enableCreate,
|
|
38
|
+
"enableDelete": this.controller.enableDelete,
|
|
39
|
+
"onAddClick": () => this.controller.create(),
|
|
40
|
+
"onRemoveClick": (_item, index) => this.controller.remove(index)
|
|
41
|
+
}, {
|
|
42
|
+
item: ({
|
|
43
|
+
data,
|
|
44
|
+
index
|
|
45
|
+
}) => {
|
|
46
|
+
return createVNode(RepeaterSingleForm, {
|
|
47
|
+
"key": index,
|
|
48
|
+
"data": data,
|
|
49
|
+
"controller": this.controller,
|
|
50
|
+
"onChange": (value) => {
|
|
51
|
+
this.onValueChange(value, index);
|
|
52
|
+
}
|
|
53
|
+
}, null);
|
|
54
|
+
}
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
});
|
|
58
|
+
|
|
59
|
+
export { RepeaterMultiForm };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.ibiz-repeater-single-form{--ibiz-repeater-single-form-header-height:32px;width:100%}.ibiz-repeater-single-form__content{width:100%}.ibiz-repeater-single-form-header{height:var(--ibiz-repeater-single-form-header-height)}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { PropType } from 'vue';
|
|
2
|
+
import { EventBase, FormMDCtrlRepeaterController } from '@ibiz-template/runtime';
|
|
3
|
+
import './repeater-single-form.scss';
|
|
4
|
+
export declare const RepeaterSingleForm: import("vue").DefineComponent<{
|
|
5
|
+
data: {
|
|
6
|
+
type: PropType<IData>;
|
|
7
|
+
required: true;
|
|
8
|
+
};
|
|
9
|
+
controller: {
|
|
10
|
+
type: typeof FormMDCtrlRepeaterController;
|
|
11
|
+
required: true;
|
|
12
|
+
};
|
|
13
|
+
}, {
|
|
14
|
+
ns: import("@ibiz-template/core").Namespace;
|
|
15
|
+
onFormDataChange: (event: EventBase) => void;
|
|
16
|
+
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
17
|
+
change: (_value: IData) => true;
|
|
18
|
+
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
|
19
|
+
data: {
|
|
20
|
+
type: PropType<IData>;
|
|
21
|
+
required: true;
|
|
22
|
+
};
|
|
23
|
+
controller: {
|
|
24
|
+
type: typeof FormMDCtrlRepeaterController;
|
|
25
|
+
required: true;
|
|
26
|
+
};
|
|
27
|
+
}>> & {
|
|
28
|
+
onChange?: ((_value: IData) => any) | undefined;
|
|
29
|
+
}, {}, {}>;
|