JCSS / jcss-miniprogram

Commit 8d0834be1e623a32ba8eaf5f0b22f0a5bf861aef

Authored by 刘淇
1 parent 5822009a

工单管理--新增工单 优化

Inline Side-by-side
Showing 1 changed file with 96 additions and 89 deletions
pages-sub/problem/work-order-manage/add-order.vue
  View file @8d0834b
... ... @@ -31,7 +31,7 @@
31 31 prop="roadName"
32 32 border-bottom
33 33 required
34   - @click="workOrderForm.workLocation ? (showRoadName = true, hideKeyboard()) : uni.showToast({title: '请先选择工单位置', icon: 'none'})"
  34 + @click="handleActionSheetOpen('roadName'); hideKeyboard()"
35 35 >
36 36 <up-input
37 37 v-model="workOrderForm.roadName"
... ... @@ -52,7 +52,7 @@
52 52 prop="orderName"
53 53 border-bottom
54 54 required
55   - @click="showOrderName = true; hideKeyboard()"
  55 + @click="handleActionSheetOpen('orderName'); hideKeyboard()"
56 56 >
57 57 <up-input
58 58 v-model="workOrderForm.orderName"
... ... @@ -72,7 +72,7 @@
72 72 prop="pressingType"
73 73 border-bottom
74 74 required
75   - @click="showPressingType = true; hideKeyboard()"
  75 + @click="handleActionSheetOpen('pressingType'); hideKeyboard()"
76 76 >
77 77 <up-input
78 78 v-model="workOrderForm.pressingTypeName"
... ... @@ -86,7 +86,6 @@
86 86 </template>
87 87 </up-form-item>
88 88  
89   -
90 89 <!-- 4. 情况描述（文本域） -->
91 90 <up-form-item
92 91 label="情况描述"
... ... @@ -115,8 +114,6 @@
115 114 ></up-upload>
116 115 </up-form-item>
117 116  
118   -
119   -
120 117 <!-- 完成时间 -->
121 118 <up-form-item
122 119 label="完成时间"
... ... @@ -128,15 +125,11 @@
128 125 border="none"
129 126 readonly
130 127 placeholder="点击选择时间"
131   - >
132   -
133   - </up-input>
  128 + ></up-input>
134 129 <template #right>
135 130 <up-icon name="arrow-right" size="16"></up-icon>
136 131 </template>
137 132 </up-form-item>
138   -
139   -
140 133 </up-form>
141 134 </view>
142 135  
... ... @@ -149,44 +142,24 @@
149 142 ></up-button>
150 143 </view>
151 144  
152   - <!-- 道路名称下拉弹窗 -->
  145 + <!-- 合并后的通用下拉弹窗 -->
153 146 <up-action-sheet
154   - :show="showRoadName"
155   - :actions="roadNameList"
156   - title="请选择道路名称"
157   - @close="showRoadName = false"
158   - @select="handleRoadNameSelect"
  147 + :show="showActionSheet"
  148 + :actions="currentActionSheetData.list"
  149 + :title="currentActionSheetData.title"
  150 + @close="handleActionSheetClose"
  151 + @select="handleActionSheetSelect"
159 152 ></up-action-sheet>
160 153  
161   - <!-- 工单名称下拉弹窗 -->
162   - <up-action-sheet
163   - :show="showOrderName"
164   - :actions="orderNameList"
165   - title="请选择工单名称"
166   - @close="showOrderName = false"
167   - @select="handleOrderNameSelect"
168   - ></up-action-sheet>
169   -
170   - <!-- 紧急程度下拉弹窗 -->
171   - <up-action-sheet
172   - :show="showPressingType"
173   - :actions="pressingTypeList"
174   - title="请选择紧急程度"
175   - @close="showPressingType = false"
176   - @select="handlePressingTypeSelect"
177   - ></up-action-sheet>
178 154 <!-- 完成时间选择器 -->
179 155 <up-datetime-picker
180 156 :show="show"
181 157 v-model="finishTime"
182 158 mode="datetime"
183 159 :min-date="new Date()"
184   -
185 160 @cancel="show = false"
186 161 @confirm="finishTimeConfirm"
187 162 ></up-datetime-picker>
188   -
189   -
190 163 </view>
191 164 </template>
192 165  
... ... @@ -208,17 +181,21 @@ export default {
208 181 return {
209 182 // 问题照片列表
210 183 problemImgsList: [],
211   - // 弹窗显隐控制
212   - showRoadName: false,
213   - showOrderName: false,
214   - showPressingType: false,
  184 + // 通用弹窗控制
  185 + showActionSheet: false,
  186 + // 当前弹窗配置（类型 + 数据 + 标题）
  187 + currentActionSheetData: {
  188 + type: '', // roadName / orderName / pressingType
  189 + list: [], // 对应类型的选项列表
  190 + title: '' // 弹窗标题
  191 + },
  192 + // 完成时间选择器控制
215 193 show: false,
216   - showBirthday: false, // 生日弹窗控制
  194 + finishTime: Date.now(),
217 195 // 下拉列表数据
218 196 roadNameList: [],
219 197 orderNameList: [],
220 198 pressingTypeList: [],
221   - finishTime:Date.now(),
222 199 // 工单表单数据
223 200 workOrderForm: {
224 201 roadId: 0, // 道路ID
... ... @@ -247,9 +224,6 @@ export default {
247 224 pressingType: [
248 225 {type: 'number', required: true, message: '请选择紧急程度', trigger: ['change']}
249 226 ],
250   - birthday: [ // 新增：生日校验规则
251   - {type: 'string', required: true, message: '请选择生日', trigger: ['change']}
252   - ],
253 227 problemDesc: [
254 228 {type: 'string', required: true, message: '请输入情况描述', trigger: ['change', 'blur']},
255 229 {type: 'string', min: 3, max: 200, message: '情况描述需3-200字', trigger: ['change', 'blur']}
... ... @@ -290,6 +264,77 @@ export default {
290 264  
291 265 methods: {
292 266 /**
  267 + * 打开通用下拉弹窗
  268 + * @param type 弹窗类型：roadName / orderName / pressingType
  269 + */
  270 + handleActionSheetOpen(type) {
  271 + // 道路名称需先校验工单位置是否选择
  272 + if (type === 'roadName' && !this.workOrderForm.workLocation) {
  273 + uni.showToast({title: '请先选择工单位置', icon: 'none'})
  274 + return
  275 + }
  276 +
  277 + // 配置当前弹窗参数
  278 + const configMap = {
  279 + roadName: {
  280 + title: '请选择道路名称',
  281 + list: this.roadNameList
  282 + },
  283 + orderName: {
  284 + title: '请选择工单名称',
  285 + list: this.orderNameList
  286 + },
  287 + pressingType: {
  288 + title: '请选择紧急程度',
  289 + list: this.pressingTypeList
  290 + }
  291 + }
  292 +
  293 + this.currentActionSheetData = {
  294 + type,
  295 + title: configMap[type].title,
  296 + list: configMap[type].list
  297 + }
  298 + this.showActionSheet = true
  299 + },
  300 +
  301 + /**
  302 + * 关闭通用下拉弹窗
  303 + */
  304 + handleActionSheetClose() {
  305 + this.showActionSheet = false
  306 + // 重置当前弹窗配置（可选，防止数据残留）
  307 + this.currentActionSheetData = { type: '', list: [], title: '' }
  308 + },
  309 +
  310 + /**
  311 + * 通用下拉弹窗选择事件
  312 + * @param e 选择的项
  313 + */
  314 + handleActionSheetSelect(e) {
  315 + const { type } = this.currentActionSheetData
  316 + // 根据类型处理不同的选择逻辑
  317 + switch (type) {
  318 + case 'roadName':
  319 + this.workOrderForm.roadName = e.name
  320 + this.workOrderForm.roadId = e.code
  321 + this.$refs.workOrderFormRef.validateField('roadName')
  322 + break
  323 + case 'orderName':
  324 + this.workOrderForm.orderName = e.name
  325 + this.$refs.workOrderFormRef.validateField('orderName')
  326 + break
  327 + case 'pressingType':
  328 + this.workOrderForm.pressingType = Number(e.value)
  329 + this.workOrderForm.pressingTypeName = e.name
  330 + this.$refs.workOrderFormRef.validateField('pressingType')
  331 + break
  332 + }
  333 + // 关闭弹窗
  334 + this.showActionSheet = false
  335 + },
  336 +
  337 + /**
293 338 * 返回上一页
294 339 */
295 340 navigateBack() {
... ... @@ -430,47 +475,14 @@ export default {
430 475 },
431 476  
432 477 /**
433   - * 选择道路名称
434   - */
435   - handleRoadNameSelect(e) {
436   - console.log('选择道路名称：', e)
437   - this.workOrderForm.roadName = e.name
438   - this.workOrderForm.roadId = e.code
439   - this.showRoadName = false
440   - this.$refs.workOrderFormRef.validateField('roadName')
441   - },
442   -
443   - /**
444   - * 选择工单名称
445   - */
446   - handleOrderNameSelect(e) {
447   - console.log('选择工单名称：', e)
448   - this.workOrderForm.orderName = e.name
449   - this.showOrderName = false
450   - this.$refs.workOrderFormRef.validateField('orderName')
451   - },
452   -
453   - /**
454   - * 选择紧急程度
455   - */
456   - handlePressingTypeSelect(e) {
457   - console.log('选择紧急程度：', e)
458   - this.workOrderForm.pressingType = Number(e.value)
459   - this.workOrderForm.pressingTypeName = e.name
460   - this.showPressingType = false
461   - this.$refs.workOrderFormRef.validateField('pressingType')
462   - },
463   -
464   - /**
465 478 * 完成时间确认
466 479 */
467 480 finishTimeConfirm(e) {
468 481 console.log('选择的完成时间：', e)
469   - this.workOrderForm.finishTime = timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
470   - this.show = false;
  482 + this.workOrderForm.finishTime = timeFormat(e.value, 'yyyy-mm-dd hh:MM:ss')
  483 + this.show = false
471 484 },
472 485  
473   -
474 486 /**
475 487 * 隐藏键盘
476 488 */
... ... @@ -504,12 +516,11 @@ export default {
504 516 lonLatAddress: this.workOrderForm.workLocation,
505 517 pressingType: this.workOrderForm.pressingType,
506 518 orderName: this.workOrderForm.orderName,
507   - birthday: this.workOrderForm.birthday, // 新增：生日字段提交
508   - finishTime: this.workOrderForm.finishTime, // 新增：完成时间提交
  519 + finishTime: this.workOrderForm.finishTime,
509 520 sourceId: 1,
510 521 sourceName: '园林',
511 522 thirdWorkNo: '',
512   - busiLine:'yl'
  523 + busiLine: 'yl'
513 524 }
514 525  
515 526 // 显示加载中
... ... @@ -564,9 +575,5 @@ export default {
564 575 background: #fff;
565 576 }
566 577  
567   -// 底部按钮样式
568   -.fixed-bottom-btn-wrap {
569   - padding: 20rpx;
570   - background: #fff;
571   -}
  578 +
572 579 </style>
573 580 \ No newline at end of file
... ...