Преглед изворни кода

优化导出,新增遮罩层,优化配车防连点

dw пре 1 недеља
родитељ
комит
d4366f4ce8
4 измењених фајлова са 214 додато и 67 уклоњено
  1. 21
    12
      src/components/PopupDistribution.vue
  2. 91
    23
      src/view/record/inrecord.vue
  3. 90
    29
      src/view/record/outrecord.vue
  4. 12
    3
      src/view/ware/storechange.vue

+ 21
- 12
src/components/PopupDistribution.vue Прегледај датотеку

1
 <template>
1
 <template>
2
 	<div>
2
 	<div>
3
-		<el-dialog title="配车" :visible.sync="dialogVisible" width="1000px" height="400px"  @close="close">
3
+		<el-dialog title="配车" :visible.sync="dialogVisible"
4
+                width="1000px" height="400px"  @close="close">
4
 
5
 
5
-			<el-form :model="distribution" label-width="100px" inline="">
6
+			<el-form :model="distribution" v-loading="dialoging"
7
+               element-loading-text="拼命加载中"
8
+               element-loading-spinner="el-icon-loading" label-width="100px" inline="">
6
 				<el-form-item label="车号">
9
 				<el-form-item label="车号">
7
 					<el-select v-model="truckNo" clearable allow-create filterable default-first-option @change="change" style="width: 200px;">
10
 					<el-select v-model="truckNo" clearable allow-create filterable default-first-option @change="change" style="width: 200px;">
8
 						<el-option v-for="item in trucks" :key="item.id" :label="item.truckNo" :value="item.truckNo">
11
 						<el-option v-for="item in trucks" :key="item.id" :label="item.truckNo" :value="item.truckNo">
102
 			selectRows: {
105
 			selectRows: {
103
 				type: Array
106
 				type: Array
104
 			},
107
 			},
108
+      dialoging:{
109
+        type:Boolean
110
+      }
105
 		},
111
 		},
106
 		data() {
112
 		data() {
107
 			return {
113
 			return {
115
 				query: '',
121
 				query: '',
116
 				isShow: false,
122
 				isShow: false,
117
 				dialogVisible: false,
123
 				dialogVisible: false,
124
+        dialoging: false,
118
 				distribution: {
125
 				distribution: {
119
 					truckNo: '',
126
 					truckNo: '',
120
 					driverName: '',
127
 					driverName: '',
229
 					// console.log("iiiiiiiiii"+JSON.stringify(this.distribution))
236
 					// console.log("iiiiiiiiii"+JSON.stringify(this.distribution))
230
 					// if(typeof(this.distribution.listDetail) != "undefined"){
237
 					// if(typeof(this.distribution.listDetail) != "undefined"){
231
 					// 	alert("kk")
238
 					// 	alert("kk")
232
-						
239
+
233
 					// }
240
 					// }
234
-					
241
+
235
 					for (let i = 0; i < this.selectRows.length; i++) {
242
 					for (let i = 0; i < this.selectRows.length; i++) {
236
 							this.tableData.push(this.selectRows[i])
243
 							this.tableData.push(this.selectRows[i])
237
 							console.log(JSON.stringify(this.selectRows[i]))
244
 							console.log(JSON.stringify(this.selectRows[i]))
239
 					}
246
 					}
240
 					for (let i = 0; i < this.distribution.listDetail.length; i++) {
247
 					for (let i = 0; i < this.distribution.listDetail.length; i++) {
241
 							// alert(JSON.stringify(this.distribution.listDetail[i].store))
248
 							// alert(JSON.stringify(this.distribution.listDetail[i].store))
242
-						if(tempPltNo.indexOf(this.distribution.listDetail[i].store.plateNo) === -1){	
249
+						if(tempPltNo.indexOf(this.distribution.listDetail[i].store.plateNo) === -1){
243
 							this.tableData.push(this.distribution.listDetail[i].store)
250
 							this.tableData.push(this.distribution.listDetail[i].store)
244
-						}	
251
+						}
245
 					}
252
 					}
246
-					
253
+
247
 
254
 
248
 					this.distribution.sumWeight = this.sumWeight
255
 					this.distribution.sumWeight = this.sumWeight
249
 					this.distribution.sumCount = this.sumCount
256
 					this.distribution.sumCount = this.sumCount
252
 			},
259
 			},
253
 			handleSave() {
260
 			handleSave() {
254
 				//console.log(JSON.stringify(this.distribution))
261
 				//console.log(JSON.stringify(this.distribution))
262
+        this.dialoging = true
255
 				this.distribution.sumWeight = this.sumWeight
263
 				this.distribution.sumWeight = this.sumWeight
256
 				this.distribution.sumCount = this.sumCount
264
 				this.distribution.sumCount = this.sumCount
257
 				this.distribution.truckNo = this.truckNo
265
 				this.distribution.truckNo = this.truckNo
269
 				}
277
 				}
270
 				axios.post(url, param).then(response => {
278
 				axios.post(url, param).then(response => {
271
 					if (response.data.code == 0) {
279
 					if (response.data.code == 0) {
272
-
280
+            this.dialoging = false
273
 						this.dialogVisible = false
281
 						this.dialogVisible = false
274
 						this.selectRows    = []
282
 						this.selectRows    = []
275
 					} else {
283
 					} else {
277
 							type: 'error',
285
 							type: 'error',
278
 							message: '失败!' + response.data.msg,
286
 							message: '失败!' + response.data.msg,
279
 						});
287
 						});
280
-					}
288
+            this.dialoging = false
289
+          }
281
 				});
290
 				});
282
 			},
291
 			},
283
 			close() {
292
 			close() {
329
 						});
338
 						});
330
 						return;
339
 						return;
331
 					}
340
 					}
332
-					
341
+
333
 				}
342
 				}
334
 
343
 
335
 				this.selection = selection;
344
 				this.selection = selection;
358
 					}
367
 					}
359
 				});
368
 				});
360
 			},
369
 			},
361
-			
370
+
362
 
371
 
363
 			tableRowClassName({
372
 			tableRowClassName({
364
 				row,
373
 				row,
365
 				rowIndex
374
 				rowIndex
366
-			}) 
375
+			})
367
 			{
376
 			{
368
 				if (row.lockFlag == '1') {
377
 				if (row.lockFlag == '1') {
369
 					return 'success-row';
378
 					return 'success-row';

+ 91
- 23
src/view/record/inrecord.vue Прегледај датотеку

166
 		<popup-material ref="PopupMaterial" @receviceFromChild="receviceFromMaterial"></popup-material>
166
 		<popup-material ref="PopupMaterial" @receviceFromChild="receviceFromMaterial"></popup-material>
167
 		<popup-customer ref="PopupCustomer" @receviceFromChild="receviceFromCustomer"></popup-customer>
167
 		<popup-customer ref="PopupCustomer" @receviceFromChild="receviceFromCustomer"></popup-customer>
168
 		<popup-customer ref="PopupFkCompony" @receviceFromChild="receviceFromFkCompony"></popup-customer>
168
 		<popup-customer ref="PopupFkCompony" @receviceFromChild="receviceFromFkCompony"></popup-customer>
169
+
170
+		<!-- 导出Loading遮罩层 -->
171
+		<div v-if="exportLoading" class="export-loading-mask">
172
+			<div class="export-loading-content">
173
+				<i class="el-icon-loading"></i>
174
+				<p>正在导出,请稍候...</p>
175
+			</div>
176
+		</div>
169
 	</div>
177
 	</div>
170
 </template>
178
 </template>
171
 
179
 
180
+<style>
181
+/* 导出Loading遮罩样式 */
182
+.export-loading-mask {
183
+  position: fixed;
184
+  top: 0;
185
+  left: 0;
186
+  width: 100%;
187
+  height: 100%;
188
+  background-color: rgba(0, 0, 0, 0.5);
189
+  z-index: 9999;
190
+  display: flex;
191
+  justify-content: center;
192
+  align-items: center;
193
+}
194
+
195
+.export-loading-content {
196
+  background-color: #fff;
197
+  padding: 30px 50px;
198
+  border-radius: 8px;
199
+  text-align: center;
200
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
201
+}
202
+
203
+.export-loading-content i {
204
+  font-size: 40px;
205
+  color: #409EFF;
206
+  margin-bottom: 15px;
207
+}
208
+
209
+.export-loading-content p {
210
+  font-size: 16px;
211
+  color: #333;
212
+  margin: 0;
213
+}
214
+</style>
215
+
172
 <script>
216
 <script>
173
 	import axios from '@/axios'
217
 	import axios from '@/axios'
174
 	import PopupStack from '@/components/PopupStack.vue'
218
 	import PopupStack from '@/components/PopupStack.vue'
203
 				},
247
 				},
204
 				selectRows: [],
248
 				selectRows: [],
205
 				loading: false,
249
 				loading: false,
250
+			exportLoading: false,
206
 				tableData: [],
251
 				tableData: [],
207
 				optionsWare: [],
252
 				optionsWare: [],
208
 				dialogVisible: false,
253
 				dialogVisible: false,
418
 				this.query.ordNo = replaceResult;
463
 				this.query.ordNo = replaceResult;
419
 			},
464
 			},
420
 			handleExport() {
465
 			handleExport() {
421
-				var imptData = [];
422
-				var url = 'WareInRecord/query.do'
466
+        // 显示加载动画
467
+        this.exportLoading = true;
468
+
469
+        var baseUrl = this.$store.state.app.serverName;
470
+        var url = baseUrl + 'WareStore/inExportStoreExcel.do';
471
+        let userId = localStorage.getItem("userId");
472
+        let belongId = localStorage.getItem("belongId");
473
+        let token = localStorage.getItem("token");
474
+        console.log(userId, belongId, token);
423
 				var param = {
475
 				var param = {
424
 					page: -1,
476
 					page: -1,
425
 					rows: -1,
477
 					rows: -1,
438
 					fkComponyName:this.query.fkComponyName,
490
 					fkComponyName:this.query.fkComponyName,
439
 					remark1:this.query.remark1,
491
 					remark1:this.query.remark1,
440
           contractNo:this.query.contractNo.length == 0 ? '' : this.query.contractNo.join(','),
492
           contractNo:this.query.contractNo.length == 0 ? '' : this.query.contractNo.join(','),
493
+          userId: userId,
494
+          belongId: belongId
441
 				}
495
 				}
442
 
496
 
497
+        var params = [];
498
+        // 去掉 if(param\[key\]) 判断,空字符串也要传递给后端
499
+        for (var key in param) {
500
+          params.push(key + '=' + encodeURIComponent(param[key]));
501
+        }
502
+        var fullUrl = url + (params.length > 0 ? '?' + params.join('&') : '');
443
 
503
 
444
-				axios.get(url, param).then(response => {
445
-
446
-					if (response.data.code == 0) {
447
-						var imptData = response.data.data;
448
-						if (imptData.length == 0) {
449
-							this.$alert('无法导出,选择时间段无记录', '提示', {
450
-								confirmButtonText: '确定',
451
-								callback: action => {}
452
-							});
453
-						} else {
454
-
455
-							this.exportExcel(imptData)
456
-						}
457
-					} else {
458
-						this.$message({
459
-							type: 'error',
460
-							message: '操作失败;' + response.data.msg,
461
-						});
462
-					}
463
-
464
-				});
504
+        // 使用 fetch + blob 方式,下载完成后关闭 loading
505
+        fetch(fullUrl)
506
+        .then(response => {
507
+          if (!response.ok) {
508
+            throw new Error('网络请求失败');
509
+          }
510
+          return response.blob();
511
+        })
512
+        .then(blob => {
513
+          // 创建下载链接
514
+          const url = window.URL.createObjectURL(blob);
515
+          const link = document.createElement('a');
516
+          link.href = url;
517
+          link.download = '入库记录_' + new Date().toISOString().slice(0, 10) + '.xlsx';
518
+          document.body.appendChild(link);
519
+          link.click();
520
+          // 浏览器开始下载后立即关闭 loading
521
+          this.exportLoading = false;
522
+          // 清理
523
+          setTimeout(() => {
524
+            document.body.removeChild(link);
525
+            window.URL.revokeObjectURL(url);
526
+          }, 100);
527
+        })
528
+        .catch(error => {
529
+          console.error('导出失败:', error);
530
+          this.$message.error('导出失败:' + error.message);
531
+          this.exportLoading = false;
532
+        });
465
 
533
 
466
 			},
534
 			},
467
 			exportExcel(imptData) {
535
 			exportExcel(imptData) {

+ 90
- 29
src/view/record/outrecord.vue Прегледај датотеку

265
 		<popup-material ref="PopupMaterial" @receviceFromChild="receviceFromMaterial"></popup-material>
265
 		<popup-material ref="PopupMaterial" @receviceFromChild="receviceFromMaterial"></popup-material>
266
 		<popup-customer ref="PopupCustomer" @receviceFromChild="receviceFromCustomer"></popup-customer>
266
 		<popup-customer ref="PopupCustomer" @receviceFromChild="receviceFromCustomer"></popup-customer>
267
 		<popup-customer ref="PopupFkCompony" @receviceFromChild="receviceFromFkCompony"></popup-customer>
267
 		<popup-customer ref="PopupFkCompony" @receviceFromChild="receviceFromFkCompony"></popup-customer>
268
+
269
+		<!-- 导出Loading遮罩层 -->
270
+		<div v-if="exportLoading" class="export-loading-mask">
271
+			<div class="export-loading-content">
272
+				<i class="el-icon-loading"></i>
273
+				<p>正在导出,请稍候...</p>
274
+			</div>
275
+		</div>
268
 	</div>
276
 	</div>
269
 </template>
277
 </template>
270
 
278
 
349
 				modifyWgt:0,
357
 				modifyWgt:0,
350
 				modifyPrice:0,
358
 				modifyPrice:0,
351
 				optionsCust:[],
359
 				optionsCust:[],
352
-				changeCarNo:"",
353
-				popupCarno: false,
354
-				ChangeOutDtm:''
355
-			};
360
+			changeCarNo:"",
361
+			popupCarno: false,
362
+			ChangeOutDtm:'',
363
+			exportLoading: false  // 导出Loading状态
364
+		};
356
 		},
365
 		},
357
 		//页面加载完成渲染
366
 		//页面加载完成渲染
358
 		mounted() {
367
 		mounted() {
808
 
817
 
809
 			},
818
 			},
810
 			handleExport() {
819
 			handleExport() {
811
-				var imptData = [];
820
+        // 显示Loading遮罩,禁止用户操作
821
+        this.exportLoading = true;
812
 
822
 
813
-
814
-				var url = 'WareOutRecord/query.do'
823
+        var baseUrl = this.$store.state.app.serverName;
824
+				var url = baseUrl + 'WareStore/outExportStoreExcel.do';
825
+        let userId = localStorage.getItem("userId");
826
+        let belongId = localStorage.getItem("belongId");
827
+        let token = localStorage.getItem("token");
815
 				var param = {
828
 				var param = {
816
 					page: -1,
829
 					page: -1,
817
 					rows: -1,
830
 					rows: -1,
830
 					fkComponyName:this.query.fkComponyName,
843
 					fkComponyName:this.query.fkComponyName,
831
 					remark1:this.query.remark1,
844
 					remark1:this.query.remark1,
832
           contractNo:this.query.contractNo.length == 0 ? '' : this.query.contractNo.join(','),
845
           contractNo:this.query.contractNo.length == 0 ? '' : this.query.contractNo.join(','),
846
+          userId: userId,
847
+          belongId: belongId
833
 				}
848
 				}
834
-				// alert(JSON.stringify(param))
835
-
836
-				axios.get(url, param).then(response => {
837
-					// alert(JSON.stringify(response))
838
-					if (response.data.code == 0) {
839
-						var imptData = response.data.data;
840
-						if (imptData.length == 0) {
841
-							this.$alert('无法导出,选择时间段无记录', '提示', {
842
-								confirmButtonText: '确定',
843
-								callback: action => {}
844
-							});
845
-						} else {
846
 
849
 
847
-							this.exportExcel(imptData)
848
-						}
849
-					} else {
850
-						this.$message({
851
-							type: 'error',
852
-							message: '操作失败;' + response.data.msg,
853
-						});
854
-					}
850
+        var params = [];
851
+        for (var key in param) {
852
+          params.push(key + '=' + encodeURIComponent(param[key]));
853
+        }
854
+        var fullUrl = url + (params.length > 0 ? '?' + params.join('&') : '');
855
 
855
 
856
-				});
856
+        // 使用 fetch + blob 方式,下载完成后关闭 loading
857
+        fetch(fullUrl)
858
+        .then(response => {
859
+          if (!response.ok) {
860
+            throw new Error('网络请求失败');
861
+          }
862
+          return response.blob();
863
+        })
864
+        .then(blob => {
865
+          // 创建下载链接
866
+          const url = window.URL.createObjectURL(blob);
867
+          const link = document.createElement('a');
868
+          link.href = url;
869
+          link.download = '出库记录_' + new Date().toISOString().slice(0, 10) + '.xlsx';
870
+          document.body.appendChild(link);
871
+          link.click();
872
+          // 浏览器开始下载后立即关闭 loading
873
+          this.exportLoading = false;
874
+          // 清理
875
+          setTimeout(() => {
876
+            document.body.removeChild(link);
877
+            window.URL.revokeObjectURL(url);
878
+          }, 100);
879
+        })
880
+        .catch(error => {
881
+          console.error('导出失败:', error);
882
+          this.$message.error('导出失败:' + error.message);
883
+          this.exportLoading = false;
884
+        });
857
 
885
 
858
-			},
886
+		},
859
 			exportExcel(imptData) {
887
 			exportExcel(imptData) {
860
 				 console.log(JSON.stringify(imptData))
888
 				 console.log(JSON.stringify(imptData))
861
 				const header = ["仓库名称"
889
 				const header = ["仓库名称"
980
 		height: calc(100% - 230px);
1008
 		height: calc(100% - 230px);
981
 		/*background-color: #000;*/
1009
 		/*background-color: #000;*/
982
 	}
1010
 	}
1011
+
1012
+	/* 导出Loading遮罩层样式 */
1013
+	.export-loading-mask {
1014
+		position: fixed;
1015
+		top: 0;
1016
+		left: 0;
1017
+		right: 0;
1018
+		bottom: 0;
1019
+		background-color: rgba(0, 0, 0, 0.5);
1020
+		z-index: 9999;
1021
+		display: flex;
1022
+		justify-content: center;
1023
+		align-items: center;
1024
+	}
1025
+
1026
+	.export-loading-content {
1027
+		background-color: #fff;
1028
+		padding: 40px 60px;
1029
+		border-radius: 8px;
1030
+		text-align: center;
1031
+		box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
1032
+	}
1033
+
1034
+	.export-loading-content .el-icon-loading {
1035
+		font-size: 48px;
1036
+		color: #409EFF;
1037
+	}
1038
+
1039
+	.export-loading-content p {
1040
+		margin-top: 20px;
1041
+		font-size: 16px;
1042
+		color: #333;
1043
+	}
983
 </style>
1044
 </style>

+ 12
- 3
src/view/ware/storechange.vue Прегледај датотеку

271
       </el-form>
271
       </el-form>
272
     </el-dialog>
272
     </el-dialog>
273
 
273
 
274
+		<!-- 导出Loading遮罩层 -->
275
+		<div v-if="exportLoading" class="export-loading-mask">
276
+			<div class="export-loading-content">
277
+				<i class="el-icon-loading"></i>
278
+				<p>正在导出,请稍候...</p>
279
+			</div>
280
+		</div>
281
+
274
 	</div>
282
 	</div>
275
 </template>
283
 </template>
276
 
284
 
367
 				newStack:'',
375
 				newStack:'',
368
 				newRemark1:'',
376
 				newRemark1:'',
369
 				newRemark:'',
377
 				newRemark:'',
370
-				changeCUSTDialogVisible: false,
371
-				newCustomername:'',
372
-				newFKCustomername:'',
378
+			changeCUSTDialogVisible: false,
379
+			newCustomername:'',
380
+			newFKCustomername:'',
373
         outDialogVisible: false,
381
         outDialogVisible: false,
374
         address: '',
382
         address: '',
383
+				exportLoading: false,  // 导出Loading状态
375
 			};
384
 			};
376
 		},
385
 		},
377
 		mounted() {
386
 		mounted() {

Loading…
Откажи
Сачувај