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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "plain-design",
3
- "version": "0.0.89",
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.105",
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.105",
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
- .pl-cascade-panel {
3
- display: inline-block;
4
- height: 200px;
5
- border: solid 1px $ibc;
6
- border-radius: $popperRadius;
7
- color: $itc;
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
- .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;
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
- .pl-list {
30
- overflow: hidden;
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
- .pl-cascade-item {
34
- padding: 5px 0 5px 12px;
35
- font-weight: 400;
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
- .pl-cascade-content {
43
- padding-right: 30px;
44
- position: relative;
29
+ .pl-list {
30
+ overflow: hidden;
31
+ }
45
32
 
46
- .pl-cascade-arrow {
47
- position: absolute;
48
- top: 0;
49
- bottom: 0;
50
- right: 0;
51
- width: 30px;
52
- display: flex;
53
- align-items: center;
54
- justify-content: center;
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
- &.pl-cascade-item-expand, &:hover {
60
- color: $ihc;
61
- background-color: $disabled;
62
- }
43
+ .pl-cascade-content {
44
+ padding-right: 30px;
45
+ position: relative;
63
46
 
64
- &.pl-cascade-item-active {
65
- color: $colorPrimary;
66
- background-color: rgba($colorPrimary, 0.1);
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
- &.pl-cascade-empty {
70
- display: flex;
71
- flex-direction: column;
72
- align-items: center;
73
- justify-content: center;
60
+ &.pl-cascade-item-expand, &:hover {
61
+ color: $ihc;
62
+ background-color: $disabled;
63
+ }
74
64
 
75
- padding-left: 0;
76
- font-size: 12px;
77
- color: $disabledText;
78
- background-color: transparent;
79
- cursor: auto;
65
+ &.pl-cascade-item-active {
66
+ color: $colorPrimary;
67
+ background-color: rgba($colorPrimary, 0.1);
68
+ }
80
69
 
81
- .pl-icon {
82
- margin-bottom: 8px;
83
- font-size: 20px;
84
- }
85
- }
70
+ &.pl-cascade-empty {
71
+ display: flex;
72
+ flex-direction: column;
73
+ align-items: center;
74
+ justify-content: center;
86
75
 
87
- &.pl-cascade-item-disabled {
88
- background-color: transparent;
89
- color: $disabledText;
90
- cursor: not-allowed;
91
- }
92
- }
76
+ padding-left: 0;
77
+ font-size: 12px;
78
+ color: $disabledText;
79
+ background-color: transparent;
80
+ cursor: auto;
93
81
 
94
- &.pl-cascade-filter-list {
95
- width: 360px;
96
- }
82
+ .pl-icon {
83
+ margin-bottom: 8px;
84
+ font-size: 20px;
85
+ }
97
86
  }
98
87
 
99
- .pl-loading-mask {
100
- top: 1px;
101
- bottom: 1px;
102
- left: 1px;
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(-5vh) scale(0.85);opacity: 0;}
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(-5vh) scale(0.85);opacity: 0;}
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 300ms linear, transform 300ms $transition;
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 : '120px'
125
- let minWidth = props.minWidth !== undefined ? props.minWidth : width !== undefined ? null : '500px'
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
 
@@ -55,7 +55,7 @@
55
55
  }
56
56
 
57
57
  .pl-dropdown-group-content {
58
- padding: 4px 8px;
58
+ padding: 4px 0;
59
59
  }
60
60
 
61
61
  &.pl-dropdown-no-title:not(:last-child) {
@@ -31,6 +31,7 @@
31
31
 
32
32
  .pl-input-custom-placeholder {
33
33
  color: $ipc;
34
+ margin-left: 6px;
34
35
  }
35
36
 
36
37
  input, textarea {
@@ -52,6 +52,7 @@
52
52
  background-color: rgba(black, 0.8);
53
53
  color: white;
54
54
  padding: 3px 6px;
55
+ line-height: initial;
55
56
  position: absolute;
56
57
  left: 50%;
57
58
  transform: translateX(-50%);
@@ -172,4 +173,4 @@
172
173
  }
173
174
  }
174
175
  }
175
- }
176
+ }
@@ -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(updateNodes.map(node => node.editRow)).map(row => hooks.onBeforeSaveRow.exec(row)))}
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()
@@ -3,7 +3,7 @@
3
3
  position: fixed;
4
4
 
5
5
  .pl-contextmenu-service-body {
6
- transition: all $transition 300ms;
6
+ transition: all $transition 150ms;
7
7
  transform-origin: top left;
8
8
  box-sizing: border-box;
9
9
  box-shadow: $boxshadow;
@@ -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 || '500px')
200
+ return ((option.dialogProps || {}).width || '400px')
201
201
  } else {
202
- return 500
202
+ return 400
203
203
  }
204
204
  })()
205
205