@robot-admin/naive-ui-components 0.24.4 → 0.24.6
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 +14 -0
- package/README.md +7 -1
- package/README_EN.md +7 -1
- package/dist/C_FormModal.css +271 -45
- package/dist/C_FormModal2.cjs +1 -1
- package/dist/C_FormModal2.js +1 -1
- package/dist/C_Table.base.css +109 -110
- package/dist/C_Table.css +109 -110
- package/dist/C_Table2.cjs +3 -3
- package/dist/C_Table2.js +3 -3
- package/dist/constants.d.cts +1 -1
- package/dist/constants.d.ts +1 -1
- package/dist/constants2.d.cts +6 -6
- package/dist/constants2.d.ts +6 -6
- package/dist/constants3.d.cts +3 -3
- package/dist/constants3.d.ts +3 -3
- package/dist/constants5.d.cts +2 -2
- package/dist/constants5.d.ts +2 -2
- package/dist/data2.d.cts +10 -10
- package/dist/data2.d.ts +10 -10
- package/dist/formModal.cjs +1 -0
- package/dist/formModal.js +1 -0
- package/dist/index.vue.d.cts +3 -3
- package/dist/index.vue.d.ts +3 -3
- package/dist/index10.vue.d.cts +3 -3
- package/dist/index10.vue.d.ts +4 -4
- package/dist/index11.vue.d.cts +4 -4
- package/dist/index13.vue.d.ts +2 -2
- package/dist/index14.vue.d.cts +2 -2
- package/dist/index15.vue.d.ts +9 -9
- package/dist/index16.vue.d.cts +9 -9
- package/dist/index17.vue.d.ts +3 -3
- package/dist/index18.vue.d.cts +3 -3
- package/dist/index18.vue.d.ts +1 -1
- package/dist/index19.vue.d.cts +1 -1
- package/dist/index19.vue.d.ts +1 -1
- package/dist/index2.vue.d.cts +2 -2
- package/dist/index2.vue.d.ts +2 -2
- package/dist/index20.vue.d.cts +1 -1
- package/dist/index22.vue.d.ts +1 -1
- package/dist/index23.vue.d.cts +1 -1
- package/dist/index24.vue.d.cts +1 -1
- package/dist/index24.vue.d.ts +1 -1
- package/dist/index25.vue.d.cts +1 -1
- package/dist/index25.vue.d.ts +1 -1
- package/dist/index26.vue.d.cts +3 -3
- package/dist/index26.vue.d.ts +3 -3
- package/dist/index28.vue.d.cts +2 -2
- package/dist/index28.vue.d.ts +2 -2
- package/dist/index29.vue.d.cts +2 -2
- package/dist/index29.vue.d.ts +2 -2
- package/dist/index3.vue.d.cts +4 -4
- package/dist/index3.vue.d.ts +4 -4
- package/dist/index9.vue.d.ts +3 -3
- package/dist/mapUtils.d.cts +4 -4
- package/dist/mapUtils.d.ts +4 -4
- package/dist/presets.d.cts +1 -1
- package/dist/presets.d.ts +1 -1
- package/dist/style.css +110 -166
- package/dist/useCalendarEvents.d.cts +1 -1
- package/dist/useCalendarEvents.d.ts +1 -1
- package/dist/useCollapsePanel.d.cts +6 -6
- package/dist/useCollapsePanel.d.ts +6 -6
- package/dist/useCropperCore.d.cts +7 -7
- package/dist/useCropperCore.d.ts +7 -7
- package/dist/useDynamicFormState.d.cts +7 -7
- package/dist/useDynamicFormState.d.ts +7 -7
- package/dist/useEdgeInteraction.d.cts +1 -1
- package/dist/useEdgeInteraction.d.ts +1 -1
- package/dist/useInfiniteScroll.d.cts +1 -1
- package/dist/useInfiniteScroll.d.ts +1 -1
- package/dist/useQRCode.d.cts +3 -3
- package/dist/useQRCode.d.ts +3 -3
- package/dist/useSignatureHistory.d.cts +4 -4
- package/dist/useSignatureHistory.d.ts +4 -4
- package/dist/useSplitResize.d.cts +11 -11
- package/dist/useSplitResize.d.ts +11 -11
- package/dist/useWorkflowValidation.d.cts +3 -3
- package/dist/useWorkflowValidation.d.ts +3 -3
- package/dist/verification.d.cts +2 -2
- package/dist/verification.d.ts +2 -2
- package/docs/guides/form-density.en.md +4 -0
- package/docs/guides/form-density.md +4 -0
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,19 @@
|
|
|
1
1
|
# @robot-admin/naive-ui-components
|
|
2
2
|
|
|
3
|
+
## 0.24.6
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 修复普通下拉列转换为弹窗表单时遗漏选项的问题,保留标签、原始值和选项隔离,不要求配置字典。
|
|
8
|
+
|
|
9
|
+
- 修复 C_Table 将 modalWidth 作为无效原生属性传递导致编辑弹窗通栏的问题,移除宿主原子类依赖。与 C_FormModal 共用轻量原生分区样式,按配置居中、受视口宽高约束,窄屏表单自动单列,超高内容内部滚动并保留标题和页脚。保留原有编辑、校验与保存会话。
|
|
10
|
+
|
|
11
|
+
## 0.24.5
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- 修复表单弹窗首行贴标题的问题,使用原生 Card 分区样式统一紧凑留白、内容滚动与固定页脚,约束宽高并避免样式穿透内嵌业务卡片。移除失效的 scoped 弹窗样式,不增加字段监听或渲染测量。
|
|
16
|
+
|
|
3
17
|
## 0.24.4
|
|
4
18
|
|
|
5
19
|
### Patch Changes
|
package/README.md
CHANGED
|
@@ -33,12 +33,18 @@
|
|
|
33
33
|
| 按需消费 | 60 个独立组件入口、自动导入 Resolver、组件样式入口,以及表单/表格的基础样式层级 |
|
|
34
34
|
| 独立接入 | 支持全量注册与局部导入;反馈、文案和全局配置可由宿主提供,表单弹窗可接入结构兼容的 Headless CRUD |
|
|
35
35
|
|
|
36
|
-
组件库负责界面与交互;业务接口、身份权限、上传服务和第三方平台配置由应用接入。当前仓库版本 **0.24.
|
|
36
|
+
组件库负责界面与交互;业务接口、身份权限、上传服务和第三方平台配置由应用接入。当前仓库版本 **0.24.6**,版本变化见 [CHANGELOG](./CHANGELOG.md)。
|
|
37
37
|
|
|
38
38
|
0.24.3–0.24.4 复核了异步校验与编辑会话、字典订阅、列拖拽、媒体与图实例、数据快照及依赖边界,修复已复现的问题并删除死状态与不可达重试分支。审查范围、性能约束和验证证据见[稳定性复核](./docs/stability-review-20261031.md)。
|
|
39
39
|
|
|
40
40
|
表单与搜索共用 `config.density: 'compact'`:收紧字段、布局和空校验区,实际错误仍自然展开。表单弹窗默认紧凑,页脚按钮 22px;搜索可继承应用密度。紧凑数字输入默认隐藏步进按钮,保留键盘、精度和上下限,也可逐字段开启。按需设置默认值与显式覆盖见[表单密度](./docs/guides/form-density.md)。
|
|
41
41
|
|
|
42
|
+
0.24.5 修复表单弹窗首行紧贴标题的问题:标题、内容与页脚通过原生分区样式保持留白,长表单仅内容区滚动,页脚保持可见;样式不穿透内嵌业务卡片。
|
|
43
|
+
|
|
44
|
+
0.24.6 修复 `C_Table` 编辑弹窗未应用 `edit.modalWidth` 导致通栏的问题。表格编辑与 `C_FormModal` 共用原生分区样式和视口约束;桌面按配置宽度居中,窄屏自动单列,超高内容内部滚动,无需宿主原子类或页面样式补丁。
|
|
45
|
+
|
|
46
|
+
普通下拉列的 `editProps.options` 同步传递到弹窗字段,不依赖字典绑定;显示标签、编辑及保存继续使用各自的原始值协议。
|
|
47
|
+
|
|
42
48
|
业务工作台新增共享字典 Provider、容器搜索、区域密度、远程选择、错误导航及批量结果;纯值工具走 `/data`,组合函数走 `/workflows`。接入见[业务数据与工作台](./docs/guides/data-workflows.md)、[搜索工作流](./docs/guides/search-workflows.md)、[远程选择](./docs/guides/data-picker.md)和[批量结果](./docs/guides/batch-results.md)。
|
|
43
49
|
|
|
44
50
|
## 能力地图
|
package/README_EN.md
CHANGED
|
@@ -33,12 +33,18 @@
|
|
|
33
33
|
| Selective loading | 60 component entries, an auto-import resolver, component CSS and base styles for forms and tables |
|
|
34
34
|
| Application integration | Global registration or local imports; injectable feedback, locale and defaults; form dialogs compatible with structurally matching headless CRUD controllers |
|
|
35
35
|
|
|
36
|
-
The library handles UI and interaction. Applications supply business APIs, authentication, authorization, upload services and platform configuration. The current repository version is **0.24.
|
|
36
|
+
The library handles UI and interaction. Applications supply business APIs, authentication, authorization, upload services and platform configuration. The current repository version is **0.24.6**; see the [changelog](./CHANGELOG.md) for release details.
|
|
37
37
|
|
|
38
38
|
The 0.24.3–0.24.4 review covers async validation and edit sessions, dictionaries, column dragging, media and graph instances, data snapshots and dependency boundaries. Reproduced issues are fixed; dead state and unreachable retry branches are removed. See the [stability review](./docs/stability-review-20261031.md) for scope, performance constraints and verification evidence.
|
|
39
39
|
|
|
40
40
|
Forms and search share `config.density: 'compact'`, reducing field spacing and empty validation space while allowing errors to expand naturally. Form modals default to compact density with 22px footer buttons, and search can inherit application density. Compact numeric fields hide step buttons by default while retaining keyboard interaction, precision and limits; individual fields can enable buttons. See [form density](./docs/guides/form-density.en.md) for on-demand defaults and explicit overrides.
|
|
41
41
|
|
|
42
|
+
0.24.5 restores spacing between form modal titles and the first field using native card section styles. Long forms scroll inside the content area while the footer stays visible; modal styles do not override nested business cards.
|
|
43
|
+
|
|
44
|
+
0.24.6 fixes full-width `C_Table` editor dialogs ignoring `edit.modalWidth`. Table editors and `C_FormModal` share native section styles and viewport bounds. Dialogs honor configured widths on desktop, use one form column when space is limited, and scroll tall content without relying on application utility CSS.
|
|
45
|
+
|
|
46
|
+
Ordinary select columns retain `editProps.options` in modal fields without requiring dictionary bindings. Labels are displayed while editing and saving preserve the original value types.
|
|
47
|
+
|
|
42
48
|
Business workspaces can share dictionary providers, container-aware search, regional density, remote pickers, error navigation and batch results. Pure value utilities live at `/data`; opt-in composables live at `/workflows`. See the [data and workspace guide](./docs/guides/data-workflows.md), [search workflows](./docs/guides/search-workflows.md), [data picker](./docs/guides/data-picker.md) and [batch results](./docs/guides/batch-results.md).
|
|
43
49
|
|
|
44
50
|
## Capability map
|
package/dist/C_FormModal.css
CHANGED
|
@@ -1,59 +1,285 @@
|
|
|
1
1
|
@import "./C_Form.css";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
}
|
|
22
|
-
.c-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
2
|
+
.c-icon[data-v-075758a0] {
|
|
3
|
+
display: inline-flex;
|
|
4
|
+
align-items: center;
|
|
5
|
+
justify-content: center;
|
|
6
|
+
position: relative;
|
|
7
|
+
flex-shrink: 0;
|
|
8
|
+
vertical-align: middle;
|
|
9
|
+
user-select: none;
|
|
10
|
+
transition: all 0.2s ease-in-out;
|
|
11
|
+
}
|
|
12
|
+
.c-icon--clickable[data-v-075758a0] {
|
|
13
|
+
cursor: pointer;
|
|
14
|
+
}
|
|
15
|
+
.c-icon--clickable[data-v-075758a0]:hover {
|
|
16
|
+
opacity: 0.8;
|
|
17
|
+
transform: scale(1.05);
|
|
18
|
+
}
|
|
19
|
+
.c-icon--clickable[data-v-075758a0]:active {
|
|
20
|
+
transform: scale(0.95);
|
|
21
|
+
}
|
|
22
|
+
.c-icon--clickable[data-v-075758a0]:focus-visible {
|
|
23
|
+
outline: 2px solid currentColor;
|
|
24
|
+
outline-offset: 2px;
|
|
25
|
+
border-radius: 4px;
|
|
26
|
+
}
|
|
27
|
+
.c-icon--loading[data-v-075758a0] {
|
|
28
|
+
opacity: 0.6;
|
|
29
|
+
cursor: wait;
|
|
30
|
+
}
|
|
31
|
+
.c-icon__loading[data-v-075758a0] {
|
|
32
|
+
position: absolute;
|
|
33
|
+
inset: 0;
|
|
34
|
+
}
|
|
35
|
+
.c-icon__spinner[data-v-075758a0] {
|
|
36
|
+
width: 100%;
|
|
37
|
+
height: 100%;
|
|
38
|
+
border: 2px solid currentColor;
|
|
39
|
+
border-radius: 50%;
|
|
40
|
+
border-top-color: transparent;
|
|
41
|
+
animation: spin-075758a0 1s linear infinite;
|
|
42
|
+
}
|
|
43
|
+
.c-icon__error[data-v-075758a0] {
|
|
44
|
+
font-size: 0.8em;
|
|
45
|
+
opacity: 0.5;
|
|
46
|
+
}
|
|
47
|
+
.c-icon__rotatable[data-v-075758a0] {
|
|
48
|
+
transition: transform 0.3s ease-in-out;
|
|
49
|
+
}
|
|
50
|
+
.c-icon__flippable[data-v-075758a0] {
|
|
51
|
+
transition: transform 0.3s ease-in-out;
|
|
52
|
+
}
|
|
53
|
+
@keyframes spin-075758a0 {
|
|
54
|
+
0% {
|
|
55
|
+
transform: rotate(0deg);
|
|
56
|
+
}
|
|
57
|
+
100% {
|
|
58
|
+
transform: rotate(360deg);
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
/* layer: default */
|
|
63
|
+
.inline-flex[data-v-075758a0]{display:inline-flex;}
|
|
64
|
+
.transform[data-v-075758a0]{transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}
|
|
65
|
+
.px[data-v-075758a0]{padding-left:1rem;padding-right:1rem;}
|
|
66
|
+
|
|
67
|
+
/* 通用操作按钮组件样式 */
|
|
68
|
+
/* ================= 主容器 ================= */
|
|
69
|
+
.c-action-bar[data-v-48eb3073] {
|
|
29
70
|
display: flex;
|
|
71
|
+
min-width: 0;
|
|
72
|
+
align-items: center;
|
|
73
|
+
justify-content: space-between;
|
|
74
|
+
padding: 16px;
|
|
75
|
+
margin-bottom: 16px;
|
|
76
|
+
background: var(--c-bg-card);
|
|
77
|
+
border-radius: var(--c-radius);
|
|
78
|
+
border: 1px solid var(--c-border);
|
|
79
|
+
transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
|
|
80
|
+
}
|
|
81
|
+
.c-action-bar.is-align-left[data-v-48eb3073] {
|
|
82
|
+
justify-content: flex-start;
|
|
83
|
+
}
|
|
84
|
+
.c-action-bar.is-align-center[data-v-48eb3073] {
|
|
85
|
+
justify-content: center;
|
|
86
|
+
}
|
|
87
|
+
.c-action-bar.is-align-right[data-v-48eb3073] {
|
|
30
88
|
justify-content: flex-end;
|
|
31
|
-
padding: 10px 16px;
|
|
32
|
-
background: color-mix(in srgb, var(--n-color-modal) 94%, var(--n-border-color));
|
|
33
|
-
border-top: 1px solid var(--n-border-color);
|
|
34
89
|
}
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
padding-inline: 12px;
|
|
90
|
+
.c-action-bar.is-align-space-between[data-v-48eb3073] {
|
|
91
|
+
justify-content: space-between;
|
|
38
92
|
}
|
|
39
|
-
.c-
|
|
40
|
-
|
|
93
|
+
.c-action-bar.is-align-space-around[data-v-48eb3073] {
|
|
94
|
+
justify-content: space-around;
|
|
41
95
|
}
|
|
96
|
+
.c-action-bar.is-compact[data-v-48eb3073] {
|
|
97
|
+
padding: 8px;
|
|
98
|
+
margin-bottom: 8px;
|
|
42
99
|
}
|
|
43
|
-
.c-
|
|
100
|
+
.c-action-bar.is-inline[data-v-48eb3073] {
|
|
101
|
+
padding: 0;
|
|
44
102
|
margin-bottom: 0;
|
|
103
|
+
background: transparent;
|
|
104
|
+
border: none;
|
|
105
|
+
border-radius: 0;
|
|
106
|
+
box-shadow: none;
|
|
107
|
+
}
|
|
108
|
+
.c-action-bar.is-wrap[data-v-48eb3073] {
|
|
109
|
+
flex-wrap: wrap;
|
|
110
|
+
gap: 8px;
|
|
111
|
+
}
|
|
112
|
+
.c-action-bar.is-wrap .actions-group[data-v-48eb3073] {
|
|
113
|
+
flex-wrap: wrap;
|
|
114
|
+
min-width: 0;
|
|
115
|
+
max-width: 100%;
|
|
116
|
+
}
|
|
117
|
+
@media (max-width: 768px) {
|
|
118
|
+
.c-action-bar[data-v-48eb3073] {
|
|
119
|
+
flex-direction: column;
|
|
120
|
+
gap: 12px;
|
|
121
|
+
}
|
|
122
|
+
.c-action-bar .actions-group[data-v-48eb3073] {
|
|
123
|
+
width: 100%;
|
|
124
|
+
justify-content: center;
|
|
125
|
+
}
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
/* ================= 按钮组 ================= */
|
|
129
|
+
.actions-group[data-v-48eb3073] {
|
|
130
|
+
display: flex;
|
|
131
|
+
align-items: center;
|
|
132
|
+
gap: 12px;
|
|
133
|
+
flex-wrap: nowrap;
|
|
134
|
+
flex-shrink: 0;
|
|
135
|
+
}
|
|
136
|
+
.actions-group.actions-left[data-v-48eb3073] {
|
|
137
|
+
justify-content: flex-start;
|
|
138
|
+
}
|
|
139
|
+
.actions-group.actions-right[data-v-48eb3073] {
|
|
140
|
+
justify-content: flex-end;
|
|
141
|
+
}
|
|
142
|
+
.c-action-bar.has-only-left.is-align-center .actions-group.actions-left[data-v-48eb3073], .c-action-bar.has-only-right.is-align-center .actions-group.actions-right[data-v-48eb3073] {
|
|
143
|
+
width: 100%;
|
|
144
|
+
justify-content: center;
|
|
145
|
+
}
|
|
146
|
+
.c-action-bar.has-only-left.is-align-space-between .actions-group.actions-left[data-v-48eb3073], .c-action-bar.has-only-right.is-align-space-between .actions-group.actions-right[data-v-48eb3073] {
|
|
147
|
+
width: 100%;
|
|
148
|
+
justify-content: space-between;
|
|
149
|
+
}
|
|
150
|
+
.c-action-bar.has-only-left.is-align-space-around .actions-group.actions-left[data-v-48eb3073], .c-action-bar.has-only-right.is-align-space-around .actions-group.actions-right[data-v-48eb3073] {
|
|
151
|
+
width: 100%;
|
|
152
|
+
justify-content: space-around;
|
|
153
|
+
}
|
|
154
|
+
.c-action-bar.has-only-left.is-align-right .actions-group.actions-left[data-v-48eb3073] {
|
|
155
|
+
width: 100%;
|
|
156
|
+
justify-content: flex-end;
|
|
157
|
+
}
|
|
158
|
+
.c-action-bar.has-only-right.is-align-left .actions-group.actions-right[data-v-48eb3073] {
|
|
159
|
+
width: 100%;
|
|
160
|
+
justify-content: flex-start;
|
|
45
161
|
}
|
|
46
|
-
.
|
|
47
|
-
|
|
48
|
-
|
|
162
|
+
.actions-group[data-v-48eb3073] .n-button {
|
|
163
|
+
flex-shrink: 0;
|
|
164
|
+
transition: color 0.16s ease, background-color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
|
|
165
|
+
font-weight: 500;
|
|
49
166
|
}
|
|
50
|
-
.
|
|
51
|
-
|
|
167
|
+
.actions-group[data-v-48eb3073] .n-button .n-icon {
|
|
168
|
+
transition: transform 0.3s ease;
|
|
52
169
|
}
|
|
53
|
-
.
|
|
54
|
-
|
|
170
|
+
.actions-group[data-v-48eb3073] .n-button:hover:not(:disabled) {
|
|
171
|
+
transform: translateY(-1px);
|
|
172
|
+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
|
|
55
173
|
}
|
|
174
|
+
.actions-group[data-v-48eb3073] .n-button:hover:not(:disabled) .n-icon {
|
|
175
|
+
transform: scale(1.1);
|
|
176
|
+
}
|
|
177
|
+
.actions-group[data-v-48eb3073] .n-button:active:not(:disabled) {
|
|
178
|
+
transform: translateY(0);
|
|
179
|
+
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
180
|
+
}
|
|
181
|
+
.actions-group[data-v-48eb3073] .n-button:disabled {
|
|
182
|
+
cursor: not-allowed;
|
|
183
|
+
opacity: 0.5;
|
|
184
|
+
}
|
|
185
|
+
.actions-group[data-v-48eb3073] .n-button.n-button--loading {
|
|
186
|
+
pointer-events: none;
|
|
187
|
+
}
|
|
188
|
+
.actions-group[data-v-48eb3073] .n-button--primary-type:hover:not(:disabled) {
|
|
189
|
+
box-shadow: 0 4px 12px rgba(24, 160, 88, 0.3);
|
|
190
|
+
}
|
|
191
|
+
.actions-group[data-v-48eb3073] .n-button--info-type:hover:not(:disabled) {
|
|
192
|
+
box-shadow: 0 4px 12px rgba(42, 148, 125, 0.3);
|
|
193
|
+
}
|
|
194
|
+
.actions-group[data-v-48eb3073] .n-button--success-type:hover:not(:disabled) {
|
|
195
|
+
box-shadow: 0 4px 12px rgba(99, 226, 183, 0.3);
|
|
196
|
+
}
|
|
197
|
+
.actions-group[data-v-48eb3073] .n-button--warning-type:hover:not(:disabled) {
|
|
198
|
+
box-shadow: 0 4px 12px rgba(240, 138, 0, 0.3);
|
|
199
|
+
}
|
|
200
|
+
.actions-group[data-v-48eb3073] .n-button--error-type:hover:not(:disabled) {
|
|
201
|
+
box-shadow: 0 4px 12px rgba(208, 48, 80, 0.3);
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
/* ================= 中间插槽区域 ================= */
|
|
205
|
+
.actions-center[data-v-48eb3073] {
|
|
206
|
+
display: flex;
|
|
207
|
+
align-items: center;
|
|
208
|
+
justify-content: center;
|
|
209
|
+
flex: 1;
|
|
210
|
+
padding: 0 24px;
|
|
211
|
+
min-width: 0;
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
/* ================= 分隔线 ================= */
|
|
215
|
+
.action-divider[data-v-48eb3073] {
|
|
216
|
+
margin: 0 8px !important;
|
|
217
|
+
height: 20px;
|
|
218
|
+
opacity: 0.3;
|
|
219
|
+
transition: opacity 0.3s ease;
|
|
220
|
+
}
|
|
221
|
+
.action-divider[data-v-48eb3073]:hover {
|
|
222
|
+
opacity: 0.6;
|
|
223
|
+
}
|
|
224
|
+
|
|
225
|
+
/* ================= 下拉菜单优化 ================= */
|
|
226
|
+
[data-v-48eb3073] .n-dropdown-option {
|
|
227
|
+
transition: all 0.2s ease;
|
|
228
|
+
}
|
|
229
|
+
[data-v-48eb3073] .n-dropdown-option:hover {
|
|
230
|
+
transform: translateX(4px);
|
|
231
|
+
}
|
|
232
|
+
[data-v-48eb3073] .n-dropdown-option .n-icon {
|
|
233
|
+
transition: transform 0.2s ease;
|
|
234
|
+
}
|
|
235
|
+
[data-v-48eb3073] .n-dropdown-option:hover .n-icon {
|
|
236
|
+
transform: scale(1.15);
|
|
237
|
+
}
|
|
238
|
+
|
|
239
|
+
/* ================= 加载动画 ================= */
|
|
240
|
+
@keyframes button-loading-48eb3073 {
|
|
241
|
+
0% {
|
|
242
|
+
opacity: 0.6;
|
|
243
|
+
}
|
|
244
|
+
50% {
|
|
245
|
+
opacity: 1;
|
|
246
|
+
}
|
|
247
|
+
100% {
|
|
248
|
+
opacity: 0.6;
|
|
249
|
+
}
|
|
250
|
+
}
|
|
251
|
+
[data-v-48eb3073] .n-button--loading {
|
|
252
|
+
animation: button-loading-48eb3073 1.5s ease-in-out infinite;
|
|
253
|
+
}
|
|
254
|
+
|
|
255
|
+
/* ================= Tooltip 样式 ================= */
|
|
256
|
+
[data-v-48eb3073] .n-tooltip .n-tooltip__content {
|
|
257
|
+
font-size: 12px;
|
|
258
|
+
padding: 6px 10px;
|
|
259
|
+
border-radius: 4px;
|
|
260
|
+
backdrop-filter: blur(8px);
|
|
261
|
+
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
/* ================= 暗黑模式适配 ================= */
|
|
265
|
+
html.dark .c-action-bar[data-v-48eb3073] {
|
|
266
|
+
border-color: rgba(255, 255, 255, 0.09);
|
|
267
|
+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
|
|
268
|
+
}
|
|
269
|
+
html.dark .actions-group[data-v-48eb3073] .n-button:hover:not(:disabled) {
|
|
270
|
+
box-shadow: 0 4px 12px rgba(255, 255, 255, 0.1);
|
|
271
|
+
}
|
|
272
|
+
html.dark .action-divider[data-v-48eb3073] {
|
|
273
|
+
opacity: 0.15;
|
|
274
|
+
}
|
|
275
|
+
html.dark .action-divider[data-v-48eb3073]:hover {
|
|
276
|
+
opacity: 0.4;
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
/* layer: default */
|
|
280
|
+
.inline[data-v-48eb3073]{display:inline;}
|
|
281
|
+
.px[data-v-48eb3073]{padding-left:1rem;padding-right:1rem;}
|
|
282
|
+
|
|
56
283
|
|
|
57
284
|
/* layer: default */
|
|
58
|
-
.visible[data-v-
|
|
59
|
-
.px[data-v-66511257]{padding-left:1rem;padding-right:1rem;}
|
|
285
|
+
.visible[data-v-133d21f7]{visibility:visible;}
|
package/dist/C_FormModal2.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
require(`./chunk.cjs`);const e=require(`./density.cjs`),t=require(`./export-helper.cjs`),n=require(`./C_ActionBar2.cjs`),r=require(`./useFormConfig.cjs`),i=require(`./helpers.cjs`);let
|
|
1
|
+
require(`./chunk.cjs`);const e=require(`./density.cjs`),t=require(`./export-helper.cjs`),n=require(`./C_ActionBar2.cjs`),r=require(`./useFormConfig.cjs`),i=require(`./helpers.cjs`),a=require(`./formModal.cjs`);let o=require(`vue`),s=require(`naive-ui`);const c=(0,o.defineComponent)({name:`C_FormModal`,__name:`index`,props:{editor:{},options:{},config:{default:()=>({})},width:{default:`min(620px, calc(100vw - 24px))`},createText:{default:`创建`},saveText:{default:`保存`},cancelText:{default:`取消`},closable:{type:Boolean,default:!0},maskClosable:{type:Boolean,default:!0},closeOnEsc:{type:Boolean,default:!0}},emits:[`submit`,`close`],setup(t,{emit:c}){let l=t,u=c,d=(0,o.ref)(null),f=r.o(),p=(0,o.computed)(()=>l.config?.density??f.density??`compact`),m=(0,o.computed)({get:()=>l.editor.visible.value,set:e=>{e||b()}}),h=(0,o.computed)(()=>l.editor.title.value),g=(0,o.computed)(()=>l.editor.loading.value),_=(0,o.computed)(()=>a.t(l.width,p.value)),v=(0,o.computed)({get:()=>l.editor.model.value??{},set:e=>{l.editor.setModel(e)}}),y=(0,o.computed)(()=>({...l.config,density:p.value,mode:l.editor.mode.value,showActions:!1,onSubmit:async(e,t)=>{if(await l.config?.onSubmit?.(e,t),t?.signal.aborted)return;let n=await l.editor.submit(e.model);t?.signal.aborted||u(`submit`,e,n)}})),b=()=>{l.editor.close(),u(`close`)},x=(0,o.computed)(()=>{let t=r.r(y.value,f),n=e.t(p.value);return{align:`right`,size:t.size??(p.value===`compact`?`tiny`:n.size),gap:n.gap,compact:p.value===`compact`}}),S=(0,o.computed)(()=>n.a([{key:`cancel`,label:l.cancelText,disabled:g,onClick:b},{key:l.editor.mode.value===`create`?`create`:`save`,label:l.editor.mode.value===`create`?l.createText:l.saveText,loading:g,onClick:async()=>{await d.value?.submit()}}]));return(e,r)=>((0,o.openBlock)(),(0,o.createBlock)((0,o.unref)(s.NModal),{show:m.value,"onUpdate:show":r[1]||=e=>m.value=e,preset:`card`,title:h.value,"aria-label":h.value,style:(0,o.normalizeStyle)(_.value.shell),"header-style":_.value.header,"content-style":_.value.content,"footer-style":_.value.footer,"footer-class":`c-form-modal__footer`,"mask-closable":t.maskClosable,"close-on-esc":t.closeOnEsc,closable:t.closable,class:(0,o.normalizeClass)([`c-form-modal`,`c-form-modal--${p.value}`])},{footer:(0,o.withCtx)(()=>[(0,o.createVNode)(n.t,{actions:S.value,config:x.value},null,8,[`actions`,`config`])]),default:(0,o.withCtx)(()=>[m.value&&t.editor.model.value?((0,o.openBlock)(),(0,o.createBlock)((0,o.unref)(i.i),{key:0,ref_key:`formRef`,ref:d,modelValue:v.value,"onUpdate:modelValue":r[0]||=e=>v.value=e,options:t.options,config:y.value},(0,o.createSlots)({_:2},[(0,o.renderList)(e.$slots,(t,n)=>({name:n,fn:(0,o.withCtx)(t=>[(0,o.renderSlot)(e.$slots,n,(0,o.normalizeProps)((0,o.guardReactiveProps)(t)),void 0,!0)])}))]),1032,[`modelValue`,`options`,`config`])):(0,o.createCommentVNode)(`v-if`,!0)]),_:3},8,[`show`,`title`,`aria-label`,`style`,`header-style`,`content-style`,`footer-style`,`mask-closable`,`close-on-esc`,`closable`,`class`]))}});var l=t.t(c,[[`__scopeId`,`data-v-133d21f7`]]);Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return l}});
|
package/dist/C_FormModal2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{t as e}from"./density.js";import{t}from"./export-helper.js";import{a as n,t as r}from"./C_ActionBar2.js";import{o as i,r as a}from"./useFormConfig.js";import{i as o}from"./helpers.js";import{computed as
|
|
1
|
+
import{t as e}from"./density.js";import{t}from"./export-helper.js";import{a as n,t as r}from"./C_ActionBar2.js";import{o as i,r as a}from"./useFormConfig.js";import{i as o}from"./helpers.js";import{t as s}from"./formModal.js";import{computed as c,createBlock as l,createCommentVNode as u,createSlots as d,createVNode as f,defineComponent as p,guardReactiveProps as m,normalizeClass as h,normalizeProps as g,normalizeStyle as _,openBlock as v,ref as y,renderList as b,renderSlot as x,unref as S,withCtx as C}from"vue";import{NModal as w}from"naive-ui";var T=t(p({name:`C_FormModal`,__name:`index`,props:{editor:{},options:{},config:{default:()=>({})},width:{default:`min(620px, calc(100vw - 24px))`},createText:{default:`创建`},saveText:{default:`保存`},cancelText:{default:`取消`},closable:{type:Boolean,default:!0},maskClosable:{type:Boolean,default:!0},closeOnEsc:{type:Boolean,default:!0}},emits:[`submit`,`close`],setup(t,{emit:p}){let T=t,E=p,D=y(null),O=i(),k=c(()=>T.config?.density??O.density??`compact`),A=c({get:()=>T.editor.visible.value,set:e=>{e||I()}}),j=c(()=>T.editor.title.value),M=c(()=>T.editor.loading.value),N=c(()=>s(T.width,k.value)),P=c({get:()=>T.editor.model.value??{},set:e=>{T.editor.setModel(e)}}),F=c(()=>({...T.config,density:k.value,mode:T.editor.mode.value,showActions:!1,onSubmit:async(e,t)=>{if(await T.config?.onSubmit?.(e,t),t?.signal.aborted)return;let n=await T.editor.submit(e.model);t?.signal.aborted||E(`submit`,e,n)}})),I=()=>{T.editor.close(),E(`close`)},L=c(()=>{let t=a(F.value,O),n=e(k.value);return{align:`right`,size:t.size??(k.value===`compact`?`tiny`:n.size),gap:n.gap,compact:k.value===`compact`}}),R=c(()=>n([{key:`cancel`,label:T.cancelText,disabled:M,onClick:I},{key:T.editor.mode.value===`create`?`create`:`save`,label:T.editor.mode.value===`create`?T.createText:T.saveText,loading:M,onClick:async()=>{await D.value?.submit()}}]));return(e,n)=>(v(),l(S(w),{show:A.value,"onUpdate:show":n[1]||=e=>A.value=e,preset:`card`,title:j.value,"aria-label":j.value,style:_(N.value.shell),"header-style":N.value.header,"content-style":N.value.content,"footer-style":N.value.footer,"footer-class":`c-form-modal__footer`,"mask-closable":t.maskClosable,"close-on-esc":t.closeOnEsc,closable:t.closable,class:h([`c-form-modal`,`c-form-modal--${k.value}`])},{footer:C(()=>[f(r,{actions:R.value,config:L.value},null,8,[`actions`,`config`])]),default:C(()=>[A.value&&t.editor.model.value?(v(),l(S(o),{key:0,ref_key:`formRef`,ref:D,modelValue:P.value,"onUpdate:modelValue":n[0]||=e=>P.value=e,options:t.options,config:F.value},d({_:2},[b(e.$slots,(t,n)=>({name:n,fn:C(t=>[x(e.$slots,n,g(m(t)),void 0,!0)])}))]),1032,[`modelValue`,`options`,`config`])):u(`v-if`,!0)]),_:3},8,[`show`,`title`,`aria-label`,`style`,`header-style`,`content-style`,`footer-style`,`mask-closable`,`close-on-esc`,`closable`,`class`]))}}),[[`__scopeId`,`data-v-133d21f7`]]);export{T as t};
|