nsgm-cli 2.1.26 → 2.1.28

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.
@@ -5,55 +5,44 @@ export const Container = styled.div`
5
5
  margin: 20px 0 0 0;
6
6
  padding-bottom: 32px;
7
7
 
8
- .ant-table {
9
- box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
10
- border-radius: 8px;
11
- overflow: hidden;
12
- transition: all 0.3s ease;
13
-
14
- &:hover {
15
- box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
16
- }
17
- }
18
-
19
8
  .table-row-light {
20
- background-color: #ffffff;
9
+ background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.9) 100%);
10
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
21
11
  }
22
12
 
23
13
  .table-row-dark {
24
- background-color: #f9f9f9;
25
- }
26
-
27
- .ant-table-thead > tr > th {
28
- background-color: #f0f5ff;
29
- color: #1890ff;
30
- font-weight: 500;
31
- padding: 12px 16px;
32
- }
33
-
34
- .ant-table-tbody > tr > td {
35
- padding: 12px 16px;
36
- transition: background-color 0.3s;
14
+ background: linear-gradient(135deg, rgba(248, 250, 252, 0.95) 0%, rgba(243, 246, 248, 0.9) 100%);
15
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
37
16
  }
38
17
 
39
18
  .page-title {
40
- font-size: 24px;
41
- font-weight: 500;
19
+ font-size: 28px;
20
+ font-weight: 700;
42
21
  color: #1890ff;
43
- margin-bottom: 20px;
44
- padding-bottom: 10px;
45
- border-bottom: 1px solid #f0f0f0;
22
+ margin-bottom: 24px;
23
+ padding-bottom: 12px;
24
+ border-bottom: 2px solid #f0f0f0;
46
25
  position: relative;
47
26
 
48
27
  &:after {
49
28
  content: "";
50
29
  position: absolute;
51
- bottom: -1px;
30
+ bottom: -2px;
52
31
  left: 0;
53
- width: 100px;
54
- height: 3px;
55
- background: linear-gradient(90deg, #1890ff, #69c0ff);
56
- border-radius: 3px;
32
+ width: 120px;
33
+ height: 4px;
34
+ background: linear-gradient(90deg, #1890ff 0%, #52c41a 50%, #faad14 100%);
35
+ border-radius: 2px;
36
+ animation: slideIn 0.5s ease-out;
37
+ }
38
+ }
39
+
40
+ @keyframes slideIn {
41
+ from {
42
+ width: 0;
43
+ }
44
+ to {
45
+ width: 120px;
57
46
  }
58
47
  }
59
48
  `;
@@ -77,26 +66,32 @@ export const SearchRow = styled.div`
77
66
  `;
78
67
 
79
68
  export const ModalContainer = styled.div`
69
+ padding: 8px 0;
70
+
80
71
  .line {
81
72
  display: flex;
82
- flex: 1;
83
73
  flex-direction: row;
84
74
  justify-content: flex-start;
85
- align-items: flex-start;
86
- height: 50px;
87
- margin-bottom: 16px;
75
+ align-items: center;
76
+ min-height: 40px;
77
+ margin-bottom: 20px;
78
+
79
+ &:last-child {
80
+ margin-bottom: 0;
81
+ }
88
82
 
89
83
  label {
90
84
  display: flex;
91
85
  flex-direction: column;
92
86
  justify-content: center;
93
87
  align-items: flex-start;
94
- width: 80px;
95
- height: 32px;
88
+ width: 100px;
89
+ min-height: 32px;
96
90
  margin-right: 16px;
97
91
  font-weight: 500;
98
92
  color: #333;
99
93
  position: relative;
94
+ flex-shrink: 0;
100
95
 
101
96
  &:after {
102
97
  content: "";
@@ -106,34 +101,27 @@ export const ModalContainer = styled.div`
106
101
  transform: translateY(-50%);
107
102
  width: 3px;
108
103
  height: 16px;
109
- background: #1890ff;
104
+ background: linear-gradient(180deg, #1890ff 0%, #52c41a 100%);
110
105
  border-radius: 3px;
111
106
  }
112
107
  }
113
108
 
114
- input {
109
+ input,
110
+ .ant-input-affix-wrapper {
115
111
  flex: 1;
116
- border-radius: 6px;
117
- transition: all 0.3s ease;
112
+ border-radius: 8px;
113
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
114
+ min-height: 36px;
118
115
 
119
116
  &:hover,
120
117
  &:focus {
121
118
  border-color: #40a9ff;
122
- box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
119
+ box-shadow: 0 0 0 3px rgba(24, 144, 255, 0.15);
123
120
  }
124
121
  }
125
122
 
126
- .row {
127
- display: flex;
128
- flex-direction: row;
129
- justify-content: center;
130
- align-items: center;
131
-
132
- .item {
133
- flex-direction: row;
134
- justify-content: flex-start;
135
- align-items: center;
136
- }
123
+ .ant-input-affix-wrapper input {
124
+ min-height: auto;
137
125
  }
138
126
  }
139
127
  `;
@@ -185,18 +173,290 @@ export const StyledInput = styled(Input)`
185
173
 
186
174
  export const StyledTable = styled(Table)`
187
175
  margin-top: 16px;
188
- border-radius: 8px;
176
+ border-radius: 12px;
189
177
  overflow: hidden;
178
+ box-shadow:
179
+ 0 4px 16px rgba(0, 0, 0, 0.08),
180
+ 0 2px 8px rgba(0, 0, 0, 0.04),
181
+ inset 0 1px 0 rgba(255, 255, 255, 0.8);
182
+ background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.95) 100%);
183
+ backdrop-filter: blur(10px);
184
+ border: 1px solid rgba(255, 255, 255, 0.5);
185
+ transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
186
+
187
+ &:hover {
188
+ box-shadow:
189
+ 0 8px 24px rgba(0, 0, 0, 0.12),
190
+ 0 4px 12px rgba(0, 0, 0, 0.06),
191
+ inset 0 1px 0 rgba(255, 255, 255, 0.9);
192
+ transform: translateY(-2px);
193
+ }
194
+
195
+ .ant-table-container {
196
+ position: relative;
197
+ border-radius: 12px 12px 0 0;
198
+ overflow: auto;
199
+ }
200
+
201
+ .ant-table-content {
202
+ overflow: auto;
203
+ }
204
+
205
+ .ant-table-thead > tr > th {
206
+ background: linear-gradient(135deg, #f0f5ff 0%, #e6f4ff 100%);
207
+ color: #1890ff;
208
+ font-weight: 600;
209
+ padding: 16px;
210
+ font-size: 14px;
211
+ border-bottom: 2px solid #bae7ff;
212
+ position: relative;
213
+ white-space: nowrap;
214
+ overflow: hidden;
215
+ text-overflow: ellipsis;
216
+
217
+ &::before {
218
+ content: "";
219
+ position: absolute;
220
+ top: 0;
221
+ left: 0;
222
+ right: 0;
223
+ height: 3px;
224
+ background: linear-gradient(90deg, #1890ff 0%, #52c41a 50%, #faad14 100%);
225
+ opacity: 0.5;
226
+ }
227
+
228
+ .ant-table-column-sorter {
229
+ color: #1890ff;
230
+ font-size: 12px;
231
+ transition: all 0.3s ease;
232
+ display: inline-flex;
233
+ align-items: center;
234
+ margin-left: 4px;
235
+
236
+ &:hover {
237
+ color: #40a9ff;
238
+ transform: scale(1.1);
239
+ }
240
+ }
241
+
242
+ .ant-table-column-title {
243
+ white-space: nowrap;
244
+ overflow: hidden;
245
+ text-overflow: ellipsis;
246
+ display: inline;
247
+ }
248
+ }
249
+
250
+ .ant-table-tbody > tr {
251
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
252
+ border-bottom: 1px solid #f0f0f0;
253
+
254
+ &:hover > td {
255
+ background: linear-gradient(135deg, rgba(24, 144, 255, 0.05) 0%, rgba(82, 196, 26, 0.03) 100%) !important;
256
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
257
+ }
258
+ }
259
+
260
+ .ant-table-tbody > tr > td {
261
+ padding: 14px 16px;
262
+ color: #333;
263
+ font-size: 14px;
264
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
265
+ border-bottom: 1px solid #f0f0f0;
266
+ white-space: nowrap;
267
+ }
268
+
269
+ .ant-table-tbody > tr:last-child > td {
270
+ border-bottom: none;
271
+ }
272
+
273
+ .ant-table-selection-column {
274
+ width: 60px;
275
+ text-align: center;
276
+
277
+ .ant-checkbox-wrapper {
278
+ display: flex;
279
+ justify-content: center;
280
+ align-items: center;
281
+ }
282
+ }
283
+
284
+ .ant-table-cell-fix-right {
285
+ position: sticky !important;
286
+ right: 0;
287
+ z-index: 2;
288
+ background: linear-gradient(135deg, #f0f5ff 0%, #e6f4ff 100%);
289
+ box-shadow: -2px 0 8px rgba(0, 0, 0, 0.08);
290
+ }
291
+
292
+ .ant-table-pagination.ant-pagination {
293
+ margin: 20px 16px !important;
294
+ padding: 12px 20px;
295
+ background: linear-gradient(135deg, rgba(248, 250, 252, 0.95) 0%, rgba(243, 246, 248, 0.9) 100%);
296
+ border-radius: 8px;
297
+ border: 1px solid rgba(255, 255, 255, 0.5);
298
+ display: flex;
299
+ justify-content: flex-end;
300
+ align-items: center;
301
+ flex-wrap: wrap;
302
+ gap: 8px;
303
+
304
+ .ant-pagination-total-text {
305
+ color: #1890ff;
306
+ font-weight: 600;
307
+ margin-right: 16px;
308
+ font-size: 14px;
309
+ }
310
+ }
190
311
 
191
312
  .styled-pagination {
192
- margin-top: 16px;
193
- margin-bottom: 16px;
313
+ &.ant-pagination {
314
+ color: #666;
315
+ }
316
+
317
+ .ant-pagination-item {
318
+ border-radius: 6px;
319
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
320
+ border: 1px solid #d9d9d9;
321
+ background: #fff;
322
+
323
+ a {
324
+ color: #666 !important;
325
+ transition: all 0.3s ease;
326
+ }
327
+
328
+ &:hover {
329
+ border-color: #1890ff;
330
+ transform: translateY(-2px);
331
+ box-shadow: 0 4px 12px rgba(24, 144, 255, 0.15);
332
+
333
+ a {
334
+ color: #1890ff !important;
335
+ }
336
+ }
337
+
338
+ &.ant-pagination-item-active {
339
+ background: linear-gradient(135deg, #1890ff 0%, #40a9ff 100%);
340
+ border-color: #1890ff;
341
+ font-weight: 600;
342
+ box-shadow: 0 4px 12px rgba(24, 144, 255, 0.3);
343
+ transform: translateY(-2px);
344
+
345
+ a {
346
+ color: #fff !important;
347
+ }
348
+ }
349
+ }
350
+
351
+ .ant-pagination-prev,
352
+ .ant-pagination-next {
353
+ border-radius: 6px;
354
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
355
+
356
+ &:hover {
357
+ border-color: #1890ff;
358
+ color: #1890ff;
359
+ transform: translateY(-2px);
360
+ }
361
+
362
+ .ant-pagination-item-link {
363
+ border-radius: 6px;
364
+ transition: all 0.3s ease;
365
+ }
366
+ }
367
+
368
+ .ant-pagination-jump-prev,
369
+ .ant-pagination-jump-next {
370
+ border-radius: 6px;
371
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
372
+
373
+ &:hover {
374
+ color: #1890ff;
375
+ }
376
+ }
377
+
378
+ .ant-pagination-options {
379
+ .ant-select-selector {
380
+ border-radius: 6px !important;
381
+ transition: all 0.3s ease;
382
+
383
+ &:hover {
384
+ border-color: #1890ff;
385
+ }
386
+ }
387
+
388
+ .ant-pagination-options-quick-jumper input {
389
+ border-radius: 6px !important;
390
+ transition: all 0.3s ease;
391
+
392
+ &:hover,
393
+ &:focus {
394
+ border-color: #1890ff;
395
+ box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
396
+ }
397
+ }
398
+ }
399
+ }
400
+
401
+ /* 横向滚动条样式 */
402
+ .ant-table-body {
403
+ overflow-x: auto !important;
404
+
405
+ &::-webkit-scrollbar {
406
+ height: 8px;
407
+ width: 8px;
408
+ }
409
+
410
+ &::-webkit-scrollbar-track {
411
+ background: #f1f1f1;
412
+ border-radius: 4px;
413
+ }
414
+
415
+ &::-webkit-scrollbar-thumb {
416
+ background: #c1c1c1;
417
+ border-radius: 4px;
418
+
419
+ &:hover {
420
+ background: #a8a8a8;
421
+ }
422
+ }
423
+ }
424
+
425
+ /* 响应式设计 */
426
+ @media (max-width: 768px) {
427
+ .ant-table-thead > tr > th {
428
+ padding: 12px;
429
+ font-size: 13px;
430
+ }
431
+
432
+ .ant-table-tbody > tr > td {
433
+ padding: 12px;
434
+ font-size: 13px;
435
+ }
436
+
437
+ .ant-table-pagination.ant-pagination {
438
+ margin: 16px !important;
439
+ padding: 10px 16px;
440
+ }
194
441
  }
195
442
  `;
196
443
 
197
444
  export const ModalTitle = styled.div`
198
445
  color: #1890ff;
199
- font-weight: 500;
446
+ font-weight: 600;
447
+ font-size: 18px;
448
+ display: flex;
449
+ align-items: center;
450
+ gap: 8px;
451
+
452
+ &:before {
453
+ content: "";
454
+ display: inline-block;
455
+ width: 4px;
456
+ height: 20px;
457
+ background: linear-gradient(180deg, #1890ff 0%, #52c41a 100%);
458
+ border-radius: 2px;
459
+ }
200
460
  `;
201
461
 
202
462
  export const ModalInput = styled(Input)`
@@ -213,7 +473,16 @@ export const RoundedButton = styled(Button)`
213
473
 
214
474
  export const GlobalStyle = styled.div`
215
475
  .rounded-button {
216
- border-radius: 4px;
476
+ border-radius: 8px;
477
+ height: 36px;
478
+ padding: 0 20px;
479
+ font-weight: 500;
480
+ transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
481
+
482
+ &:hover {
483
+ transform: translateY(-1px);
484
+ box-shadow: 0 4px 12px rgba(24, 144, 255, 0.3);
485
+ }
217
486
  }
218
487
 
219
488
  /* 防止Modal打开时滚动条消失 */
@@ -221,4 +490,31 @@ export const GlobalStyle = styled.div`
221
490
  overflow: auto !important;
222
491
  padding-right: 0 !important;
223
492
  }
493
+
494
+ /* Modal 样式优化 */
495
+ .ant-modal-content {
496
+ border-radius: 16px;
497
+ overflow: hidden;
498
+ box-shadow:
499
+ 0 24px 48px rgba(0, 0, 0, 0.15),
500
+ 0 12px 24px rgba(0, 0, 0, 0.1);
501
+ }
502
+
503
+ .ant-modal-header {
504
+ padding: 20px 24px;
505
+ border-bottom: 1px solid #f0f0f0;
506
+ background: linear-gradient(135deg, #fafafa 0%, #f5f5f5 100%);
507
+ }
508
+
509
+ .ant-modal-body {
510
+ padding: 24px;
511
+ max-height: 60vh;
512
+ overflow-y: auto;
513
+ }
514
+
515
+ .ant-modal-footer {
516
+ padding: 16px 24px;
517
+ border-top: 1px solid #f0f0f0;
518
+ background: linear-gradient(135deg, #fafafa 0%, #f5f5f5 100%);
519
+ }
224
520
  `;
@@ -486,7 +486,7 @@ export default Page`;
486
486
  .join(",\n");
487
487
  }
488
488
  generateTableColumns(fields) {
489
- const columns = fields.map((field, index) => {
489
+ const columns = fields.map((field) => {
490
490
  let column = ` {\n title: t('${this.controller}:${this.controller}.fields.${field.name}'),\n dataIndex: '${field.name}',\n key: '${field.name}'`;
491
491
  // 添加排序功能
492
492
  if (field.type === "integer") {
@@ -508,10 +508,10 @@ export default Page`;
508
508
  }
509
509
  // 设置宽度
510
510
  if (field.name === "id") {
511
- column += `,\n width: '15%',\n align: 'center' as const`;
511
+ column += `,\n width: 80,\n align: 'center' as const`;
512
512
  }
513
- else if (index === fields.length - 1) {
514
- column += `,\n width: '60%',\n ellipsis: true`;
513
+ else if (field.type === "integer" || field.type === "decimal") {
514
+ column += `,\n width: 100`;
515
515
  }
516
516
  column += "\n }";
517
517
  return column;
@@ -520,8 +520,9 @@ export default Page`;
520
520
  const actionColumn = ` {
521
521
  title: t('${this.controller}:${this.controller}.fields.actions'),
522
522
  dataIndex: '',
523
- width: '25%',
523
+ width: 140,
524
524
  align: 'center' as const,
525
+ fixed: 'right',
525
526
  render: (_: any, record: any) => {
526
527
  return (
527
528
  <Space size="small">