附件功能优化

pages/dangerous/dangerous.vue

@@ -325,23 +325,24 @@
 			<view class="uni-list">
 				<view class="align-items" style="margin-bottom: 20px;">
 					<view class="container" style="color: gainsboro;">*请上传文件</view>
-					<view>
-						<!-- style="display: flex; flex-wrap: wrap;margin-top: 10px; margin-left: 10px;" -->
+					<view style="display: flex; flex-wrap: wrap;margin-top: 10px; margin-left: 10px;">
+						<!--  -->
 						<image src="/static/images/chooseimg.png" mode=""
 							style="width: 100rpx; height: 100rpx; margin: 0 12rpx;; " @click="chooseFile()"></image>
 						<view v-for="(item,index) in fileArr" :key="index" style="position: relative;">
 							<view style="width: 100rpx; height: 100rpx; margin: 0 12rpx;">
-								{{item.fileName}}
 								<image
 									v-if="item.picUrl.substring(item.picUrl.length - 3) == 'png' || item.picUrl.substring(item.picUrl.length - 3) == 'jpg' || item.picUrl.substring(item.picUrl.length - 4) == 'jpeg' "
-									:src="item.picUrl" @click="this.showPhoto(index,fileArr)" style="width: 100rpx; height: 100rpx; margin: 0 12rpx;">
-								</image>
-								<video v-else-if="item.picUrl.substring(item.picUrl.length - 3) == 'mp4'" :src="item.picUrl"
-									style="width: 100rpx; height: 100rpx; margin: 0 12rpx;">
-								</video>
-								<image v-else :src="item.picUrl"
+									:src="item.picUrl" @click="this.showPhoto(imgList.indexOf(item.picUrl),imgList)"
 									style="width: 100rpx; height: 100rpx; margin: 0 12rpx;">
 								</image>
+								<video v-else-if="item.picUrl.substring(item.picUrl.length - 3) == 'mp4'"
+									:src="item.picUrl" style="width: 100rpx; height: 100rpx; margin: 0 12rpx;">
+								</video>
+								<text v-else style="width: 100rpx; height: 100rpx; margin: 0 12rpx;"
+									@click="chooseModel(item.picUrl,item.fileName)">
+									{{item.fileName}}
+								</text>
 							</view>
 							<view v-if="isShowRemoveFile(item)" @click="removeFile(index)"
 								style="position: absolute; top: 0; right: 14rpx; border-radius: 50%;">
@@ -363,6 +364,10 @@
 			<yt-dateTimePicker ref="myPicker" @submit="handleSubmit" :start-year="2024" :end-year="2099"
 				:time-hide="[true, true, true, true, true, true]" :time-label="['年', '月', '日', '时', '分', '秒']" />
 
+			<!-- 下载提示页面 -->
+			<mypopup :show="show_loding" :popupText="popupText" :titleText="titleText" :cancelText="cancelText"
+				:confirmText="confirmText" @close="cancel_loding" @confirm="confirm_loding">
+			</mypopup>
 		</view>
 	</view>
 </template>
@@ -398,6 +403,15 @@
 				currentTime: "",
 				fileArr: [],
 				projectTime: "",
+				imgList: [],
+
+				popupText: '', //对话框内容
+				titleText: '',
+				cancelText: '',
+				confirmText: '',
+				show_loding: false,
+				fileUrl: '', //点击的文件地址
+				fileName: '', //点击的文件名称
 			}
 		},
 		created() {
@@ -407,8 +421,86 @@
 			isEmpty(str) {
 				return (!str || 0 === str.length);
 			},
+			chooseModel(url, name) {
+				this.cancelText = '复制';
+				this.confirmText = "下载";
+				this.titleText = "温馨提示"
+				this.popupText = "下载或者复制链接";
+				this.show_loding = true;
+				this.fileName = name;
+				this.fileUrl = url; //文件名称和下载地址赋值
+			},
+			//取消按钮
+			cancel_loding() {
+				let _this = this;
+				_this.show_loding = false;
+				console.log("复制")
+				if (!_this.isEmpty(_this.fileUrl)) {
+					console.log(_this.fileUrl)
+					console.log(_this.fileName)
+					uni.setClipboardData({
+						data: _this.fileUrl,
+						success() {
+							uni.showToast({
+								title: '已复制' + _this.fileName + '地址成功 请在浏览器打开',
+								icon: 'none'
+							});
+						},
+						fail(e) {
+							console.log("失败", e)
+							uni.showToast({
+								title: '复制失败',
+								icon: 'none'
+							});
+						}
+					});
+
+				}
+			},
+			//确定按钮
+			confirm_loding() {
+				this.show_loding = false;
+				this.download(this.fileUrl, this.fileName);
+			},
+			getDownLoadFilePath() {
+				let cachePath = `${uni.env.USER_DATA_PATH}/downloads`
+				let fm = uni.getFileSystemManager()
+				try {
+					// 访问成功则存在
+					fm.accessSync(cachePath)
+				} catch (error) {
+					// 不存在则新建
+					fm.mkdirSync(cachePath, true)
+				}
+				return cachePath
+			},
+			download(url, name) {
+				let savePath = this.getDownLoadFilePath();
+				console.log('点击下载', url);
+				console.log('点击下载333', savePath);
+				//var savePath = uni.env.USER_DATA_PATH + '/savePath'
+				uni.downloadFile({
+					url: url,
+					success: response => {
+						if (response.statusCode === 200) {
+							uni.getFileSystemManager().saveFile({
+								tempFilePath: response.tempFilePath,
+								filePath: `${savePath}/${name}`,
+								success: (resData) => {
+									console.log('保存路径', resData.savedFilePath)
+									uni.showToast({
+										title: '下载成功'
+									})
+								},
+								fail: error => {
+									console.log('error: ', error)
+								}
+							})
+						}
+					}
+				})
+			},
 			showPhoto(index, list) {
-				console.log("index:"+index+"_list:"+list)
 				uni.previewImage({
 					current: index,
 					urls: list,
@@ -459,6 +551,16 @@
 					}
 
 					this.fileArr = this.projectObj.pics;
+
+					for (let i = 0; i < this.fileArr.length; i++) {
+						if (this.fileArr[i].picUrl.substring(this.fileArr[i].picUrl.length - 3) == 'png' || this
+							.fileArr[i].picUrl.substring(this.fileArr[i].picUrl.length - 3) == 'jpg' ||
+							this.fileArr[i].picUrl.substring(this.fileArr[i].picUrl.length - 4) ==
+							'jpeg') {
+							this.imgList.push(this.fileArr[i].picUrl);
+						}
+
+					}
 				})
 			},
 			switchChangePipe(e) {
@@ -508,11 +610,15 @@
 										_this.$modal.msg(data.msg)
 									} else {
 										if (_this.progress === 100) {
-											console.log('_this.progress', _this.progress)
+											console.log(
+												'_this.progress',
+												_this.progress)
 											console.log('res--', res)
 											_this.fileArr.push({
-												'fileName': item.name,
-												'picUrl': data.data.url,
+												'fileName': item
+													.name,
+												'picUrl': data
+													.data.url,
 											})
 											_this.$modal.msg('上传成功！')
 										}
@@ -532,16 +638,19 @@
 							task.onProgressUpdate(res => {
 								_this.progress = res.progress;
 								console.log('onProgressUpdate', res)
-								console.log('task.onProgressUpdate', _this.progress)
+								console.log('task.onProgressUpdate', _this
+									.progress)
 								uni.showLoading({
 									title: '上传中'
 								})
 								if (_this.progress != 100) {
 									_this.loading = false
-									console.log('_this.loading false', _this.loading)
+									console.log('_this.loading false',
+										_this.loading)
 								} else {
 									_this.loading = true
-									console.log('_this.loading true', _this.loading)
+									console.log('_this.loading true', _this
+										.loading)
 								}
 							});
 
@@ -552,7 +661,8 @@
 			},
 			isShowRemoveFile(item) {
 				var isShow = item.createBy == this.$user.state.name;
-				console.log("isShow:" + isShow + "_name:" + this.$user.state.name + "_createBy:" + item.createBy)
+				console.log("isShow:" + isShow + "_name:" + this.$user.state.name + "_createBy:" +
+					item.createBy)
 				return isShow;
 			},
 			removeFile(index) {
@@ -694,11 +804,14 @@
 
 				updateDangerousWorkProject(this.projectObj).then(res => {
 					this.$modal.msg(res.msg);
-					uni.navigateBack();
+					setTimeout(() => {
+						uni.navigateBack();
+					},1000);
 				})
 			},
 			handleSubmit(e) {
-				this.projectTime = `${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}:${e.second}`;
+				this.projectTime =
+					`${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}:${e.second}`;
 				this.projectObj.enginTime = this.projectTime;
 			},
 			// 打开picker
@@ -722,7 +835,8 @@
 				let h = time.getHours();
 				let mm = time.getMinutes();
 				let s = time.getSeconds();
-				return y + '-' + this.addTimes(m) + '-' + this.addTimes(d) + ' ' + this.addTimes(h) + ':' + this.addTimes(
+				return y + '-' + this.addTimes(m) + '-' + this.addTimes(d) + ' ' + this.addTimes(
+					h) + ':' + this.addTimes(
 					mm) + ':' + this.addTimes(s);
 			},
 		}

plugins/index.js

@@ -14,7 +14,7 @@ export default {
 		Vue.prototype.$modal = modal
 		//校验
 		Vue.prototype.$validation = validation
+		//用户信息
 		Vue.prototype.$user = user
-		console.log(111)
 	}
 }