@kine-design/crud 0.0.1-beta.10 → 0.0.1-beta.11

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.
Files changed (5) hide show
  1. package/components/formPage/KFormPage.tsx +40 -38
  2. package/components/formPage/formPage.css +12 -2
  3. package/dist/crud.css +12 -2
  4. package/dist/crud.js +25 -26
  5. package/package.json +2 -2
package/components/formPage/KFormPage.tsx CHANGED
@@ -52,50 +52,52 @@ export default defineComponent({
52
52
  const title = isEdit.value ? `编辑${props.config.title}` : `新建${props.config.title}`;
53
53
 
54
54
  return (
55
- <div class="k-form-page">
56
- {/* 页头 */}
57
- <div class="k-fp-header">
58
- <div class="k-fp-header-left">
59
- <KButton text="←" onClick={goBack} />
60
- <h1 class="k-fp-title">{title}</h1>
55
+ <div class="k-form-page-wrapper">
56
+ <div class="k-form-page">
57
+ {/* 页头 */}
58
+ <div class="k-fp-header">
59
+ <div class="k-fp-header-left">
60
+ <KButton text="←" onClick={goBack} />
61
+ <h1 class="k-fp-title">{title}</h1>
62
+ </div>
63
+ <div class="k-fp-header-right">
64
+ {slots.headerExtra?.()}
65
+ </div>
61
66
  </div>
62
- <div class="k-fp-header-right">
63
- {slots.headerExtra?.()}
64
- </div>
65
- </div>
66
67
 
67
- {/* 表单 */}
68
- <KFormCard>
69
- {slots.beforeFields?.({ formData })}
68
+ {/* 表单 */}
69
+ <KFormCard>
70
+ {slots.beforeFields?.({ formData })}
70
71
 
71
- <div class={`k-fp-grid k-fp-grid--${cols}`}>
72
- {props.config.fields.map(field => {
73
- const span = field.span === 'full' ? cols : (field.span ?? 1);
74
- return (
75
- <div
76
- key={field.param}
77
- class="k-fp-field"
78
- style={span > 1 ? { gridColumn: `span ${span}` } : undefined}
79
- >
80
- <label class="k-fp-label">
81
- {field.label}
82
- {field.required && <span class="k-fp-required">*</span>}
83
- </label>
84
- {renderFormField(field, formData, errors.value, validateField, slots)}
85
- {errors.value[field.param] && (
86
- <span class="k-fp-error">{errors.value[field.param]}</span>
87
- )}
88
- </div>
89
- );
90
- })}
91
- </div>
72
+ <div class={`k-fp-grid k-fp-grid--${cols}`}>
73
+ {props.config.fields.map(field => {
74
+ const span = field.span === 'full' ? cols : (field.span ?? 1);
75
+ return (
76
+ <div
77
+ key={field.param}
78
+ class="k-fp-field"
79
+ style={span > 1 ? { gridColumn: `span ${span}` } : undefined}
80
+ >
81
+ <label class="k-fp-label">
82
+ {field.label}
83
+ {field.required && <span class="k-fp-required">*</span>}
84
+ </label>
85
+ {renderFormField(field, formData, errors.value, validateField, slots)}
86
+ {errors.value[field.param] && (
87
+ <span class="k-fp-error">{errors.value[field.param]}</span>
88
+ )}
89
+ </div>
90
+ );
91
+ })}
92
+ </div>
92
93
 
93
- {slots.afterFields?.({ formData })}
94
- </KFormCard>
94
+ {slots.afterFields?.({ formData })}
95
+ </KFormCard>
95
96
 
96
- {slots.default?.({ formData })}
97
+ {slots.default?.({ formData })}
98
+ </div>
97
99
 
98
- {/* 底部操作栏 */}
100
+ {/* 底部操作栏 — 在 max-width 容器外，撑满内容区 */}
99
101
  <KStickyActionBar>
100
102
  {{
101
103
  default: () => slots.actions?.({ formData, submit, saveDraft, submitting }) ?? (
package/components/formPage/formPage.css CHANGED
@@ -97,7 +97,7 @@
97
97
  z-index: 10;
98
98
  display: flex;
99
99
  align-items: center;
100
- justify-content: space-between;
100
+ justify-content: flex-end;
101
101
  padding: var(--kine-spacing-6) var(--kine-spacing-12);
102
102
  background: var(--kine-color-bg-tertiary, #fff);
103
103
  border-top: 1px solid var(--kine-color-border-default, #e5e7eb);
@@ -247,9 +247,19 @@
247
247
  KFormPage / KMasterDetailPage — 表单页布局
248
248
  ================================================================ */
249
249
 
250
+ /* wrapper: 全宽容器，承载 sticky bar 出血 */
251
+ .k-form-page-wrapper {
252
+ display: flex;
253
+ flex-direction: column;
254
+ min-height: 100%;
255
+ }
256
+
250
257
  .k-form-page {
251
258
  max-width: 960px;
252
- padding: 0 0 80px;
259
+ width: 100%;
260
+ margin: 0 auto;
261
+ padding: 0 0 var(--kine-spacing-10);
262
+ flex: 1;
253
263
  }
254
264
 
255
265
  .k-master-detail-page {
package/dist/crud.css CHANGED
@@ -1864,7 +1864,7 @@ textarea.k-input {
1864
1864
  z-index: 10;
1865
1865
  display: flex;
1866
1866
  align-items: center;
1867
- justify-content: space-between;
1867
+ justify-content: flex-end;
1868
1868
  padding: var(--kine-spacing-6) var(--kine-spacing-12);
1869
1869
  background: var(--kine-color-bg-tertiary, #fff);
1870
1870
  border-top: 1px solid var(--kine-color-border-default, #e5e7eb);
@@ -2014,9 +2014,19 @@ textarea.k-input {
2014
2014
  KFormPage / KMasterDetailPage — 表单页布局
2015
2015
  ================================================================ */
2016
2016
 
2017
+ /* wrapper: 全宽容器，承载 sticky bar 出血 */
2018
+ .k-form-page-wrapper {
2019
+ display: flex;
2020
+ flex-direction: column;
2021
+ min-height: 100%;
2022
+ }
2023
+
2017
2024
  .k-form-page {
2018
2025
  max-width: 960px;
2019
- padding: 0 0 80px;
2026
+ width: 100%;
2027
+ margin: 0 auto;
2028
+ padding: 0 0 var(--kine-spacing-10);
2029
+ flex: 1;
2020
2030
  }
2021
2031
 
2022
2032
  .k-master-detail-page {
package/dist/crud.js CHANGED
@@ -10688,7 +10688,7 @@ var KFormPage_default = /* @__PURE__ */ defineComponent({
10688
10688
  return () => {
10689
10689
  if (loading.value) return createVNode("div", { "class": "k-fp-loading" }, [createTextVNode("加载中...")]);
10690
10690
  const title = isEdit.value ? `编辑${props.config.title}` : `新建${props.config.title}`;
10691
- return createVNode("div", { "class": "k-form-page" }, [
10691
+ return createVNode("div", { "class": "k-form-page-wrapper" }, [createVNode("div", { "class": "k-form-page" }, [
10692
10692
  createVNode("div", { "class": "k-fp-header" }, [createVNode("div", { "class": "k-fp-header-left" }, [createVNode(KButton_default, {
10693
10693
  "text": "←",
10694
10694
  "onClick": goBack
@@ -10709,31 +10709,30 @@ var KFormPage_default = /* @__PURE__ */ defineComponent({
10709
10709
  })]),
10710
10710
  slots.afterFields?.({ formData })
10711
10711
  ] }),
10712
- slots.default?.({ formData }),
10713
- createVNode(KStickyActionBar_default, null, { default: () => slots.actions?.({
10714
- formData,
10715
- submit,
10716
- saveDraft,
10717
- submitting
10718
- }) ?? createVNode(Fragment, null, [
10719
- createVNode(KButton_default, {
10720
- "text": "取消",
10721
- "onClick": goBack
10722
- }, null),
10723
- props.config.showDraft && createVNode(KButton_default, {
10724
- "text": "保存草稿",
10725
- "disabled": submitting.value,
10726
- "onClick": () => saveDraft()
10727
- }, null),
10728
- createVNode(KButton_default, {
10729
- "type": "primary",
10730
- "text": submitting.value ? "保存中..." : props.config.submitText ?? "保存",
10731
- "disabled": submitting.value,
10732
- "loading": submitting.value,
10733
- "onClick": () => submit()
10734
- }, null)
10735
- ]) })
10736
- ]);
10712
+ slots.default?.({ formData })
10713
+ ]), createVNode(KStickyActionBar_default, null, { default: () => slots.actions?.({
10714
+ formData,
10715
+ submit,
10716
+ saveDraft,
10717
+ submitting
10718
+ }) ?? createVNode(Fragment, null, [
10719
+ createVNode(KButton_default, {
10720
+ "text": "取消",
10721
+ "onClick": goBack
10722
+ }, null),
10723
+ props.config.showDraft && createVNode(KButton_default, {
10724
+ "text": "保存草稿",
10725
+ "disabled": submitting.value,
10726
+ "onClick": () => saveDraft()
10727
+ }, null),
10728
+ createVNode(KButton_default, {
10729
+ "type": "primary",
10730
+ "text": submitting.value ? "保存中..." : props.config.submitText ?? "保存",
10731
+ "disabled": submitting.value,
10732
+ "loading": submitting.value,
10733
+ "onClick": () => submit()
10734
+ }, null)
10735
+ ]) })]);
10737
10736
  };
10738
10737
  }
10739
10738
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kine-design/crud",
3
- "version": "0.0.1-beta.10",
3
+ "version": "0.0.1-beta.11",
4
4
  "type": "module",
5
5
  "main": "./dist/crud.js",
6
6
  "types": "./dist/index.d.ts",
@@ -10,7 +10,7 @@
10
10
  "vue": "^3.5.30",
11
11
  "vue-router": "^5.0.3",
12
12
  "@kine-design/core": "0.0.1-beta.3",
13
- "kine-ui": "0.0.1-beta.4"
13
+ "kine-ui": "0.0.1-beta.5"
14
14
  },
15
15
  "publishConfig": {
16
16
  "access": "public",