Jelajahi Sumber

fix: 添加按钮加载状态并修复表单提交逻辑

liujt 5 bulan lalu
induk
melakukan
9939bba01b
3 mengubah file dengan 31 tambahan dan 6 penghapusan
  1. 24 4
      hybrid/html/a.html
  2. 6 2
      hybrid/html/c.html
  3. 1 0
      pages/internalManagement/apply/index.vue

+ 24 - 4
hybrid/html/a.html

@@ -80,9 +80,9 @@
 
 				<div v-if='isEdit'
 					style="display: flex;justify-content: space-between; padding: 30px 30px; position: fixed; bottom: 0; width: 100%; height: 80px;">
-					<van-button style="width:48%" type="primary" @click="handleAudit(1)">提交
+					<van-button style="width:48%" type="primary" :loading="loading" @click="handleAudit(1)">提交
 					</van-button>
-					<van-button style="width:48%" type="danger" @click="onClickLeft">取消
+					<van-button style="width:48%" type="danger" :loading="loading" @click="onClickLeft">取消
 					</van-button>
 				</div>
 
@@ -104,6 +104,7 @@
 			Vue.createApp({
 				data() {
 					return {
+						loading: false,
 						isFlag: false,
 						isEdit: true,
 						title: '',
@@ -272,8 +273,13 @@
 						});
 					},
 					async handleAudit(status) {
-
-						this.form.valueJson = await this.generateFormValid();
+						this.loading = true;
+						try {
+							this.form.valueJson = await this.generateFormValid();
+						} catch (error) {
+							this.loading = false;
+							return;
+						}
 						console.log(this.form.valueJson)
 						this.form.processType = '1';
 						let API = this.APIUrl + '/bpm/process-instance/create'
@@ -285,6 +291,7 @@
 								...this.form,
 							}
 						}).then((res) => {
+							this.loading = false;
 							if (res.data.code != '-1') {
 								vant.showNotify({
 									type: 'success',
@@ -294,7 +301,20 @@
 								setTimeout(() => {
 									this.onClickLeft()
 								}, 1000)
+							} else {
+								vant.showNotify({
+									type: 'danger',
+									message: `提交失败!${res.data.message}`,
+									duration: 1000,
+								});
 							}
+						}).catch((err) => {
+							vant.showNotify({
+									type: 'danger',
+									message: `提交失败!${err.message}`,
+									duration: 1000,
+								});
+							this.loading = false;
 						});
 					},
 					onClickLeft() {

+ 6 - 2
hybrid/html/c.html

@@ -67,9 +67,9 @@
 				</van-form>
 				<div
 					style="display: flex;justify-content: space-between; padding: 0px 30px;  width: 100%; height: 80px;">
-					<van-button style="width:48%" type="primary" @click="handleAudit(1)">通过
+					<van-button style="width:48%" type="primary" :loading="loading" @click="handleAudit(1)">通过
 					</van-button>
-					<van-button style="width:48%" type="danger" @click="handleAudit(0)">驳回
+					<van-button style="width:48%" type="danger" :loading="loading" @click="handleAudit(0)">驳回
 					</van-button>
 				</div>
 
@@ -162,6 +162,7 @@
 						await this._approveTaskWithVariables(status);
 					},
 					async _approveTaskWithVariables(status) {
+						this.loading = true;
 						let variables = {
 							pass: !!status,
 							...this.form.formVariables
@@ -179,6 +180,7 @@
 								variables
 							}
 						}).then((res) => {
+							this.loading = false;
 							if (res.data.code != '-1') {
 								let params = {
 									status,
@@ -193,6 +195,8 @@
 									this.onClickLeft()
 								}, 1000)
 							}
+						}).catch(() => {
+							this.loading = false;
 						});
 
 					},

+ 1 - 0
pages/internalManagement/apply/index.vue

@@ -277,6 +277,7 @@
 		font-size: 15px;
 		color: #333;
 		padding: 10rpx 0 20rpx 0rpx;
+		margin-top: 10rpx;
 		/* #ifndef APP-PLUS */
 		box-sizing: border-box;
 		/* #endif */