完工-上传组件适配scroll-view

src/components/createCom/XhFiles.vue

@@ -2,10 +2,6 @@
 <template>
 	<view>
 		<view class="file-box">
-			<!-- <view class="u-flex">
-				<view class="txt u-flex-1">{{item.fieldsTitle}}</view>
-				<u-icon name="arrow-right" color="#666" size="28"></u-icon>
-			</view> -->
 			<view class="pics u-flex u-flex-wrap">
 				<view class="img-list" v-for="(item,index) in imgList" :key="index">
 					<u-image class="pic" width="160" height="160" :src="item.path ? item.path : item.src + '?imageView2/1/w/100/h/100/q/75'" :border-radius="10" @click.stop="prviewImage(item,index)"></u-image>
@@ -14,13 +10,14 @@
 						<view class="icon-del rotate"></view>
 					</view>
 				</view>
-				<view class="img-list">
+				<slot></slot>
+				<!-- <view class="img-list">
 					<u-image class="pic" width="160rpx" height="160rpx" :border-radius="10" @click="selectUpload" :src="uploadImage"></u-image>
-				</view>
+				</view> -->
 			</view>
-			<u-action-sheet :list="list" v-model="maskShow" :cancel-btn="true" @click="uploadSelect"></u-action-sheet>
+			<!-- <u-action-sheet :list="list" v-model="maskShow" :cancel-btn="true" @click="uploadSelect"></u-action-sheet> -->
 		</view>
-		<take-photo v-if="takeStatus" @close="closeTake" :upload="false" :currentItem="currentItemDate"></take-photo>
+		<!-- <take-photo v-if="takeStatus" @close="closeTake" :upload="false" :currentItem="currentItemDate"></take-photo> -->
 	</view>
 </template>
 
@@ -86,6 +83,26 @@
 			}
 		},
 		methods: {
+			setTmpValue(values) {
+				this.imgList = this.imgList.concat(values)
+				const dataValue = this.imgList.map(v => v.src)
+				this.valueChange(dataValue)
+			},
+			setValue() {
+				const dataValue = this.imgList.map(item => item.src)
+				this.valueChange(dataValue)
+			},
+			prviewImage(item, index) {
+				uni.previewImage({
+					urls: [item.path ? item.path : item.src],
+					current: index
+				});
+			},
+			delFile(index) {
+				this.imgList.splice(index, 1)
+				this.setValue()
+			},
+			/*
 			selectUpload(){
 				if (this.imgList.length === 10) {
 					return this.$refs.uToast.show({
@@ -122,18 +139,6 @@
 				this.photograph()
 				this.getWatermark()
 			},
-			setTmpValue(values) {
-				this.imgList = this.imgList.concat(values)
-				const dataValue = values.map(v => v.key)
-				this.valueChange(dataValue)
-			},
-			setValue() {
-				const dataValue = []
-				this.imgList.map(item=>{
-					dataValue.push(item.src)
-				})
-				this.valueChange(dataValue)
-			},
 			closeTake(val) {
 				if(val && val.length > 0){
 					// val.forEach(item=>{
@@ -164,16 +169,6 @@
 				// }
 				// uploader.qnFileUpload(options)
 			},
-			prviewImage(item, index) {
-				uni.previewImage({
-					urls: [item.path ? item.path : item.src],
-					current: index
-				});
-			},
-			delFile(index) {
-				this.imgList.splice(index, 1)
-				this.setValue()
-			},
 			photograph(){// 获取拍照规范接口
 				let self = this
 				let param = {"partnerCompanyId":self.partnerCompanyId,
@@ -201,7 +196,7 @@
 						console.log("获取水印备注异常",res.data.message)
 					}
 				});
-			}
+			}*/
 		}
 	}
 </script>

src/components/upload/index.js

@@ -48,10 +48,11 @@ export default {
 		async saveToTask(files) {
 			// 生成key返回，然后把key放到异步上传的任务队列
 			let lists = files.map(v => {
+				const key = randomChar(10)
 				return {
-					key: randomChar(10),
+					key: key,
 					path: v,
-					src: ''
+					src: key
 				}
 			})
 			// for (let i = 0; i < files.length; i++) {
@@ -92,10 +93,11 @@ export default {
 					tempFilePath: path,
 					success(e) {
 						const { savedFilePath } = e
+						const key = randomChar(10)
 						const img = {
-							key: randomChar(10),
+							key: key,
 							path: savedFilePath,
-							src: ''
+							src: key
 						}
 						resolve(img)
 					},