@vue-start/pro 0.1.0 → 0.2.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/CHANGELOG.md +15 -0
- package/dist/index.d.ts +1021 -61
- package/dist/index.es.js +1072 -326
- package/dist/index.js +1073 -319
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -8,41 +8,121 @@ var rxjs = require('rxjs');
|
|
|
8
8
|
var hooks = require('@vue-start/hooks');
|
|
9
9
|
var request = require('@vue-start/request');
|
|
10
10
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
11
|
+
function ownKeys(object, enumerableOnly) {
|
|
12
|
+
var keys = Object.keys(object);
|
|
13
|
+
|
|
14
|
+
if (Object.getOwnPropertySymbols) {
|
|
15
|
+
var symbols = Object.getOwnPropertySymbols(object);
|
|
16
|
+
enumerableOnly && (symbols = symbols.filter(function (sym) {
|
|
17
|
+
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
|
|
18
|
+
})), keys.push.apply(keys, symbols);
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
return keys;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
function _objectSpread2(target) {
|
|
25
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
26
|
+
var source = null != arguments[i] ? arguments[i] : {};
|
|
27
|
+
i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
|
|
28
|
+
_defineProperty(target, key, source[key]);
|
|
29
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
|
|
30
|
+
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
return target;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
function _defineProperty(obj, key, value) {
|
|
38
|
+
if (key in obj) {
|
|
39
|
+
Object.defineProperty(obj, key, {
|
|
40
|
+
value: value,
|
|
41
|
+
enumerable: true,
|
|
42
|
+
configurable: true,
|
|
43
|
+
writable: true
|
|
44
|
+
});
|
|
45
|
+
} else {
|
|
46
|
+
obj[key] = value;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
return obj;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
function _toConsumableArray(arr) {
|
|
53
|
+
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
function _arrayWithoutHoles(arr) {
|
|
57
|
+
if (Array.isArray(arr)) return _arrayLikeToArray(arr);
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
function _iterableToArray(iter) {
|
|
61
|
+
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
function _unsupportedIterableToArray(o, minLen) {
|
|
65
|
+
if (!o) return;
|
|
66
|
+
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
|
|
67
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
68
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
69
|
+
if (n === "Map" || n === "Set") return Array.from(o);
|
|
70
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
function _arrayLikeToArray(arr, len) {
|
|
74
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
75
|
+
|
|
76
|
+
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
|
|
77
|
+
|
|
78
|
+
return arr2;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
function _nonIterableSpread() {
|
|
82
|
+
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
var createUseRequestActor = function createUseRequestActor(filterFun) {
|
|
86
|
+
return function (actors, callback) {
|
|
87
|
+
var _useRequestProvide = request.useRequestProvide(),
|
|
88
|
+
requestSubject$ = _useRequestProvide.requestSubject$;
|
|
89
|
+
|
|
90
|
+
var nameSet = new Set(lodash.map(actors, function (actor) {
|
|
91
|
+
return lodash.isString(actor) ? actor : actor.name;
|
|
92
|
+
}));
|
|
93
|
+
hooks.useEffect(function () {
|
|
94
|
+
var sub = requestSubject$.pipe(rxjs.filter(filterFun), rxjs.tap(function (actor) {
|
|
95
|
+
if (nameSet.has(actor.name)) {
|
|
96
|
+
callback(actor);
|
|
97
|
+
}
|
|
98
|
+
})).subscribe();
|
|
99
|
+
return function () {
|
|
100
|
+
sub.unsubscribe();
|
|
101
|
+
};
|
|
102
|
+
}, []);
|
|
103
|
+
};
|
|
26
104
|
};
|
|
27
105
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
106
|
+
var useDoneRequestActor = createUseRequestActor(request.isDoneRequestActor);
|
|
107
|
+
var useFailedRequestActor = createUseRequestActor(request.isFailedRequestActor);
|
|
108
|
+
var useComposeRequestActor = function useComposeRequestActor(actors, options, cancelWhileUnmount) {
|
|
109
|
+
var _useRequestProvide2 = request.useRequestProvide(),
|
|
110
|
+
requestSubject$ = _useRequestProvide2.requestSubject$,
|
|
111
|
+
dispatchRequest = _useRequestProvide2.dispatchRequest;
|
|
112
|
+
|
|
113
|
+
var nameSet = new Set(lodash.map(actors, function (actor) {
|
|
114
|
+
return lodash.isString(actor) ? actor : actor.name;
|
|
115
|
+
}));
|
|
116
|
+
var lastRequestActors = {};
|
|
117
|
+
hooks.useEffect(function () {
|
|
118
|
+
var sub = rxjs.merge(requestSubject$.pipe(rxjs.filter(request.isPreRequestActor), rxjs.tap(function (actor) {
|
|
39
119
|
if (nameSet.has(actor.name)) {
|
|
40
120
|
var _options$onStart;
|
|
41
121
|
|
|
42
122
|
(_options$onStart = options.onStart) === null || _options$onStart === void 0 ? void 0 : _options$onStart.call(options, actor);
|
|
43
123
|
lastRequestActors[actor.name] = actor;
|
|
44
124
|
}
|
|
45
|
-
})), requestSubject$.pipe(rxjs.filter(request.isDoneRequestActor), rxjs.tap(actor
|
|
125
|
+
})), requestSubject$.pipe(rxjs.filter(request.isDoneRequestActor), rxjs.tap(function (actor) {
|
|
46
126
|
if (nameSet.has(actor.name)) {
|
|
47
127
|
var _options$onSuccess, _options$onFinish;
|
|
48
128
|
|
|
@@ -50,7 +130,7 @@ const useComposeRequestActor = (actors, options, cancelWhileUnmount) => {
|
|
|
50
130
|
(_options$onFinish = options.onFinish) === null || _options$onFinish === void 0 ? void 0 : _options$onFinish.call(options, actor);
|
|
51
131
|
lastRequestActors[actor.name] = undefined;
|
|
52
132
|
}
|
|
53
|
-
})), requestSubject$.pipe(rxjs.filter(request.isFailedRequestActor), rxjs.tap(actor
|
|
133
|
+
})), requestSubject$.pipe(rxjs.filter(request.isFailedRequestActor), rxjs.tap(function (actor) {
|
|
54
134
|
if (nameSet.has(actor.name)) {
|
|
55
135
|
var _options$onFailed, _options$onFinish2;
|
|
56
136
|
|
|
@@ -59,15 +139,15 @@ const useComposeRequestActor = (actors, options, cancelWhileUnmount) => {
|
|
|
59
139
|
lastRequestActors[actor.name] = undefined;
|
|
60
140
|
}
|
|
61
141
|
}))).subscribe();
|
|
62
|
-
return ()
|
|
142
|
+
return function () {
|
|
63
143
|
sub.unsubscribe();
|
|
64
144
|
|
|
65
145
|
if (cancelWhileUnmount) {
|
|
66
146
|
//组件销毁的时候cancel请求
|
|
67
|
-
lodash.forEach(lastRequestActors, actor
|
|
68
|
-
actor && dispatchRequest({
|
|
147
|
+
lodash.forEach(lastRequestActors, function (actor) {
|
|
148
|
+
actor && dispatchRequest(_objectSpread2(_objectSpread2({}, actor), {}, {
|
|
69
149
|
stage: "CANCEL"
|
|
70
|
-
});
|
|
150
|
+
}));
|
|
71
151
|
});
|
|
72
152
|
}
|
|
73
153
|
};
|
|
@@ -79,7 +159,7 @@ const useComposeRequestActor = (actors, options, cancelWhileUnmount) => {
|
|
|
79
159
|
* @param column
|
|
80
160
|
*/
|
|
81
161
|
|
|
82
|
-
|
|
162
|
+
var getColumnValueType = function getColumnValueType(column) {
|
|
83
163
|
return column.formValueType || column.valueType || "text";
|
|
84
164
|
};
|
|
85
165
|
/**
|
|
@@ -87,7 +167,7 @@ const getColumnValueType = column => {
|
|
|
87
167
|
* @param column
|
|
88
168
|
*/
|
|
89
169
|
|
|
90
|
-
|
|
170
|
+
var getColumnFormItemName = function getColumnFormItemName(column) {
|
|
91
171
|
var _column$formItemProps;
|
|
92
172
|
|
|
93
173
|
return ((_column$formItemProps = column.formItemProps) === null || _column$formItemProps === void 0 ? void 0 : _column$formItemProps.name) || column.dataIndex;
|
|
@@ -100,26 +180,27 @@ const getColumnFormItemName = column => {
|
|
|
100
180
|
* @param needRules
|
|
101
181
|
*/
|
|
102
182
|
|
|
103
|
-
|
|
183
|
+
var getFormItemEl = function getFormItemEl(formElementMap, column) {
|
|
104
184
|
var _column$formFieldProp;
|
|
105
185
|
|
|
106
|
-
|
|
107
|
-
|
|
186
|
+
var needRules = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
|
|
187
|
+
var valueType = getColumnValueType(column);
|
|
188
|
+
var Comp = lodash.get(formElementMap, valueType);
|
|
108
189
|
|
|
109
190
|
if (!Comp) {
|
|
110
191
|
return null;
|
|
111
192
|
}
|
|
112
193
|
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
return vue.h(Comp, {
|
|
194
|
+
var name = getColumnFormItemName(column);
|
|
195
|
+
var itemProps = needRules ? column.formItemProps : lodash.omit(column.formItemProps, "rules");
|
|
196
|
+
return vue.h(Comp, _objectSpread2(_objectSpread2({
|
|
116
197
|
key: name,
|
|
117
|
-
name,
|
|
118
|
-
label: column.title
|
|
119
|
-
|
|
198
|
+
name: name,
|
|
199
|
+
label: column.title
|
|
200
|
+
}, itemProps), {}, {
|
|
120
201
|
fieldProps: lodash.omit(column.formFieldProps, "slots"),
|
|
121
202
|
showProps: column.showProps
|
|
122
|
-
}, (_column$formFieldProp = column.formFieldProps) === null || _column$formFieldProp === void 0 ? void 0 : _column$formFieldProp.slots);
|
|
203
|
+
}), (_column$formFieldProp = column.formFieldProps) === null || _column$formFieldProp === void 0 ? void 0 : _column$formFieldProp.slots);
|
|
123
204
|
};
|
|
124
205
|
/**
|
|
125
206
|
* 根据Column生成Item VNode
|
|
@@ -128,93 +209,96 @@ const getFormItemEl = (formElementMap, column, needRules = true) => {
|
|
|
128
209
|
* @param value
|
|
129
210
|
*/
|
|
130
211
|
|
|
131
|
-
|
|
212
|
+
var getItemEl = function getItemEl(elementMap, column, value) {
|
|
132
213
|
var _column$formFieldProp2;
|
|
133
214
|
|
|
134
|
-
|
|
135
|
-
|
|
215
|
+
var valueType = column.valueType || "text";
|
|
216
|
+
var Comp = lodash.get(elementMap, valueType);
|
|
136
217
|
|
|
137
218
|
if (!Comp) {
|
|
138
219
|
return null;
|
|
139
220
|
}
|
|
140
221
|
|
|
141
|
-
return vue.h(Comp, {
|
|
222
|
+
return vue.h(Comp, _objectSpread2(_objectSpread2({}, lodash.omit(column.formFieldProps, "slots")), {}, {
|
|
142
223
|
showProps: column.showProps,
|
|
143
|
-
value
|
|
144
|
-
}, (_column$formFieldProp2 = column.formFieldProps) === null || _column$formFieldProp2 === void 0 ? void 0 : _column$formFieldProp2.slots);
|
|
224
|
+
value: value
|
|
225
|
+
}), (_column$formFieldProp2 = column.formFieldProps) === null || _column$formFieldProp2 === void 0 ? void 0 : _column$formFieldProp2.slots);
|
|
226
|
+
};
|
|
227
|
+
var ProModuleKey = Symbol("pro-module");
|
|
228
|
+
var useProModule = function useProModule() {
|
|
229
|
+
return vue.inject(ProModuleKey);
|
|
145
230
|
};
|
|
146
|
-
|
|
147
|
-
const useProModule = () => vue.inject(ProModuleKey);
|
|
148
|
-
const provideProModule = ctx => {
|
|
231
|
+
var provideProModule = function provideProModule(ctx) {
|
|
149
232
|
vue.provide(ProModuleKey, ctx);
|
|
150
233
|
};
|
|
151
|
-
|
|
234
|
+
var RequestAction = {
|
|
152
235
|
Success: "request-success$",
|
|
153
236
|
Fail: "request-fail$"
|
|
154
237
|
};
|
|
155
238
|
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
239
|
+
var proModuleProps = function proModuleProps() {
|
|
240
|
+
return {
|
|
241
|
+
/**
|
|
242
|
+
* module状态
|
|
243
|
+
*/
|
|
244
|
+
state: {
|
|
245
|
+
type: Object
|
|
246
|
+
},
|
|
163
247
|
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
248
|
+
/**
|
|
249
|
+
* 配置(静态)
|
|
250
|
+
*/
|
|
251
|
+
columns: {
|
|
252
|
+
type: Array
|
|
253
|
+
},
|
|
170
254
|
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
255
|
+
/**
|
|
256
|
+
* 配置(动态)
|
|
257
|
+
* columns动态属性兼容
|
|
258
|
+
*/
|
|
259
|
+
columnState: {
|
|
260
|
+
type: Object
|
|
261
|
+
},
|
|
178
262
|
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
263
|
+
/**
|
|
264
|
+
* 展示组件集
|
|
265
|
+
*/
|
|
266
|
+
elementMap: {
|
|
267
|
+
type: Object
|
|
268
|
+
},
|
|
185
269
|
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
270
|
+
/**
|
|
271
|
+
* 录入组件集
|
|
272
|
+
*/
|
|
273
|
+
formElementMap: {
|
|
274
|
+
type: Object
|
|
275
|
+
},
|
|
192
276
|
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
}
|
|
277
|
+
/**
|
|
278
|
+
* requests
|
|
279
|
+
*/
|
|
280
|
+
requests: {
|
|
281
|
+
type: Array
|
|
282
|
+
}
|
|
283
|
+
};
|
|
284
|
+
};
|
|
285
|
+
|
|
286
|
+
var ProModule = vue.defineComponent({
|
|
287
|
+
props: _objectSpread2({}, proModuleProps()),
|
|
288
|
+
setup: function setup(props, _ref) {
|
|
289
|
+
var slots = _ref.slots;
|
|
200
290
|
|
|
201
|
-
const ProModule = vue.defineComponent({
|
|
202
|
-
props: { ...proModuleProps()
|
|
203
|
-
},
|
|
204
|
-
setup: (props, {
|
|
205
|
-
slots
|
|
206
|
-
}) => {
|
|
207
291
|
/**
|
|
208
292
|
* columns columnState 合并
|
|
209
293
|
*/
|
|
210
|
-
|
|
211
|
-
return lodash.map(props.columns, item
|
|
294
|
+
var columns = vue.computed(function () {
|
|
295
|
+
return lodash.map(props.columns, function (item) {
|
|
212
296
|
//如果columnState中有值,merge处理
|
|
213
|
-
|
|
297
|
+
var mapData = lodash.get(props.columnState, getColumnFormItemName(item));
|
|
214
298
|
|
|
215
299
|
if (lodash.isObject(mapData) && !lodash.isEmpty(mapData) && !lodash.isArray(mapData) && !lodash.isFunction(mapData)) {
|
|
216
300
|
//合并
|
|
217
|
-
return lodash.mergeWith(item, mapData, (objValue, srcValue)
|
|
301
|
+
return lodash.mergeWith(item, mapData, function (objValue, srcValue) {
|
|
218
302
|
//如果是数组,替换
|
|
219
303
|
if (lodash.isArray(objValue) || lodash.isArray(srcValue)) {
|
|
220
304
|
return srcValue;
|
|
@@ -228,28 +312,29 @@ const ProModule = vue.defineComponent({
|
|
|
228
312
|
/*********************************** 渲染组件 ***************************************/
|
|
229
313
|
// 获取FormItem VNode
|
|
230
314
|
|
|
231
|
-
|
|
315
|
+
var getFormItemVNode = function getFormItemVNode(column) {
|
|
316
|
+
var needRules = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
232
317
|
return getFormItemEl(props.formElementMap, column, needRules);
|
|
233
318
|
}; // 获取Item VNode
|
|
234
319
|
|
|
235
320
|
|
|
236
|
-
|
|
321
|
+
var getItemVNode = function getItemVNode(column, value) {
|
|
237
322
|
return getItemEl(props.elementMap, column, value);
|
|
238
323
|
};
|
|
239
324
|
/*********************************** 事件处理 ***************************************/
|
|
240
325
|
|
|
241
326
|
|
|
242
|
-
|
|
327
|
+
var subject$ = new rxjs.Subject(); //发送Module事件
|
|
243
328
|
|
|
244
|
-
|
|
329
|
+
var sendEvent = function sendEvent(action) {
|
|
245
330
|
subject$.next(action);
|
|
246
331
|
};
|
|
247
332
|
/*********************************** 页面状态 ***************************************/
|
|
248
333
|
|
|
249
334
|
|
|
250
|
-
|
|
335
|
+
var state = props.state || vue.reactive({});
|
|
251
336
|
|
|
252
|
-
|
|
337
|
+
var dispatch = function dispatch(action) {
|
|
253
338
|
//如果要更新的属性值是 object ,执行覆盖操作
|
|
254
339
|
if (lodash.isObject(state[action.type])) {
|
|
255
340
|
hooks.setReactiveValue(state[action.type], action.payload);
|
|
@@ -261,27 +346,33 @@ const ProModule = vue.defineComponent({
|
|
|
261
346
|
/*********************************** request ***************************************/
|
|
262
347
|
|
|
263
348
|
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
} = request.useRequestProvide();
|
|
267
|
-
const requestMap = lodash.reduce(props.requests, (pair, item) => ({ ...pair,
|
|
268
|
-
[item.actor.name]: item
|
|
269
|
-
}), {});
|
|
270
|
-
const actionMap = lodash.reduce(props.requests, (pair, item) => ({ ...pair,
|
|
271
|
-
[item.action]: item
|
|
272
|
-
}), {}); //发送请求
|
|
349
|
+
var _useRequestProvide = request.useRequestProvide(),
|
|
350
|
+
dispatchRequest = _useRequestProvide.dispatchRequest;
|
|
273
351
|
|
|
274
|
-
|
|
275
|
-
|
|
352
|
+
var requestMap = lodash.reduce(props.requests, function (pair, item) {
|
|
353
|
+
var _item$actor;
|
|
354
|
+
|
|
355
|
+
return _objectSpread2(_objectSpread2({}, pair), {}, _defineProperty({}, (_item$actor = item.actor) === null || _item$actor === void 0 ? void 0 : _item$actor.name, item));
|
|
356
|
+
}, {});
|
|
357
|
+
var actionMap = lodash.reduce(props.requests, function (pair, item) {
|
|
358
|
+
return _objectSpread2(_objectSpread2({}, pair), {}, _defineProperty({}, item.action, item));
|
|
359
|
+
}, {}); //发送请求
|
|
360
|
+
|
|
361
|
+
var sendRequest = function sendRequest(requestNameOrAction) {
|
|
362
|
+
var requestOpts = lodash.get(requestMap, requestNameOrAction) || lodash.get(actionMap, requestNameOrAction);
|
|
276
363
|
|
|
277
364
|
if (!requestOpts) {
|
|
278
365
|
return;
|
|
279
366
|
}
|
|
280
367
|
|
|
281
|
-
|
|
368
|
+
var nextParams;
|
|
369
|
+
|
|
370
|
+
for (var _len = arguments.length, params = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
371
|
+
params[_key - 1] = arguments[_key];
|
|
372
|
+
}
|
|
282
373
|
|
|
283
374
|
if (requestOpts.convertParams) {
|
|
284
|
-
nextParams = requestOpts.convertParams(
|
|
375
|
+
nextParams = requestOpts.convertParams.apply(requestOpts, params);
|
|
285
376
|
} else {
|
|
286
377
|
nextParams = lodash.get(params, 0);
|
|
287
378
|
}
|
|
@@ -290,9 +381,9 @@ const ProModule = vue.defineComponent({
|
|
|
290
381
|
};
|
|
291
382
|
|
|
292
383
|
useComposeRequestActor(lodash.keys(requestMap), {
|
|
293
|
-
onStart: actor
|
|
384
|
+
onStart: function onStart(actor) {
|
|
294
385
|
//如果设置了loading,将请求状态维护到state中
|
|
295
|
-
|
|
386
|
+
var loadingName = lodash.get(requestMap, [actor.name, "loadingName"]);
|
|
296
387
|
|
|
297
388
|
if (loadingName) {
|
|
298
389
|
dispatch({
|
|
@@ -301,15 +392,15 @@ const ProModule = vue.defineComponent({
|
|
|
301
392
|
});
|
|
302
393
|
}
|
|
303
394
|
},
|
|
304
|
-
onSuccess: actor
|
|
395
|
+
onSuccess: function onSuccess(actor) {
|
|
305
396
|
var _requestOpts$onSucces;
|
|
306
397
|
|
|
307
|
-
|
|
398
|
+
var requestOpts = lodash.get(requestMap, actor.name); //如果设置了stateName,将结果维护到state中
|
|
308
399
|
|
|
309
400
|
if (requestOpts !== null && requestOpts !== void 0 && requestOpts.stateName) {
|
|
310
401
|
var _actor$res;
|
|
311
402
|
|
|
312
|
-
|
|
403
|
+
var data = requestOpts.convertData ? requestOpts.convertData(actor) : (_actor$res = actor.res) === null || _actor$res === void 0 ? void 0 : _actor$res.data;
|
|
313
404
|
dispatch({
|
|
314
405
|
type: requestOpts.stateName,
|
|
315
406
|
payload: data
|
|
@@ -320,28 +411,30 @@ const ProModule = vue.defineComponent({
|
|
|
320
411
|
sendEvent({
|
|
321
412
|
type: RequestAction.Success,
|
|
322
413
|
payload: {
|
|
323
|
-
actor
|
|
414
|
+
actor: actor,
|
|
415
|
+
requestOpts: requestOpts
|
|
324
416
|
}
|
|
325
417
|
}); //回调事件
|
|
326
418
|
|
|
327
419
|
(_requestOpts$onSucces = requestOpts.onSuccess) === null || _requestOpts$onSucces === void 0 ? void 0 : _requestOpts$onSucces.call(requestOpts, actor);
|
|
328
420
|
},
|
|
329
|
-
onFailed: actor
|
|
421
|
+
onFailed: function onFailed(actor) {
|
|
330
422
|
var _requestOpts$onFailed;
|
|
331
423
|
|
|
332
|
-
|
|
424
|
+
var requestOpts = lodash.get(requestMap, actor.name); //发送失败事件
|
|
333
425
|
|
|
334
426
|
sendEvent({
|
|
335
427
|
type: RequestAction.Fail,
|
|
336
428
|
payload: {
|
|
337
|
-
actor
|
|
429
|
+
actor: actor,
|
|
430
|
+
requestOpts: requestOpts
|
|
338
431
|
}
|
|
339
432
|
}); //回调事件
|
|
340
433
|
|
|
341
434
|
(_requestOpts$onFailed = requestOpts.onFailed) === null || _requestOpts$onFailed === void 0 ? void 0 : _requestOpts$onFailed.call(requestOpts, actor);
|
|
342
435
|
},
|
|
343
|
-
onFinish: actor
|
|
344
|
-
|
|
436
|
+
onFinish: function onFinish(actor) {
|
|
437
|
+
var loadingName = lodash.get(requestMap, [actor.name, "loadingName"]);
|
|
345
438
|
|
|
346
439
|
if (loadingName) {
|
|
347
440
|
dispatch({
|
|
@@ -352,53 +445,57 @@ const ProModule = vue.defineComponent({
|
|
|
352
445
|
}
|
|
353
446
|
}, true);
|
|
354
447
|
provideProModule({
|
|
355
|
-
columns,
|
|
356
|
-
getFormItemVNode,
|
|
357
|
-
getItemVNode,
|
|
448
|
+
columns: columns,
|
|
449
|
+
getFormItemVNode: getFormItemVNode,
|
|
450
|
+
getItemVNode: getItemVNode,
|
|
358
451
|
elementMap: props.elementMap,
|
|
359
452
|
formElementMap: props.formElementMap,
|
|
360
453
|
//
|
|
361
|
-
subject$,
|
|
362
|
-
sendEvent,
|
|
454
|
+
subject$: subject$,
|
|
455
|
+
sendEvent: sendEvent,
|
|
363
456
|
//
|
|
364
|
-
state,
|
|
365
|
-
dispatch,
|
|
457
|
+
state: state,
|
|
458
|
+
dispatch: dispatch,
|
|
366
459
|
//
|
|
367
460
|
requests: props.requests,
|
|
368
|
-
sendRequest
|
|
461
|
+
sendRequest: sendRequest
|
|
369
462
|
});
|
|
370
|
-
return ()
|
|
463
|
+
return function () {
|
|
371
464
|
var _slots$default;
|
|
372
465
|
|
|
373
|
-
return (_slots$default = slots
|
|
466
|
+
return (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
|
|
374
467
|
};
|
|
375
468
|
}
|
|
376
469
|
});
|
|
377
470
|
|
|
378
471
|
//订阅module事件
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
hooks.useEffect(()
|
|
384
|
-
|
|
385
|
-
next: action
|
|
472
|
+
var useModuleEvent = function useModuleEvent(cb) {
|
|
473
|
+
var _useProModule = useProModule(),
|
|
474
|
+
subject$ = _useProModule.subject$;
|
|
475
|
+
|
|
476
|
+
hooks.useEffect(function () {
|
|
477
|
+
var sub = subject$.subscribe({
|
|
478
|
+
next: function next(action) {
|
|
386
479
|
cb(action);
|
|
387
480
|
}
|
|
388
481
|
});
|
|
389
|
-
return ()
|
|
482
|
+
return function () {
|
|
390
483
|
return sub.unsubscribe();
|
|
391
484
|
};
|
|
392
485
|
}, []);
|
|
393
486
|
};
|
|
394
487
|
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
488
|
+
var ProCurdKey = Symbol("pro-curd");
|
|
489
|
+
var useProCurd = function useProCurd() {
|
|
490
|
+
return vue.inject(ProCurdKey);
|
|
491
|
+
};
|
|
492
|
+
var provideProCurd = function provideProCurd(ctx) {
|
|
493
|
+
return vue.provide(ProCurdKey, ctx);
|
|
494
|
+
};
|
|
398
495
|
/************************************ 常量 *************************************/
|
|
399
496
|
|
|
400
497
|
/**
|
|
401
|
-
* curd 5种
|
|
498
|
+
* curd 5种Action
|
|
402
499
|
*/
|
|
403
500
|
|
|
404
501
|
exports.CurdAction = void 0;
|
|
@@ -411,6 +508,19 @@ exports.CurdAction = void 0;
|
|
|
411
508
|
CurdAction["DELETE"] = "DELETE";
|
|
412
509
|
})(exports.CurdAction || (exports.CurdAction = {}));
|
|
413
510
|
|
|
511
|
+
/**
|
|
512
|
+
* 5种Action 的子事件
|
|
513
|
+
*/
|
|
514
|
+
exports.CurdSubAction = void 0;
|
|
515
|
+
|
|
516
|
+
(function (CurdSubAction) {
|
|
517
|
+
CurdSubAction["EMIT"] = "EMIT";
|
|
518
|
+
CurdSubAction["EXECUTE"] = "EXECUTE";
|
|
519
|
+
CurdSubAction["PAGE"] = "PAGE";
|
|
520
|
+
CurdSubAction["SUCCESS"] = "SUCCESS";
|
|
521
|
+
CurdSubAction["FAIL"] = "FAIL";
|
|
522
|
+
})(exports.CurdSubAction || (exports.CurdSubAction = {}));
|
|
523
|
+
|
|
414
524
|
/**
|
|
415
525
|
* curd 操作模式
|
|
416
526
|
*/
|
|
@@ -432,100 +542,109 @@ exports.CurdAddAction = void 0;
|
|
|
432
542
|
CurdAddAction["CONTINUE"] = "CONTINUE";
|
|
433
543
|
})(exports.CurdAddAction || (exports.CurdAddAction = {}));
|
|
434
544
|
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
545
|
+
var proCurdProps = function proCurdProps() {
|
|
546
|
+
return {
|
|
547
|
+
/**
|
|
548
|
+
* 列表 或 详情 的唯一标识
|
|
549
|
+
*/
|
|
550
|
+
rowKey: {
|
|
551
|
+
type: String,
|
|
552
|
+
"default": "id"
|
|
553
|
+
},
|
|
443
554
|
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
555
|
+
/**
|
|
556
|
+
* operates
|
|
557
|
+
*/
|
|
558
|
+
operates: {
|
|
559
|
+
type: Array
|
|
560
|
+
},
|
|
561
|
+
|
|
562
|
+
/************************* 子组件props *******************************/
|
|
563
|
+
listProps: {
|
|
564
|
+
type: Object
|
|
565
|
+
},
|
|
566
|
+
formProps: {
|
|
567
|
+
type: Object
|
|
568
|
+
},
|
|
569
|
+
descProps: {
|
|
570
|
+
type: Object
|
|
571
|
+
},
|
|
572
|
+
modalProps: {
|
|
573
|
+
type: Object
|
|
574
|
+
}
|
|
575
|
+
};
|
|
576
|
+
};
|
|
450
577
|
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
formProps: {
|
|
456
|
-
type: Object
|
|
457
|
-
},
|
|
458
|
-
descProps: {
|
|
459
|
-
type: Object
|
|
460
|
-
},
|
|
461
|
-
modalProps: {
|
|
462
|
-
type: Object
|
|
463
|
-
}
|
|
464
|
-
});
|
|
578
|
+
var Curd = vue.defineComponent({
|
|
579
|
+
props: _objectSpread2({}, proCurdProps()),
|
|
580
|
+
setup: function setup(props, _ref) {
|
|
581
|
+
var slots = _ref.slots;
|
|
465
582
|
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
}) => {
|
|
472
|
-
const {
|
|
473
|
-
columns,
|
|
474
|
-
state,
|
|
475
|
-
sendEvent,
|
|
476
|
-
sendRequest
|
|
477
|
-
} = useProModule();
|
|
583
|
+
var _ref2 = useProModule(),
|
|
584
|
+
columns = _ref2.columns,
|
|
585
|
+
state = _ref2.state,
|
|
586
|
+
sendEvent = _ref2.sendEvent,
|
|
587
|
+
sendRequest = _ref2.sendRequest;
|
|
478
588
|
/**
|
|
479
589
|
* 排序
|
|
480
590
|
* @param list
|
|
481
591
|
* @param propName
|
|
482
592
|
*/
|
|
483
593
|
|
|
484
|
-
|
|
485
|
-
|
|
594
|
+
|
|
595
|
+
var dealSort = function dealSort(list, propName) {
|
|
596
|
+
return lodash.sortBy(list, function (item) {
|
|
597
|
+
return lodash.get(item, propName);
|
|
598
|
+
});
|
|
486
599
|
};
|
|
487
600
|
/**
|
|
488
601
|
* 非 hideInForm columns
|
|
489
602
|
*/
|
|
490
603
|
|
|
491
604
|
|
|
492
|
-
|
|
493
|
-
return dealSort(lodash.filter(columns.value,
|
|
605
|
+
var formColumns = vue.computed(function () {
|
|
606
|
+
return dealSort(lodash.filter(columns.value, function (item) {
|
|
607
|
+
return !item.hideInForm;
|
|
608
|
+
}), "formSort");
|
|
494
609
|
});
|
|
495
610
|
/**
|
|
496
611
|
* 非 hideInDetail columns
|
|
497
612
|
*/
|
|
498
613
|
|
|
499
|
-
|
|
500
|
-
return dealSort(lodash.filter(columns.value,
|
|
614
|
+
var descColumns = vue.computed(function () {
|
|
615
|
+
return dealSort(lodash.filter(columns.value, function (item) {
|
|
616
|
+
return !item.hideInDetail;
|
|
617
|
+
}), "descSort");
|
|
501
618
|
});
|
|
502
619
|
/**
|
|
503
620
|
* 非 hideInTable columns
|
|
504
621
|
*/
|
|
505
622
|
|
|
506
|
-
|
|
507
|
-
return dealSort(lodash.filter(columns.value,
|
|
623
|
+
var tableColumns = vue.computed(function () {
|
|
624
|
+
return dealSort(lodash.filter(columns.value, function (item) {
|
|
625
|
+
return !item.hideInTable;
|
|
626
|
+
}), "tableSort");
|
|
508
627
|
});
|
|
509
628
|
/**
|
|
510
629
|
* search columns
|
|
511
630
|
*/
|
|
512
631
|
|
|
513
|
-
|
|
514
|
-
return dealSort(lodash.filter(columns.value,
|
|
632
|
+
var searchColumns = vue.computed(function () {
|
|
633
|
+
return dealSort(lodash.filter(columns.value, function (item) {
|
|
634
|
+
return !!item.search;
|
|
635
|
+
}), "searchSort");
|
|
515
636
|
});
|
|
516
637
|
/******************************** 逻辑 *************************************/
|
|
517
638
|
//上一次发起列表请求的参数
|
|
518
639
|
|
|
519
|
-
|
|
640
|
+
var prevListParams; //刷新列表
|
|
520
641
|
|
|
521
|
-
|
|
522
|
-
sendRequest(exports.CurdAction.LIST, {
|
|
523
|
-
...extra
|
|
524
|
-
});
|
|
642
|
+
var handleSearch = function handleSearch(extra) {
|
|
643
|
+
sendRequest(exports.CurdAction.LIST, _objectSpread2(_objectSpread2({}, prevListParams), extra));
|
|
525
644
|
}; //发送事件
|
|
526
645
|
|
|
527
646
|
|
|
528
|
-
|
|
647
|
+
var sendCurdEvent = function sendCurdEvent(event) {
|
|
529
648
|
sendEvent({
|
|
530
649
|
type: event.action,
|
|
531
650
|
payload: lodash.omit(event, "action")
|
|
@@ -533,23 +652,16 @@ const Curd = vue.defineComponent({
|
|
|
533
652
|
}; //事件订阅
|
|
534
653
|
|
|
535
654
|
|
|
536
|
-
useModuleEvent(event
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
const action = event.type;
|
|
544
|
-
const {
|
|
545
|
-
type,
|
|
546
|
-
values,
|
|
547
|
-
record
|
|
548
|
-
} = event.payload;
|
|
655
|
+
useModuleEvent(function (event) {
|
|
656
|
+
var action = event.type;
|
|
657
|
+
var _ref3 = event.payload,
|
|
658
|
+
type = _ref3.type,
|
|
659
|
+
values = _ref3.values,
|
|
660
|
+
record = _ref3.record;
|
|
549
661
|
|
|
550
662
|
switch (action) {
|
|
551
663
|
case exports.CurdAction.LIST:
|
|
552
|
-
if (type ===
|
|
664
|
+
if (type === exports.CurdSubAction.EMIT) {
|
|
553
665
|
prevListParams = values;
|
|
554
666
|
handleSearch();
|
|
555
667
|
}
|
|
@@ -557,163 +669,456 @@ const Curd = vue.defineComponent({
|
|
|
557
669
|
return;
|
|
558
670
|
|
|
559
671
|
case exports.CurdAction.ADD:
|
|
560
|
-
if (type ===
|
|
672
|
+
if (type === exports.CurdSubAction.EXECUTE) {
|
|
561
673
|
sendRequest(exports.CurdAction.ADD, values, state.detailData);
|
|
562
674
|
}
|
|
563
675
|
|
|
564
676
|
return;
|
|
565
677
|
|
|
566
678
|
case exports.CurdAction.EDIT:
|
|
567
|
-
if (type ===
|
|
679
|
+
if (type === exports.CurdSubAction.EXECUTE) {
|
|
568
680
|
sendRequest(exports.CurdAction.EDIT, values, state.detailData);
|
|
569
681
|
}
|
|
570
682
|
|
|
571
683
|
return;
|
|
572
684
|
|
|
573
685
|
case exports.CurdAction.DELETE:
|
|
574
|
-
if (type ===
|
|
686
|
+
if (type === exports.CurdSubAction.EMIT) {
|
|
575
687
|
sendRequest(exports.CurdAction.DELETE, record, props.rowKey);
|
|
576
688
|
}
|
|
577
689
|
|
|
578
690
|
return;
|
|
579
691
|
}
|
|
580
692
|
});
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
}
|
|
693
|
+
var operateMap = lodash.reduce(props.operates, function (pair, item) {
|
|
694
|
+
return _objectSpread2(_objectSpread2({}, pair), {}, _defineProperty({}, item.action, item));
|
|
695
|
+
}, {}); //根据Action获取ICurdOperateOpts
|
|
584
696
|
|
|
585
|
-
|
|
697
|
+
var getOperate = function getOperate(action) {
|
|
586
698
|
return lodash.get(operateMap, action);
|
|
587
699
|
};
|
|
588
700
|
|
|
701
|
+
var listProps = vue.computed(function () {
|
|
702
|
+
return props.listProps;
|
|
703
|
+
});
|
|
704
|
+
var formProps = vue.computed(function () {
|
|
705
|
+
return props.formProps;
|
|
706
|
+
});
|
|
707
|
+
var descProps = vue.computed(function () {
|
|
708
|
+
return props.descProps;
|
|
709
|
+
});
|
|
710
|
+
var modalProps = vue.computed(function () {
|
|
711
|
+
return props.modalProps;
|
|
712
|
+
});
|
|
589
713
|
provideProCurd({
|
|
590
714
|
rowKey: props.rowKey,
|
|
591
715
|
curdState: state,
|
|
592
|
-
formColumns,
|
|
593
|
-
descColumns,
|
|
594
|
-
tableColumns,
|
|
595
|
-
searchColumns,
|
|
716
|
+
formColumns: formColumns,
|
|
717
|
+
descColumns: descColumns,
|
|
718
|
+
tableColumns: tableColumns,
|
|
719
|
+
searchColumns: searchColumns,
|
|
596
720
|
//
|
|
597
|
-
sendCurdEvent,
|
|
721
|
+
sendCurdEvent: sendCurdEvent,
|
|
598
722
|
//
|
|
599
|
-
getOperate,
|
|
723
|
+
getOperate: getOperate,
|
|
600
724
|
//
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
725
|
+
refreshList: handleSearch,
|
|
726
|
+
//
|
|
727
|
+
listProps: listProps,
|
|
728
|
+
formProps: formProps,
|
|
729
|
+
descProps: descProps,
|
|
730
|
+
modalProps: modalProps
|
|
605
731
|
});
|
|
606
|
-
return ()
|
|
732
|
+
return function () {
|
|
607
733
|
var _slots$default;
|
|
608
734
|
|
|
609
|
-
return (_slots$default = slots
|
|
735
|
+
return (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
|
|
610
736
|
};
|
|
611
737
|
}
|
|
612
738
|
});
|
|
613
|
-
|
|
614
|
-
props: {
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
739
|
+
var ProCurd = vue.defineComponent({
|
|
740
|
+
props: _objectSpread2(_objectSpread2(_objectSpread2({}, lodash.omit(ProModule.props, "state", "requests")), Curd.props), {}, {
|
|
741
|
+
curdState: {
|
|
742
|
+
type: Object
|
|
743
|
+
}
|
|
744
|
+
}),
|
|
745
|
+
setup: function setup(props, _ref4) {
|
|
746
|
+
var _curdOperateOpts;
|
|
747
|
+
|
|
748
|
+
var slots = _ref4.slots;
|
|
749
|
+
var curdState = props.curdState || vue.reactive({
|
|
621
750
|
detailData: {}
|
|
622
751
|
});
|
|
623
752
|
/****************** 请求处理 **********************/
|
|
624
753
|
//curd默认网络属性
|
|
625
754
|
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
755
|
+
var curdOperateOpts = (_curdOperateOpts = {}, _defineProperty(_curdOperateOpts, exports.CurdAction.LIST, {
|
|
756
|
+
convertParams: function convertParams(values) {
|
|
757
|
+
return values;
|
|
758
|
+
},
|
|
759
|
+
convertData: function convertData(actor) {
|
|
760
|
+
var _actor$res;
|
|
631
761
|
|
|
632
|
-
|
|
633
|
-
},
|
|
634
|
-
loadingName: "listLoading",
|
|
635
|
-
stateName: "listData"
|
|
762
|
+
return (_actor$res = actor.res) === null || _actor$res === void 0 ? void 0 : _actor$res.data;
|
|
636
763
|
},
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
return (_actor$res2 = actor.res) === null || _actor$res2 === void 0 ? void 0 : _actor$res2.data;
|
|
643
|
-
},
|
|
644
|
-
loadingName: "detailLoading",
|
|
645
|
-
stateName: "detailData",
|
|
646
|
-
label: "详情"
|
|
764
|
+
loadingName: "listLoading",
|
|
765
|
+
stateName: "listData"
|
|
766
|
+
}), _defineProperty(_curdOperateOpts, exports.CurdAction.DETAIL, {
|
|
767
|
+
convertParams: function convertParams(record, rowKey) {
|
|
768
|
+
return lodash.pick(record, rowKey);
|
|
647
769
|
},
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
}
|
|
653
|
-
}),
|
|
654
|
-
loadingName: "operateLoading",
|
|
655
|
-
label: "添加"
|
|
770
|
+
convertData: function convertData(actor) {
|
|
771
|
+
var _actor$res2;
|
|
772
|
+
|
|
773
|
+
return (_actor$res2 = actor.res) === null || _actor$res2 === void 0 ? void 0 : _actor$res2.data;
|
|
656
774
|
},
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
775
|
+
loadingName: "detailLoading",
|
|
776
|
+
stateName: "detailData",
|
|
777
|
+
label: "详情"
|
|
778
|
+
}), _defineProperty(_curdOperateOpts, exports.CurdAction.ADD, {
|
|
779
|
+
convertParams: function convertParams(values, record) {
|
|
780
|
+
return {
|
|
781
|
+
body: _objectSpread2(_objectSpread2({}, record), values)
|
|
782
|
+
};
|
|
665
783
|
},
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
784
|
+
loadingName: "operateLoading",
|
|
785
|
+
label: "添加"
|
|
786
|
+
}), _defineProperty(_curdOperateOpts, exports.CurdAction.EDIT, {
|
|
787
|
+
convertParams: function convertParams(values, record) {
|
|
788
|
+
return {
|
|
789
|
+
body: _objectSpread2(_objectSpread2({}, record), values)
|
|
790
|
+
};
|
|
791
|
+
},
|
|
792
|
+
loadingName: "operateLoading",
|
|
793
|
+
label: "编辑"
|
|
794
|
+
}), _defineProperty(_curdOperateOpts, exports.CurdAction.DELETE, {
|
|
795
|
+
convertParams: function convertParams(record, rowKey) {
|
|
796
|
+
return lodash.pick(record, rowKey);
|
|
797
|
+
},
|
|
798
|
+
label: "删除"
|
|
799
|
+
}), _curdOperateOpts);
|
|
800
|
+
var requests = lodash.map(props.operates, function (item) {
|
|
801
|
+
var curdOpts = lodash.get(curdOperateOpts, item.action);
|
|
802
|
+
return _objectSpread2(_objectSpread2({}, curdOpts), item);
|
|
803
|
+
});
|
|
804
|
+
var moduleKeys = lodash.keys(lodash.omit(ProModule.props, "state", "requests"));
|
|
805
|
+
return function () {
|
|
806
|
+
return vue.h(ProModule, _objectSpread2(_objectSpread2({}, lodash.pick(props, moduleKeys)), {}, {
|
|
807
|
+
state: curdState,
|
|
808
|
+
requests: requests
|
|
809
|
+
}), vue.h(Curd, _objectSpread2(_objectSpread2({}, lodash.omit.apply(void 0, [props].concat(_toConsumableArray(moduleKeys), ["curdState", "operates"]))), {}, {
|
|
810
|
+
operates: requests
|
|
811
|
+
}), slots));
|
|
812
|
+
};
|
|
813
|
+
}
|
|
814
|
+
});
|
|
815
|
+
|
|
816
|
+
var ProFormKey = Symbol("pro-form");
|
|
817
|
+
var useProForm = function useProForm() {
|
|
818
|
+
return vue.inject(ProFormKey);
|
|
819
|
+
};
|
|
820
|
+
|
|
821
|
+
var provideProForm = function provideProForm(ctx) {
|
|
822
|
+
vue.provide(ProFormKey, ctx);
|
|
823
|
+
};
|
|
824
|
+
|
|
825
|
+
var proFormProps = function proFormProps() {
|
|
826
|
+
return {
|
|
827
|
+
/**
|
|
828
|
+
* 同 antd 或 element form中的model
|
|
829
|
+
*/
|
|
830
|
+
model: {
|
|
831
|
+
type: Object
|
|
832
|
+
},
|
|
833
|
+
|
|
834
|
+
/**
|
|
835
|
+
* 子组件是否只读样式
|
|
836
|
+
*/
|
|
837
|
+
readonly: {
|
|
838
|
+
type: Boolean,
|
|
839
|
+
"default": undefined
|
|
840
|
+
},
|
|
841
|
+
|
|
842
|
+
/**
|
|
843
|
+
* FormComponent 根据此项来确定组件是否显示
|
|
844
|
+
* rules 根据rules中方法生成showState对象
|
|
845
|
+
*/
|
|
846
|
+
showState: {
|
|
847
|
+
type: Object
|
|
848
|
+
},
|
|
849
|
+
showStateRules: {
|
|
850
|
+
type: Object
|
|
851
|
+
},
|
|
852
|
+
|
|
853
|
+
/**
|
|
854
|
+
* 是否只读
|
|
855
|
+
*/
|
|
856
|
+
readonlyState: {
|
|
857
|
+
type: Object
|
|
858
|
+
},
|
|
859
|
+
readonlyStateRules: {
|
|
860
|
+
type: Object
|
|
861
|
+
},
|
|
862
|
+
|
|
863
|
+
/**
|
|
864
|
+
* 是否disabled
|
|
865
|
+
*/
|
|
866
|
+
disableState: {
|
|
867
|
+
type: Object
|
|
868
|
+
},
|
|
869
|
+
disableStateRules: {
|
|
870
|
+
type: Object
|
|
871
|
+
},
|
|
872
|
+
|
|
873
|
+
/**
|
|
874
|
+
*
|
|
875
|
+
*/
|
|
876
|
+
columns: {
|
|
877
|
+
type: Array
|
|
878
|
+
},
|
|
879
|
+
|
|
880
|
+
/**
|
|
881
|
+
* 展示控件集合,readonly模式下使用这些组件渲染
|
|
882
|
+
*/
|
|
883
|
+
elementMap: {
|
|
884
|
+
type: Object
|
|
885
|
+
},
|
|
886
|
+
|
|
887
|
+
/**
|
|
888
|
+
* 录入控件集合
|
|
889
|
+
*/
|
|
890
|
+
formElementMap: {
|
|
891
|
+
type: Object
|
|
892
|
+
},
|
|
893
|
+
|
|
894
|
+
/**
|
|
895
|
+
* 是否启用rules验证
|
|
896
|
+
*/
|
|
897
|
+
needRules: {
|
|
898
|
+
type: Boolean,
|
|
899
|
+
"default": true
|
|
900
|
+
},
|
|
901
|
+
|
|
902
|
+
/**
|
|
903
|
+
* provide传递
|
|
904
|
+
*/
|
|
905
|
+
provideExtra: {
|
|
906
|
+
type: Object
|
|
907
|
+
}
|
|
908
|
+
};
|
|
909
|
+
};
|
|
910
|
+
|
|
911
|
+
var ProForm = vue.defineComponent({
|
|
912
|
+
props: _objectSpread2({}, proFormProps()),
|
|
913
|
+
setup: function setup(props, _ref) {
|
|
914
|
+
var slots = _ref.slots;
|
|
915
|
+
var formState = props.model || vue.reactive({}); //组件状态相关
|
|
916
|
+
|
|
917
|
+
var showState = props.showState || vue.reactive({});
|
|
918
|
+
var readonlyState = props.readonlyState || vue.reactive({});
|
|
919
|
+
var disableState = props.disableState || vue.reactive({}); //formState改变情况下,更新 showState,readonlyState,disableState状态
|
|
920
|
+
|
|
921
|
+
hooks.useEffect(function () {
|
|
922
|
+
if (props.showStateRules) {
|
|
923
|
+
lodash.forEach(props.showStateRules, function (fn, key) {
|
|
924
|
+
showState[key] = fn(formState);
|
|
925
|
+
});
|
|
926
|
+
}
|
|
927
|
+
|
|
928
|
+
if (props.readonlyStateRules) {
|
|
929
|
+
lodash.forEach(props.readonlyStateRules, function (fn, key) {
|
|
930
|
+
readonlyState[key] = fn(formState);
|
|
931
|
+
});
|
|
932
|
+
}
|
|
933
|
+
|
|
934
|
+
if (props.disableStateRules) {
|
|
935
|
+
lodash.forEach(props.disableStateRules, function (fn, key) {
|
|
936
|
+
disableState[key] = fn(formState);
|
|
937
|
+
});
|
|
673
938
|
}
|
|
939
|
+
}, formState); //转换为ref对象
|
|
940
|
+
|
|
941
|
+
var readonly = vue.computed(function () {
|
|
942
|
+
return props.readonly;
|
|
943
|
+
});
|
|
944
|
+
/**
|
|
945
|
+
* 将columns 转化为FormItem VNode对象
|
|
946
|
+
*/
|
|
947
|
+
|
|
948
|
+
var formItemVNodes = vue.computed(function () {
|
|
949
|
+
if (lodash.size(props.formElementMap) <= 0) {
|
|
950
|
+
return [];
|
|
951
|
+
}
|
|
952
|
+
|
|
953
|
+
return lodash.map(props.columns, function (item) {
|
|
954
|
+
return getFormItemEl(props.formElementMap, item, props.needRules);
|
|
955
|
+
});
|
|
956
|
+
});
|
|
957
|
+
provideProForm(_objectSpread2({
|
|
958
|
+
formState: formState,
|
|
959
|
+
showState: showState,
|
|
960
|
+
readonlyState: readonlyState,
|
|
961
|
+
disableState: disableState,
|
|
962
|
+
//
|
|
963
|
+
elementMap: props.elementMap,
|
|
964
|
+
//
|
|
965
|
+
readonly: readonly,
|
|
966
|
+
//
|
|
967
|
+
formItemVNodes: formItemVNodes
|
|
968
|
+
}, props.provideExtra));
|
|
969
|
+
return function () {
|
|
970
|
+
var _slots$default;
|
|
971
|
+
|
|
972
|
+
return (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
|
|
674
973
|
};
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
974
|
+
}
|
|
975
|
+
});
|
|
976
|
+
|
|
977
|
+
exports.SearchMode = void 0;
|
|
978
|
+
|
|
979
|
+
(function (SearchMode) {
|
|
980
|
+
SearchMode["AUTO"] = "AUTO";
|
|
981
|
+
SearchMode["MANUAL"] = "MANUAL";
|
|
982
|
+
})(exports.SearchMode || (exports.SearchMode = {}));
|
|
983
|
+
|
|
984
|
+
var proSearchFormProps = function proSearchFormProps() {
|
|
985
|
+
return {
|
|
986
|
+
/**
|
|
987
|
+
* 需要监听的对象
|
|
988
|
+
*/
|
|
989
|
+
model: {
|
|
990
|
+
type: Object,
|
|
991
|
+
required: true
|
|
992
|
+
},
|
|
993
|
+
|
|
994
|
+
/**
|
|
995
|
+
* 初始化触发 onFinish
|
|
996
|
+
*/
|
|
997
|
+
initEmit: {
|
|
998
|
+
type: Boolean,
|
|
999
|
+
"default": true
|
|
1000
|
+
},
|
|
1001
|
+
|
|
1002
|
+
/**
|
|
1003
|
+
* 模式 自动触发或者手动触发 onFinish
|
|
1004
|
+
*/
|
|
1005
|
+
searchMode: {
|
|
1006
|
+
type: String,
|
|
1007
|
+
"default": exports.SearchMode.AUTO
|
|
1008
|
+
},
|
|
1009
|
+
|
|
1010
|
+
/**
|
|
1011
|
+
* 配置 同ProForm中的columns
|
|
1012
|
+
* 可以根据column中valueType计算出默认的debounceKeys
|
|
1013
|
+
*/
|
|
1014
|
+
columns: {
|
|
1015
|
+
type: Array
|
|
1016
|
+
},
|
|
1017
|
+
|
|
1018
|
+
/**
|
|
1019
|
+
* 需要debounce处理的字段
|
|
1020
|
+
*/
|
|
1021
|
+
debounceKeys: {
|
|
1022
|
+
type: Array
|
|
1023
|
+
},
|
|
1024
|
+
debounceTime: {
|
|
1025
|
+
type: Number,
|
|
1026
|
+
"default": 800
|
|
1027
|
+
}
|
|
1028
|
+
};
|
|
1029
|
+
};
|
|
1030
|
+
|
|
1031
|
+
/**
|
|
1032
|
+
* 该组件只是个模式,最终返回null,不做任何渲染,应配合着ProForm的包装类一起使用
|
|
1033
|
+
* 针对传入的model(监听对象)做相应的finish(回调)处理
|
|
1034
|
+
*/
|
|
1035
|
+
var ProSearchForm = vue.defineComponent({
|
|
1036
|
+
props: _objectSpread2({}, proSearchFormProps()),
|
|
1037
|
+
setup: function setup(props, _ref) {
|
|
1038
|
+
var emit = _ref.emit;
|
|
1039
|
+
//根据column valueType 算出默认需要debounce处理的属性集合
|
|
1040
|
+
var defaultDebounceKeys = lodash.map(lodash.filter(props.columns, function (column) {
|
|
1041
|
+
var valueType = getColumnValueType(column); //默认input组件的触发事件需要debounce处理
|
|
1042
|
+
|
|
1043
|
+
return valueType === "text";
|
|
1044
|
+
}), function (column) {
|
|
1045
|
+
return getColumnFormItemName(column);
|
|
680
1046
|
});
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
1047
|
+
|
|
1048
|
+
var handleFinish = function handleFinish() {
|
|
1049
|
+
emit("finish");
|
|
1050
|
+
};
|
|
1051
|
+
|
|
1052
|
+
var debounceFinish = lodash.debounce(function () {
|
|
1053
|
+
handleFinish();
|
|
1054
|
+
}, props.debounceTime); //初始化
|
|
1055
|
+
|
|
1056
|
+
hooks.useEffect(function () {
|
|
1057
|
+
if (props.initEmit) {
|
|
1058
|
+
handleFinish();
|
|
1059
|
+
}
|
|
1060
|
+
}, []);
|
|
1061
|
+
|
|
1062
|
+
var isDebounceDataChange = function isDebounceDataChange(state, prevState, debounceKeys) {
|
|
1063
|
+
return lodash.some(debounceKeys, function (key) {
|
|
1064
|
+
return lodash.get(state, key) !== lodash.get(prevState, key);
|
|
1065
|
+
});
|
|
1066
|
+
}; //监听
|
|
1067
|
+
|
|
1068
|
+
|
|
1069
|
+
hooks.useWatch(function (state, prevState) {
|
|
1070
|
+
if (props.searchMode !== exports.SearchMode.AUTO) {
|
|
1071
|
+
return;
|
|
1072
|
+
} //如果改变的值中包括debounceKeys中注册的 延时触发
|
|
1073
|
+
|
|
1074
|
+
|
|
1075
|
+
var debounceKeys = lodash.size(props.debounceKeys) > 0 ? props.debounceKeys : defaultDebounceKeys;
|
|
1076
|
+
|
|
1077
|
+
if (lodash.size(debounceKeys) > 0 && isDebounceDataChange(state, prevState, debounceKeys)) {
|
|
1078
|
+
debounceFinish();
|
|
1079
|
+
return;
|
|
1080
|
+
}
|
|
1081
|
+
|
|
1082
|
+
handleFinish();
|
|
1083
|
+
}, function () {
|
|
1084
|
+
return lodash.clone(props.model);
|
|
1085
|
+
});
|
|
1086
|
+
return function () {
|
|
1087
|
+
return null;
|
|
688
1088
|
};
|
|
689
1089
|
}
|
|
690
1090
|
});
|
|
691
1091
|
|
|
692
|
-
/**
|
|
693
|
-
* 剔除showState或showStateRules规则为!true的值
|
|
694
|
-
* @param values
|
|
695
|
-
* @param showState
|
|
696
|
-
* @param showStateRules
|
|
1092
|
+
/**
|
|
1093
|
+
* 剔除showState或showStateRules规则为!true的值
|
|
1094
|
+
* @param values
|
|
1095
|
+
* @param showState
|
|
1096
|
+
* @param showStateRules
|
|
697
1097
|
*/
|
|
698
|
-
|
|
1098
|
+
var getValidValues = function getValidValues(values, showState, showStateRules) {
|
|
699
1099
|
if (showState) {
|
|
700
|
-
|
|
1100
|
+
var invalidKeys = lodash.filter(lodash.keys(showState), function (key) {
|
|
1101
|
+
return !showState[key];
|
|
1102
|
+
});
|
|
701
1103
|
return lodash.omit(values, invalidKeys);
|
|
702
1104
|
}
|
|
703
1105
|
|
|
704
1106
|
if (showStateRules) {
|
|
705
|
-
|
|
706
|
-
|
|
1107
|
+
var _invalidKeys = lodash.filter(lodash.keys(showStateRules), function (key) {
|
|
1108
|
+
return !showStateRules[key](values);
|
|
1109
|
+
});
|
|
1110
|
+
|
|
1111
|
+
return lodash.omit(values, _invalidKeys);
|
|
707
1112
|
}
|
|
708
1113
|
|
|
709
1114
|
return values;
|
|
710
1115
|
};
|
|
711
|
-
/**
|
|
712
|
-
* string类型的path转为arr
|
|
713
|
-
* @param path
|
|
1116
|
+
/**
|
|
1117
|
+
* string类型的path转为arr
|
|
1118
|
+
* @param path
|
|
714
1119
|
*/
|
|
715
1120
|
|
|
716
|
-
|
|
1121
|
+
var convertPathToList = function convertPathToList(path) {
|
|
717
1122
|
if (!path) {
|
|
718
1123
|
return undefined;
|
|
719
1124
|
}
|
|
@@ -729,10 +1134,356 @@ const convertPathToList = path => {
|
|
|
729
1134
|
return [path];
|
|
730
1135
|
};
|
|
731
1136
|
|
|
1137
|
+
/**
|
|
1138
|
+
* ProFormList ctx
|
|
1139
|
+
*/
|
|
1140
|
+
|
|
1141
|
+
var ProFormListKey = Symbol("pro-form-list");
|
|
1142
|
+
var useProFormList = function useProFormList() {
|
|
1143
|
+
return vue.inject(ProFormListKey);
|
|
1144
|
+
};
|
|
1145
|
+
|
|
1146
|
+
var provideProFormList = function provideProFormList(ctx) {
|
|
1147
|
+
vue.provide(ProFormListKey, ctx);
|
|
1148
|
+
};
|
|
1149
|
+
|
|
1150
|
+
var FormListProvider = vue.defineComponent({
|
|
1151
|
+
props: {
|
|
1152
|
+
pathList: {
|
|
1153
|
+
type: Array
|
|
1154
|
+
}
|
|
1155
|
+
},
|
|
1156
|
+
setup: function setup(props, _ref) {
|
|
1157
|
+
var slots = _ref.slots;
|
|
1158
|
+
provideProFormList({
|
|
1159
|
+
pathList: props.pathList
|
|
1160
|
+
});
|
|
1161
|
+
return function () {
|
|
1162
|
+
var _slots$default;
|
|
1163
|
+
|
|
1164
|
+
return (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
|
|
1165
|
+
};
|
|
1166
|
+
}
|
|
1167
|
+
});
|
|
1168
|
+
|
|
1169
|
+
var proFormListProps = function proFormListProps() {
|
|
1170
|
+
return {
|
|
1171
|
+
//每行默认id
|
|
1172
|
+
rowKey: {
|
|
1173
|
+
type: String,
|
|
1174
|
+
"default": "id"
|
|
1175
|
+
},
|
|
1176
|
+
//name
|
|
1177
|
+
name: {
|
|
1178
|
+
type: [String, Number, Array],
|
|
1179
|
+
required: true
|
|
1180
|
+
}
|
|
1181
|
+
};
|
|
1182
|
+
};
|
|
1183
|
+
|
|
1184
|
+
var ProFormList = vue.defineComponent({
|
|
1185
|
+
props: _objectSpread2({}, proFormListProps()),
|
|
1186
|
+
setup: function setup(props, _ref2) {
|
|
1187
|
+
var slots = _ref2.slots;
|
|
1188
|
+
|
|
1189
|
+
var _useProForm = useProForm(),
|
|
1190
|
+
formState = _useProForm.formState,
|
|
1191
|
+
readonly = _useProForm.readonly;
|
|
1192
|
+
|
|
1193
|
+
var formListCtx = useProFormList();
|
|
1194
|
+
var nameList = convertPathToList(props.name);
|
|
1195
|
+
var path = formListCtx !== null && formListCtx !== void 0 && formListCtx.pathList ? [].concat(_toConsumableArray(formListCtx.pathList), _toConsumableArray(nameList)) : nameList;
|
|
1196
|
+
|
|
1197
|
+
var handleAdd = function handleAdd() {
|
|
1198
|
+
var targetList = lodash.get(formState, path);
|
|
1199
|
+
|
|
1200
|
+
if (!lodash.isArray(targetList)) {
|
|
1201
|
+
targetList = [];
|
|
1202
|
+
}
|
|
1203
|
+
|
|
1204
|
+
targetList.push(_defineProperty({}, props.rowKey, new Date().valueOf()));
|
|
1205
|
+
lodash.set(formState, path, targetList);
|
|
1206
|
+
};
|
|
1207
|
+
|
|
1208
|
+
var handleRemove = function handleRemove(index) {
|
|
1209
|
+
var targetList = lodash.get(formState, path);
|
|
1210
|
+
|
|
1211
|
+
if (lodash.size(targetList) <= 0) {
|
|
1212
|
+
return;
|
|
1213
|
+
}
|
|
1214
|
+
|
|
1215
|
+
targetList.splice(index, 1);
|
|
1216
|
+
};
|
|
1217
|
+
|
|
1218
|
+
return function () {
|
|
1219
|
+
var _slots$add;
|
|
1220
|
+
|
|
1221
|
+
return vue.createVNode(vue.Fragment, null, [lodash.map(lodash.get(formState, path), function (item, index) {
|
|
1222
|
+
var _slots$default2, _slots$itemAdd, _slots$itemMinus;
|
|
1223
|
+
|
|
1224
|
+
return vue.createVNode(FormListProvider, {
|
|
1225
|
+
"key": index,
|
|
1226
|
+
"pathList": [].concat(_toConsumableArray(path), [index])
|
|
1227
|
+
}, {
|
|
1228
|
+
"default": function _default() {
|
|
1229
|
+
return [vue.createVNode("div", {
|
|
1230
|
+
"class": "pro-form-list-item"
|
|
1231
|
+
}, [(_slots$default2 = slots["default"]) === null || _slots$default2 === void 0 ? void 0 : _slots$default2.call(slots), !readonly.value && vue.createVNode(vue.Fragment, null, [vue.createVNode("div", {
|
|
1232
|
+
"class": "pro-form-list-item-add",
|
|
1233
|
+
"onClick": handleAdd
|
|
1234
|
+
}, [(_slots$itemAdd = slots.itemAdd) === null || _slots$itemAdd === void 0 ? void 0 : _slots$itemAdd.call(slots)]), vue.createVNode("div", {
|
|
1235
|
+
"class": "pro-form-list-item-minus",
|
|
1236
|
+
"onClick": function onClick() {
|
|
1237
|
+
return handleRemove(index);
|
|
1238
|
+
}
|
|
1239
|
+
}, [(_slots$itemMinus = slots.itemMinus) === null || _slots$itemMinus === void 0 ? void 0 : _slots$itemMinus.call(slots)])])])];
|
|
1240
|
+
}
|
|
1241
|
+
});
|
|
1242
|
+
}), !readonly.value && vue.createVNode("div", {
|
|
1243
|
+
"class": "pro-form-list-add",
|
|
1244
|
+
"onClick": handleAdd
|
|
1245
|
+
}, [(_slots$add = slots.add) === null || _slots$add === void 0 ? void 0 : _slots$add.call(slots)])]);
|
|
1246
|
+
};
|
|
1247
|
+
}
|
|
1248
|
+
});
|
|
1249
|
+
|
|
1250
|
+
var proFormItemProps = function proFormItemProps() {
|
|
1251
|
+
return {
|
|
1252
|
+
readonly: {
|
|
1253
|
+
type: Boolean,
|
|
1254
|
+
"default": undefined
|
|
1255
|
+
},
|
|
1256
|
+
fieldProps: {
|
|
1257
|
+
type: Object
|
|
1258
|
+
},
|
|
1259
|
+
showProps: {
|
|
1260
|
+
type: Object
|
|
1261
|
+
},
|
|
1262
|
+
slots: {
|
|
1263
|
+
type: Object
|
|
1264
|
+
}
|
|
1265
|
+
};
|
|
1266
|
+
};
|
|
1267
|
+
|
|
1268
|
+
var createFormItemCompFn = function createFormItemCompFn(FormItem, convertInputCompProps) {
|
|
1269
|
+
return function (_ref) {
|
|
1270
|
+
var InputComp = _ref.InputComp,
|
|
1271
|
+
valueType = _ref.valueType,
|
|
1272
|
+
name = _ref.name;
|
|
1273
|
+
return vue.defineComponent({
|
|
1274
|
+
name: name,
|
|
1275
|
+
props: _objectSpread2(_objectSpread2({}, FormItem.props), proFormItemProps()),
|
|
1276
|
+
setup: function setup(props, _ref2) {
|
|
1277
|
+
var slots = _ref2.slots;
|
|
1278
|
+
|
|
1279
|
+
var _useProForm = useProForm(),
|
|
1280
|
+
formState = _useProForm.formState,
|
|
1281
|
+
showState = _useProForm.showState,
|
|
1282
|
+
readonlyState = _useProForm.readonlyState,
|
|
1283
|
+
disableState = _useProForm.disableState,
|
|
1284
|
+
formReadonly = _useProForm.readonly,
|
|
1285
|
+
elementMap = _useProForm.elementMap;
|
|
1286
|
+
|
|
1287
|
+
var formListCtx = useProFormList(); //优先级 props.readonly > readonlyState > formContext.readonly
|
|
1288
|
+
|
|
1289
|
+
var readonly = vue.computed(function () {
|
|
1290
|
+
if (lodash.isBoolean(props.readonly)) {
|
|
1291
|
+
return props.readonly;
|
|
1292
|
+
} else if (lodash.isBoolean(readonlyState[props.name])) {
|
|
1293
|
+
return readonlyState[props.name];
|
|
1294
|
+
}
|
|
1295
|
+
|
|
1296
|
+
return formReadonly.value;
|
|
1297
|
+
});
|
|
1298
|
+
var nameList = convertPathToList(props.name);
|
|
1299
|
+
var path = formListCtx !== null && formListCtx !== void 0 && formListCtx.pathList ? [].concat(_toConsumableArray(formListCtx.pathList), _toConsumableArray(nameList)) : nameList;
|
|
1300
|
+
|
|
1301
|
+
var setValue = function setValue(v) {
|
|
1302
|
+
lodash.set(formState, path, v);
|
|
1303
|
+
};
|
|
1304
|
+
|
|
1305
|
+
var invalidKeys = lodash.keys(proFormItemProps());
|
|
1306
|
+
return function () {
|
|
1307
|
+
var show = lodash.get(showState, path);
|
|
1308
|
+
|
|
1309
|
+
if (lodash.isBoolean(show) && !show) {
|
|
1310
|
+
return null;
|
|
1311
|
+
}
|
|
1312
|
+
|
|
1313
|
+
var value = lodash.get(formState, path); //valueType对应的展示组件
|
|
1314
|
+
|
|
1315
|
+
var ShowComp = lodash.get(elementMap, valueType);
|
|
1316
|
+
return vue.createVNode(FormItem, vue.mergeProps(lodash.omit.apply(void 0, [props].concat(_toConsumableArray(invalidKeys), ["name", "slots"])), {
|
|
1317
|
+
"name": path
|
|
1318
|
+
}), _objectSpread2({
|
|
1319
|
+
"default": function _default() {
|
|
1320
|
+
return [readonly.value ? vue.createVNode(vue.Fragment, null, [ShowComp ? vue.createVNode(ShowComp, vue.mergeProps({
|
|
1321
|
+
"value": value
|
|
1322
|
+
}, props.fieldProps, {
|
|
1323
|
+
"showProps": props.showProps
|
|
1324
|
+
}), slots) : vue.createVNode("span", null, [value])]) : vue.createVNode(InputComp, vue.mergeProps(convertInputCompProps(value, setValue, lodash.get(disableState, path)), props.fieldProps), slots)];
|
|
1325
|
+
}
|
|
1326
|
+
}, props.slots));
|
|
1327
|
+
};
|
|
1328
|
+
}
|
|
1329
|
+
});
|
|
1330
|
+
};
|
|
1331
|
+
};
|
|
1332
|
+
|
|
1333
|
+
var ProTableKey = Symbol("pro-table");
|
|
1334
|
+
var useProTable = function useProTable() {
|
|
1335
|
+
return vue.inject(ProTableKey);
|
|
1336
|
+
};
|
|
1337
|
+
|
|
1338
|
+
var provideProTable = function provideProTable(ctx) {
|
|
1339
|
+
vue.provide(ProTableKey, ctx);
|
|
1340
|
+
};
|
|
1341
|
+
|
|
1342
|
+
var proTableProps = function proTableProps() {
|
|
1343
|
+
return {
|
|
1344
|
+
//操作栏
|
|
1345
|
+
operate: {
|
|
1346
|
+
type: Object
|
|
1347
|
+
},
|
|
1348
|
+
//默认空字符串
|
|
1349
|
+
columnEmptyText: {
|
|
1350
|
+
type: String
|
|
1351
|
+
},
|
|
1352
|
+
|
|
1353
|
+
/**
|
|
1354
|
+
* 公共column,会merge到columns item中
|
|
1355
|
+
*/
|
|
1356
|
+
column: {
|
|
1357
|
+
type: Object
|
|
1358
|
+
},
|
|
1359
|
+
//
|
|
1360
|
+
columns: {
|
|
1361
|
+
type: Array
|
|
1362
|
+
},
|
|
1363
|
+
|
|
1364
|
+
/**
|
|
1365
|
+
* 展示控件集合,readonly模式下使用这些组件渲染
|
|
1366
|
+
*/
|
|
1367
|
+
elementMap: {
|
|
1368
|
+
type: Object
|
|
1369
|
+
},
|
|
1370
|
+
|
|
1371
|
+
/**
|
|
1372
|
+
* loading
|
|
1373
|
+
*/
|
|
1374
|
+
loading: {
|
|
1375
|
+
type: Boolean
|
|
1376
|
+
},
|
|
1377
|
+
|
|
1378
|
+
/**
|
|
1379
|
+
* provide传递
|
|
1380
|
+
*/
|
|
1381
|
+
provideExtra: {
|
|
1382
|
+
type: Object
|
|
1383
|
+
}
|
|
1384
|
+
};
|
|
1385
|
+
};
|
|
1386
|
+
|
|
1387
|
+
var ProTable = vue.defineComponent({
|
|
1388
|
+
props: _objectSpread2({}, proTableProps()),
|
|
1389
|
+
setup: function setup(props, _ref) {
|
|
1390
|
+
var slots = _ref.slots;
|
|
1391
|
+
var columns = vue.computed(function () {
|
|
1392
|
+
//根据valueType选择对应的展示组件
|
|
1393
|
+
var columns = lodash.map(props.columns, function (item) {
|
|
1394
|
+
//merge公共item
|
|
1395
|
+
var nextItem = lodash.merge(props.column, item);
|
|
1396
|
+
|
|
1397
|
+
if (!item.customRender) {
|
|
1398
|
+
nextItem.customRender = function (_ref2) {
|
|
1399
|
+
var text = _ref2.text;
|
|
1400
|
+
var vn = getItemEl(props.elementMap, _objectSpread2(_objectSpread2({}, item), {}, {
|
|
1401
|
+
showProps: _objectSpread2(_objectSpread2({}, item.showProps), {}, {
|
|
1402
|
+
content: props.columnEmptyText
|
|
1403
|
+
})
|
|
1404
|
+
}), text); //如果找不到注册的组件,使用当前值 及 columnEmptyText
|
|
1405
|
+
|
|
1406
|
+
return vn || text || props.columnEmptyText;
|
|
1407
|
+
};
|
|
1408
|
+
}
|
|
1409
|
+
|
|
1410
|
+
return nextItem;
|
|
1411
|
+
});
|
|
1412
|
+
var operate = props.operate; //处理operate
|
|
1413
|
+
|
|
1414
|
+
if (operate && operate.items && lodash.some(operate.items, function (item) {
|
|
1415
|
+
return item.show;
|
|
1416
|
+
})) {
|
|
1417
|
+
//将itemState补充的信息拼到item中
|
|
1418
|
+
var items = lodash.map(operate.items, function (i) {
|
|
1419
|
+
return _objectSpread2(_objectSpread2({}, i), lodash.get(operate.itemState, i.value));
|
|
1420
|
+
}); //排序
|
|
1421
|
+
|
|
1422
|
+
var sortedItems = lodash.sortBy(items, function (item) {
|
|
1423
|
+
return item.sort;
|
|
1424
|
+
});
|
|
1425
|
+
columns.push(_objectSpread2(_objectSpread2({
|
|
1426
|
+
title: "操作",
|
|
1427
|
+
dataIndex: "operate",
|
|
1428
|
+
fixed: "right"
|
|
1429
|
+
}, props.column), {}, {
|
|
1430
|
+
customRender: function customRender(_ref3) {
|
|
1431
|
+
var record = _ref3.record;
|
|
1432
|
+
var validItems = lodash.filter(sortedItems, function (item) {
|
|
1433
|
+
if (item.show && lodash.isFunction(item.show)) {
|
|
1434
|
+
return item.show(record);
|
|
1435
|
+
}
|
|
1436
|
+
|
|
1437
|
+
if (item.show === false) {
|
|
1438
|
+
return false;
|
|
1439
|
+
}
|
|
1440
|
+
|
|
1441
|
+
return true;
|
|
1442
|
+
});
|
|
1443
|
+
return vue.createVNode("div", {
|
|
1444
|
+
"class": "pro-table-operate"
|
|
1445
|
+
}, [lodash.map(validItems, function (item) {
|
|
1446
|
+
//自定义
|
|
1447
|
+
if (lodash.isFunction(item.element)) {
|
|
1448
|
+
return item.element(record, item);
|
|
1449
|
+
}
|
|
1450
|
+
|
|
1451
|
+
return vue.createVNode("div", {
|
|
1452
|
+
"class": "pro-table-operate-item",
|
|
1453
|
+
"key": item.value,
|
|
1454
|
+
"onClick": function onClick() {
|
|
1455
|
+
var _item$onClick;
|
|
1456
|
+
|
|
1457
|
+
(_item$onClick = item.onClick) === null || _item$onClick === void 0 ? void 0 : _item$onClick.call(item, record);
|
|
1458
|
+
}
|
|
1459
|
+
}, [item.label]);
|
|
1460
|
+
})]);
|
|
1461
|
+
}
|
|
1462
|
+
}, operate.column));
|
|
1463
|
+
}
|
|
1464
|
+
|
|
1465
|
+
return columns;
|
|
1466
|
+
});
|
|
1467
|
+
provideProTable(_objectSpread2({
|
|
1468
|
+
columns: columns
|
|
1469
|
+
}, props.provideExtra));
|
|
1470
|
+
return function () {
|
|
1471
|
+
var _slots$default;
|
|
1472
|
+
|
|
1473
|
+
return (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots, columns.value);
|
|
1474
|
+
};
|
|
1475
|
+
}
|
|
1476
|
+
});
|
|
1477
|
+
|
|
732
1478
|
exports.ProCurd = ProCurd;
|
|
1479
|
+
exports.ProForm = ProForm;
|
|
1480
|
+
exports.ProFormList = ProFormList;
|
|
733
1481
|
exports.ProModule = ProModule;
|
|
1482
|
+
exports.ProSearchForm = ProSearchForm;
|
|
1483
|
+
exports.ProTable = ProTable;
|
|
734
1484
|
exports.RequestAction = RequestAction;
|
|
735
1485
|
exports.convertPathToList = convertPathToList;
|
|
1486
|
+
exports.createFormItemCompFn = createFormItemCompFn;
|
|
736
1487
|
exports.getColumnFormItemName = getColumnFormItemName;
|
|
737
1488
|
exports.getColumnValueType = getColumnValueType;
|
|
738
1489
|
exports.getFormItemEl = getFormItemEl;
|
|
@@ -745,4 +1496,7 @@ exports.useDoneRequestActor = useDoneRequestActor;
|
|
|
745
1496
|
exports.useFailedRequestActor = useFailedRequestActor;
|
|
746
1497
|
exports.useModuleEvent = useModuleEvent;
|
|
747
1498
|
exports.useProCurd = useProCurd;
|
|
1499
|
+
exports.useProForm = useProForm;
|
|
1500
|
+
exports.useProFormList = useProFormList;
|
|
748
1501
|
exports.useProModule = useProModule;
|
|
1502
|
+
exports.useProTable = useProTable;
|