新增加载条

api/member.js

@@ -86,7 +86,7 @@ class Member {
      */
     static uploadImage(data) {
         
-        return server.uploadFile(`/uploadImage`,data);
+        return server.uploadFile(`/uploadImage`,data,{loading:false});
     }
 
     // 页面底部信息

element/index.js

@@ -1,6 +1,6 @@
 // 导入自己需要的组件
-import { Slider,Steps,Step,Select,Option } from 'element-ui'
-const components = [Slider,Steps,Step,Select,Option]
+import { Slider,Progress,Steps,Step,Select,Option } from 'element-ui'
+const components = [Slider,Progress,Steps,Step,Select,Option]
 const element = {
   install: function (Vue) {
     // Vue.use(Slider)

pages/auth/certification.vue

@@ -76,7 +76,7 @@
 					<v-input v-model="form.phone" :placeholder="$t('auth.d0')"></v-input>
 				</view>
 			</view>
-			<div class="form-item border-b p-md">
+			<div class="form-item border-b p-md" style="padding-bottom: 30px !important;position: relative;">
 				<div class="color-light p-b-xs">1、{{$t('auth.b5')}}</div>
 				<div class="d-flex justify-between m-t-md ">
 					<div class="examples m-r-xs bg-panel-4 p-md rounded-sm">
@@ -88,8 +88,15 @@
 						<img v-else :src="form.front_img" alt />
 					</div>
 				</div>
+				<el-progress
+				  v-if="boll"
+				  :percentage="uploadProgress"
+				  :status="uploadStatus"
+				  :stroke-width="10"
+				  class="my-2"
+				></el-progress>
 			</div>
-			<div class="form-item border-b p-md">
+			<div class="form-item border-b p-md" style="padding-bottom: 30px !important;position: relative;">
 				<div class="color-light p-b-xs">2、{{$t('auth.b6')}}</div>
 				<div class="d-flex justify-between m-t-md">
 					<div class="examples m-r-xs bg-panel-4 p-md rounded-sm">
@@ -101,6 +108,13 @@
 						<img v-else :src="form.back_img" alt />
 					</div>
 				</div>
+				<el-progress
+				  v-if="boll1"
+				  :percentage="uploadProgress1"
+				  :status="uploadStatus1"
+				  :stroke-width="10"
+				  class="my-2"
+				></el-progress>
 			</div>
 			<view class="p-md ">
 				<v-button block type="white" class="w-max rounded-md" ref="btn"
@@ -146,6 +160,15 @@
 					value: 2,
 					text: this.$t('auth.d3')
 				}],
+				uploadProgress: 0,    // 新增进度状态
+				uploadStatus: null,// 新增状态类型
+				progressInterval: null,
+				boll:false,
+				uploadProgress1: 0,    // 新增进度状态
+				uploadStatus1: null,// 新增状态类型
+				boll1:false,
+				continueUploading:true,
+				continueUploading1:true
 			};
 		},
 		computed: {
@@ -167,10 +190,73 @@
 			},
 			// 上传图片
 			upLoadImg(chooseImageRes, name) {
+				if(name=='front_img'){
+					this.uploadStatus = null // 重置状态
+					this.uploadProgress = 0 // 重置进度
+					this.boll = true
+				}else{
+					this.uploadStatus1 = null // 重置状态
+					this.uploadProgress1 = 0 // 重置进度
+					this.boll1 = true
+				}
+				
+				clearInterval(this.progressInterval); // 清除之前的定时器
+				
+				this.progressInterval = setInterval(() => {
+				  if (this.uploadProgress < 100&&name=='front_img'&&this.continueUploading) {
+				    this.uploadProgress += Math.floor(Math.random() * 3) + 1;
+					setTimeout(() => {
+					  this.continueUploading = false;
+					  // 暂停3秒后继续累加
+					  setTimeout(() => {
+					    this.continueUploading = true;
+					  }, 1000); // 这里的3000毫秒表示暂停3秒后继续
+					}, 1000);
+				  }else if(this.uploadProgress1 < 100&&name=='back_img'&&this.continueUploading1){
+					this.uploadProgress1 += Math.floor(Math.random() * 4) + 1;
+					setTimeout(() => {
+					  this.continueUploading1 = false;
+					  // 暂停3秒后继续累加
+					  setTimeout(() => {
+					    this.continueUploading1 = true;
+					  }, 1600); // 这里的3000毫秒表示暂停3秒后继续
+					}, 1000);
+				  }
+				}, 50);
+				
 			    Member.uploadImage(chooseImageRes).then((res) => {
 			        this.form[name] = res.data.url;
-			        this.$toast.success(this.$t('auth.c1'));
-			    });
+					if(res.data.url){
+						if(name=='front_img'){
+							setTimeout(() => {
+							  this.uploadStatus = 'success'
+							  this.uploadProgress = 100
+							  clearInterval(this.progressInterval); // 清除之前的定时器
+							  setTimeout(() => {
+							  	this.boll = false
+							  },3000)
+							}, 2000)
+						}else{
+							setTimeout(() => {
+							  this.uploadStatus1 = 'success'
+							  this.uploadProgress1 = 100
+							  clearInterval(this.progressInterval); // 清除之前的定时器
+							  setTimeout(() => {
+							  	this.boll1 = false
+							  },3000)
+							}, 2000)
+						}
+					}
+			        // this.$toast.success(this.$t('auth.c1'));
+			    }).catch(() => {
+					if(name=='front_img'){
+						this.uploadStatus = 'exception'
+						this.uploadProgress = 100
+					}else{
+						this.uploadStatus1 = 'exception'
+						this.uploadProgress1 = 100
+					}
+				});
 			},
 			getAuthInfo() {
 				Profile.getAuthInfo().then((res) => {
@@ -379,4 +465,20 @@
 	        // object-fit: cover;
 	    }
 	}
+	
+	.el-progress {
+	  position: absolute;
+	  bottom: 8px;
+	  right:-15px;
+	  width: 300rpx;
+	  // margin-top: 10px;
+	  
+	  &-bar {
+	    padding-right: 45px;
+	  }
+	  
+	  &__text {
+	    font-size: 12px!important;
+	  }
+	}
 </style>

pages/base/mine.vue

@@ -429,6 +429,7 @@ export default {
   },
   methods: {
 	price1(item,index){
+		if (this.hideMoney) return "******";
 		if (item) {
 			let price = item.toFixed(index).toString();
 			let parts = price.split(".");