plain-design 0.0.89 → 0.0.93
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/plain-design.commonjs.min.js +2 -2
- package/dist/plain-design.min.css +18 -18
- package/dist/plain-design.min.js +2 -2
- package/dist/report.html +2 -2
- package/package.json +3 -3
- package/src/packages/PlCascadePanel/cascade-panel.scss +90 -89
- package/src/packages/PlDialog/dialog.scss +8 -8
- package/src/packages/PlDialog/index.tsx +2 -2
- package/src/packages/PlDropdown/dropdown.scss +1 -1
- package/src/packages/PlInput/input.scss +1 -0
- package/src/packages/PlSlider/slider.scss +2 -1
- package/src/packages/createUseTableOption/use/use.methods.tsx +21 -1
- package/src/packages/useContextmenu/contextmenu-service.scss +1 -1
- package/src/packages/useDialog/PlDialogService.tsx +2 -2
- package/src/styles/data/scan.scss.json +15 -15
- package/src/styles/public/public.scss +31 -1
- package/src/styles/public/transition.scss +1 -1
- package/src/styles/theme/default.scss +2 -2
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "plain-design",
|
3
|
-
"version": "0.0.
|
3
|
+
"version": "0.0.93",
|
4
4
|
"description": "",
|
5
5
|
"main": "dist/plain-design.min.js",
|
6
6
|
"module": "dist/plain-design.commonjs.min.js",
|
@@ -21,7 +21,7 @@
|
|
21
21
|
"author": "",
|
22
22
|
"license": "ISC",
|
23
23
|
"peerDependencies": {
|
24
|
-
"plain-design-composition": "0.0.
|
24
|
+
"plain-design-composition": "0.0.114",
|
25
25
|
"react": "^17.0.1",
|
26
26
|
"react-dom": "^17.0.1"
|
27
27
|
},
|
@@ -65,7 +65,7 @@
|
|
65
65
|
"fork-ts-checker-webpack-plugin": "^6.2.4",
|
66
66
|
"mini-css-extract-plugin": "^1.6.2",
|
67
67
|
"mockjs": "^1.1.0",
|
68
|
-
"plain-design-composition": "0.0.
|
68
|
+
"plain-design-composition": "^0.0.114",
|
69
69
|
"postcss": "^8.2.13",
|
70
70
|
"postcss-loader": "^4.2.0",
|
71
71
|
"qs": "^6.10.1",
|
@@ -1,106 +1,107 @@
|
|
1
1
|
@include theme {
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
& > .pl-list {
|
10
|
-
height: 100%;
|
11
|
-
overflow: hidden;
|
12
|
-
white-space: nowrap;
|
13
|
-
}
|
2
|
+
.pl-cascade-panel {
|
3
|
+
display: inline-block;
|
4
|
+
height: 200px;
|
5
|
+
border: solid 1px $ibc;
|
6
|
+
border-radius: $popperRadius;
|
7
|
+
color: $itc;
|
14
8
|
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
display: inline-block;
|
21
|
-
vertical-align: top;
|
22
|
-
overflow: hidden;
|
23
|
-
box-sizing: border-box;
|
24
|
-
|
25
|
-
&:not(:last-child) {
|
26
|
-
border-right: solid 1px $ibc;
|
27
|
-
}
|
9
|
+
& > .pl-list {
|
10
|
+
height: 100%;
|
11
|
+
overflow: hidden;
|
12
|
+
white-space: nowrap;
|
13
|
+
}
|
28
14
|
|
29
|
-
|
30
|
-
|
31
|
-
|
15
|
+
.pl-cascade-list {
|
16
|
+
width: 180px;
|
17
|
+
height: 100%;
|
18
|
+
padding: 6px 0;
|
19
|
+
font-size: 14px;
|
20
|
+
display: inline-block;
|
21
|
+
vertical-align: top;
|
22
|
+
overflow: hidden;
|
23
|
+
box-sizing: border-box;
|
32
24
|
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
font-size: 13px;
|
37
|
-
color: $itc;
|
38
|
-
background-color: white;
|
39
|
-
transition: all 300ms $transition;
|
40
|
-
cursor: pointer;
|
25
|
+
&:not(:last-child) {
|
26
|
+
border-right: solid 1px $ibc;
|
27
|
+
}
|
41
28
|
|
42
|
-
|
43
|
-
|
44
|
-
|
29
|
+
.pl-list {
|
30
|
+
overflow: hidden;
|
31
|
+
}
|
45
32
|
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
color: $icc;
|
56
|
-
}
|
57
|
-
}
|
33
|
+
.pl-cascade-item {
|
34
|
+
padding: 5px 0 5px 12px;
|
35
|
+
line-height: 22px;
|
36
|
+
font-weight: 400;
|
37
|
+
font-size: 13px;
|
38
|
+
color: $itc;
|
39
|
+
background-color: white;
|
40
|
+
transition: all 300ms $transition;
|
41
|
+
cursor: pointer;
|
58
42
|
|
59
|
-
|
60
|
-
|
61
|
-
|
62
|
-
}
|
43
|
+
.pl-cascade-content {
|
44
|
+
padding-right: 30px;
|
45
|
+
position: relative;
|
63
46
|
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
47
|
+
.pl-cascade-arrow {
|
48
|
+
position: absolute;
|
49
|
+
top: 0;
|
50
|
+
bottom: 0;
|
51
|
+
right: 0;
|
52
|
+
width: 30px;
|
53
|
+
display: flex;
|
54
|
+
align-items: center;
|
55
|
+
justify-content: center;
|
56
|
+
color: $icc;
|
57
|
+
}
|
58
|
+
}
|
68
59
|
|
69
|
-
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
justify-content: center;
|
60
|
+
&.pl-cascade-item-expand, &:hover {
|
61
|
+
color: $ihc;
|
62
|
+
background-color: $disabled;
|
63
|
+
}
|
74
64
|
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
cursor: auto;
|
65
|
+
&.pl-cascade-item-active {
|
66
|
+
color: $colorPrimary;
|
67
|
+
background-color: rgba($colorPrimary, 0.1);
|
68
|
+
}
|
80
69
|
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
70
|
+
&.pl-cascade-empty {
|
71
|
+
display: flex;
|
72
|
+
flex-direction: column;
|
73
|
+
align-items: center;
|
74
|
+
justify-content: center;
|
86
75
|
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
}
|
76
|
+
padding-left: 0;
|
77
|
+
font-size: 12px;
|
78
|
+
color: $disabledText;
|
79
|
+
background-color: transparent;
|
80
|
+
cursor: auto;
|
93
81
|
|
94
|
-
|
95
|
-
|
96
|
-
|
82
|
+
.pl-icon {
|
83
|
+
margin-bottom: 8px;
|
84
|
+
font-size: 20px;
|
85
|
+
}
|
97
86
|
}
|
98
87
|
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
right: 1px;
|
88
|
+
&.pl-cascade-item-disabled {
|
89
|
+
background-color: transparent;
|
90
|
+
color: $disabledText;
|
91
|
+
cursor: not-allowed;
|
104
92
|
}
|
93
|
+
}
|
94
|
+
|
95
|
+
&.pl-cascade-filter-list {
|
96
|
+
width: 360px;
|
97
|
+
}
|
98
|
+
}
|
99
|
+
|
100
|
+
.pl-loading-mask {
|
101
|
+
top: 1px;
|
102
|
+
bottom: 1px;
|
103
|
+
left: 1px;
|
104
|
+
right: 1px;
|
105
105
|
}
|
106
|
-
}
|
106
|
+
}
|
107
|
+
}
|
@@ -109,7 +109,7 @@
|
|
109
109
|
/*@formatter:off*/
|
110
110
|
&.pl-transition-dialog-enter {
|
111
111
|
&:before {opacity: 0;}
|
112
|
-
.pl-dialog-body {transform: translateY(-
|
112
|
+
.pl-dialog-body {transform: translateY(-10px);opacity: 0;}
|
113
113
|
}
|
114
114
|
&.pl-transition-dialog-enter-active {
|
115
115
|
&:before {opacity: 1;}
|
@@ -121,10 +121,10 @@
|
|
121
121
|
}
|
122
122
|
&.pl-transition-dialog-exit-active {
|
123
123
|
&:before {opacity: 0;}
|
124
|
-
.pl-dialog-body {transform: translateY(-
|
124
|
+
.pl-dialog-body {transform: translateY(-10px);opacity: 0;}
|
125
125
|
}
|
126
126
|
&.pl-transition-dialog-enter-active, &.pl-transition-dialog-exit-active {
|
127
|
-
transition: opacity
|
127
|
+
transition: opacity 150ms linear, transform 150ms $transition;
|
128
128
|
}
|
129
129
|
/*@formatter:on*/
|
130
130
|
}
|
@@ -171,19 +171,19 @@
|
|
171
171
|
/*@formatter:off*/
|
172
172
|
&.pl-transition-dialog-#{$key}-enter {
|
173
173
|
&:before {opacity: 0;}
|
174
|
-
.pl-dialog-body {transform: $value;}
|
174
|
+
.pl-dialog-body {opacity: 0;transform: $value;}
|
175
175
|
}
|
176
176
|
&.pl-transition-dialog-#{$key}-enter-active {
|
177
177
|
&:before {opacity: 1;}
|
178
|
-
.pl-dialog-body {transform: translate3d(0, 0, 0);}
|
178
|
+
.pl-dialog-body {opacity: 1;transform: translate3d(0, 0, 0);}
|
179
179
|
}
|
180
180
|
&.pl-transition-dialog-#{$key}-exit {
|
181
181
|
&:before {opacity: 1;}
|
182
|
-
.pl-dialog-body {transform: translate3d(0, 0, 0);}
|
182
|
+
.pl-dialog-body {opacity: 1;transform: translate3d(0, 0, 0);}
|
183
183
|
}
|
184
184
|
&.pl-transition-dialog-#{$key}-exit-active {
|
185
185
|
&:before {opacity: 0;}
|
186
|
-
.pl-dialog-body {transform: $value;}
|
186
|
+
.pl-dialog-body {opacity: 0;transform: $value;}
|
187
187
|
}
|
188
188
|
&.pl-transition-dialog-#{$key}-enter-active, &.pl-transition-dialog-#{$key}-exit-active {
|
189
189
|
.pl-dialog-body {
|
@@ -193,4 +193,4 @@
|
|
193
193
|
/*@formatter:on*/
|
194
194
|
}
|
195
195
|
}
|
196
|
-
}
|
196
|
+
}
|
@@ -121,8 +121,8 @@ export const PlDialog = designComponent({
|
|
121
121
|
let height = props.fullHeight ? `calc(100vh - ${(!!hasHead.value ? 45 : 0) + (hasFoot.value ? 50 : 0)}px)` : props.height
|
122
122
|
let width = props.fullWidth ? '100vw' : props.width
|
123
123
|
|
124
|
-
let minHeight = props.minHeight !== undefined ? props.minHeight : height !== undefined ? null : '
|
125
|
-
let minWidth = props.minWidth !== undefined ? props.minWidth : width !== undefined ? null : '
|
124
|
+
let minHeight = props.minHeight !== undefined ? props.minHeight : height !== undefined ? null : '100px'
|
125
|
+
let minWidth = props.minWidth !== undefined ? props.minWidth : width !== undefined ? null : '400px'
|
126
126
|
let maxHeight = props.maxHeight !== undefined ? props.maxHeight : height !== undefined ? null : '80vh'
|
127
127
|
let maxWidth = props.maxWidth !== undefined ? props.maxWidth : width !== undefined ? null : '60vw'
|
128
128
|
|
@@ -61,6 +61,14 @@ export function useTableOptionMethods({tableState, config, pagination, hooks, cu
|
|
61
61
|
requestConfig,
|
62
62
|
}
|
63
63
|
},
|
64
|
+
getChangeNode: (node: TableNode) => {
|
65
|
+
const {editRow, data} = node
|
66
|
+
const changeKey = Object.keys({...editRow, ...data}).find(key => editRow[key] !== data[key])
|
67
|
+
/*if (!!changeKey) {
|
68
|
+
console.log(editRow[changeKey], data[changeKey])
|
69
|
+
}*/
|
70
|
+
return !!changeKey ? node : null
|
71
|
+
},
|
64
72
|
}
|
65
73
|
|
66
74
|
const pageMethods = useAsyncMethods((() => {
|
@@ -381,6 +389,13 @@ export function useTableOptionMethods({tableState, config, pagination, hooks, cu
|
|
381
389
|
$$message.error(`第${index + 1}条记录校验不通过,${errors[0].label}:${errors[0].message}`)
|
382
390
|
return Promise.reject(validateResult)
|
383
391
|
}
|
392
|
+
const changeNode = utils.getChangeNode(node)
|
393
|
+
if (!changeNode) {
|
394
|
+
// 没有改变任何字段
|
395
|
+
node.closeEdit()
|
396
|
+
await selectCurrent(node.editRow[config.keyField])
|
397
|
+
return
|
398
|
+
}
|
384
399
|
const saveRow = await saveUpdate(node.editRow)
|
385
400
|
node.saveEdit(saveRow)
|
386
401
|
node.closeEdit()
|
@@ -425,8 +440,13 @@ export function useTableOptionMethods({tableState, config, pagination, hooks, cu
|
|
425
440
|
$$message.error(`第${index + 1}条记录校验不通过,${errors[0].label}:${errors[0].message}`)
|
426
441
|
return Promise.reject(validateResults[0])
|
427
442
|
}
|
443
|
+
const changeNodes = updateNodes.map(node => utils.getChangeNode(node)).filter(Boolean) as TableNode[]
|
444
|
+
if (changeNodes.length === 0) {
|
445
|
+
updateNodes.forEach(node => node.cancelEdit())
|
446
|
+
return confirm.close.clear()
|
447
|
+
}
|
428
448
|
let {request, requestConfig} = utils.getUrlConfig('batchUpdate')
|
429
|
-
requestConfig.body = {rows: await Promise.all(deepcopy(
|
449
|
+
requestConfig.body = {rows: await Promise.all(deepcopy(changeNodes.map(node => node.editRow)).map(row => hooks.onBeforeSaveRow.exec(row)))}
|
430
450
|
requestConfig = await hooks.onBeforeUpdate.exec(requestConfig)
|
431
451
|
await request!(requestConfig)
|
432
452
|
confirm.close.clear()
|
@@ -197,9 +197,9 @@ export default createDefaultService({
|
|
197
197
|
const width = (() => {
|
198
198
|
if (!!option.dialogProps && option.dialogProps.width !== undefined) {return option.dialogProps.width}
|
199
199
|
if (option.editType === DialogServiceEditType.textarea) {
|
200
|
-
return ((option.dialogProps || {}).width || '
|
200
|
+
return ((option.dialogProps || {}).width || '400px')
|
201
201
|
} else {
|
202
|
-
return
|
202
|
+
return 400
|
203
203
|
}
|
204
204
|
})()
|
205
205
|
|