@agile-team/wl-skills-kit 2.9.3 → 2.9.4
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 +12 -0
- package/README.md +1 -1
- package/bin/wl-skills.js +1 -1
- package/files/.github/copilot-instructions.md +9 -14
- package/files/.github/guides/architecture.md +1 -1
- package/files/.github/guides/usage.md +1 -1
- package/files/.github/skills/_best-practices.md +2 -2
- package/files/.github/skills/core/convention-audit/SKILL.md +9 -7
- package/files/.github/skills/core/page-codegen/SKILL.md +1 -0
- package/files/.github/skills/core/page-codegen/USAGE.md +1 -1
- package/files/.github/skills/core/prototype-scan/SKILL.md +3 -3
- package/files/.github/standards/14-layout-containers.md +159 -159
- package/files/demo/sale/demo/add-demo/index.scss +207 -207
- package/files/demo/sale/demo/add-demo/index.vue +171 -171
- package/files/demo/sale/demo/metallurgical-spec/index.scss +264 -264
- package/files/demo/sale/demo/metallurgical-spec/index.vue +313 -313
- package/files/src/components/global/C_Splitter/index.vue +149 -149
- package/files/src/components/local/c_formSections/README.md +496 -496
- package/package.json +2 -2
|
@@ -1,171 +1,171 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
* @Author: ChenYu ycyplus@gmail.com
|
|
3
|
-
* @Date: 2025-12-29 15:38:58
|
|
4
|
-
* @LastEditors: ChenYu ycyplus@gmail.com
|
|
5
|
-
* @LastEditTime: 2026-01-03 00:46:17
|
|
6
|
-
* @FilePath: \cx-ui-sale\src\views\sale\demo\add-demo\index.vue
|
|
7
|
-
* @Description: 新增编辑页示例 - 视图层（订单新增编辑表单、项次信息管理）
|
|
8
|
-
* Copyright (c) 2025 by CHENY, All Rights Reserved 😎.
|
|
9
|
-
-->
|
|
10
|
-
<template>
|
|
11
|
-
<div class="main-maintenance-container">
|
|
12
|
-
<!-- jh-drag-row 包裹表单区和项次信息（上下拖拽） -->
|
|
13
|
-
<jh-drag-row :topHeight="480" class="main-splitter">
|
|
14
|
-
<template #top>
|
|
15
|
-
<!-- 🆕 使用增强版组件（集成所有功能） -->
|
|
16
|
-
<c_formSections
|
|
17
|
-
:sections="sectionsConfig"
|
|
18
|
-
:form="form"
|
|
19
|
-
v-model:activeNames="activeNames"
|
|
20
|
-
show-header
|
|
21
|
-
header-title="主档维护"
|
|
22
|
-
:header-actions="headerActions"
|
|
23
|
-
show-toolbar
|
|
24
|
-
show-required-filter
|
|
25
|
-
show-layout-switch
|
|
26
|
-
:default-layout="5"
|
|
27
|
-
:layout-options="[2, 3, 4, 5]"
|
|
28
|
-
show-nav-tabs
|
|
29
|
-
nav-tabs-position="left"
|
|
30
|
-
:nav-tabs="navTabsConfig"
|
|
31
|
-
label-width="100px"
|
|
32
|
-
label-position="right"
|
|
33
|
-
:gutter="20"
|
|
34
|
-
class="form-card"
|
|
35
|
-
>
|
|
36
|
-
<!-- 特殊需求区块插槽 -->
|
|
37
|
-
<template #special-3>
|
|
38
|
-
<el-row :gutter="20">
|
|
39
|
-
<el-col :span="24">
|
|
40
|
-
<el-button type="primary" plain @click="addSpecialRequirement">
|
|
41
|
-
+ 添加需求
|
|
42
|
-
</el-button>
|
|
43
|
-
</el-col>
|
|
44
|
-
</el-row>
|
|
45
|
-
</template>
|
|
46
|
-
</c_formSections>
|
|
47
|
-
</template>
|
|
48
|
-
|
|
49
|
-
<template #bottom>
|
|
50
|
-
<el-card
|
|
51
|
-
shadow="never"
|
|
52
|
-
class="items-card"
|
|
53
|
-
:initialSize="220"
|
|
54
|
-
:minSize="150"
|
|
55
|
-
>
|
|
56
|
-
<div class="child-items-section">
|
|
57
|
-
<div class="section-header">
|
|
58
|
-
<div class="title-group">
|
|
59
|
-
<el-icon class="collapse-icon"><ArrowDown /></el-icon>
|
|
60
|
-
<span>项次信息</span>
|
|
61
|
-
</div>
|
|
62
|
-
<el-icon
|
|
63
|
-
class="fullscreen-icon"
|
|
64
|
-
:title="isItemTableFullscreen ? '退出全屏' : '全屏'"
|
|
65
|
-
@click="toggleItemTableFullscreen"
|
|
66
|
-
>
|
|
67
|
-
<component :is="isItemTableFullscreen ? 'Close' : 'FullScreen'" />
|
|
68
|
-
</el-icon>
|
|
69
|
-
</div>
|
|
70
|
-
<BaseTable
|
|
71
|
-
:data="paginatedItemData"
|
|
72
|
-
:columns="itemColumnsConfig"
|
|
73
|
-
border
|
|
74
|
-
class="child-table"
|
|
75
|
-
height="100%"
|
|
76
|
-
/>
|
|
77
|
-
<!-- 分页 -->
|
|
78
|
-
<div class="items-pagination">
|
|
79
|
-
<div class="drag-hint">
|
|
80
|
-
<span class="drag-icon">⇕</span>
|
|
81
|
-
<span class="hint-text">长按拖动，可调整两个区域所占高度</span>
|
|
82
|
-
</div>
|
|
83
|
-
<jh-pagination
|
|
84
|
-
v-show="itemTotal && itemTotal > 0"
|
|
85
|
-
:total="itemTotal || 0"
|
|
86
|
-
v-model:currentPage="currentPage"
|
|
87
|
-
v-model:pageSize="pageSize"
|
|
88
|
-
@current-change="refreshItemData"
|
|
89
|
-
@size-change="refreshItemData"
|
|
90
|
-
/>
|
|
91
|
-
</div>
|
|
92
|
-
</div>
|
|
93
|
-
</el-card>
|
|
94
|
-
</template>
|
|
95
|
-
</jh-drag-row>
|
|
96
|
-
|
|
97
|
-
<!-- 全屏模式 - 使用 Teleport 传送到 body -->
|
|
98
|
-
<Teleport to="body">
|
|
99
|
-
<div v-if="isItemTableFullscreen" class="fullscreen-overlay">
|
|
100
|
-
<el-card shadow="never" class="items-card-fullscreen">
|
|
101
|
-
<div class="child-items-section">
|
|
102
|
-
<div class="section-header">
|
|
103
|
-
<div class="title-group">
|
|
104
|
-
<el-icon class="collapse-icon"><ArrowDown /></el-icon>
|
|
105
|
-
<span>项次信息</span>
|
|
106
|
-
</div>
|
|
107
|
-
<el-icon
|
|
108
|
-
class="fullscreen-icon"
|
|
109
|
-
title="退出全屏"
|
|
110
|
-
@click="toggleItemTableFullscreen"
|
|
111
|
-
>
|
|
112
|
-
<Close />
|
|
113
|
-
</el-icon>
|
|
114
|
-
</div>
|
|
115
|
-
<BaseTable
|
|
116
|
-
:data="paginatedItemData"
|
|
117
|
-
:columns="itemColumnsConfig"
|
|
118
|
-
border
|
|
119
|
-
class="child-table"
|
|
120
|
-
height="100%"
|
|
121
|
-
/>
|
|
122
|
-
<!-- MARK: 分页（推荐平台统一封装的，保持一致，个性化定制不能满足的时候可以自行拓展 el-pagination） -->
|
|
123
|
-
<div class="items-pagination">
|
|
124
|
-
<jh-pagination
|
|
125
|
-
v-show="itemTotal && itemTotal > 0"
|
|
126
|
-
:total="itemTotal || 0"
|
|
127
|
-
v-model:currentPage="currentPage"
|
|
128
|
-
v-model:pageSize="pageSize"
|
|
129
|
-
@current-change="refreshItemData"
|
|
130
|
-
@size-change="refreshItemData"
|
|
131
|
-
/>
|
|
132
|
-
</div>
|
|
133
|
-
</div>
|
|
134
|
-
</el-card>
|
|
135
|
-
</div>
|
|
136
|
-
</Teleport>
|
|
137
|
-
</div>
|
|
138
|
-
</template>
|
|
139
|
-
|
|
140
|
-
<script setup lang="ts">
|
|
141
|
-
import { onMounted } from "vue";
|
|
142
|
-
import { ArrowDown, Close } from "@element-plus/icons-vue";
|
|
143
|
-
// jh-drag-row 是 @jhlc/jh-ui 全局注册组件，无需 import
|
|
144
|
-
import c_formSections from "@/components/local/c_formSections/index.vue";
|
|
145
|
-
import {
|
|
146
|
-
form,
|
|
147
|
-
activeNames,
|
|
148
|
-
sectionsConfig,
|
|
149
|
-
navTabsConfig,
|
|
150
|
-
headerActions,
|
|
151
|
-
isItemTableFullscreen,
|
|
152
|
-
itemColumnsConfig,
|
|
153
|
-
itemTotal,
|
|
154
|
-
paginatedItemData,
|
|
155
|
-
currentPage,
|
|
156
|
-
pageSize,
|
|
157
|
-
addSpecialRequirement,
|
|
158
|
-
toggleItemTableFullscreen,
|
|
159
|
-
refreshItemData,
|
|
160
|
-
initPage
|
|
161
|
-
} from "./data";
|
|
162
|
-
|
|
163
|
-
// 页面初始化
|
|
164
|
-
onMounted(() => {
|
|
165
|
-
initPage();
|
|
166
|
-
});
|
|
167
|
-
</script>
|
|
168
|
-
|
|
169
|
-
<style scoped lang="scss">
|
|
170
|
-
@import "./index.scss";
|
|
171
|
-
</style>
|
|
1
|
+
<!--
|
|
2
|
+
* @Author: ChenYu ycyplus@gmail.com
|
|
3
|
+
* @Date: 2025-12-29 15:38:58
|
|
4
|
+
* @LastEditors: ChenYu ycyplus@gmail.com
|
|
5
|
+
* @LastEditTime: 2026-01-03 00:46:17
|
|
6
|
+
* @FilePath: \cx-ui-sale\src\views\sale\demo\add-demo\index.vue
|
|
7
|
+
* @Description: 新增编辑页示例 - 视图层（订单新增编辑表单、项次信息管理）
|
|
8
|
+
* Copyright (c) 2025 by CHENY, All Rights Reserved 😎.
|
|
9
|
+
-->
|
|
10
|
+
<template>
|
|
11
|
+
<div class="main-maintenance-container">
|
|
12
|
+
<!-- jh-drag-row 包裹表单区和项次信息（上下拖拽） -->
|
|
13
|
+
<jh-drag-row :topHeight="480" class="main-splitter">
|
|
14
|
+
<template #top>
|
|
15
|
+
<!-- 🆕 使用增强版组件（集成所有功能） -->
|
|
16
|
+
<c_formSections
|
|
17
|
+
:sections="sectionsConfig"
|
|
18
|
+
:form="form"
|
|
19
|
+
v-model:activeNames="activeNames"
|
|
20
|
+
show-header
|
|
21
|
+
header-title="主档维护"
|
|
22
|
+
:header-actions="headerActions"
|
|
23
|
+
show-toolbar
|
|
24
|
+
show-required-filter
|
|
25
|
+
show-layout-switch
|
|
26
|
+
:default-layout="5"
|
|
27
|
+
:layout-options="[2, 3, 4, 5]"
|
|
28
|
+
show-nav-tabs
|
|
29
|
+
nav-tabs-position="left"
|
|
30
|
+
:nav-tabs="navTabsConfig"
|
|
31
|
+
label-width="100px"
|
|
32
|
+
label-position="right"
|
|
33
|
+
:gutter="20"
|
|
34
|
+
class="form-card"
|
|
35
|
+
>
|
|
36
|
+
<!-- 特殊需求区块插槽 -->
|
|
37
|
+
<template #special-3>
|
|
38
|
+
<el-row :gutter="20">
|
|
39
|
+
<el-col :span="24">
|
|
40
|
+
<el-button type="primary" plain @click="addSpecialRequirement">
|
|
41
|
+
+ 添加需求
|
|
42
|
+
</el-button>
|
|
43
|
+
</el-col>
|
|
44
|
+
</el-row>
|
|
45
|
+
</template>
|
|
46
|
+
</c_formSections>
|
|
47
|
+
</template>
|
|
48
|
+
|
|
49
|
+
<template #bottom>
|
|
50
|
+
<el-card
|
|
51
|
+
shadow="never"
|
|
52
|
+
class="items-card"
|
|
53
|
+
:initialSize="220"
|
|
54
|
+
:minSize="150"
|
|
55
|
+
>
|
|
56
|
+
<div class="child-items-section">
|
|
57
|
+
<div class="section-header">
|
|
58
|
+
<div class="title-group">
|
|
59
|
+
<el-icon class="collapse-icon"><ArrowDown /></el-icon>
|
|
60
|
+
<span>项次信息</span>
|
|
61
|
+
</div>
|
|
62
|
+
<el-icon
|
|
63
|
+
class="fullscreen-icon"
|
|
64
|
+
:title="isItemTableFullscreen ? '退出全屏' : '全屏'"
|
|
65
|
+
@click="toggleItemTableFullscreen"
|
|
66
|
+
>
|
|
67
|
+
<component :is="isItemTableFullscreen ? 'Close' : 'FullScreen'" />
|
|
68
|
+
</el-icon>
|
|
69
|
+
</div>
|
|
70
|
+
<BaseTable
|
|
71
|
+
:data="paginatedItemData"
|
|
72
|
+
:columns="itemColumnsConfig"
|
|
73
|
+
border
|
|
74
|
+
class="child-table"
|
|
75
|
+
height="100%"
|
|
76
|
+
/>
|
|
77
|
+
<!-- 分页 -->
|
|
78
|
+
<div class="items-pagination">
|
|
79
|
+
<div class="drag-hint">
|
|
80
|
+
<span class="drag-icon">⇕</span>
|
|
81
|
+
<span class="hint-text">长按拖动，可调整两个区域所占高度</span>
|
|
82
|
+
</div>
|
|
83
|
+
<jh-pagination
|
|
84
|
+
v-show="itemTotal && itemTotal > 0"
|
|
85
|
+
:total="itemTotal || 0"
|
|
86
|
+
v-model:currentPage="currentPage"
|
|
87
|
+
v-model:pageSize="pageSize"
|
|
88
|
+
@current-change="refreshItemData"
|
|
89
|
+
@size-change="refreshItemData"
|
|
90
|
+
/>
|
|
91
|
+
</div>
|
|
92
|
+
</div>
|
|
93
|
+
</el-card>
|
|
94
|
+
</template>
|
|
95
|
+
</jh-drag-row>
|
|
96
|
+
|
|
97
|
+
<!-- 全屏模式 - 使用 Teleport 传送到 body -->
|
|
98
|
+
<Teleport to="body">
|
|
99
|
+
<div v-if="isItemTableFullscreen" class="fullscreen-overlay">
|
|
100
|
+
<el-card shadow="never" class="items-card-fullscreen">
|
|
101
|
+
<div class="child-items-section">
|
|
102
|
+
<div class="section-header">
|
|
103
|
+
<div class="title-group">
|
|
104
|
+
<el-icon class="collapse-icon"><ArrowDown /></el-icon>
|
|
105
|
+
<span>项次信息</span>
|
|
106
|
+
</div>
|
|
107
|
+
<el-icon
|
|
108
|
+
class="fullscreen-icon"
|
|
109
|
+
title="退出全屏"
|
|
110
|
+
@click="toggleItemTableFullscreen"
|
|
111
|
+
>
|
|
112
|
+
<Close />
|
|
113
|
+
</el-icon>
|
|
114
|
+
</div>
|
|
115
|
+
<BaseTable
|
|
116
|
+
:data="paginatedItemData"
|
|
117
|
+
:columns="itemColumnsConfig"
|
|
118
|
+
border
|
|
119
|
+
class="child-table"
|
|
120
|
+
height="100%"
|
|
121
|
+
/>
|
|
122
|
+
<!-- MARK: 分页（推荐平台统一封装的，保持一致，个性化定制不能满足的时候可以自行拓展 el-pagination） -->
|
|
123
|
+
<div class="items-pagination">
|
|
124
|
+
<jh-pagination
|
|
125
|
+
v-show="itemTotal && itemTotal > 0"
|
|
126
|
+
:total="itemTotal || 0"
|
|
127
|
+
v-model:currentPage="currentPage"
|
|
128
|
+
v-model:pageSize="pageSize"
|
|
129
|
+
@current-change="refreshItemData"
|
|
130
|
+
@size-change="refreshItemData"
|
|
131
|
+
/>
|
|
132
|
+
</div>
|
|
133
|
+
</div>
|
|
134
|
+
</el-card>
|
|
135
|
+
</div>
|
|
136
|
+
</Teleport>
|
|
137
|
+
</div>
|
|
138
|
+
</template>
|
|
139
|
+
|
|
140
|
+
<script setup lang="ts">
|
|
141
|
+
import { onMounted } from "vue";
|
|
142
|
+
import { ArrowDown, Close } from "@element-plus/icons-vue";
|
|
143
|
+
// jh-drag-row 是 @jhlc/jh-ui 全局注册组件，无需 import
|
|
144
|
+
import c_formSections from "@/components/local/c_formSections/index.vue";
|
|
145
|
+
import {
|
|
146
|
+
form,
|
|
147
|
+
activeNames,
|
|
148
|
+
sectionsConfig,
|
|
149
|
+
navTabsConfig,
|
|
150
|
+
headerActions,
|
|
151
|
+
isItemTableFullscreen,
|
|
152
|
+
itemColumnsConfig,
|
|
153
|
+
itemTotal,
|
|
154
|
+
paginatedItemData,
|
|
155
|
+
currentPage,
|
|
156
|
+
pageSize,
|
|
157
|
+
addSpecialRequirement,
|
|
158
|
+
toggleItemTableFullscreen,
|
|
159
|
+
refreshItemData,
|
|
160
|
+
initPage
|
|
161
|
+
} from "./data";
|
|
162
|
+
|
|
163
|
+
// 页面初始化
|
|
164
|
+
onMounted(() => {
|
|
165
|
+
initPage();
|
|
166
|
+
});
|
|
167
|
+
</script>
|
|
168
|
+
|
|
169
|
+
<style scoped lang="scss">
|
|
170
|
+
@import "./index.scss";
|
|
171
|
+
</style>
|