页面修改

subpkg/buyShare/buyShare.vue

@@ -33,16 +33,22 @@
 						type='number' border="surround" v-model="amount"></u--input>
 				</view>
 			</view>
-			<view class="" v-if="!file">
+			<view class="" :class="{hide:file}">
-				<lsjUpload ref="lsjUpload" childId="upload1" :size="10" :option="fileOption" height="200rpx"
+				<view class="" :class="{hide:progress!=0}">
-					style="margin-top: 28rpx;" :debug="false" :formats="'png,jpg,jpeg,pdf,webp'" :multiple="false"
+					<lsjUpload ref="lsjUpload" childId="upload1" :size="10" :option="fileOption" height="200rpx"
-					:count="1" :instantly="false" @change="changeFile" @uploadEnd="onuploadEnd">
+						style="margin-top: 28rpx;" :debug="false" :formats="'png,jpg,jpeg,pdf,webp'" :multiple="false"
-					<view class="change-file">上传凭证</view>
+						:count="1" :instantly="false" @change="changeFile" @uploadEnd="onuploadEnd"
-				</lsjUpload>
+						@progress="onprogress">
+						<view class="change-file">上传凭证</view>
+					</lsjUpload>
+				</view>
+				<view style="margin-top: 20rpx;" v-if="progress>0">
+					<u-loading-icon :text=" '正在上传中'+ progress+'%'" textSize="18"></u-loading-icon>
+				</view>
 			</view>
-			<view class="file" v-else>
+			<view class="file" v-if='file'>
 				<view class="">
-					<image :src="file" style="width: 150rpx;height: 150rpx;margin-right: 12rpx;"
+					<image :src="local_src" style="width: 150rpx;height: 150rpx;margin-right: 12rpx;"
 						v-if="file_type=='image'">
 					</image>
 					<image src="@/static/img/contract/pdf.png" style="width: 150rpx;height: 150rpx;margin-right: 12rpx;"
@@ -53,9 +59,15 @@
 					<view class="">
 						{{fileTit}}
 					</view>
-					<view class="" style="color: blue;" @click="navToContract">
+					<view class="" style="display: flex;">
-						查看
+						<view class="" style="color: blue;margin-right: 10rpx;" @click="navToContract">
+							查看
+						</view>
+						<view class="" style="color: red;" @click="delFn" v-if="!isDisabled">
+							删除
+						</view>
 					</view>
+
 				</view>
 
 			</view>
@@ -93,15 +105,14 @@
 	import {
 		Toast
 	} from "../../libs/uniApi";
-	import {
+
-		nextTick
-	} from "vue";
 	export default {
 		components: {
 			lsjUpload
 		},
 		data() {
 			return {
+				progress: 0,
 				imgTypeList: ["png", "jpg", "jpeg", "webp"],
 				isDisabled: false,
 				amount: "",
@@ -109,6 +120,7 @@
 				task: {},
 				task_id: -1,
 				file: "",
+				local_src: "",
 				fileTit: "",
 				file_type: "pdf",
 			};
@@ -128,7 +140,6 @@
 		methods: {
 			navToContract() {
 				let fileSrc = this.file
-
 				if (this.file_type == 'image') {
 					uni.previewImage({
 						urls: [fileSrc]
@@ -142,24 +153,35 @@
 			async submitFn() {
 				if (!this.amount) return Toast("请输入金额")
 				if (Number(this.amount) < Number(this.task.extend.shareholder.money)) return Toast("未达到目标入股金额，无法提交")
-				let res = await commit_service_group_taskAPI({
+				let data = {
 					id: this.task_id,
 					annex: this.file,
 					amount: this.amount,
 					file_type: this.file_type
+				}
+				let res = await commit_service_group_taskAPI({
+					...data
 				})
 				Toast("操作成功!")
-				return
 				setTimeout(() => {
 					uni.navigateBack()
 				}, 1000)
 			},
+			delFn() {
+				this.clear()
+				this.file = ""
+				this.file_type = "pdf"
+				this.progress = 0
+
+			},
+			clear() {
+				this.$refs.lsjUpload.clear();
+			},
 			/**
 			 * 某文件上传结束回调(成功失败都回调)
 			 * @param {Object} item 当前上传完成的文件
 			 */
 			onuploadEnd(item) {
-
 				let res = JSON.parse(item.responseText)
 				this.file = res.data.uri
 				this.fileTit = res.data.name
@@ -170,18 +192,16 @@
 			 * 如果网页上md文档没有渲染出事件名称onprogre，请复制代码的小伙伴自行添加上哈，没有哪个事件是只(item)的
 			 * @param {Object} item 当前正在上传的文件
 			 */
-			onprogre(item) {
+			onprogress(item) {
-				// 更新当前状态变化的文件
+				this.progress = item.progress
-				this.files.set(item.name, item);
-				// 强制更新视图
-				this.$forceUpdate();
 			},
 			/**
 			 * 文件选择回调
 			 * @param {Object} files 已选择的所有文件Map集合
 			 */
 			async changeFile(files) {
-				let type = [...files.values()][0].name
+				let type = [...files.values()][0]?.name || null
+				if (!type) return
 				let isImage = null
 				this.imgTypeList.forEach(item => {
 					if (type.includes(item)) {
@@ -189,9 +209,11 @@
 						this.file_type = 'image'
 					}
 				})
-
+				this.local_src = [...files.values()][0].path
 				if (isImage) {
 					this.$refs.lsjUpload.setData("url", IMG_URL)
+				} else {
+					this.$refs.lsjUpload.setData("url", FILE_URL)
 				}
 				this.$refs.lsjUpload.upload()
 				// 更新选择的文件 
@@ -199,21 +221,6 @@
 				// 强制更新视图
 				this.$forceUpdate();
 			},
-			/**
-			 * 指定上传某个文件
-			 * @param {Object} name 带后缀名的文件名称
-			 */
-			resetUpload(name) {
-				this.$refs.lsjUpload.upload(name);
-			},
-			/**
-			 * 移除某个文件
-			 * @param {Object} name 带后缀名的文件名称
-			 */
-			clear(name) {
-				// name=指定文件名，不传name默认移除所有文件
-				this.$refs.lsjUpload.clear();
-			},
 			async loadTask() {
 				let res = await taskShareholder({
 					id: this.task_id
@@ -297,4 +304,9 @@
 			flex-direction: column;
 		}
 	}
+
+	.hide {
+		height: 0;
+		overflow: hidden;
+	}
 </style>