jobsys-explore 4.6.0 → 4.6.1

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 (187) hide show
  1. package/.changeset/{dry-feet-float.md → hip-hounds-drop.md} +1 -1
  2. package/.changeset/{blue-spiders-roll.md → hip-spoons-smell.md} +1 -1
  3. package/.changeset/{cyan-monkeys-draw.md → orange-trees-film.md} +1 -1
  4. package/.changeset/tall-trainers-sin.md +5 -0
  5. package/.eslintignore +3 -3
  6. package/CHANGELOG.md +12 -33
  7. package/README.md +41 -41
  8. package/TODOs.md +8 -8
  9. package/business-components/survey/ExSurvey.jsx +193 -193
  10. package/business-components/survey/index.js +5 -5
  11. package/business-components/survey/index.less +36 -36
  12. package/components/button/ExButton.jsx +120 -120
  13. package/components/button/index.js +4 -4
  14. package/components/button/index.less +7 -7
  15. package/components/decorator/ExDecorator.jsx +31 -31
  16. package/components/decorator/index.js +5 -5
  17. package/components/decorator/index.less +76 -76
  18. package/components/form/ExAddress.jsx +195 -195
  19. package/components/form/ExCascader.jsx +166 -166
  20. package/components/form/ExCheckbox.jsx +59 -59
  21. package/components/form/ExDate.jsx +143 -143
  22. package/components/form/ExDatetime.jsx +166 -166
  23. package/components/form/ExField.jsx +138 -138
  24. package/components/form/ExFieldUploader.jsx +50 -50
  25. package/components/form/ExForm.jsx +506 -506
  26. package/components/form/ExMatrixCheckbox.jsx +99 -99
  27. package/components/form/ExMatrixRadio.jsx +86 -86
  28. package/components/form/ExMatrixScale.jsx +97 -97
  29. package/components/form/ExNumber.jsx +51 -51
  30. package/components/form/ExRadio.jsx +58 -58
  31. package/components/form/ExRate.jsx +51 -51
  32. package/components/form/ExSelect.jsx +248 -248
  33. package/components/form/ExSlider.jsx +55 -55
  34. package/components/form/ExSwitch.jsx +51 -51
  35. package/components/form/ExTime.jsx +99 -99
  36. package/components/form/FormItem.jsx +307 -307
  37. package/components/form/PickerWrapper.jsx +120 -120
  38. package/components/form/index.js +46 -46
  39. package/components/form/index.less +178 -178
  40. package/components/form/utils.js +62 -62
  41. package/components/grid/ExGrid.jsx +53 -53
  42. package/components/grid/index.js +4 -4
  43. package/components/grid/index.less +2 -2
  44. package/components/index.js +12 -12
  45. package/components/pagination/ExPagination.jsx +300 -375
  46. package/components/pagination/index.js +5 -5
  47. package/components/pagination/index.less +3 -3
  48. package/components/provider/ExProvider.jsx +173 -173
  49. package/components/qrcode/ExQrcode.jsx +86 -86
  50. package/components/qrcode/index.js +5 -5
  51. package/components/qrcode/index.less +8 -8
  52. package/components/result/ExResult.jsx +122 -122
  53. package/components/result/index.js +5 -5
  54. package/components/result/index.less +59 -59
  55. package/components/search/ExSearch.jsx +290 -290
  56. package/components/search/components/Expand.jsx +77 -77
  57. package/components/search/components/Field.jsx +27 -27
  58. package/components/search/components/Quick.jsx +53 -53
  59. package/components/search/components/index.js +5 -5
  60. package/components/search/index.js +5 -5
  61. package/components/search/index.less +118 -118
  62. package/components/search/utils.js +30 -30
  63. package/components/sector/ExSector.jsx +52 -52
  64. package/components/sector/README.md +26 -26
  65. package/components/sector/index.js +5 -5
  66. package/components/sector/index.less +122 -122
  67. package/components/theme/ExTheme.jsx +10 -10
  68. package/components/theme/index.js +4 -4
  69. package/components/theme/index.less +98 -98
  70. package/components/uploader/ExUploader.jsx +269 -276
  71. package/components/uploader/index.js +5 -5
  72. package/components/utils.js +187 -187
  73. package/directives/auth.js +113 -113
  74. package/directives/index.js +4 -4
  75. package/dist/directives.cjs.map +1 -1
  76. package/dist/directives.js.map +1 -1
  77. package/dist/hooks.cjs +1 -1
  78. package/dist/hooks.cjs.map +1 -1
  79. package/dist/hooks.js +49 -36
  80. package/dist/hooks.js.map +1 -1
  81. package/dist/{cipher-df48bf6e.js → index-6bb3abf2.js} +274 -293
  82. package/dist/index-6bb3abf2.js.map +1 -0
  83. package/dist/index-ca50c51f.cjs +2 -0
  84. package/dist/index-ca50c51f.cjs.map +1 -0
  85. package/dist/jobsys-explore.cjs +6 -6
  86. package/dist/jobsys-explore.cjs.map +1 -1
  87. package/dist/jobsys-explore.js +1464 -1502
  88. package/dist/jobsys-explore.js.map +1 -1
  89. package/docgen.config.js +15 -15
  90. package/docs/.vuepress/.cache/deps/_metadata.json +52 -52
  91. package/docs/.vuepress/.cache/deps/lodash-es.js +8442 -8442
  92. package/docs/.vuepress/.cache/deps/lodash-es.js.map +7 -7
  93. package/docs/.vuepress/.temp/internal/clientConfigs.js +17 -17
  94. package/docs/.vuepress/.temp/internal/pagesComponents.js +24 -24
  95. package/docs/.vuepress/.temp/internal/pagesData.js +22 -22
  96. package/docs/.vuepress/.temp/internal/pagesRoutes.js +12 -12
  97. package/docs/.vuepress/.temp/internal/themeData.js +1 -1
  98. package/docs/.vuepress/.temp/pages/components/decorator/ExDecorator.html.js +1 -1
  99. package/docs/.vuepress/.temp/pages/components/decorator/ExDecorator.html.vue +37 -37
  100. package/docs/.vuepress/.temp/pages/components/sector/ExSector.html.js +1 -1
  101. package/docs/.vuepress/.temp/pages/components/sector/ExSector.html.vue +71 -71
  102. package/docs/.vuepress/.temp/styles/index.scss +1 -1
  103. package/docs/.vuepress/config.js +61 -61
  104. package/docs/.vuepress/dist/404.html +33 -33
  105. package/docs/.vuepress/dist/assets/404.html-a0ce2184.js +1 -1
  106. package/docs/.vuepress/dist/assets/ExButton.html-ad283101.js +1 -1
  107. package/docs/.vuepress/dist/assets/ExDecorator.html-42d09114.js +1 -1
  108. package/docs/.vuepress/dist/assets/ExDecorator.html-c82c5fe8.js +1 -1
  109. package/docs/.vuepress/dist/assets/ExForm.html-9e3f8000.js +1 -1
  110. package/docs/.vuepress/dist/assets/ExProvider.html-78fdc6cd.js +1 -1
  111. package/docs/.vuepress/dist/assets/ExSearch.html-103f6f34.js +1 -1
  112. package/docs/.vuepress/dist/assets/ExSector.html-a1e24c3a.js +7 -7
  113. package/docs/.vuepress/dist/assets/ExSector.html-cff3fefd.js +1 -1
  114. package/docs/.vuepress/dist/assets/ExUploader.html-8310e424.js +1 -1
  115. package/docs/.vuepress/dist/assets/app-29fe8d1e.js +10 -10
  116. package/docs/.vuepress/dist/assets/hooks.html-90ccbc1a.js +1 -1
  117. package/docs/.vuepress/dist/assets/index.html-85b79c97.js +43 -43
  118. package/docs/.vuepress/dist/assets/style-46d7e227.css +1 -1
  119. package/docs/.vuepress/dist/components/button/ExButton.html +33 -33
  120. package/docs/.vuepress/dist/components/decorator/ExDecorator.html +33 -33
  121. package/docs/.vuepress/dist/components/form/ExForm.html +33 -33
  122. package/docs/.vuepress/dist/components/provider/ExProvider.html +33 -33
  123. package/docs/.vuepress/dist/components/search/ExSearch.html +33 -33
  124. package/docs/.vuepress/dist/components/sector/ExSector.html +39 -39
  125. package/docs/.vuepress/dist/components/uploader/ExUploader.html +33 -33
  126. package/docs/.vuepress/dist/hooks.html +33 -33
  127. package/docs/.vuepress/dist/index.html +75 -75
  128. package/docs/.vuepress/styles/index.scss +7 -7
  129. package/docs/components/decorator/ExDecorator.md +14 -14
  130. package/docs/components/sector/ExSector.md +43 -43
  131. package/docs/index.md +82 -82
  132. package/hooks/cipher.js +44 -44
  133. package/hooks/datetime.js +69 -69
  134. package/hooks/form.js +188 -188
  135. package/hooks/utils.js +268 -274
  136. package/index.html +17 -17
  137. package/package.json +2 -2
  138. package/playground/App.vue +190 -190
  139. package/playground/TestButton.vue +61 -61
  140. package/playground/TestCascader.vue +2441 -2441
  141. package/playground/TestDecorator.vue +14 -14
  142. package/playground/TestForm.vue +401 -401
  143. package/playground/TestFormItem.vue +110 -110
  144. package/playground/TestGrid.vue +22 -22
  145. package/playground/TestPagination.vue +1240 -1243
  146. package/playground/TestQrcode.vue +7 -7
  147. package/playground/TestResult.vue +12 -12
  148. package/playground/TestSearch.vue +115 -115
  149. package/playground/TestSector.vue +15 -15
  150. package/playground/TestSurvey.vue +27 -27
  151. package/playground/TestUploader.vue +20 -14
  152. package/playground/main.js +22 -22
  153. package/utils/style.js +13 -13
  154. package/vite.config.js +54 -54
  155. package/.changeset/empty-mice-share.md +0 -5
  156. package/.changeset/famous-yaks-doubt.md +0 -5
  157. package/.changeset/five-fans-type.md +0 -5
  158. package/.changeset/funny-hats-drop.md +0 -5
  159. package/.changeset/khaki-cobras-bathe.md +0 -5
  160. package/.changeset/khaki-forks-shave.md +0 -5
  161. package/.changeset/lazy-yaks-crash.md +0 -5
  162. package/.changeset/light-cycles-flow.md +0 -5
  163. package/.changeset/loud-mirrors-explain.md +0 -5
  164. package/.changeset/lovely-balloons-protect.md +0 -5
  165. package/.changeset/mean-pens-travel.md +0 -5
  166. package/.changeset/moody-doors-grow.md +0 -5
  167. package/.changeset/moody-laws-change.md +0 -5
  168. package/.changeset/nasty-goats-joke.md +0 -5
  169. package/.changeset/odd-forks-drop.md +0 -5
  170. package/.changeset/olive-windows-suffer.md +0 -5
  171. package/.changeset/popular-carpets-jog.md +0 -5
  172. package/.changeset/popular-planets-play.md +0 -5
  173. package/.changeset/rare-gorillas-boil.md +0 -5
  174. package/.changeset/rare-moose-teach.md +0 -5
  175. package/.changeset/sharp-tools-hope.md +0 -5
  176. package/.changeset/slimy-sloths-refuse.md +0 -5
  177. package/.changeset/slow-boats-search.md +0 -5
  178. package/.changeset/smooth-horses-tie.md +0 -5
  179. package/.changeset/tame-feet-reply.md +0 -5
  180. package/.changeset/tidy-items-reflect.md +0 -5
  181. package/.changeset/weak-chicken-admire.md +0 -5
  182. package/.changeset/weak-rockets-compare.md +0 -5
  183. package/.changeset/wild-glasses-bathe.md +0 -5
  184. package/.changeset/wise-ears-turn.md +0 -5
  185. package/dist/cipher-1066b9c6.cjs +0 -2
  186. package/dist/cipher-1066b9c6.cjs.map +0 -1
  187. package/dist/cipher-df48bf6e.js.map +0 -1
@@ -2,4 +2,4 @@
2
2
  "jobsys-explore": patch
3
3
  ---
4
4
 
5
- Drop the unused property
5
+ Add useFindOptionByValue
@@ -2,4 +2,4 @@
2
2
  "jobsys-explore": patch
3
3
  ---
4
4
 
5
- Fix
5
+ Upgrade
@@ -2,4 +2,4 @@
2
2
  "jobsys-explore": patch
3
3
  ---
4
4
 
5
- Build
5
+ Downgrade vue
@@ -0,0 +1,5 @@
1
+ ---
2
+ "jobsys-explore": patch
3
+ ---
4
+
5
+ Add fieldNames support for options
package/.eslintignore CHANGED
@@ -1,4 +1,4 @@
1
- dist
2
- node_modules
3
- .prettierrc.cjs
1
+ dist
2
+ node_modules
3
+ .prettierrc.cjs
4
4
  vite.config.js
package/CHANGELOG.md CHANGED
@@ -1,43 +1,22 @@
1
1
  # jobsys-explore
2
2
 
3
- ## 4.6.0
3
+ ## 4.5.5
4
4
 
5
- ### Minor Changes
5
+ ### Patch Changes
6
6
 
7
- - Add survey component
7
+ - Add useFindOptionByValue
8
+ - Upgrade
9
+ - Downgrade vue
10
+ - Add fieldNames support for options
11
+
12
+ ## 4.5.4
8
13
 
9
14
  ### Patch Changes
10
15
 
11
- - Fix
12
- - Build
13
- - Drop the unused property
14
- - Add matrix component and closable option
15
- - Fix clear error in ExSearch
16
- - Rewrite ExPagiantion
17
- - Add init and beforeSubmit
18
- - Fix
19
- - Add disabled and readonly for ex form
20
- - hide upload when readonly or disabled
21
- - Add form item pattern support
22
- - Add cascader search and filter search issue
23
- - Fix sector style
24
- - Fix exupload
25
- - Add ex-decorator
26
- - clone the options before traverse
27
- - Upgrade useFormFormat
28
- - Add \_type for uploader
29
- - upgrade
30
- - Fix
31
- - Add useFindParentValues
32
- - Fix form submit await
33
- - Add status adapter and useFetch loading
34
- - Adjust form item render order
35
- - Add pagination expose
36
- - Add pagination persistence
37
- - Fix upload file
38
- - Add useFindPropertyRecursive
39
- - upgrade
40
- - Fix beforeSubmit
16
+ - Add useFindOptionByValue
17
+ - Upgrade
18
+ - Downgrade vue
19
+ - Add fieldNames support for options
41
20
 
42
21
  ## 4.6.0
43
22
 
package/README.md CHANGED
@@ -1,41 +1,41 @@
1
- # TODOs
2
-
3
- ---
4
-
5
- ## 增强
6
-
7
- - [ ] ExploreForm
8
-
9
- - [x] Address
10
- - [x] Cascader
11
- - [x] Checkbox
12
- - [x] Date
13
- - [ ] Group
14
- - [ ] Html
15
- - [x] Input
16
- - [x] Number
17
- - [x] Radio
18
- - [ ] Remote
19
- - [x] Select
20
- - [x] Switch
21
- - [] Tag
22
- - [x] Text
23
- - [x] Time
24
- - [ ] TreeSelect
25
- - [x] Uploader
26
-
27
- - [x] ExploreSearch
28
-
29
- - [x] 同上
30
-
31
- - [x] Field
32
- - [x] Disabled
33
- - [x] Help
34
-
35
- ## 新增
36
-
37
- - [ ] 样式定制
38
- - [ ] 浮动按钮
39
- - [ ] 列表组件
40
- - [ ] 背景生成
41
- - [ ] 简易图表
1
+ # TODOs
2
+
3
+ ---
4
+
5
+ ## 增强
6
+
7
+ - [ ] ExploreForm
8
+
9
+ - [x] Address
10
+ - [x] Cascader
11
+ - [x] Checkbox
12
+ - [x] Date
13
+ - [ ] Group
14
+ - [ ] Html
15
+ - [x] Input
16
+ - [x] Number
17
+ - [x] Radio
18
+ - [ ] Remote
19
+ - [x] Select
20
+ - [x] Switch
21
+ - [] Tag
22
+ - [x] Text
23
+ - [x] Time
24
+ - [ ] TreeSelect
25
+ - [x] Uploader
26
+
27
+ - [x] ExploreSearch
28
+
29
+ - [x] 同上
30
+
31
+ - [x] Field
32
+ - [x] Disabled
33
+ - [x] Help
34
+
35
+ ## 新增
36
+
37
+ - [ ] 样式定制
38
+ - [ ] 浮动按钮
39
+ - [ ] 列表组件
40
+ - [ ] 背景生成
41
+ - [ ] 简易图表
package/TODOs.md CHANGED
@@ -1,8 +1,8 @@
1
- # Bugs
2
-
3
- - [ ] ExPagination 无限加载数据问题
4
-
5
- # Improvements
6
-
7
- # Features
8
-
1
+ # Bugs
2
+
3
+ - [ ] ExPagination 无限加载数据问题
4
+
5
+ # Improvements
6
+
7
+ # Features
8
+
@@ -1,193 +1,193 @@
1
- import { computed, defineComponent, nextTick, reactive, watch } from "vue"
2
- import { Progress } from "vant"
3
- import "./index.less"
4
- import { ExButton, ExForm } from "../../components"
5
- import { cloneDeep } from "lodash-es"
6
- import { useProcessStatusSuccess } from "../../hooks"
7
-
8
- /**
9
- * 调查问卷
10
- * @version 4.4.0
11
- */
12
- export default defineComponent({
13
- name: "ExSurvey",
14
- props: {
15
- /**
16
- * 标题
17
- */
18
- title: { type: String, default: "" },
19
-
20
- /**
21
- * 问卷 slug
22
- */
23
- slug: { type: [Number, String], default: "", required: true },
24
- /**
25
- * 开场语
26
- */
27
- intro: { type: String, default: "" },
28
-
29
- /**
30
- * 结束语
31
- */
32
- outro: { type: String, default: "" },
33
-
34
- /**
35
- * 从哪个章节开始做
36
- */
37
- startChapter: { type: Number, default: 0 },
38
-
39
- /**
40
- * 表单项
41
- */
42
- formItems: { type: Array, default: () => [], required: true },
43
-
44
- /**
45
- * 提交地址
46
- */
47
- submitUrl: { type: String, default: "" },
48
-
49
- /**
50
- *
51
- * @typedef {Object} ExposedFormData
52
- * @property {Object} formatForm Format后的表单数据
53
- *
54
- *
55
- * 提交数据处理函数
56
- * @param {ExposedFormData} data
57
- * @return {Boolean|Object} return false会阻止提交操作,return Object会替换提交的数据
58
- *
59
- */
60
- beforeSubmit: { type: Function, default: null },
61
- },
62
- emits: [
63
- /**
64
- * @event click
65
- * @param {Event} event 完结事件
66
- */
67
- "finish",
68
- ],
69
-
70
- setup(props, { emit }) {
71
- const state = reactive({
72
- currentStep: "intro",
73
- formChapters: [], //二维数组,按章节存储
74
- currentChapter: 0, //当前章节
75
- })
76
-
77
- const isLastChapter = computed(() => state.currentChapter === state.formChapters.length)
78
- const progress = computed(() => (!state.formChapters.length ? 0 : (state.currentChapter / state.formChapters.length) * 100))
79
-
80
- // 将 props.formItems 按 break 划分成章节
81
- const prepareFormItems = () => {
82
- let chapter = [] //存储章节的数组
83
- const formItems = cloneDeep(props.formItems)
84
- for (let i = 0; i < formItems.length; i += 1) {
85
- const item = formItems[i] // 这个是用于渲染的配置
86
- item.defaultSlots = {
87
- label: () => (
88
- <span style={{ marginBottom: "10px" }}>
89
- {i + 1}.{item.title}
90
- </span>
91
- ),
92
- }
93
- if (item.break) {
94
- if (chapter.length) {
95
- state.formChapters.push(chapter)
96
- }
97
- delete item.break
98
- chapter = [item]
99
- } else {
100
- chapter.push(item)
101
- }
102
-
103
- if (i === formItems.length - 1) {
104
- state.formChapters.push(chapter)
105
- }
106
- }
107
- }
108
-
109
- watch(
110
- () => props.formItems,
111
- () => {
112
- prepareFormItems()
113
- nextTick(() => {
114
- if (props.startChapter) {
115
- state.currentChapter = Math.min(props.startChapter - 1, state.formChapters.length - 1)
116
- }
117
- })
118
- },
119
- { immediate: true },
120
- )
121
-
122
- const onBeforeSubmit = ({ formatForm }) => {
123
- let data = { slug: props.slug, answers: formatForm }
124
- if (props.beforeSubmit) {
125
- return props.beforeSubmit(data)
126
- }
127
- return data
128
- }
129
-
130
- const onAfterSubmit = (res) => {
131
- useProcessStatusSuccess(res, () => {
132
- state.currentChapter += 1
133
- if (state.currentChapter === state.formChapters.length) {
134
- state.currentStep = "outro"
135
- }
136
- })
137
- }
138
-
139
- const onFinish = () => {
140
- emit("finish")
141
- }
142
-
143
- const progressElem = () => {
144
- return state.formChapters.length <= 1 || state.currentStep !== "form" ? null : (
145
- <div class={`ex-survey__progress`}>
146
- <Progress showPivot={false} percentage={progress.value}></Progress>
147
- </div>
148
- )
149
- }
150
-
151
- const introElem = () =>
152
- (props.title || props.intro) && state.currentStep === "intro" ? (
153
- <div class={`ex-survey__intro`}>
154
- {props.title ? <div class={`ex-survey__title`}>{props.title}</div> : null}
155
- {props.intro || null}
156
- <ExButton type={"primary"} class={"ex-survey__start-btn"} onClick={() => (state.currentStep = "form")}>
157
- {() => "开始"}
158
- </ExButton>
159
- </div>
160
- ) : null
161
-
162
- const outroElem = () =>
163
- props.intro && state.currentStep === "outro" ? (
164
- <div class={`ex-survey__outro`}>
165
- {props.outro || "谢谢您的参与,祝您有美好的一天!"}
166
- <ExButton type={"primary"} class={"ex-survey__finish-btn"} onClick={onFinish}>
167
- {() => "完成"}
168
- </ExButton>
169
- </div>
170
- ) : null
171
-
172
- const formElem = () => {
173
- return state.currentStep === "form" ? (
174
- <div class={`ex-survey__form`}>
175
- <ExForm
176
- form={state.formChapters[state.currentChapter]}
177
- labelWidth={"100%"}
178
- fixed={true}
179
- submitUrl={props.submitUrl}
180
- closable={!isLastChapter.value && state.currentChapter !== 0}
181
- close={() => (state.currentChapter -= 1)}
182
- cancelButtonText={"上一步"}
183
- submitButtonText={"确定"}
184
- beforeSubmit={onBeforeSubmit}
185
- afterSubmit={onAfterSubmit}
186
- ></ExForm>
187
- </div>
188
- ) : null
189
- }
190
-
191
- return () => <div class={`ex-survey`}>{[introElem(), progressElem(), formElem(), outroElem()]}</div>
192
- },
193
- })
1
+ import { computed, defineComponent, nextTick, reactive, watch } from "vue"
2
+ import { Progress } from "vant"
3
+ import "./index.less"
4
+ import { ExButton, ExForm } from "../../components"
5
+ import { cloneDeep } from "lodash-es"
6
+ import { useProcessStatusSuccess } from "../../hooks"
7
+
8
+ /**
9
+ * 调查问卷
10
+ * @version 4.4.0
11
+ */
12
+ export default defineComponent({
13
+ name: "ExSurvey",
14
+ props: {
15
+ /**
16
+ * 标题
17
+ */
18
+ title: { type: String, default: "" },
19
+
20
+ /**
21
+ * 问卷 slug
22
+ */
23
+ slug: { type: [Number, String], default: "", required: true },
24
+ /**
25
+ * 开场语
26
+ */
27
+ intro: { type: String, default: "" },
28
+
29
+ /**
30
+ * 结束语
31
+ */
32
+ outro: { type: String, default: "" },
33
+
34
+ /**
35
+ * 从哪个章节开始做
36
+ */
37
+ startChapter: { type: Number, default: 0 },
38
+
39
+ /**
40
+ * 表单项
41
+ */
42
+ formItems: { type: Array, default: () => [], required: true },
43
+
44
+ /**
45
+ * 提交地址
46
+ */
47
+ submitUrl: { type: String, default: "" },
48
+
49
+ /**
50
+ *
51
+ * @typedef {Object} ExposedFormData
52
+ * @property {Object} formatForm Format后的表单数据
53
+ *
54
+ *
55
+ * 提交数据处理函数
56
+ * @param {ExposedFormData} data
57
+ * @return {Boolean|Object} return false会阻止提交操作,return Object会替换提交的数据
58
+ *
59
+ */
60
+ beforeSubmit: { type: Function, default: null },
61
+ },
62
+ emits: [
63
+ /**
64
+ * @event click
65
+ * @param {Event} event 完结事件
66
+ */
67
+ "finish",
68
+ ],
69
+
70
+ setup(props, { emit }) {
71
+ const state = reactive({
72
+ currentStep: "intro",
73
+ formChapters: [], //二维数组,按章节存储
74
+ currentChapter: 0, //当前章节
75
+ })
76
+
77
+ const isLastChapter = computed(() => state.currentChapter === state.formChapters.length)
78
+ const progress = computed(() => (!state.formChapters.length ? 0 : (state.currentChapter / state.formChapters.length) * 100))
79
+
80
+ // 将 props.formItems 按 break 划分成章节
81
+ const prepareFormItems = () => {
82
+ let chapter = [] //存储章节的数组
83
+ const formItems = cloneDeep(props.formItems)
84
+ for (let i = 0; i < formItems.length; i += 1) {
85
+ const item = formItems[i] // 这个是用于渲染的配置
86
+ item.defaultSlots = {
87
+ label: () => (
88
+ <span style={{ marginBottom: "10px" }}>
89
+ {i + 1}.{item.title}
90
+ </span>
91
+ ),
92
+ }
93
+ if (item.break) {
94
+ if (chapter.length) {
95
+ state.formChapters.push(chapter)
96
+ }
97
+ delete item.break
98
+ chapter = [item]
99
+ } else {
100
+ chapter.push(item)
101
+ }
102
+
103
+ if (i === formItems.length - 1) {
104
+ state.formChapters.push(chapter)
105
+ }
106
+ }
107
+ }
108
+
109
+ watch(
110
+ () => props.formItems,
111
+ () => {
112
+ prepareFormItems()
113
+ nextTick(() => {
114
+ if (props.startChapter) {
115
+ state.currentChapter = Math.min(props.startChapter - 1, state.formChapters.length - 1)
116
+ }
117
+ })
118
+ },
119
+ { immediate: true },
120
+ )
121
+
122
+ const onBeforeSubmit = ({ formatForm }) => {
123
+ let data = { slug: props.slug, answers: formatForm }
124
+ if (props.beforeSubmit) {
125
+ return props.beforeSubmit(data)
126
+ }
127
+ return data
128
+ }
129
+
130
+ const onAfterSubmit = (res) => {
131
+ useProcessStatusSuccess(res, () => {
132
+ state.currentChapter += 1
133
+ if (state.currentChapter === state.formChapters.length) {
134
+ state.currentStep = "outro"
135
+ }
136
+ })
137
+ }
138
+
139
+ const onFinish = () => {
140
+ emit("finish")
141
+ }
142
+
143
+ const progressElem = () => {
144
+ return state.formChapters.length <= 1 || state.currentStep !== "form" ? null : (
145
+ <div class={`ex-survey__progress`}>
146
+ <Progress showPivot={false} percentage={progress.value}></Progress>
147
+ </div>
148
+ )
149
+ }
150
+
151
+ const introElem = () =>
152
+ (props.title || props.intro) && state.currentStep === "intro" ? (
153
+ <div class={`ex-survey__intro`}>
154
+ {props.title ? <div class={`ex-survey__title`}>{props.title}</div> : null}
155
+ {props.intro || null}
156
+ <ExButton type={"primary"} class={"ex-survey__start-btn"} onClick={() => (state.currentStep = "form")}>
157
+ {() => "开始"}
158
+ </ExButton>
159
+ </div>
160
+ ) : null
161
+
162
+ const outroElem = () =>
163
+ props.intro && state.currentStep === "outro" ? (
164
+ <div class={`ex-survey__outro`}>
165
+ {props.outro || "谢谢您的参与,祝您有美好的一天!"}
166
+ <ExButton type={"primary"} class={"ex-survey__finish-btn"} onClick={onFinish}>
167
+ {() => "完成"}
168
+ </ExButton>
169
+ </div>
170
+ ) : null
171
+
172
+ const formElem = () => {
173
+ return state.currentStep === "form" ? (
174
+ <div class={`ex-survey__form`}>
175
+ <ExForm
176
+ form={state.formChapters[state.currentChapter]}
177
+ labelWidth={"100%"}
178
+ fixed={true}
179
+ submitUrl={props.submitUrl}
180
+ closable={!isLastChapter.value && state.currentChapter !== 0}
181
+ close={() => (state.currentChapter -= 1)}
182
+ cancelButtonText={"上一步"}
183
+ submitButtonText={"确定"}
184
+ beforeSubmit={onBeforeSubmit}
185
+ afterSubmit={onAfterSubmit}
186
+ ></ExForm>
187
+ </div>
188
+ ) : null
189
+ }
190
+
191
+ return () => <div class={`ex-survey`}>{[introElem(), progressElem(), formElem(), outroElem()]}</div>
192
+ },
193
+ })
@@ -1,5 +1,5 @@
1
- import _ExSurvey from "./ExSurvey.jsx"
2
- import withInstall from "../../utils/withInstall"
3
-
4
- export const ExSurvey = withInstall(_ExSurvey)
5
- export default ExSurvey
1
+ import _ExSurvey from "./ExSurvey.jsx"
2
+ import withInstall from "../../utils/withInstall"
3
+
4
+ export const ExSurvey = withInstall(_ExSurvey)
5
+ export default ExSurvey
@@ -1,37 +1,37 @@
1
- .ex-survey {
2
- .ex-survey__progress {
3
- position: fixed;
4
- top: 0;
5
- left: 0;
6
- right: 0;
7
- }
8
-
9
- .ex-survey__order {
10
- font-weight: bold;
11
- }
12
-
13
-
14
- .ex-survey__intro, .ex-survey__outro {
15
- background: #FFF;
16
- font-size: var(--van-font-size-md);
17
- margin: var(--van-padding-md);
18
- padding: 48px var(--van-padding-md);
19
- border-radius: var(--van-radius-lg, 8px);
20
-
21
- .ex-survey__title {
22
- text-align: center;
23
- font-size: var(--van-font-size-lg);
24
- font-weight: bold;
25
- margin-bottom: 48px;
26
- }
27
-
28
- .ex-survey__start-btn, .ex-survey__finish-btn {
29
- margin-top: var(--van-padding-xl);
30
- }
31
- }
32
-
33
- .ex-survey__form {
34
- margin-top: 5px;
35
- margin-bottom: 100px;
36
- }
1
+ .ex-survey {
2
+ .ex-survey__progress {
3
+ position: fixed;
4
+ top: 0;
5
+ left: 0;
6
+ right: 0;
7
+ }
8
+
9
+ .ex-survey__order {
10
+ font-weight: bold;
11
+ }
12
+
13
+
14
+ .ex-survey__intro, .ex-survey__outro {
15
+ background: #FFF;
16
+ font-size: var(--van-font-size-md);
17
+ margin: var(--van-padding-md);
18
+ padding: 48px var(--van-padding-md);
19
+ border-radius: var(--van-radius-lg, 8px);
20
+
21
+ .ex-survey__title {
22
+ text-align: center;
23
+ font-size: var(--van-font-size-lg);
24
+ font-weight: bold;
25
+ margin-bottom: 48px;
26
+ }
27
+
28
+ .ex-survey__start-btn, .ex-survey__finish-btn {
29
+ margin-top: var(--van-padding-xl);
30
+ }
31
+ }
32
+
33
+ .ex-survey__form {
34
+ margin-top: 5px;
35
+ margin-bottom: 100px;
36
+ }
37
37
  }