@power-xa/m-ui 0.0.7 → 0.0.8
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/README.md +37 -25
- package/dist/ActionSheet/index.js +5 -3
- package/dist/Breadcrumb/index.js +4 -2
- package/dist/Calendar/Date/index.d.ts +8 -0
- package/dist/Calendar/Date/index.js +246 -0
- package/dist/Calendar/Date/index.less +146 -0
- package/dist/Calendar/Month/index.d.ts +7 -0
- package/dist/Calendar/Month/index.js +199 -0
- package/dist/Calendar/Month/index.less +96 -0
- package/dist/Calendar/Week/index.d.ts +7 -0
- package/dist/Calendar/Week/index.js +200 -0
- package/dist/Calendar/Week/index.less +96 -0
- package/dist/Calendar/index.d.ts +10 -0
- package/dist/Calendar/index.js +9 -0
- package/dist/Filter/index.js +4 -4
- package/dist/ProForm/Controls/Cascader/index.d.ts +28 -0
- package/dist/ProForm/Controls/Cascader/index.js +159 -0
- package/dist/ProForm/Controls/Cascader/index.less +106 -0
- package/dist/ProForm/Controls/Date/index.d.ts +6 -1
- package/dist/ProForm/Controls/Date/index.js +12 -4
- package/dist/ProForm/Controls/Date/index.less +18 -0
- package/dist/ProForm/Controls/List/index.d.ts +2 -8
- package/dist/ProForm/Controls/List/index.js +17 -9
- package/dist/ProForm/Controls/List/index.less +0 -0
- package/dist/ProForm/Controls/Select/index.d.ts +50 -1
- package/dist/ProForm/Controls/Select/index.js +289 -211
- package/dist/ProForm/Controls/Select/index.less +29 -0
- package/dist/ProForm/Controls/Stepper/index.d.ts +10 -0
- package/dist/ProForm/Controls/Stepper/index.js +72 -0
- package/dist/ProForm/Controls/Stepper/index.less +31 -0
- package/dist/ProForm/Controls/Switch/index.d.ts +5 -0
- package/dist/ProForm/Controls/Switch/index.js +21 -0
- package/dist/ProForm/Controls/Switch/index.less +3 -0
- package/dist/ProForm/Controls/Text/index.d.ts +9 -2
- package/dist/ProForm/Controls/Text/index.js +12 -12
- package/dist/ProForm/Controls/Text/index.less +0 -0
- package/dist/ProForm/Controls/TextArea/index.d.ts +6 -1
- package/dist/ProForm/Controls/TextArea/index.js +10 -11
- package/dist/ProForm/Controls/Upload/index.d.ts +32 -9
- package/dist/ProForm/Controls/Upload/index.js +14 -6
- package/dist/ProForm/Controls/Upload/index.less +0 -0
- package/dist/ProForm/Field/index.d.ts +27 -4
- package/dist/ProForm/Field/index.js +12 -13
- package/dist/ProForm/Field/index.less +0 -4
- package/dist/ProForm/Form/index.d.ts +41 -6
- package/dist/ProForm/Form/index.js +294 -172
- package/dist/ProForm/Form/index.less +0 -0
- package/dist/ProForm/Group/index.d.ts +22 -3
- package/dist/ProForm/Group/index.js +8 -30
- package/dist/ProForm/Group/index.less +0 -0
- package/dist/ProForm/index.d.ts +4 -4
- package/dist/ProForm/index.js +5 -5
- package/dist/ProList/index.d.ts +8 -2
- package/dist/ProList/index.js +6 -4
- package/dist/Tabbar/index.d.ts +4 -2
- package/dist/Tabbar/index.js +14 -5
- package/dist/Tabs/index.d.ts +8 -5
- package/dist/Tabs/index.js +3 -3
- package/dist/Tabs/index.less +4 -1
- package/dist/UserView/index.d.ts +15 -0
- package/dist/UserView/index.js +62 -0
- package/dist/UserView/index.less +41 -0
- package/dist/ValidMobilePopup/index.d.ts +9 -0
- package/dist/ValidMobilePopup/index.js +147 -0
- package/dist/ValidMobilePopup/index.less +58 -0
- package/dist/hooks/index.d.ts +22 -0
- package/dist/hooks/index.js +51 -0
- package/dist/index.d.ts +17 -2
- package/dist/index.js +9 -1
- package/dist/services/CommonController/index.d.ts +5 -0
- package/dist/services/CommonController/index.js +21 -0
- package/dist/services/CommonController/typings.d.ts +0 -0
- package/dist/services/index.d.ts +2 -1
- package/dist/services/index.js +2 -1
- package/package.json +6 -3
- package/dist/ProForm/typings.d.ts +0 -164
- package/dist/RefreshList/index.d.ts +0 -17
- package/dist/RefreshList/index.js +0 -43
- package/dist/RefreshList/index.less +0 -19
- package/dist/assets/fonts/PingFangSC-Light.ttf +0 -0
- package/dist/assets/fonts/PingFangSC-Medium.ttf +0 -0
- package/dist/assets/fonts/PingFangSC-Regular.ttf +0 -0
|
@@ -0,0 +1,199 @@
|
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
3
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
4
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
5
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
+
import React, { useCallback, useEffect, useState } from "react";
|
|
8
|
+
import { createSelectorQuery } from "@tarojs/taro";
|
|
9
|
+
import { Text, View } from "@tarojs/components";
|
|
10
|
+
import dayjs from "dayjs";
|
|
11
|
+
import "./index.less";
|
|
12
|
+
var CalendarMonth = function CalendarMonth(_ref) {
|
|
13
|
+
var onChange = _ref.onChange;
|
|
14
|
+
var today = dayjs();
|
|
15
|
+
var _useState = useState(dayjs()),
|
|
16
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
17
|
+
current = _useState2[0],
|
|
18
|
+
setCurrent = _useState2[1];
|
|
19
|
+
var _useState3 = useState([]),
|
|
20
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
21
|
+
monthList = _useState4[0],
|
|
22
|
+
setMonthList = _useState4[1];
|
|
23
|
+
var _useState5 = useState({}),
|
|
24
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
25
|
+
rect = _useState6[0],
|
|
26
|
+
setRect = _useState6[1];
|
|
27
|
+
var _useState7 = useState({
|
|
28
|
+
x: 0,
|
|
29
|
+
y: 0
|
|
30
|
+
}),
|
|
31
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
32
|
+
position = _useState8[0],
|
|
33
|
+
setPosition = _useState8[1];
|
|
34
|
+
var _useState9 = useState({
|
|
35
|
+
x: 0,
|
|
36
|
+
y: 0
|
|
37
|
+
}),
|
|
38
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
39
|
+
startPosition = _useState10[0],
|
|
40
|
+
setStartPosition = _useState10[1];
|
|
41
|
+
var _useState11 = useState(false),
|
|
42
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
|
43
|
+
touching = _useState12[0],
|
|
44
|
+
setTouching = _useState12[1];
|
|
45
|
+
var _useState13 = useState(0),
|
|
46
|
+
_useState14 = _slicedToArray(_useState13, 2),
|
|
47
|
+
index = _useState14[0],
|
|
48
|
+
setIndex = _useState14[1];
|
|
49
|
+
useEffect(function () {
|
|
50
|
+
setMonthList(formatMonthList(current));
|
|
51
|
+
var query = createSelectorQuery();
|
|
52
|
+
query.select("#p-calendar-month-content").boundingClientRect(function (rect) {
|
|
53
|
+
if (!(rect instanceof Array)) {
|
|
54
|
+
setRect(rect);
|
|
55
|
+
}
|
|
56
|
+
}).exec();
|
|
57
|
+
}, []);
|
|
58
|
+
useEffect(function () {
|
|
59
|
+
if (current) onChange === null || onChange === void 0 || onChange(current.startOf("month").format("YYYY-MM-DD"), current.endOf("month").format("YYYY-MM-DD"));
|
|
60
|
+
}, [current]);
|
|
61
|
+
var returnToday = useCallback(function () {
|
|
62
|
+
setCurrent(today);
|
|
63
|
+
setIndex(0);
|
|
64
|
+
setMonthList(formatMonthList(today));
|
|
65
|
+
}, []);
|
|
66
|
+
var _onTouchStart = useCallback(function (e) {
|
|
67
|
+
e.stopPropagation();
|
|
68
|
+
var x = e.touches[0].clientX;
|
|
69
|
+
var y = e.touches[0].clientY;
|
|
70
|
+
/* 判断是左右滑动还是上下滑动 */
|
|
71
|
+
setStartPosition({
|
|
72
|
+
x: x,
|
|
73
|
+
y: y
|
|
74
|
+
});
|
|
75
|
+
setTouching(true);
|
|
76
|
+
}, []);
|
|
77
|
+
var _onTouchMove = useCallback(function (e) {
|
|
78
|
+
e.stopPropagation();
|
|
79
|
+
var x = e.touches[0].clientX - startPosition.x;
|
|
80
|
+
var y = e.touches[0].clientY - startPosition.y;
|
|
81
|
+
/* 判断是左右滑动还是上下滑动 */
|
|
82
|
+
if (Math.abs(x) > Math.abs(y)) {
|
|
83
|
+
setPosition({
|
|
84
|
+
x: x / rect.width,
|
|
85
|
+
y: 0
|
|
86
|
+
});
|
|
87
|
+
}
|
|
88
|
+
}, [startPosition, rect]);
|
|
89
|
+
var _onTouchEnd = useCallback(function (e) {
|
|
90
|
+
e.stopPropagation();
|
|
91
|
+
setTouching(false);
|
|
92
|
+
var x = Math.abs(position.x);
|
|
93
|
+
var y = Math.abs(position.y);
|
|
94
|
+
if (x > y) {
|
|
95
|
+
var currentIndex = position.x > 0 ? index + 1 : index - 1;
|
|
96
|
+
setIndex(currentIndex);
|
|
97
|
+
var currentMonth = current[position.x > 0 ? "subtract" : "add"](6, "month");
|
|
98
|
+
setMonthList(formatMonthList(currentMonth));
|
|
99
|
+
setCurrent(currentMonth.month() + 1 < 7 ? currentMonth.month(0) : currentMonth.month(6));
|
|
100
|
+
}
|
|
101
|
+
setPosition({
|
|
102
|
+
x: 0,
|
|
103
|
+
y: 0
|
|
104
|
+
});
|
|
105
|
+
}, [position, index, current]);
|
|
106
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
107
|
+
className: "p-calendar-month-container"
|
|
108
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
109
|
+
className: "p-calendar-month-header"
|
|
110
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
111
|
+
className: "current-month"
|
|
112
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
113
|
+
className: "sub-text"
|
|
114
|
+
}, current.format("YYYY年")), /*#__PURE__*/React.createElement(Text, {
|
|
115
|
+
className: "text"
|
|
116
|
+
}, current.format("MM月"))), !current.isSame(today, 'month') && /*#__PURE__*/React.createElement(View, {
|
|
117
|
+
className: "button",
|
|
118
|
+
onTap: returnToday
|
|
119
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
120
|
+
className: "text"
|
|
121
|
+
}, "\u56DE\u5230\u672C\u6708"))), /*#__PURE__*/React.createElement(View, {
|
|
122
|
+
className: "p-calendar-month-content",
|
|
123
|
+
id: "p-calendar-month-content",
|
|
124
|
+
onTouchStart: function onTouchStart(e) {
|
|
125
|
+
return _onTouchStart(e);
|
|
126
|
+
},
|
|
127
|
+
onTouchMove: function onTouchMove(e) {
|
|
128
|
+
return _onTouchMove(e);
|
|
129
|
+
},
|
|
130
|
+
onTouchEnd: function onTouchEnd(e) {
|
|
131
|
+
return _onTouchEnd(e);
|
|
132
|
+
}
|
|
133
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
134
|
+
className: "p-calendar-month-content-body",
|
|
135
|
+
style: {
|
|
136
|
+
transform: "translateX(".concat(-index * 100, "%)")
|
|
137
|
+
}
|
|
138
|
+
}, monthList.map(function (list, i) {
|
|
139
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
140
|
+
className: "p-calendar-month-cell",
|
|
141
|
+
key: 'calendar-cell-' + i,
|
|
142
|
+
style: {
|
|
143
|
+
transform: "translateX(".concat((i - 1 + index + (touching ? position.x : 0)) * 100, "%)"),
|
|
144
|
+
transitionDuration: "".concat(touching ? 0 : .3, "s")
|
|
145
|
+
}
|
|
146
|
+
}, list.map(function (m, mi) {
|
|
147
|
+
var selected = m.isSame(current, "month");
|
|
148
|
+
var isToday = m.isSame(today, "month");
|
|
149
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
150
|
+
className: "p-calendar-month-view ".concat(isToday ? 'today' : '', " ").concat(selected ? 'selected' : ''),
|
|
151
|
+
key: 'calendar-view-' + mi,
|
|
152
|
+
onTap: function onTap() {
|
|
153
|
+
return setCurrent(m);
|
|
154
|
+
}
|
|
155
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
156
|
+
className: "p-calendar-month-view-text"
|
|
157
|
+
}, m.format("MM月")));
|
|
158
|
+
}));
|
|
159
|
+
}))));
|
|
160
|
+
};
|
|
161
|
+
export default CalendarMonth;
|
|
162
|
+
var formatMonthList = function formatMonthList(date) {
|
|
163
|
+
/* 获取当前月 */
|
|
164
|
+
var month = date.month() + 1;
|
|
165
|
+
var monthList = [];
|
|
166
|
+
var prev = date.startOf("year").subtract(1, "year");
|
|
167
|
+
var next = date.startOf("year").add(1, "year");
|
|
168
|
+
var current = date.startOf("year");
|
|
169
|
+
if (month < 7) {
|
|
170
|
+
monthList = [Array.from({
|
|
171
|
+
length: 6
|
|
172
|
+
}, function (_, i) {
|
|
173
|
+
return prev.month(i + 6);
|
|
174
|
+
}), Array.from({
|
|
175
|
+
length: 6
|
|
176
|
+
}, function (_, i) {
|
|
177
|
+
return current.month(i);
|
|
178
|
+
}), Array.from({
|
|
179
|
+
length: 6
|
|
180
|
+
}, function (_, i) {
|
|
181
|
+
return current.month(i + 6);
|
|
182
|
+
})];
|
|
183
|
+
} else {
|
|
184
|
+
monthList = [Array.from({
|
|
185
|
+
length: 6
|
|
186
|
+
}, function (_, i) {
|
|
187
|
+
return current.month(i);
|
|
188
|
+
}), Array.from({
|
|
189
|
+
length: 6
|
|
190
|
+
}, function (_, i) {
|
|
191
|
+
return current.month(i + 6);
|
|
192
|
+
}), Array.from({
|
|
193
|
+
length: 6
|
|
194
|
+
}, function (_, i) {
|
|
195
|
+
return next.month(i);
|
|
196
|
+
})];
|
|
197
|
+
}
|
|
198
|
+
return monthList;
|
|
199
|
+
};
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
@import "@power-xa/m-ui/dist/assets/less/mixins.less";
|
|
2
|
+
|
|
3
|
+
.p-calendar-month-container {
|
|
4
|
+
display: flex;
|
|
5
|
+
flex-direction: column;
|
|
6
|
+
gap: 16px;
|
|
7
|
+
|
|
8
|
+
.p-calendar-month-header {
|
|
9
|
+
display: flex;
|
|
10
|
+
align-items: center;
|
|
11
|
+
justify-content: space-between;
|
|
12
|
+
|
|
13
|
+
.current-month {
|
|
14
|
+
display: flex;
|
|
15
|
+
align-items: center;
|
|
16
|
+
gap: 24px;
|
|
17
|
+
|
|
18
|
+
.sub-text {
|
|
19
|
+
.font(28, #999);
|
|
20
|
+
position: relative;
|
|
21
|
+
|
|
22
|
+
&::after {
|
|
23
|
+
position: absolute;
|
|
24
|
+
content: "";
|
|
25
|
+
width: 1px;
|
|
26
|
+
height: 20px;
|
|
27
|
+
background: #999;
|
|
28
|
+
top: 50%;
|
|
29
|
+
margin-top: -10px;
|
|
30
|
+
right: -12px;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.text {
|
|
35
|
+
.font(28)
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.button {
|
|
40
|
+
display: flex;
|
|
41
|
+
align-items: center;
|
|
42
|
+
|
|
43
|
+
.text {
|
|
44
|
+
.font(28, #999)
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.p-calendar-month-content {
|
|
50
|
+
overflow: hidden;
|
|
51
|
+
|
|
52
|
+
.p-calendar-month-content-body {
|
|
53
|
+
display: flex;
|
|
54
|
+
align-items: center;
|
|
55
|
+
flex-wrap: nowrap;
|
|
56
|
+
height: 50px;
|
|
57
|
+
|
|
58
|
+
.p-calendar-month-cell {
|
|
59
|
+
display: flex;
|
|
60
|
+
align-items: center;
|
|
61
|
+
justify-content: space-around;
|
|
62
|
+
gap: 24px;
|
|
63
|
+
width: 100%;
|
|
64
|
+
flex-shrink: 0;
|
|
65
|
+
will-change: transform;
|
|
66
|
+
position: absolute;
|
|
67
|
+
|
|
68
|
+
.p-calendar-month-view {
|
|
69
|
+
flex: 1;
|
|
70
|
+
flex-shrink: 0;
|
|
71
|
+
display: flex;
|
|
72
|
+
align-items: center;
|
|
73
|
+
justify-content: center;
|
|
74
|
+
border-radius: 25px;
|
|
75
|
+
padding: 8px 0;
|
|
76
|
+
|
|
77
|
+
.p-calendar-month-view-text {
|
|
78
|
+
.font(24);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
&.today {
|
|
82
|
+
background: #F6F7F9;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
&.selected {
|
|
86
|
+
background: #333437;
|
|
87
|
+
|
|
88
|
+
.p-calendar-month-view-text {
|
|
89
|
+
color: #fff;
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
}
|
|
@@ -0,0 +1,200 @@
|
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
3
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
4
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
5
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
6
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
+
import React, { useCallback, useEffect, useState } from "react";
|
|
8
|
+
import { createSelectorQuery } from "@tarojs/taro";
|
|
9
|
+
import { Text, View } from "@tarojs/components";
|
|
10
|
+
import dayjs from "dayjs";
|
|
11
|
+
import "./index.less";
|
|
12
|
+
var updateLocale = require("dayjs/plugin/updateLocale");
|
|
13
|
+
var isBetween = require("dayjs/plugin/isBetween");
|
|
14
|
+
dayjs.extend(isBetween);
|
|
15
|
+
dayjs.extend(updateLocale);
|
|
16
|
+
dayjs.updateLocale("en", {
|
|
17
|
+
weekStart: 1
|
|
18
|
+
});
|
|
19
|
+
var CalendarWeek = function CalendarWeek(_ref) {
|
|
20
|
+
var onChange = _ref.onChange;
|
|
21
|
+
var today = dayjs();
|
|
22
|
+
var _useState = useState(today),
|
|
23
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
24
|
+
currentMonth = _useState2[0],
|
|
25
|
+
setCurrentMonth = _useState2[1];
|
|
26
|
+
var _useState3 = useState(dayjs()),
|
|
27
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
28
|
+
current = _useState4[0],
|
|
29
|
+
setCurrent = _useState4[1];
|
|
30
|
+
var _useState5 = useState([]),
|
|
31
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
32
|
+
weekList = _useState6[0],
|
|
33
|
+
setWeekList = _useState6[1];
|
|
34
|
+
var _useState7 = useState({}),
|
|
35
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
36
|
+
rect = _useState8[0],
|
|
37
|
+
setRect = _useState8[1];
|
|
38
|
+
var _useState9 = useState({
|
|
39
|
+
x: 0,
|
|
40
|
+
y: 0
|
|
41
|
+
}),
|
|
42
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
43
|
+
position = _useState10[0],
|
|
44
|
+
setPosition = _useState10[1];
|
|
45
|
+
var _useState11 = useState({
|
|
46
|
+
x: 0,
|
|
47
|
+
y: 0
|
|
48
|
+
}),
|
|
49
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
|
50
|
+
startPosition = _useState12[0],
|
|
51
|
+
setStartPosition = _useState12[1];
|
|
52
|
+
var _useState13 = useState(false),
|
|
53
|
+
_useState14 = _slicedToArray(_useState13, 2),
|
|
54
|
+
touching = _useState14[0],
|
|
55
|
+
setTouching = _useState14[1];
|
|
56
|
+
var _useState15 = useState(0),
|
|
57
|
+
_useState16 = _slicedToArray(_useState15, 2),
|
|
58
|
+
index = _useState16[0],
|
|
59
|
+
setIndex = _useState16[1];
|
|
60
|
+
useEffect(function () {
|
|
61
|
+
var result = formatMonthList(current);
|
|
62
|
+
setWeekList(result.weekList);
|
|
63
|
+
var query = createSelectorQuery();
|
|
64
|
+
query.select("#p-calendar-week-content").boundingClientRect(function (rect) {
|
|
65
|
+
if (!(rect instanceof Array)) {
|
|
66
|
+
setRect(rect);
|
|
67
|
+
}
|
|
68
|
+
}).exec();
|
|
69
|
+
}, []);
|
|
70
|
+
useEffect(function () {
|
|
71
|
+
if (current) onChange === null || onChange === void 0 || onChange(current.startOf("week").format("YYYY-MM-DD"), current.endOf("week").format("YYYY-MM-DD"));
|
|
72
|
+
}, [current]);
|
|
73
|
+
var returnToday = useCallback(function () {
|
|
74
|
+
setCurrent(today);
|
|
75
|
+
setIndex(0);
|
|
76
|
+
var result = formatMonthList(today);
|
|
77
|
+
setCurrentMonth(today);
|
|
78
|
+
setWeekList(result.weekList);
|
|
79
|
+
}, []);
|
|
80
|
+
var _onTouchStart = useCallback(function (e) {
|
|
81
|
+
e.stopPropagation();
|
|
82
|
+
var x = e.touches[0].clientX;
|
|
83
|
+
var y = e.touches[0].clientY;
|
|
84
|
+
/* 判断是左右滑动还是上下滑动 */
|
|
85
|
+
setStartPosition({
|
|
86
|
+
x: x,
|
|
87
|
+
y: y
|
|
88
|
+
});
|
|
89
|
+
setTouching(true);
|
|
90
|
+
}, []);
|
|
91
|
+
var _onTouchMove = useCallback(function (e) {
|
|
92
|
+
e.stopPropagation();
|
|
93
|
+
var x = e.touches[0].clientX - startPosition.x;
|
|
94
|
+
var y = e.touches[0].clientY - startPosition.y;
|
|
95
|
+
/* 判断是左右滑动还是上下滑动 */
|
|
96
|
+
if (Math.abs(x) > Math.abs(y)) {
|
|
97
|
+
setPosition({
|
|
98
|
+
x: x / rect.width,
|
|
99
|
+
y: 0
|
|
100
|
+
});
|
|
101
|
+
}
|
|
102
|
+
}, [startPosition, rect]);
|
|
103
|
+
var _onTouchEnd = useCallback(function (e) {
|
|
104
|
+
e.stopPropagation();
|
|
105
|
+
setTouching(false);
|
|
106
|
+
var x = Math.abs(position.x);
|
|
107
|
+
var y = Math.abs(position.y);
|
|
108
|
+
if (x > y) {
|
|
109
|
+
var currentIndex = position.x > 0 ? index + 1 : index - 1;
|
|
110
|
+
setIndex(currentIndex);
|
|
111
|
+
var month = currentMonth[position.x > 0 ? "subtract" : "add"](1, "month");
|
|
112
|
+
var result = formatMonthList(month.startOf("month"));
|
|
113
|
+
setCurrentMonth(month);
|
|
114
|
+
setWeekList(result.weekList);
|
|
115
|
+
setCurrent(month.startOf("month").startOf("week").add(1, "day"));
|
|
116
|
+
}
|
|
117
|
+
setPosition({
|
|
118
|
+
x: 0,
|
|
119
|
+
y: 0
|
|
120
|
+
});
|
|
121
|
+
}, [position, index, current, currentMonth]);
|
|
122
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
123
|
+
className: "p-calendar-week-container"
|
|
124
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
125
|
+
className: "p-calendar-week-header"
|
|
126
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
127
|
+
className: "current-week"
|
|
128
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
129
|
+
className: "sub-text"
|
|
130
|
+
}, current.format("YYYY年")), /*#__PURE__*/React.createElement(Text, {
|
|
131
|
+
className: "text"
|
|
132
|
+
}, current.startOf("week").format("MM月DD日"), " - ", current.endOf("week").format("MM月DD日"))), !current.isSame(today, 'day') && /*#__PURE__*/React.createElement(View, {
|
|
133
|
+
className: "button",
|
|
134
|
+
onTap: returnToday
|
|
135
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
136
|
+
className: "text"
|
|
137
|
+
}, "\u56DE\u5230\u672C\u5468"))), /*#__PURE__*/React.createElement(View, {
|
|
138
|
+
className: "p-calendar-week-content",
|
|
139
|
+
id: "p-calendar-week-content",
|
|
140
|
+
onTouchStart: function onTouchStart(e) {
|
|
141
|
+
return _onTouchStart(e);
|
|
142
|
+
},
|
|
143
|
+
onTouchMove: function onTouchMove(e) {
|
|
144
|
+
return _onTouchMove(e);
|
|
145
|
+
},
|
|
146
|
+
onTouchEnd: function onTouchEnd(e) {
|
|
147
|
+
return _onTouchEnd(e);
|
|
148
|
+
}
|
|
149
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
150
|
+
className: "p-calendar-week-content-body",
|
|
151
|
+
style: {
|
|
152
|
+
transform: "translateX(".concat(-index * 100, "%)")
|
|
153
|
+
}
|
|
154
|
+
}, weekList.map(function (list, i) {
|
|
155
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
156
|
+
className: "p-calendar-week-cell",
|
|
157
|
+
key: 'calendar-cell-' + i,
|
|
158
|
+
style: {
|
|
159
|
+
transform: "translateX(".concat((i - 1 + index + (touching ? position.x : 0)) * 100, "%)"),
|
|
160
|
+
transitionDuration: "".concat(touching ? 0 : .3, "s")
|
|
161
|
+
}
|
|
162
|
+
}, list.map(function (w, wi) {
|
|
163
|
+
var selected = current.isBetween(w.start, w.end);
|
|
164
|
+
var isToday = today.isBetween(w.start, w.end);
|
|
165
|
+
return /*#__PURE__*/React.createElement(View, {
|
|
166
|
+
className: "p-calendar-week-view ".concat(isToday ? 'today' : '', " ").concat(selected ? 'selected' : ''),
|
|
167
|
+
key: 'calendar-view-' + wi,
|
|
168
|
+
onTap: function onTap() {
|
|
169
|
+
return setCurrent(w.start.add(1, "day"));
|
|
170
|
+
}
|
|
171
|
+
}, /*#__PURE__*/React.createElement(Text, {
|
|
172
|
+
className: "p-calendar-week-view-text"
|
|
173
|
+
}, "\u7B2C", wi + 1, "\u5468"));
|
|
174
|
+
}));
|
|
175
|
+
}))));
|
|
176
|
+
};
|
|
177
|
+
export default CalendarWeek;
|
|
178
|
+
var formatWeekList = function formatWeekList(date) {
|
|
179
|
+
var start = date.startOf("month");
|
|
180
|
+
var end = date.endOf("month");
|
|
181
|
+
|
|
182
|
+
// 一个月多少天
|
|
183
|
+
var length = Number(end.format("DD"));
|
|
184
|
+
var count = Math.floor(length / 7) + (start.day() === 1 ? 0 : 1);
|
|
185
|
+
return Array.from({
|
|
186
|
+
length: count
|
|
187
|
+
}).map(function (_, i) {
|
|
188
|
+
var date = start.add(i * 7, "day");
|
|
189
|
+
return {
|
|
190
|
+
start: date.startOf("week"),
|
|
191
|
+
end: date.endOf("week")
|
|
192
|
+
};
|
|
193
|
+
});
|
|
194
|
+
};
|
|
195
|
+
var formatMonthList = function formatMonthList(date) {
|
|
196
|
+
return {
|
|
197
|
+
month: date.month() + 1,
|
|
198
|
+
weekList: [formatWeekList(date.subtract(1, "month")), formatWeekList(date), formatWeekList(date.add(1, "month"))]
|
|
199
|
+
};
|
|
200
|
+
};
|
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
@import "@power-xa/m-ui/dist/assets/less/mixins.less";
|
|
2
|
+
|
|
3
|
+
.p-calendar-week-container {
|
|
4
|
+
display: flex;
|
|
5
|
+
flex-direction: column;
|
|
6
|
+
gap: 16px;
|
|
7
|
+
|
|
8
|
+
.p-calendar-week-header {
|
|
9
|
+
display: flex;
|
|
10
|
+
align-items: center;
|
|
11
|
+
justify-content: space-between;
|
|
12
|
+
|
|
13
|
+
.current-week {
|
|
14
|
+
display: flex;
|
|
15
|
+
align-items: center;
|
|
16
|
+
gap: 24px;
|
|
17
|
+
|
|
18
|
+
.sub-text {
|
|
19
|
+
.font(28, #999);
|
|
20
|
+
position: relative;
|
|
21
|
+
|
|
22
|
+
&::after {
|
|
23
|
+
position: absolute;
|
|
24
|
+
content: "";
|
|
25
|
+
width: 1px;
|
|
26
|
+
height: 20px;
|
|
27
|
+
background: #999;
|
|
28
|
+
top: 50%;
|
|
29
|
+
margin-top: -10px;
|
|
30
|
+
right: -12px;
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.text {
|
|
35
|
+
.font(28)
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.button {
|
|
40
|
+
display: flex;
|
|
41
|
+
align-items: center;
|
|
42
|
+
|
|
43
|
+
.text {
|
|
44
|
+
.font(28, #999)
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.p-calendar-week-content {
|
|
50
|
+
overflow: hidden;
|
|
51
|
+
|
|
52
|
+
.p-calendar-week-content-body {
|
|
53
|
+
display: flex;
|
|
54
|
+
align-items: center;
|
|
55
|
+
flex-wrap: nowrap;
|
|
56
|
+
height: 50px;
|
|
57
|
+
|
|
58
|
+
.p-calendar-week-cell {
|
|
59
|
+
display: flex;
|
|
60
|
+
align-items: center;
|
|
61
|
+
justify-content: space-around;
|
|
62
|
+
gap: 24px;
|
|
63
|
+
width: 100%;
|
|
64
|
+
flex-shrink: 0;
|
|
65
|
+
will-change: transform;
|
|
66
|
+
position: absolute;
|
|
67
|
+
|
|
68
|
+
.p-calendar-week-view {
|
|
69
|
+
flex: 1;
|
|
70
|
+
flex-shrink: 0;
|
|
71
|
+
display: flex;
|
|
72
|
+
align-items: center;
|
|
73
|
+
justify-content: center;
|
|
74
|
+
border-radius: 25px;
|
|
75
|
+
padding: 8px 0;
|
|
76
|
+
|
|
77
|
+
.p-calendar-week-view-text {
|
|
78
|
+
.font(24);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
&.today {
|
|
82
|
+
background: #F6F7F9;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
&.selected {
|
|
86
|
+
background: #333437;
|
|
87
|
+
|
|
88
|
+
.p-calendar-week-view-text {
|
|
89
|
+
color: #fff;
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
}
|
package/dist/Filter/index.js
CHANGED
|
@@ -61,14 +61,14 @@ var Filter = function Filter(_ref) {
|
|
|
61
61
|
className: "footer"
|
|
62
62
|
}, /*#__PURE__*/React.createElement(Button, {
|
|
63
63
|
onTap: function onTap() {
|
|
64
|
-
var _formRef$current;
|
|
65
|
-
(_formRef$current = formRef.current) === null || _formRef$current === void 0 || _formRef$current.
|
|
64
|
+
var _formRef$current, _formRef$current$rese;
|
|
65
|
+
(_formRef$current = formRef.current) === null || _formRef$current === void 0 || (_formRef$current$rese = _formRef$current.resetFields) === null || _formRef$current$rese === void 0 || _formRef$current$rese.call(_formRef$current);
|
|
66
66
|
},
|
|
67
67
|
round: true
|
|
68
68
|
}, "\u91CD\u7F6E"), /*#__PURE__*/React.createElement(Button, {
|
|
69
69
|
onTap: function onTap() {
|
|
70
|
-
var _formRef$current2;
|
|
71
|
-
onFilter((_formRef$current2 = formRef.current) === null || _formRef$current2 === void 0 ? void 0 : _formRef$current2.
|
|
70
|
+
var _formRef$current2, _formRef$current2$get;
|
|
71
|
+
onFilter((_formRef$current2 = formRef.current) === null || _formRef$current2 === void 0 || (_formRef$current2$get = _formRef$current2.getFieldsValue) === null || _formRef$current2$get === void 0 ? void 0 : _formRef$current2$get.call(_formRef$current2, true));
|
|
72
72
|
onOpenChange();
|
|
73
73
|
},
|
|
74
74
|
round: true,
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { FC, ReactNode } from "react";
|
|
2
|
+
import type { ProFormFieldProps } from "../../Field";
|
|
3
|
+
import "./index.less";
|
|
4
|
+
type ProFormCascaderProps = ProFormFieldProps & {
|
|
5
|
+
options?: {
|
|
6
|
+
[key: string]: any;
|
|
7
|
+
}[];
|
|
8
|
+
multiple?: boolean;
|
|
9
|
+
params?: {
|
|
10
|
+
[key: string]: any;
|
|
11
|
+
};
|
|
12
|
+
request?: (params?: {
|
|
13
|
+
[key: string]: any;
|
|
14
|
+
}) => Promise<{
|
|
15
|
+
[key: string]: any;
|
|
16
|
+
}[]>;
|
|
17
|
+
fieldNames?: {
|
|
18
|
+
label: string;
|
|
19
|
+
value: string;
|
|
20
|
+
children?: string;
|
|
21
|
+
};
|
|
22
|
+
popupExtra?: {
|
|
23
|
+
top?: ReactNode;
|
|
24
|
+
bottom?: ReactNode;
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
declare const Cascader: FC<ProFormCascaderProps>;
|
|
28
|
+
export default Cascader;
|