@opentiny/vue-renderless 3.12.1 → 3.13.0
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/alert/index.js +50 -1
- package/alert/vue.js +36 -9
- package/calendar-bar/index.js +2 -2
- package/calendar-view/index.js +5 -11
- package/calendar-view/vue.js +1 -1
- package/cascader-mobile/index.js +1 -1
- package/cascader-mobile/vue.js +1 -1
- package/cascader-view/index.js +1 -1
- package/checkbox/vue.js +1 -0
- package/checkbox-group/vue.js +1 -0
- package/col/vue.js +3 -2
- package/common/date.js +2 -0
- package/common/deps/popper.js +14 -1
- package/common/index.js +1 -1
- package/common/runtime.js +1 -1
- package/container/index.js +17 -1
- package/container/vue.js +12 -3
- package/dropdown-item/vue.js +1 -1
- package/grid/utils/common.js +10 -5
- package/input/index.js +8 -2
- package/input/vue.js +13 -8
- package/label/index.js +56 -0
- package/label/vue.js +26 -0
- package/mask/index.js +13 -0
- package/mask/vue.js +18 -0
- package/numeric/index.js +13 -3
- package/numeric/vue.js +6 -1
- package/option/index.js +1 -2
- package/option/vue.js +7 -1
- package/package.json +1 -1
- package/pager/index.js +358 -0
- package/pager/vue.js +114 -2
- package/picker/index.js +1 -1
- package/pop-upload/index.js +0 -2
- package/pop-upload/vue.js +0 -4
- package/pull-refresh/index.js +55 -63
- package/pull-refresh/vue.js +20 -7
- package/select/index.js +9 -1
- package/select/vue.js +5 -4
- package/slider/index.js +27 -3
- package/slider/vue.js +26 -6
- package/tag/vue.js +5 -1
- package/tall-storage/index.js +4 -5
- package/types/action-menu.type.d.ts +5 -0
- package/types/alert.type.d.ts +17 -2
- package/types/button.type.d.ts +1 -0
- package/types/checkbox.type.d.ts +6 -3
- package/types/collapse.type.d.ts +1 -1
- package/types/date-picker.type.d.ts +1 -1
- package/types/{dropdown-item.type-bf83e929.d.ts → dropdown-item.type-8ea6c633.d.ts} +1 -1
- package/types/dropdown-item.type.d.ts +1 -1
- package/types/dropdown-menu.type.d.ts +1 -1
- package/types/dropdown.type.d.ts +1 -0
- package/types/file-upload.type.d.ts +1 -1
- package/types/form-item.type.d.ts +1 -1
- package/types/{form.type-d0fd42f3.d.ts → form.type-654dccd8.d.ts} +1 -1
- package/types/form.type.d.ts +1 -1
- package/types/input.type.d.ts +21 -3
- package/types/label.type.d.ts +81 -0
- package/types/milestone.type.d.ts +1 -1
- package/types/numeric.type.d.ts +1 -1
- package/types/pager.type.d.ts +159 -1
- package/types/popeditor.type.d.ts +1 -1
- package/types/popover.type.d.ts +1 -1
- package/types/progress.type.d.ts +1 -1
- package/types/slider.type.d.ts +8 -0
- package/types/steps.type.d.ts +1 -1
- package/types/switch.type.d.ts +3 -3
- package/types/tab-item.type.d.ts +0 -1
- package/types/tag.type.d.ts +12 -0
- package/types/upload-dragger.type.d.ts +2 -2
- package/types/{upload-list.type-343e8c11.d.ts → upload-list.type-f76f2393.d.ts} +2 -2
- package/types/upload-list.type.d.ts +1 -1
- package/types/upload.type.d.ts +1 -1
package/alert/index.js
CHANGED
|
@@ -1,4 +1,33 @@
|
|
|
1
1
|
import "../chunk-G2ADBYYC.js";
|
|
2
|
+
const ALERT_TIMEOUT = 2e3;
|
|
3
|
+
const watchAutoHide = ({ api, props }) => (newVal) => {
|
|
4
|
+
if (props.autoHide && newVal) {
|
|
5
|
+
const timer = setTimeout(() => {
|
|
6
|
+
api.handleClose();
|
|
7
|
+
clearTimeout(timer);
|
|
8
|
+
}, ALERT_TIMEOUT);
|
|
9
|
+
}
|
|
10
|
+
};
|
|
11
|
+
const computedClass = ({ props, mode }) => () => {
|
|
12
|
+
const { type, size, center } = props;
|
|
13
|
+
if (mode === "mobile") {
|
|
14
|
+
const alertClass = ["tiny-mobile-alert", "tiny-mobile-alert--" + type, "tiny-mobile-alert--" + size];
|
|
15
|
+
if (center) {
|
|
16
|
+
alertClass.push("is-center");
|
|
17
|
+
}
|
|
18
|
+
return alertClass;
|
|
19
|
+
}
|
|
20
|
+
return [];
|
|
21
|
+
};
|
|
22
|
+
const computedStyle = ({ props, mode }) => () => {
|
|
23
|
+
if (mode === "mobile") {
|
|
24
|
+
const style = {
|
|
25
|
+
top: isNaN(props.offset) ? props.offset : `${props.offset}px`
|
|
26
|
+
};
|
|
27
|
+
return style;
|
|
28
|
+
}
|
|
29
|
+
return null;
|
|
30
|
+
};
|
|
2
31
|
const handleClose = ({ emit, state }) => () => {
|
|
3
32
|
state.show = false;
|
|
4
33
|
emit("close");
|
|
@@ -26,9 +55,29 @@ const handleHeaderClick = ({ state, props, vm }) => () => {
|
|
|
26
55
|
}
|
|
27
56
|
}
|
|
28
57
|
};
|
|
58
|
+
const getEl = (node) => {
|
|
59
|
+
return node.$el || node;
|
|
60
|
+
};
|
|
61
|
+
const handlerTargetNode = ({ props, parent, vm, nextTick }) => () => {
|
|
62
|
+
const { target } = props;
|
|
63
|
+
const { $parent } = parent;
|
|
64
|
+
nextTick(() => {
|
|
65
|
+
const alertParentNode = $parent == null ? void 0 : $parent.$refs[target];
|
|
66
|
+
if (!target || !alertParentNode) {
|
|
67
|
+
return;
|
|
68
|
+
}
|
|
69
|
+
const targetNode = Array.isArray(alertParentNode) ? alertParentNode[0] : alertParentNode;
|
|
70
|
+
getEl(targetNode).insertBefore(vm.$el, getEl(targetNode).firstChild);
|
|
71
|
+
});
|
|
72
|
+
};
|
|
29
73
|
export {
|
|
74
|
+
ALERT_TIMEOUT,
|
|
75
|
+
computedClass,
|
|
30
76
|
computedGetIcon,
|
|
31
77
|
computedGetTitle,
|
|
78
|
+
computedStyle,
|
|
32
79
|
handleClose,
|
|
33
|
-
handleHeaderClick
|
|
80
|
+
handleHeaderClick,
|
|
81
|
+
handlerTargetNode,
|
|
82
|
+
watchAutoHide
|
|
34
83
|
};
|
package/alert/vue.js
CHANGED
|
@@ -1,24 +1,51 @@
|
|
|
1
1
|
import "../chunk-G2ADBYYC.js";
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
computedGetIcon,
|
|
4
|
+
computedGetTitle,
|
|
5
|
+
computedStyle,
|
|
6
|
+
computedClass,
|
|
7
|
+
handleClose,
|
|
8
|
+
handleHeaderClick,
|
|
9
|
+
watchAutoHide,
|
|
10
|
+
handlerTargetNode
|
|
11
|
+
} from "./index";
|
|
3
12
|
const api = ["handleClose", "state", "handleHeaderClick"];
|
|
4
|
-
const
|
|
5
|
-
|
|
13
|
+
const initState = ({ api: api2, computed, constants, reactive }) => {
|
|
14
|
+
return reactive({
|
|
6
15
|
show: true,
|
|
7
|
-
getIcon: computed(() => api2.computedGetIcon()),
|
|
8
|
-
getTitle: computed(() => api2.computedGetTitle()),
|
|
9
16
|
contentVisible: false,
|
|
10
17
|
contentDescribeHeight: 0,
|
|
11
18
|
contentDefaultHeight: 0,
|
|
12
19
|
contentMaxHeight: constants.CONTENT_MAXHEUGHT,
|
|
13
|
-
scrollStatus: false
|
|
20
|
+
scrollStatus: false,
|
|
21
|
+
getIcon: computed(() => api2.computedGetIcon()),
|
|
22
|
+
getTitle: computed(() => api2.computedGetTitle()),
|
|
23
|
+
alertClass: computed(() => api2.computedClass()),
|
|
24
|
+
alertStyle: computed(() => api2.computedStyle())
|
|
14
25
|
});
|
|
15
|
-
|
|
26
|
+
};
|
|
27
|
+
const initApi = ({ api: api2, state, constants, props, designConfig, t, emit, vm, parent, nextTick, mode }) => {
|
|
28
|
+
Object.assign(api2, {
|
|
16
29
|
state,
|
|
17
30
|
computedGetIcon: computedGetIcon({ constants, props, designConfig }),
|
|
18
31
|
computedGetTitle: computedGetTitle({ constants, props, t }),
|
|
32
|
+
computedClass: computedClass({ props, mode }),
|
|
33
|
+
computedStyle: computedStyle({ props, mode }),
|
|
19
34
|
handleClose: handleClose({ emit, state }),
|
|
20
|
-
handleHeaderClick: handleHeaderClick({ state, props, vm })
|
|
21
|
-
|
|
35
|
+
handleHeaderClick: handleHeaderClick({ state, props, vm }),
|
|
36
|
+
watchAutoHide: watchAutoHide({ api: api2, props }),
|
|
37
|
+
handlerTargetNode: handlerTargetNode({ props, parent, vm, nextTick })
|
|
38
|
+
});
|
|
39
|
+
};
|
|
40
|
+
const initWatcher = ({ watch, props, api: api2 }) => {
|
|
41
|
+
watch(() => props.autoHide, api2.watchAutoHide, { immediate: true });
|
|
42
|
+
watch(() => props.target, api2.handlerTargetNode, { immediate: true });
|
|
43
|
+
};
|
|
44
|
+
const renderless = (props, { computed, reactive, watch }, { t, emit, constants, vm, designConfig, parent, nextTick, mode }) => {
|
|
45
|
+
const api2 = {};
|
|
46
|
+
const state = initState({ api: api2, computed, constants, reactive });
|
|
47
|
+
initApi({ api: api2, state, constants, props, designConfig, t, emit, vm, parent, nextTick, mode });
|
|
48
|
+
initWatcher({ watch, props, api: api2 });
|
|
22
49
|
return api2;
|
|
23
50
|
};
|
|
24
51
|
export {
|
package/calendar-bar/index.js
CHANGED
|
@@ -53,7 +53,7 @@ const getBuildDay = (args) => (year, month, date) => {
|
|
|
53
53
|
};
|
|
54
54
|
const getPadCalendarDays = ({ calendarDays, buildDay }) => (flag, count, cur) => {
|
|
55
55
|
const sign = flag === "s" ? -1 : 1;
|
|
56
|
-
Array.from({ length: count }).
|
|
56
|
+
Array.from({ length: count }).forEach((v, i) => {
|
|
57
57
|
const d = new Date(cur.getTime() + (i + 1) * sign * 864e5);
|
|
58
58
|
const year = d.getFullYear();
|
|
59
59
|
const month = d.getMonth() + 1;
|
|
@@ -62,7 +62,7 @@ const getPadCalendarDays = ({ calendarDays, buildDay }) => (flag, count, cur) =>
|
|
|
62
62
|
});
|
|
63
63
|
};
|
|
64
64
|
const equalArr = (arr1, arr2) => Array.isArray(arr1) && Array.isArray(arr2) && arr1.join(",") === arr2.join(",");
|
|
65
|
-
const setDayRow = ({ calendarDays, state }) => calendarDays.
|
|
65
|
+
const setDayRow = ({ calendarDays, state }) => calendarDays.forEach((day, i) => {
|
|
66
66
|
day.row = Math.floor(i / state.dayOfWeek);
|
|
67
67
|
if (day.isCur) {
|
|
68
68
|
state.activeRow = day.row;
|
package/calendar-view/index.js
CHANGED
|
@@ -1,15 +1,9 @@
|
|
|
1
1
|
import {
|
|
2
2
|
__spreadValues
|
|
3
3
|
} from "../chunk-G2ADBYYC.js";
|
|
4
|
-
import { cloneDeep } from "
|
|
5
|
-
import { getDirection } from "
|
|
6
|
-
import {
|
|
7
|
-
getDays,
|
|
8
|
-
lastMonth,
|
|
9
|
-
nextMonth,
|
|
10
|
-
getCalendar,
|
|
11
|
-
transformArray
|
|
12
|
-
} from "@opentiny/vue-renderless/common/calendar/calendar";
|
|
4
|
+
import { cloneDeep } from "../chart-core/deps/utils";
|
|
5
|
+
import { getDirection } from "../common/deps/touch";
|
|
6
|
+
import { getDays, lastMonth, nextMonth, getCalendar, transformArray } from "../common/calendar/calendar";
|
|
13
7
|
const getTime = (date) => new Date(date).getTime();
|
|
14
8
|
const newSchedule = ({ emit }) => (date) => emit("new-schedule", date);
|
|
15
9
|
const isShowNewSchedule = ({ props }) => (date) => props.showNewSchedule instanceof Function ? props.showNewSchedule(date) : false;
|
|
@@ -230,7 +224,7 @@ const getEventByMonth = ({ state }) => (year, month) => {
|
|
|
230
224
|
day: state.weekDays[new Date(date).getDay()],
|
|
231
225
|
events: []
|
|
232
226
|
};
|
|
233
|
-
state.events.
|
|
227
|
+
state.events.forEach((item) => {
|
|
234
228
|
if (eventInThisTime(item, startTime, endTime)) {
|
|
235
229
|
obj.events.push(item);
|
|
236
230
|
state.monthEventsLength += 1;
|
|
@@ -276,7 +270,7 @@ const getEventByDate = ({ state }) => (date, events) => {
|
|
|
276
270
|
const endTime = getTime(date + " " + state.dayEndTime);
|
|
277
271
|
state.curWeekEvents[date] = [];
|
|
278
272
|
events ? events = [] : state.curWeekEvents[date] = [];
|
|
279
|
-
state.events.
|
|
273
|
+
state.events.forEach((item) => {
|
|
280
274
|
if (eventInThisTime(item, startTime, endTime)) {
|
|
281
275
|
events ? events.push(item) : state.curWeekEvents[date].push(item);
|
|
282
276
|
}
|
package/calendar-view/vue.js
CHANGED
package/cascader-mobile/index.js
CHANGED
|
@@ -78,7 +78,7 @@ const selectOption = ({ emit, state, props, api }) => (option) => {
|
|
|
78
78
|
option.loading = false;
|
|
79
79
|
state.loading = false;
|
|
80
80
|
option.loaded = true;
|
|
81
|
-
nodes.
|
|
81
|
+
nodes.forEach((data) => {
|
|
82
82
|
state.store.append(data, option.data);
|
|
83
83
|
index = waitLoadList.indexOf(data[valueField]);
|
|
84
84
|
if (index !== -1) {
|
package/cascader-mobile/vue.js
CHANGED
|
@@ -53,7 +53,7 @@ const renderless = (props, { computed, reactive, watch }, { emit, constants }) =
|
|
|
53
53
|
options: computed(() => {
|
|
54
54
|
let arr;
|
|
55
55
|
let list = [state.rootData];
|
|
56
|
-
state.navList.
|
|
56
|
+
state.navList.forEach((option) => {
|
|
57
57
|
arr = option.childNodes;
|
|
58
58
|
arr && arr.length && list.push(arr);
|
|
59
59
|
});
|
package/cascader-view/index.js
CHANGED
|
@@ -62,7 +62,7 @@ const nodeExpand = ({ emit, state, props, api }) => (option) => {
|
|
|
62
62
|
state.loading = false;
|
|
63
63
|
option.loading = false;
|
|
64
64
|
option.loaded = true;
|
|
65
|
-
nodes.
|
|
65
|
+
nodes.forEach((data) => {
|
|
66
66
|
index = -1;
|
|
67
67
|
state.store.append(data, option.data);
|
|
68
68
|
waitLoadCheckList.some((item, i) => {
|
package/checkbox/vue.js
CHANGED
|
@@ -25,6 +25,7 @@ const initState = ({ reactive, computed, parent, api: api2, inject, props }) =>
|
|
|
25
25
|
const state = reactive({
|
|
26
26
|
size: props.size || inject("size", null),
|
|
27
27
|
vertical: inject("vertical", null),
|
|
28
|
+
iconPosition: props.iconPosition || inject("iconPosition", "center"),
|
|
28
29
|
focus: false,
|
|
29
30
|
selfModel: false,
|
|
30
31
|
showLabel: false,
|
package/checkbox-group/vue.js
CHANGED
package/col/vue.js
CHANGED
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import "../chunk-G2ADBYYC.js";
|
|
2
2
|
import { setSubitemAttrValue, setGlobalAttrValue, getClassName, getStyle, row } from "./index";
|
|
3
3
|
const api = ["state"];
|
|
4
|
-
const renderless = (props, { computed, reactive }, { parent }) => {
|
|
4
|
+
const renderless = (props, { computed, reactive, inject }, { parent }) => {
|
|
5
5
|
const api2 = {};
|
|
6
6
|
const state = reactive({
|
|
7
7
|
row: computed(() => api2.row()),
|
|
8
8
|
style: computed(() => api2.getStyle()),
|
|
9
|
-
className: computed(() => api2.getClassName())
|
|
9
|
+
className: computed(() => api2.getClassName()),
|
|
10
|
+
layout: inject("layout")
|
|
10
11
|
});
|
|
11
12
|
Object.assign(api2, {
|
|
12
13
|
state,
|
package/common/date.js
CHANGED
|
@@ -16,6 +16,7 @@ const dateFormatRegs = {
|
|
|
16
16
|
"M{1,2}": /M{1,2}/,
|
|
17
17
|
"d{1,2}": /d{1,2}/,
|
|
18
18
|
"h{1,2}": /h{1,2}/,
|
|
19
|
+
"H{1,2}": /H{1,2}/,
|
|
19
20
|
"m{1,2}": /m{1,2}/,
|
|
20
21
|
"s{1,2}": /s{1,2}/,
|
|
21
22
|
"S{1,3}": /S{1,3}/,
|
|
@@ -272,6 +273,7 @@ const format = function(date, dateFormat = "yyyy/MM/dd hh:mm:ss") {
|
|
|
272
273
|
"M{1,2}": date.getMonth() + 1,
|
|
273
274
|
"d{1,2}": date.getDate(),
|
|
274
275
|
"h{1,2}": date.getHours(),
|
|
276
|
+
"H{1,2}": date.getHours(),
|
|
275
277
|
"m{1,2}": date.getMinutes(),
|
|
276
278
|
"s{1,2}": date.getSeconds(),
|
|
277
279
|
"S{1,3}": date.getMilliseconds(),
|
package/common/deps/popper.js
CHANGED
|
@@ -161,6 +161,9 @@ const getOffsetRect = (el) => {
|
|
|
161
161
|
elementRect.bottom = elementRect.top + elementRect.height;
|
|
162
162
|
return elementRect;
|
|
163
163
|
};
|
|
164
|
+
const stopFn = (ev) => {
|
|
165
|
+
ev.stopPropagation();
|
|
166
|
+
};
|
|
164
167
|
class Popper {
|
|
165
168
|
constructor(reference, popper, options) {
|
|
166
169
|
this.modifiers = {};
|
|
@@ -192,6 +195,7 @@ class Popper {
|
|
|
192
195
|
}
|
|
193
196
|
update() {
|
|
194
197
|
let data = { instance: this, styles: {} };
|
|
198
|
+
this.stopEventBubble();
|
|
195
199
|
this.popperOuterSize = null;
|
|
196
200
|
data.placement = data._originalPlacement = this._options.placement;
|
|
197
201
|
data.offsets = this._getRefPopOffsets(this._popper, this._reference, data.placement);
|
|
@@ -199,6 +203,15 @@ class Popper {
|
|
|
199
203
|
data = this.runModifiers(data, this._options.modifierFns);
|
|
200
204
|
typeof this.state.updateCallback === "function" && this.state.updateCallback(data);
|
|
201
205
|
}
|
|
206
|
+
// 阻止popper的mousewheel等事件冒泡。 通过 onxxx 绑定,是为了避免重复绑定事件
|
|
207
|
+
stopEventBubble() {
|
|
208
|
+
if (!this._popper)
|
|
209
|
+
return;
|
|
210
|
+
if (!this._popper.onmousewheel)
|
|
211
|
+
this._popper.onmousewheel = stopFn;
|
|
212
|
+
if (!this._popper.onwheel)
|
|
213
|
+
this._popper.onwheel = stopFn;
|
|
214
|
+
}
|
|
202
215
|
/** 按顺序执行Modifiers, 如果传入终点modifier,则执行到指定位置 */
|
|
203
216
|
runModifiers(data, modifiers2, ends) {
|
|
204
217
|
let modifiersToRun = modifiers2.slice();
|
|
@@ -206,7 +219,7 @@ class Popper {
|
|
|
206
219
|
if (ends !== void 0) {
|
|
207
220
|
modifiersToRun = this._options.modifierFns.slice(
|
|
208
221
|
0,
|
|
209
|
-
_options.modifierFns.findIndex((m) => m
|
|
222
|
+
_options.modifierFns.findIndex((m) => m === ends)
|
|
210
223
|
);
|
|
211
224
|
}
|
|
212
225
|
modifiersToRun.forEach((modifier) => {
|
package/common/index.js
CHANGED
package/common/runtime.js
CHANGED
package/container/index.js
CHANGED
|
@@ -73,12 +73,28 @@ const computedFooterStyle = ({ constants, props }) => () => {
|
|
|
73
73
|
height: transferWidthOrHeight(props.footerHeight)
|
|
74
74
|
};
|
|
75
75
|
};
|
|
76
|
+
const computedLeftStyle = ({ constants, props }) => () => {
|
|
77
|
+
return {
|
|
78
|
+
width: transferWidthOrHeight(props.leftWidth)
|
|
79
|
+
};
|
|
80
|
+
};
|
|
81
|
+
const computedShowRight = ({ constants, props }) => () => {
|
|
82
|
+
return props.pattern === constants.DEFAULT ? false : true;
|
|
83
|
+
};
|
|
84
|
+
const computedRightStyle = ({ constants, props }) => () => {
|
|
85
|
+
return {
|
|
86
|
+
width: transferWidthOrHeight(props.rightWidth)
|
|
87
|
+
};
|
|
88
|
+
};
|
|
76
89
|
export {
|
|
77
90
|
computedAsideStyle,
|
|
78
91
|
computedFooterStyle,
|
|
79
92
|
computedHeaderStyle,
|
|
93
|
+
computedLeftStyle,
|
|
80
94
|
computedMainStyle,
|
|
95
|
+
computedRightStyle,
|
|
81
96
|
computedShowAside,
|
|
82
97
|
computedShowFooter,
|
|
83
|
-
computedShowHeader
|
|
98
|
+
computedShowHeader,
|
|
99
|
+
computedShowRight
|
|
84
100
|
};
|
package/container/vue.js
CHANGED
|
@@ -6,7 +6,10 @@ import {
|
|
|
6
6
|
computedHeaderStyle,
|
|
7
7
|
computedAsideStyle,
|
|
8
8
|
computedMainStyle,
|
|
9
|
-
computedFooterStyle
|
|
9
|
+
computedFooterStyle,
|
|
10
|
+
computedLeftStyle,
|
|
11
|
+
computedShowRight,
|
|
12
|
+
computedRightStyle
|
|
10
13
|
} from "./index";
|
|
11
14
|
const api = ["state"];
|
|
12
15
|
const renderless = (props, { computed, reactive }, { constants }) => {
|
|
@@ -18,7 +21,10 @@ const renderless = (props, { computed, reactive }, { constants }) => {
|
|
|
18
21
|
mainStyle: computed(() => api2.computedMainStyle()),
|
|
19
22
|
asideStyle: computed(() => api2.computedAsideStyle()),
|
|
20
23
|
headerStyle: computed(() => api2.computedHeaderStyle()),
|
|
21
|
-
footerStyle: computed(() => api2.computedFooterStyle())
|
|
24
|
+
footerStyle: computed(() => api2.computedFooterStyle()),
|
|
25
|
+
showRight: computed(() => api2.computedShowRight()),
|
|
26
|
+
leftStyle: computed(() => api2.computedLeftStyle()),
|
|
27
|
+
rightStyle: computed(() => api2.computedRightStyle())
|
|
22
28
|
});
|
|
23
29
|
Object.assign(api2, {
|
|
24
30
|
state,
|
|
@@ -28,7 +34,10 @@ const renderless = (props, { computed, reactive }, { constants }) => {
|
|
|
28
34
|
computedMainStyle: computedMainStyle({ constants, props }),
|
|
29
35
|
computedAsideStyle: computedAsideStyle({ constants, props }),
|
|
30
36
|
computedHeaderStyle: computedHeaderStyle({ constants, props }),
|
|
31
|
-
computedFooterStyle: computedFooterStyle({ constants, props })
|
|
37
|
+
computedFooterStyle: computedFooterStyle({ constants, props }),
|
|
38
|
+
computedLeftStyle: computedLeftStyle({ constants, props }),
|
|
39
|
+
computedShowRight: computedShowRight({ constants, props }),
|
|
40
|
+
computedRightStyle: computedRightStyle({ constants, props })
|
|
32
41
|
});
|
|
33
42
|
return api2;
|
|
34
43
|
};
|
package/dropdown-item/vue.js
CHANGED
|
@@ -84,7 +84,7 @@ const initApi = ({ api: api2, state, emit, props, parent, dispatch, vm, constant
|
|
|
84
84
|
};
|
|
85
85
|
const renderless = (props, { computed, reactive, watch, inject }, { parent, emit, vm, dispatch, mode, constants, designConfig }) => {
|
|
86
86
|
const api2 = {};
|
|
87
|
-
const dropdownMenuVm = inject("dropdownMenuVm");
|
|
87
|
+
const dropdownMenuVm = inject("dropdownMenuVm", null);
|
|
88
88
|
if (mode === "mobile" && dropdownMenuVm) {
|
|
89
89
|
dropdownMenuVm.state.children = [...dropdownMenuVm.state.children, vm];
|
|
90
90
|
}
|
package/grid/utils/common.js
CHANGED
|
@@ -15,7 +15,11 @@ const getRowid = ($table, row) => {
|
|
|
15
15
|
const getColumnList = (columns) => {
|
|
16
16
|
const result = [];
|
|
17
17
|
columns.forEach((column) => {
|
|
18
|
-
|
|
18
|
+
if (column.children && column.children.length) {
|
|
19
|
+
result.push(...getColumnList(column.children));
|
|
20
|
+
} else {
|
|
21
|
+
result.push(column);
|
|
22
|
+
}
|
|
19
23
|
});
|
|
20
24
|
return result;
|
|
21
25
|
};
|
|
@@ -79,9 +83,10 @@ const destroyColumn = ($table, { columnConfig }) => {
|
|
|
79
83
|
}
|
|
80
84
|
$table.collectColumn = $table.collectColumn.slice(0);
|
|
81
85
|
};
|
|
82
|
-
const emitEvent = (
|
|
83
|
-
if (
|
|
84
|
-
|
|
86
|
+
const emitEvent = (vm, type, args) => {
|
|
87
|
+
if (vm.tableListeners[type]) {
|
|
88
|
+
const params = [].concat(args);
|
|
89
|
+
vm.$emit(type, ...params);
|
|
85
90
|
}
|
|
86
91
|
};
|
|
87
92
|
const assemColumn = ($table, $column, instance) => {
|
|
@@ -112,7 +117,7 @@ const getListeners = ($attrs, $listeners) => {
|
|
|
112
117
|
Object.keys($attrs).forEach((name) => {
|
|
113
118
|
const event = $attrs[name];
|
|
114
119
|
if (regEventPrefix.test(name) && typeof event === "function") {
|
|
115
|
-
listeners[name.
|
|
120
|
+
listeners[name.slice(2).replace(regHyphenate, "-$1").toLowerCase()] = event;
|
|
116
121
|
}
|
|
117
122
|
});
|
|
118
123
|
return listeners;
|
package/input/index.js
CHANGED
|
@@ -37,6 +37,11 @@ const showBox = (state) => () => {
|
|
|
37
37
|
}
|
|
38
38
|
state.boxVisibility = true;
|
|
39
39
|
};
|
|
40
|
+
const inputStyle = ({ props }) => () => {
|
|
41
|
+
return {
|
|
42
|
+
textAlign: props.textAlign
|
|
43
|
+
};
|
|
44
|
+
};
|
|
40
45
|
const calculateNodeStyling = () => (targetElement) => {
|
|
41
46
|
const style = window.getComputedStyle(targetElement);
|
|
42
47
|
const boxSizing = style.getPropertyValue(STYLE.BoxSizing);
|
|
@@ -95,7 +100,7 @@ const calcTextareaHeight = ({
|
|
|
95
100
|
hiddenTextarea = null;
|
|
96
101
|
return textareaStyle;
|
|
97
102
|
};
|
|
98
|
-
const getInput = (
|
|
103
|
+
const getInput = (vm) => () => vm.$refs.input || vm.$refs.textarea;
|
|
99
104
|
const blur = (api) => () => api.getInput().blur();
|
|
100
105
|
const focus = (api) => () => api.getInput().focus();
|
|
101
106
|
const select = (api) => () => api.getInput().select();
|
|
@@ -229,7 +234,7 @@ const watchFormSelect = ({ emit, props, state }) => (value) => {
|
|
|
229
234
|
emit("update:modelValue", value);
|
|
230
235
|
emit("change", value);
|
|
231
236
|
const filterData = props.selectMenu.length && props.selectMenu.filter((item) => item.id === value).shift();
|
|
232
|
-
state.
|
|
237
|
+
state.checkedLabel = filterData ? filterData.label : "";
|
|
233
238
|
}
|
|
234
239
|
};
|
|
235
240
|
const hasSelection = (api) => () => {
|
|
@@ -287,6 +292,7 @@ export {
|
|
|
287
292
|
handlePasswordVisible,
|
|
288
293
|
hasSelection,
|
|
289
294
|
hiddenPassword,
|
|
295
|
+
inputStyle,
|
|
290
296
|
resizeTextarea,
|
|
291
297
|
select,
|
|
292
298
|
setNativeInputValue,
|
package/input/vue.js
CHANGED
|
@@ -30,7 +30,8 @@ import {
|
|
|
30
30
|
handleEnterDisplayOnlyContent,
|
|
31
31
|
hiddenPassword,
|
|
32
32
|
dispatchDisplayedValue,
|
|
33
|
-
getDisplayedValue
|
|
33
|
+
getDisplayedValue,
|
|
34
|
+
inputStyle
|
|
34
35
|
} from "./index";
|
|
35
36
|
import useStorageBox from "../tall-storage/vue-storage-box";
|
|
36
37
|
const api = [
|
|
@@ -63,7 +64,8 @@ const api = [
|
|
|
63
64
|
"isMemoryStorage",
|
|
64
65
|
"hasSelection",
|
|
65
66
|
"handleEnterDisplayOnlyContent",
|
|
66
|
-
"hiddenPassword"
|
|
67
|
+
"hiddenPassword",
|
|
68
|
+
"inputStyle"
|
|
67
69
|
];
|
|
68
70
|
const initState = ({
|
|
69
71
|
reactive,
|
|
@@ -82,7 +84,7 @@ const initState = ({
|
|
|
82
84
|
passwordVisible: false,
|
|
83
85
|
boxVisibility: false,
|
|
84
86
|
textareaCalcStyle: {},
|
|
85
|
-
|
|
87
|
+
checkedLabel: "",
|
|
86
88
|
sheetvalue: props.modelValue,
|
|
87
89
|
inputSize: computed(() => props.size || state.formItemSize),
|
|
88
90
|
showClear: computed(
|
|
@@ -98,8 +100,10 @@ const initState = ({
|
|
|
98
100
|
() => props.disabled || (parent.tinyForm || {}).disabled || state.isDisplayOnly || (parent.tinyForm || {}).displayOnly
|
|
99
101
|
),
|
|
100
102
|
validateState: computed(() => parent.formItem ? parent.formItem.validateState : ""),
|
|
103
|
+
inputStyle: computed(() => api2.inputStyle()),
|
|
101
104
|
textareaStyle: computed(() => __spreadProps(__spreadValues({}, state.textareaCalcStyle), {
|
|
102
|
-
resize: props.resize
|
|
105
|
+
resize: props.resize,
|
|
106
|
+
textAlign: props.textAlign
|
|
103
107
|
})),
|
|
104
108
|
needStatusIcon: computed(() => parent.tinyForm ? parent.tinyForm.statusIcon : false),
|
|
105
109
|
showPwdVisible: computed(
|
|
@@ -125,7 +129,7 @@ const initApi = ({
|
|
|
125
129
|
dispatch,
|
|
126
130
|
broadcast,
|
|
127
131
|
emit,
|
|
128
|
-
|
|
132
|
+
vm,
|
|
129
133
|
props,
|
|
130
134
|
CLASS_PREFIX,
|
|
131
135
|
parent
|
|
@@ -136,7 +140,7 @@ const initApi = ({
|
|
|
136
140
|
broadcast,
|
|
137
141
|
showBox: showBox(state),
|
|
138
142
|
clear: clear(emit),
|
|
139
|
-
getInput: getInput(
|
|
143
|
+
getInput: getInput(vm),
|
|
140
144
|
handleChange: handleChange(emit),
|
|
141
145
|
watchFormSelect: watchFormSelect({ emit, props, state }),
|
|
142
146
|
calcIconOffset: calcIconOffset({ CLASS_PREFIX, parent }),
|
|
@@ -145,7 +149,8 @@ const initApi = ({
|
|
|
145
149
|
handleCompositionStart: handleCompositionStart(state),
|
|
146
150
|
handleCompositionUpdate: handleCompositionUpdate(state),
|
|
147
151
|
dispatchDisplayedValue: dispatchDisplayedValue({ state, props, dispatch, api: api2 }),
|
|
148
|
-
getDisplayedValue: getDisplayedValue({ state, props })
|
|
152
|
+
getDisplayedValue: getDisplayedValue({ state, props }),
|
|
153
|
+
inputStyle: inputStyle({ props })
|
|
149
154
|
});
|
|
150
155
|
};
|
|
151
156
|
const mergeApi = ({
|
|
@@ -266,7 +271,7 @@ const renderless = (props, { computed, onMounted, onUpdated, reactive, toRefs, w
|
|
|
266
271
|
InputGroup: constants.inputGroupMode(mode)
|
|
267
272
|
};
|
|
268
273
|
const state = initState({ reactive, computed, mode, props, parent, constants, api: api2 });
|
|
269
|
-
initApi({ api: api2, state, dispatch, broadcast, emit, refs, props, CLASS_PREFIX, parent });
|
|
274
|
+
initApi({ api: api2, state, dispatch, broadcast, emit, refs, props, CLASS_PREFIX, parent, vm });
|
|
270
275
|
const storages = useStorageBox({ api: api2, props, reactive, toRefs });
|
|
271
276
|
parent.tinyForm = parent.tinyForm || inject("form", null);
|
|
272
277
|
mergeApi({ api: api2, storages, componentName, emit, eventName, props, state, nextTick, parent, refs });
|
package/label/index.js
ADDED
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
import "../chunk-G2ADBYYC.js";
|
|
2
|
+
const prefix = "tiny-mobile-label-";
|
|
3
|
+
function numFormat(num, decimal) {
|
|
4
|
+
let str = "";
|
|
5
|
+
str = (Math.round(num * 100) / 100).toFixed(decimal).toString().replace(/(\d)(?=(\d{3})+\.)/g, function($0, $1) {
|
|
6
|
+
return $1 + ",";
|
|
7
|
+
});
|
|
8
|
+
return str;
|
|
9
|
+
}
|
|
10
|
+
function handleNumberLabel(label, decimal) {
|
|
11
|
+
let val = label;
|
|
12
|
+
const reg1 = /[^(\-|\+)?\d+(\.\d+)?$]/g;
|
|
13
|
+
const reg2 = /0*([1-9]\d*|0\.\d+)/;
|
|
14
|
+
val = val.replace(reg1, "").replace(reg2, "$1");
|
|
15
|
+
let arr = val.split(".");
|
|
16
|
+
let numStr = "";
|
|
17
|
+
for (let i = 0; i < arr.length; i++) {
|
|
18
|
+
if (i === arr.length - 1 && arr.length > 1) {
|
|
19
|
+
numStr += ".";
|
|
20
|
+
}
|
|
21
|
+
numStr += arr[i];
|
|
22
|
+
}
|
|
23
|
+
numStr = numFormat(numStr, decimal);
|
|
24
|
+
numStr = numStr.replace(/\d+/, (s) => {
|
|
25
|
+
return s.replace(/(\d)(?=(\d{3})+$)/g, "$1,");
|
|
26
|
+
});
|
|
27
|
+
return numStr;
|
|
28
|
+
}
|
|
29
|
+
const handleClick = ({ emit, state }) => () => {
|
|
30
|
+
emit("click", state.label);
|
|
31
|
+
};
|
|
32
|
+
const computeLabel = (props) => () => {
|
|
33
|
+
let label = props.label;
|
|
34
|
+
if (props.type === "number") {
|
|
35
|
+
label = handleNumberLabel(props.label, props.decimal);
|
|
36
|
+
}
|
|
37
|
+
if (props.limit !== 0 && label.length > props.limit) {
|
|
38
|
+
return label.slice(0, props.limit);
|
|
39
|
+
}
|
|
40
|
+
return label;
|
|
41
|
+
};
|
|
42
|
+
const computeLabelClass = (props) => () => {
|
|
43
|
+
return [
|
|
44
|
+
`${prefix}${props.size}`,
|
|
45
|
+
`${prefix}${props.color}`,
|
|
46
|
+
`${prefix}${props.position}`,
|
|
47
|
+
props.wholeline || props.ellipsis === 1 || props.ellipsis === 2 || props.ellipsis === 3 ? `${prefix}wholeline` : "",
|
|
48
|
+
props.ellipsis > 0 && props.ellipsis < 4 ? `${prefix}ellipsis${props.ellipsis}` : "",
|
|
49
|
+
props.bold ? `${prefix}bold` : ""
|
|
50
|
+
];
|
|
51
|
+
};
|
|
52
|
+
export {
|
|
53
|
+
computeLabel,
|
|
54
|
+
computeLabelClass,
|
|
55
|
+
handleClick
|
|
56
|
+
};
|
package/label/vue.js
ADDED
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import "../chunk-G2ADBYYC.js";
|
|
2
|
+
import { handleClick, computeLabel, computeLabelClass } from "./index";
|
|
3
|
+
const api = ["state", "handleClick", "computeLabel", "computeLabelStyle", "computeLabelClass"];
|
|
4
|
+
const renderless = (props, { computed, onBeforeUnmount, reactive, watch, inject }, { emit, parent }) => {
|
|
5
|
+
parent.tinyForm = parent.tinyForm || inject("form", null);
|
|
6
|
+
const state = reactive({
|
|
7
|
+
label: computed(() => api2.computeLabel()),
|
|
8
|
+
type: props.type,
|
|
9
|
+
color: props.color,
|
|
10
|
+
size: props.size,
|
|
11
|
+
labelClass: computed(() => api2.computeLabelClass()),
|
|
12
|
+
isRequired: props.isRequired
|
|
13
|
+
});
|
|
14
|
+
const api2 = {
|
|
15
|
+
state,
|
|
16
|
+
handleClick: handleClick({ emit, state }),
|
|
17
|
+
computeLabel: computeLabel(props),
|
|
18
|
+
// computeLabelStyle: computeLabelStyle(props, state),
|
|
19
|
+
computeLabelClass: computeLabelClass(props)
|
|
20
|
+
};
|
|
21
|
+
return api2;
|
|
22
|
+
};
|
|
23
|
+
export {
|
|
24
|
+
api,
|
|
25
|
+
renderless
|
|
26
|
+
};
|
package/mask/index.js
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import "../chunk-G2ADBYYC.js";
|
|
2
|
+
const handleTouch = ({ props, emit }) => (event) => {
|
|
3
|
+
if (props.cancelTouch) {
|
|
4
|
+
event.preventDefault();
|
|
5
|
+
event.stopPropagation();
|
|
6
|
+
} else {
|
|
7
|
+
emit("update:visible", false);
|
|
8
|
+
}
|
|
9
|
+
emit("click", props.visible);
|
|
10
|
+
};
|
|
11
|
+
export {
|
|
12
|
+
handleTouch
|
|
13
|
+
};
|