uniapp 图片上传与下载更新

上传多张图片, 用files

<template>
	<view class="page">
		<view>
				<view class="cu-load load-modal" v-if="finsh == false">
						<view class="cuIcon-emojifill text-orange"></view>
						<view class="gray-text">加载中...</view>
				</view>
					<!-- 开始。。。。。。。。。。。。。。。。。 -->
			<!-- 		<view class="cu-bar bg-white ">
						<view class="action">
							 模板名字:{{templateInfo.name}}
						</view>
					</view> -->
			<!-- 		<view class="cu-bar bg-white ">
						<view class="action">
							 请填写相关内容:
						</view>
					</view> -->
					<!-- 主题模块 -->
					<view v-if="finsh">
						<form  v-if="look == false">
									<view class="ml margin-top" style="display: block;" v-for="(item, index) in templateInfo.eventsEntityList">
										<view class="title">{{(index + 1) + ":" + item.name}}</view>
										<view style="margin-top: 10rpx;" >
											<textarea  maxlength="-1"  placeholder="请输入" style="height: 100rpx;" v-model="inputText[index]"></textarea>
										</view>
										
									</view>
							
								</form>
								<form v-if="look == true">
									<view class="ml margin-top" style="display: block;" v-for="(item, index) in templateInfo.eventsEntityList">
										<view class="title">{{(index + 1) + ":" + item.name}}</view>
										<view style="margin-top: 10rpx;">
											<view class="title" style="margin-left: 38rpx;">{{inputText[index]}}</view>
										</view>
										
									</view>	
								</form>
								<form >
									<view class="cu-form-group ">
										<view class="title">上传资料图片(选填)</view>
										<button class="cu-btn bg-green shadow" data-target="Modal" @click="chooiceImages()">点击上传</button>
									</view>
									<text class="jiachu" style="font-weight: 400; color: #007AFF; margin-left: 30rpx;" v-for="(item, index) in tempFilePaths">{{item}}</text>
									<view class=" margin-top" style="margin-left: 30rpx;" v-if="tempFilePaths.length != 0">
										<view class="title">
											<text class="jiachu" style="font-weight: 400; color: #007AFF;" @click="preView">点击预览</text>
										</view>
									</view>
								</form>
								
						<!-- 		<view class="ml black">
									<view class="title">模板名字:</view>
								</view>
								<view class="ml ">
									<view class="title">{{name}}</view>
								</view>
								<view class="ml black">
									<view class="title">{{prompting}}</view>
								</view> -->
						<!-- 		<input style="display: block; margin-left: 30rpx; margin-top: 15rpx;" placeholder="请输入..." name="input"
									v-model="description"></input> -->
								<view v-if="look == false">
									<view class="ml liuc">
										<view class="title" style="font-weight: 800;">审批流程如下:</view>
									</view>
												
									<form>
										<view v-for="(item, index) in list" class="spnode">
											<view class="title" style="margin-left: 30rpx; font-weight: 600;">节点{{index + 1}} <text v-if="item.dynamic == 1"> (动态节点, 请选择审批人)</text> </view>
											<view v-if="item.dynamic == 1">
												<view class="ml2">
													<view class="title">节点标题:</view>
													<view>{{item.name}}</view>
												</view>
												<view class="ml2">
													<view class="title">选择学院:</view>
													<view class="sun-input-box">
														<view class="sun-input-box">
															<view class="uni-list-cell-db" @click="changeCollegeIndex(index)">
																<picker @change="bindPickerChange" :value="collegeIndexList[index]" :range="array">
																	<view class="uni-input">{{array[collegeIndexList[index]]}}</view>
																</picker>
															</view>
														</view>
													</view>
												</view>
												<view class="ml2">
													<view class="title">选择老师:</view>
													<view class="sun-input-box">
														<view class="sun-input-box">
															<view class="uni-list-cell-db" @click="changeCollegeIndex(index)">
																<picker @change="bindPickerChange2" :value="collegeIndexList[index]"
																	:range="teacherList[index]">
																	<view class="uni-input">{{teacherList[index][teacherListIndex[index]]}}</view>
																</picker>
															</view>
														</view>
													</view>
												</view>
												<view class="cu-bar  bg-white" style="width: 100%; margin-top: 20rpx;" >
													<view class="search-form round">
														<!-- <text class="cuIcon-search"></text> -->
														<input  v-model="searchText[index]"  type="text" placeholder="输入关键字筛选审批人" confirm-type="search" style="padding-left: 20rpx;"></input>
													</view>
													<view class="action" >
														<button class="cu-btn  shadow-blur round" style="background-color: rgb(17, 198, 69); color: #fff;" @click="searchSPR(index)">确定</button>
													</view>
												</view>
											</view>
											<view v-else>
												<view class="ml2">
													<view class="title">节点标题:</view>
													<view class="title">{{item.name}}</view>
												</view>
												<view class="ml2">
													<view class="title">审批人:</view>
													<view class="title">{{item.userName}}</view>
												</view>
											</view>
										</view>
									</form>
								</view>
						
							<view v-if="look == true">
								<view class="ml liuc">
									<view class="title" style="font-weight: 800;">审批流程如下:</view>
								</view>
										
							<form>
								<view v-for="(item, index) in list" style="margin-bottom: 60rpx;">
									<view class="title" style="margin-left: 30rpx; font-weight: 600;">节点{{index + 1}} <text v-if="item.dynamic == 1"> (动态节点, 请选择审批人)</text> </view>
									<view >
										<view class="ml2">
											<view class="title">节点标题:</view>
											<view class="title">{{item.name}}</view>
										</view>
										<view class="ml2">
											<view class="title">审批人:</view>
											<view class="title">{{teacherList[index][teacherListIndex[index]]}}</view>
										</view>
									</view>
								</view>
							</form>
						</view>
						
							<!-- 	<button class="cu-btn round" :class="['bg-' + 'cyan']" style="margin-top: 20rpx; margin-left: 20rpx;"
									@click="ctreateOA">增加节点</button>
								<button class="cu-btn round" :class="['bg-' + 'red']" style="margin-top: 20rpx; margin-left: 20rpx;"
									@click="deleteOA">删除节点</button> -->
								<button class="cu-btn round" :class="['bg-' + 'green']" style="width: 40%; margin-top: 40rpx; margin-left: 5%;"
										@click="havelook">{{bu == undefined ? '查看' : bu}}</button>
								<button class="cu-btn round" :class="['bg-' + 'blue']" style="width: 40%; margin-top: 40rpx; margin-left: 5%;"
									@click="submitOA01">提交审批</button>
					</view>
						
		</view>
	</view>
</template>

<script>
	import constant from "../../common/constant/constant.js"
	let baseUrl = constant.url;   
	export default {
		data() {
			return {
				kindex: 0,
				modalName: null,
				array: [], //所有的学院
				index: 0,
				appId: '', //用户的学院ID
				collegeIndexList: [0], //我们选择的学院ID下标存在这里
				currentIndex: 0, //当前操作的哪个节点
				appIdList: [], // 存的是学院的ID
				node: [], //代表节点的数量
				//下面是选择了学院后的, 学院里面人的列表

				teacherList: [], //老师列表
				teacherListIndex: [], // 每个节点选择的老师的index
				teacherIdList: [], //老师的id列表 二维数组,
				nodeNum: 0,
				nodeSum: 0,
				scope: '',
				template_name: '',
				template_info: '',
				nodeName: [],
				switchA: [],
				templateId: '',
				list: null,
				name: '',
				prompting: '',
				templateName: '',
				userNumber: '',
				description: '',
				appName: '',
				userName: '',
				templateInfo: null,
				searchText: [],
				inputText: [],
				look: false,
				bu: '查看',
				finsh: false,
				approveTemplateRequest: {},
				fileList:[],
				tempFilePaths: [],
				events: "",
				nodeEntityList: ""
			}
		},
		methods: {
			preView(){
				//console.log(res);
				uni.previewImage({
				    urls: this.tempFilePaths,
				    longPressActions: {
				        itemList: ['发送给朋友', '保存图片', '收藏'],
				        success: function(data) {
				            console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
				        },
				        fail: function(err) {
				            console.log(err.errMsg);
				        }
				    }
				});
			},
			chooiceImages(){  //选择图片
				uni.chooseImage({
					count: 9, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
					sourceType: ['album'], //从相册选择
				    success: (chooseImageRes) => {
				        const tempFilePaths = chooseImageRes.tempFilePaths;
						this.tempFilePaths = tempFilePaths;
						let fileList = [];
						for (var i = 0; i < tempFilePaths.length; i++) {
							fileList.push({
								name: 'file' + i,
								uri: tempFilePaths[i]
							})
						}
						console.log("-------------");
						console.log(fileList);
				        this.fileList = fileList;
				    }
				});
			},
			// sumitNotWithImges(){
			// 	this.api.createOneApprove(this.approveTemplateRequest).then(res => {
			// 		uni.showToast({
			// 			title: '申请成功,正在跳转',
			// 			duration: 1500
			// 		})
			// 		setTimeout(function() {
			// 			uni.switchTab({
			// 				url: '/pages/OAIndex/OAIndex'
			// 			});
			// 		}, 1000)
			// 	})
			// },
			submitImages(){ // 最后提交信息的代码********************************************************************************
			
			console.log(this.templateId);
				uni.uploadFile({
				    url: baseUrl + "/main/upload/uploadSPImg",
				    files: this.fileList,
					header: {
						"SUSE-TOKEN": uni.getStorageSync("token"),
						"USER-ID": uni.getStorageSync("userId")
					},
				    formData: {
						templateId: this.templateId,
						appId: this.appId,
						userNumber: this.userNumber,
						events: this.events,
						appName: this.appName,
						userName: this.userName,
						nodeEntityList: this.nodeEntityList 
				    },
				    success: (uploadFileRes) => {
				        console.log(uploadFileRes);
						uni.showToast({
							title: '申请成功,正在跳转',
							duration: 1500
						})
						setTimeout(function() {
							uni.switchTab({
								url: '/pages/OAIndex/OAIndex'
							});
						}, 1000)
				    }
				});
			},
			havelook(){
				this.look = ! this.look;
				if(this.look){
					this.bu = "编辑";
				}else{
					this.bu = "查看";
				}
			},
			SwitchA(index) {
				//this.switchA[index] = !this.switchA[index];
				this.$set(this.switchA, index, !this.switchA[index])
				console.log(this.switchA);
			},
			showModal(e) {
				this.modalName = e.currentTarget.dataset.target
			},
			hideModal(e) {
				this.modalName = null
			},
			addNode() {
				this.modalName = null
			},
			RegionChange(e) {
				this.region = e.detail.value
			},
			bindPickerChange: function(e) { //改变的事件名
				//console.log('picker发送选择改变,携带值为', e.target.value)   用于输出改变索引值
				this.index = e.target.value //将数组改变索引赋给定义的index变量
				//this.collegeIndexList[this.currentIndex] = e.target.value;
				this.$set(this.collegeIndexList, this.currentIndex, e.target.value)
				// console.log(this.currentIndex);
				// console.log(this.collegeIndexList[this.currentIndex]);
				// console.log(this.array[this.collegeIndexList[this.currentIndex]]);
				this.jg = this.array[this.index] //将array【改变索引】的值赋给定义的jg变量
				//console.log("学院为:",this.jg)		//输出获取的籍贯值,例如:中国
				//console.log(this.appId);
				this.setTeacher(this.appIdList[e.target.value])
			},
			bindPickerChange2: function(e) { //改变的事件名
				//console.log('picker发送选择改变,携带值为', e.target.value)   用于输出改变索引值
				this.index = e.target.value //将数组改变索引赋给定义的index变量
				//this.collegeIndexList[this.currentIndex] = e.target.value;
				this.$set(this.teacherListIndex, this.currentIndex, e.target.value)
				// console.log(this.currentIndex);
				console.log(this.teacherListIndex[this.currentIndex]);
				// console.log(this.array[this.collegeIndexList[this.currentIndex]]);
				this.jg = this.teacherList[this.currentIndex][this.index] //将array【改变索引】的值赋给定义的jg变量
				//console.log("学院为:",this.jg)		//输出获取的籍贯值,例如:中国
				this.teacherListIndex[this.currentIndex] = e.target.value;
				//console.log(this.appId);
			},
			changeCollegeIndex(index) {
				//console.log(index);
				this.currentIndex = index;
			},
			ctreateOA() {
				this.nodeSum += 1;
				this.collegeIndexList.push(0);
				this.addTeachers(this.appIdList[0]);
			},
			deleteOA() {
				this.nodeSum -= 1;
			},
			addTeachers(appid) {
				let t = [];
				let t2 = [];
				console.log(appid);
				this.api.listTeachersByAppId(appid).then(res => {
					this.finsh = true;
					this.api.checkRole(res);
					//console.log(res[1].data.data);
					for (let i = 0; i < res[1].data.data.length; i++) {
						t.push(res[1].data.data[i].username)
						t2.push(res[1].data.data[i].userid)
					}
					//console.log(t);
					//this.$set(this.teacherIdList, this.teacherIdList.length, t2);
					//this.$set(this.teacherList, this.teacherList.length, t);
					//this.$set(this.teacherListIndex, this.teacherListIndex.length, 0);

					for (var i = 0; i < 100; i++) {
						this.teacherList.push(t);
						this.teacherIdList.push(t2);
						this.teacherListIndex.push(0)
					}

					//console.log(this.teacherList);
				})
			},
			searchSPR(index){
				console.log(index);
				this.currentIndex = index;
				this.appIdList[index];
				console.log(this.appIdList[this.collegeIndexList[index]]);
				this.setTeacher(this.appIdList[this.collegeIndexList[index]], this.searchText[index], index);
			},
			// setTeacher(appid) {
			// 	let t = [];
			// 	let t2 = [];
			// 	console.log(appid);
			// 	this.api.listTeachersByAppId(appid).then(res => {
			// 		//console.log(res[1].data.data);
			// 		for (let i = 0; i < res[1].data.data.length; i++) {
			// 			t.push(res[1].data.data[i].username)
			// 			t2.push(res[1].data.data[i].userid)
			// 		}
			// 		//console.log(t);
			// 		this.$set(this.teacherIdList, this.currentIndex, t2);
			// 		this.$set(this.teacherList, this.currentIndex, t);
			// 		this.$set(this.teacherListIndex, this.currentIndex, 0);
			// 		// this.teacherIdList.push(t2);
			// 		// this.teacherList.push(t);
			// 		//console.log(this.teacherList);
			// 	})
			// },
			setTeacher(appid, searchkey, index) {
				let t = [];
				let t2 = [];
				console.log(appid);
				this.api.listTeachersByAppId(appid, searchkey).then(res => {
					this.finsh = true;
					this.api.checkRole(res);
					console.log(res[1].data.data);
					for (let i = 0; i < res[1].data.data.length; i++) {
						t.push(res[1].data.data[i].username)
						t2.push(res[1].data.data[i].userid)
					}
					//console.log(t);
					if(index == undefined){
						index = this.currentIndex;
					}
					this.$set(this.teacherIdList, index, t2);
					this.$set(this.teacherList, index, t);
					this.$set(this.teacherListIndex, index, 0);
					// this.teacherIdList.push(t2);
					// this.teacherList.push(t);
					//console.log(this.teacherList);
				})
			},
			submitOA01(){
				for(let i = 0; i < this.templateInfo.eventsEntityList.length; i++){
				//	this.inputText.push("a")
					if(this.inputText[i] == "" || this.inputText[i] == undefined){
						uni.showToast({
							title: "资料未填写完成",
							image: '/static/imgs/noRole.png',
							duration: 3000
						})
						return;
					}
				}
				let that = this;
				uni.showModal({
					title: '提示',
					content: '确定提交吗?',
					success: function(res) {
						if (res.confirm) {
							that.submitOA();
						} else if (res.cancel) {
							// console.log('用户点击取消');
						}
					}
				});
			},
			submitOA() {
				let approveTemplateRequest = {
					templateId: this.templateId,
					appId: this.appId,
					userNumber: this.userNumber,
					events: "",
					appName: this.appName,
					userName: this.userName,
					approveNodeEntityList: [

					]
				};
				/*
				  **************拼接JSON字符串 提交的信息********************************************************
				*/
			   let s = "[";
				for(let i = 0; i < this.templateInfo.eventsEntityList.length; i++){
					s += "{";
					s += '"name":"' + this.templateInfo.eventsEntityList[i].name + '",'
					s += '"ans":"' +  this.inputText[i] + '",'
					s += '"eventId":"' + this.templateInfo.eventsEntityList[i].eventId + '"'
					s += "}"
					if(i != this.templateInfo.eventsEntityList.length - 1){
						s += ",";
					}
				}
				s += "]"
				this.events = s;
				approveTemplateRequest.events = s;
				/*
				*********************************************这里是模板节点信息 ********************************************************
				*/
			   s = "[";
				for (let i = 0; i < this.list.length; i++) {
					let item = this.list[i];
					if (item.dynamic == 1) {
						let t = {};
						s += "{";
						s += '"name":"' + this.teacherList[i][this.teacherListIndex[i]] + '",'
						s += '"userAppId":"' +  this.appIdList[this.collegeIndexList[i]] + '",'
						s += '"userNumber":"' + this.teacherIdList[i][this.teacherListIndex[i]] + '"'
						s += "}"
						if(i != this.list.length - 1){
							s += ",";
						}
						t.name = this.teacherList[i][this.teacherListIndex[i]];
						t.userAppId = this.appIdList[this.collegeIndexList[i]];
						t.userNumber = this.teacherIdList[i][this.teacherListIndex[i]];
						approveTemplateRequest.approveNodeEntityList.push(t);
					}

				}
				s += "]"
				this.nodeEntityList = s;
				console.log(approveTemplateRequest);
				this.approveTemplateRequest = approveTemplateRequest;
				console.log("AAAAAAAAAAAAAAAA");
				this.submitImages();// ******************************************调用最后提交代码方法***************************************
				// this.api.createOneApprove(approveTemplateRequest).then(res => {
				// 	uni.showToast({
				// 		title: '申请成功,正在跳转',
				// 		duration: 1500
				// 	})
				// 	setTimeout(function() {
				// 		uni.switchTab({
				// 			url: '/pages/OAIndex/OAIndex'
				// 		});
				// 	}, 1000)
				// })
			}

		},
		created() {
			this.api.getCollege().then(res => {
				this.finsh = true;
				this.api.checkRole(res);
				for (let i = 0; i < res[1].data.data.length; i++) {
					this.$set(this.array, i, res[1].data.data[i].appname);
					this.array.push(res[1].data.data[i].appname)
					this.appIdList.push(res[1].data.data[i].appid)
				}
				this.college = res[1].data.data;
				this.appId = res[1].data.data[0].appid;
				this.addTeachers(this.appId);
			})
			
			
		},
		onLoad: function(option) { //option为object类型,会序列化上个页面传递的参数
			this.templateId = option.id;
			this.name = option.name;
			this.prompting = option.prompting;
			this.scope = option.scope;
			uni.setNavigationBarTitle({
				title: option.name
			});
			// this.api.findNodesByTemplateId(this.templateId).then(res => {
			// 	this.list = res[1].data.data;
			// 	//console.log(this.list);
			// })
			this.api.findTemplateByTemplateId(this.templateId).then(res=>{
				this.finsh = true;
				this.api.checkRole(res);
				this.list = res[1].data.data.approveNodeVOList;
				this.templateInfo = res[1].data.data;
				console.log(this.templateInfo);
				//console.log(this.templateInfo);
				// for(let i = 0; i < this.templateInfo.eventsEntityList.length; i++){
				// 	this.inputText[i] = "是是是";
				// }
			})
			for (let i = 0; i < 100; i++) {
				this.collegeIndexList[i] = 0;
				this.teacherListIndex[i] = 0;
			};
			let that = this;
			uni.getStorage({
				key: "userInfo",
				success: function(res) {
					//console.log(res.data);
					that.appName = res.data.appName;
					that.appId = res.data.appid;
					that.userNumber = res.data.userid;
					that.userName = res.data.username;
				}
			});
			
		},
	}
</script>

<style scoped>
	.page{
		background-color: #ffff;
		margin-top: -30rpx;
		padding-top: 30rpx;
		height: 100%;
		background-color: #ffffff;
	}

	.ml {
		background-color: #ffffff;
		padding: 1upx 30upx;
		display: flex;
		align-items: center;
		min-height: 100upx;
		justify-content: space-between;
		border-top: 1px solid #f1f1f1;
		padding-top: 30rpx;
	}
	.spnode{
		margin-bottom: 60rpx;
		border-top: 1px solid #f1f1f1;
		padding-top: 30rpx;
	}
	.black {
		font-weight: 600;
		margin-top: 30rpx;
	}
	.liuc{
		font-size: 30rpx;
		margin-top: 30rpx;
		margin-bottom: 10rpx;
	}
	.ml2{
		padding: 1upx 30upx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 30rpx;
		font-size: 30rpx;
	}
	.jiachu {
		font-weight: 600;
	}
</style>

上传单张图片 用路径

<template>
	<view class="user">
		<!-- 头部 -->
		<view class="user-wrap" >
			<view class="setting iconfont icon31shezhi"></view>
			<view class="info">
				
				<image class="avatar" mode="aspectFill" :src="myUserInfo.headImgUrl == null || myUserInfo.headImgUrl == ''  ? defaultHeadUrl:baseImgUrl + myUserInfo.headImgUrl " @click="chageHeadImg"></image>
				<view class="nickname">{{ myUserInfo.username }}</view>
			</view>
		</view>

		<!-- 订单状态 -->
		<view class="order-status">
			<view class="status-wrap">
				<!-- 单元格 -->
				<!-- <view class="cell">
					<view class="cell-left">
						<image class="cell-icon" src="/static/images/user/icon-order.png" mode="aspectFill"></image>
						<view class="cell-text">全部订单</view>
					</view>
					<view class="iconfont iconmore1"></view>
				</view> -->

				<!-- 订单状态 -->
				<!-- <view class="status-list">
					<view class="status-item" hover-class="btn-hover" v-for="(item, index) in orderStatusList" :key="index">
						<view class="item-icon" :class="item.icon"></view>
						<view class="item-text">{{ item.name }}</view>
					</view>
				</view> -->
			</view>
		</view>

		<!-- 滑动导航 -->
		<!-- <view style="border-radius: 20rpx; overflow: hidden; margin: 0 20rpx;">
			<com-nav :list="list" :col="4"></com-nav>
		</view> -->

		<!-- 用户功能 -->
		<view class="com-item" style="margin-top: 80rpx;">
			<view class="com-wrap">
				<view class="cell" v-for="(item, index) in userList" :key="index"
					@click="serverListClick2(item)"
					v-if="userInfo.jurisdictionLevel >= item.level">
					<view class="cell-left">
						<image class="cell-icon" :src="item.icon" mode="aspectFill"></image>
						<view class="cell-text">{{ item.title }}</view>
					</view>
					<view class="iconfont iconmore1 tishinum" v-if="item.num > 0">{{item.num}}</view>
				</view>
			</view>
		</view>

		<!-- 用户服务 -->
		<view class="com-item">
			<view class="com-wrap">
				<view class="cell" v-for="(item, index) in serverList" :key="index"
					@click="serverListClick(item)">
					<view class="cell-left">
						<image class="cell-icon" :src="item.icon" mode="aspectFill"></image>
						<view class="cell-text">{{ item.title }}</view>
					</view>
					<view class="iconfont iconmore1"></view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import comNav from './components/com-nav.vue'
	import constant from "../../common/constant/constant.js"
	let baseUrl = constant.url;   
	let baseImgUrl = constant.baseImgUrl;
	export default {
		components: {
			comNav
		},
		data() {
			return {
				myRole: 'student',
				roleCode: '',
				userInfo: {
					headPicUrl: '/static/images/user/avatar.jpg',
					nickName: '史蒂芬.林'
				},
				orderStatusList: [{
						name: '待付款',
						icon: 'iconfont icon31daifukuan',
						status: 10
					},
					{
						name: '待发货',
						icon: 'iconfont icon31daifahuo',
						status: 30
					},
					{
						name: '待收货',
						icon: 'iconfont icon31daishouhuo',
						status: 40
					},
					{
						name: '待评价',
						icon: 'iconfont icon31daipingjia',
						status: 50
					},
					{
						name: '已完成',
						icon: 'iconfont icon31yiguanzhudianpu',
						status: 55
					}
				],
				currentIndex: 0,
				list: [{
						icon: '/static/images/user/class-01.png',
						text: '我的电子券'
					},
					{
						icon: '/static/images/user/class-02.png',
						text: '退换/售后'
					},
					{
						icon: '/static/images/user/class-03.png',
						text: '我的积分'
					},
					{
						icon: '/static/images/user/class-04.png',
						text: '送礼提醒'
					}
				],
				userList: [
					{
						title: '管理台',
						icon: '/static/images/user/icon-kefu.png',
						path: 'browse-list',
						level: 4,
						url: '/pages/user/secondpage/admin/admin'
					},
					{
						title: '扩展功能',
						icon: '/static/images/user/icon-collect.png',
						path: 'collect-list',
						level: 0,
						//url: '/pages/user/secondpage/released',
						url: '/pages/user/secondpage/extern/extern'
					},
					// {
					// 	title: '新闻统计',
					// 	icon: '/static/images/user/class-04.png',
					// 	path: 'browse-list',
					// 	level: 0,
					// 	url: '/pages/statistics/index'
					// },
					{
						title: '我的审批',
						icon: '/static/images/user/class-02.png',
						path: 'browse-list',
						level: 0,
						url: '/pages/OAIndex/myOAList/myOAList'
					},
					{
						title: '待我审批',
						icon: '/static/images/user/class-04.png',
						path: 'browse-list',
						num: 0,
						level: 1,
						url: '/pages/OAIndex/needOA/needOA'
					},

				],
				serverList: [{
						title: '帮助中心',
						icon: '/static/images/user/icon-help.png',
						path: 'help',
						all:true,
						url: '/pages/user/secondpage/help'
					},
					{
						title: '版本',
						icon: '/static/images/user/icon-order.png',
						path: 'kefu',
						all:true,
						url: '/pages/user/secondpage/version'
					},
					{
						title: '退出登录',
						icon: '/static/images/user/icon-about.png',
						text: '1.0.0',
						all:true,
						url: 'logout'
					}
				],
				myUserInfo: '',
				defaultHeadUrl:'../../static/imgs/suse_logo.jpg',
				baseImgUrl: baseImgUrl
			};
		},
		methods: {
			changeImgUrl(){
				this.api.getUserInfo(this.myUserInfo.userid).then(res=>{
					this.api.checkRole(res);
					this.myUserInfo.headImgUrl = res[1].data.data.headImgUrl;
					uni.setStorage({
					    key: 'userInfo',
					    data: this.myUserInfo,
					});
					console.log(this.myUserInfo.headImgUrl);
				})
			},
			chageHeadImg(){
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
					// sourceType: ['album'],//从相册选择
				    success: (chooseImageRes) => {
				        const tempFilePaths = chooseImageRes.tempFilePaths;
				        uni.uploadFile({
				            url: baseUrl + "/main/upload/uploadHeadImg", //仅为示例,非真实的接口地址
				            filePath: tempFilePaths[0],
				            name: 'file',
							header: {
								"SUSE-TOKEN": uni.getStorageSync("token"),
								"USER-ID": uni.getStorageSync("userId")
							},
				            formData: {
				                'userId': this.myUserInfo.userid
				            },
				            success: (uploadFileRes) => {
				                console.log(uploadFileRes.data);
								this.changeImgUrl();
				            }
				        });
				    }
				});
			},
			// 下拉刷新
			onPullDownRefresh() {
				let _self = this
				console.log('refresh');
				this.listNeedMeToApprove();
				setTimeout(function() {
					uni.stopPullDownRefresh();//停止当前页面下拉刷新
				}, 1000);
			},
			serverListClick(item, index) {
				if(item.url == 'logout'){
					uni.showModal({
						title: '提示',
						content: '确定要退出吗?',
						success: function(res) {
							if (res.confirm) {
								console.log("aa");
								uni.clearStorageSync();
								uni.redirectTo({
									url: "/pages/login/login"
								})
							} else if (res.cancel) {
								// console.log('用户点击取消');
							}
						}
					});
				}else {
					let myUrl = item.url;
					uni.navigateTo({
						url: myUrl
					})
				}
			},
			serverListClick2(item, index) {
				let myUrl = item.url;
				const value = uni.getStorageSync('userInfo');
				uni.navigateTo({
					url: myUrl
				})

			},
			listNeedMeToApprove(){
				// console.log("------------------");
				this.api.listNeedMeToApprove(this.myUserInfo.appid, this.myUserInfo.userid).then(res=>{
					this.api.checkRole(res);
					// console.log(res);
					// console.log(this.userList[5]);
					this.userList[3].num = res[1].data.data.length;
					console.log(res[1].data.data,);
					uni.setStorage({
					    key: 'myReading',
					    data: res[1].data.data,
					});
				})
			}
		},
		created() {
			let that = this;
			uni.getStorage({
				key: "userInfo",
				success: function(res) {
					console.log(res.data);
					that.myUserInfo = res.data;
					console.log(that.myUserInfo);
					that.myRole = res.data.role;
					that.userInfo = res.data;
					that.listNeedMeToApprove();
				}
			})

		}
	};
</script>

<style lang="scss" scoped>
	.tishinum {
		width: 60rpx !important;
		height: 40rpx !important;
		line-height: 40rpx !important;
		background-color:red;
		color: #fff !important;
		border-radius: 10px !important;
		font-size: 15rpx !important;
		text-align: center !important;
	}

	page {
		background: #f2f2f2;
	}

	.btn-hover {
		background: #f2f2f2 !important;
	}

	.user {
		.user-wrap {
			display: flex;
			justify-content: center;
			align-items: center;
			height: 50vw;
			padding: 30rpx;
			z-index: 9;
			border-radius: 0 0 20% 20%;
			background-image: url('~@/static/extern/2024.png');
			background-size: cover;

			.setting {
				color: #fff;
				position: absolute;
				top: 60rpx;
				left: 60rpx;
				font-size: 50rpx;
			}

			.info {
				position: absolute;
				text-align: center;

				.avatar {
					width: 150rpx;
					height: 150rpx;
					border-radius: 50%;
				}

				.nickname {
					color: #fff;
					font-size: 28rpx;
				}
			}
		}

		.order-status {
			padding: 0 20rpx;
			margin-top: -10vw;

			.status-wrap {
				border-radius: 25rpx;
				overflow: hidden;

				.status-list {
					display: flex;
					justify-content: space-evenly;
					align-items: center;
					background: #fff;
					padding-top: 30rpx;
					padding-bottom: 30rpx;

					.status-item {
						flex: 1;
						display: flex;
						flex-direction: column;
						justify-content: center;
						align-items: center;

						.item-icon {
							line-height: 1;
							font-size: 65rpx;
							color: #bbb;
						}

						.item-text {
							font-size: 28rpx;
							color: #666;
							margin-top: 5rpx;
						}
					}
				}
			}
		}

		.com-item {
			padding-left: 20rpx;
			padding-right: 20rpx;
			margin-top: 20rpx;

			.com-wrap {
				border-radius: 25rpx;
				overflow: hidden;
			}
		}

		.cell {
			height: 80rpx;
			padding-left: 20rpx;
			padding-right: 20rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			background: #fff;
			border-bottom: 1px solid #f8f8f8;

			&:active {
				background: #f2f2f2;
			}

			&:last-child {
				border-bottom: none !important;
			}

			.cell-left {
				display: flex;
				align-items: center;

				.cell-icon {
					width: 50rpx;
					height: 50rpx;
				}

				.cell-text {
					color: #666;
					font-size: 28rpx;
					margin-left: 20rpx;
				}
			}

			.iconfont {
				font-size: 40rpx;
				color: #999;
			}
		}
	}
</style>

更新APP

<template>
	<view style="width: 100%; height: 100%;">
		<view class="cu-load load-modal" v-if="finsh == false ">
			<view class="cuIcon-emojifill text-orange"></view>

			<view class="gray-text">{{showText}}</view>
		</view>
		<view class="top">
			<text>当前版本:{{vsersionCode}}</text>
			<text class="startUpdate" @click="updateVersion">检测更新</text>
		</view>

		<!-- 進度展示 -->
		<view class="steps" style="margin-top: 50rpx;">
			<view class="step" v-for="(item, i) in list" :key="i">

				<!-- 左侧 -->
				<view class="step_left">{{item.createTime}}</view>
				<!-- 					<view class="reading" v-if="item.currentNode == 1">审批中</view> -->
				<!-- 中部 -->
				<view class="step_mid">
					<view class="step_dot" :style="colorList2[1]">{{ stepType === 'number' ? i + 1 : '' }}</view>
					<template v-if="i < list.length - 1">
						<view class="step_line" :style="colorList[1]"></view>
					</template>
				</view>
				<!-- 右侧 -->
				<view class="step_right">
					<view class="step_name">版本:{{ item.versionCode }}</view>
					<view class="step_idea">更新内容:{{ item.message}}</view>
					<!-- 	<view class="step_idea" v-if="item.idea == 2">未通过</view> -->
					<!-- <view class="step_idea" v-if="(item.idea == 1 || item.idea == 2) && item.description != ''">审批意见:{{item.description}}</view> -->
				</view>

			</view>
		</view>
	</view>
</template>

<script>
	import constant from "../../../common/constant/constant.js"
	let vsersionCode = constant.versionCode;
	export default {

		props: {
			// 步骤条格式 数字或者为点
			stepType: {
				type: String,
				default: 'dot'
			},
			// 激活颜色
			activeColor: {
				type: String,
				default: '#00ff7f'
			},
			refuseColor: {
				type: String,
				default: '#ff0000'
			},
		},
		data() {
			return {
				kk: 'background-color: #007AFF;',
				colorList: ['', 'background-color: #00de6b;', ''],
				colorList2: ['', 'background-color: #00de6b;', 'background-color: #ff0000;'],
				list: [{
						currentNode: 1,
						time: 'ss',
						idea: 1,
						versionCode: "sss",
						message: "ss",
					},
					{
						currentNode: 1,
						time: 'ss',
						idea: 1,
						versionCode: "sss",
						message: "ss",
					},
					{
						currentNode: 1,
						time: 'ss',
						idea: 1,
						versionCode: "sss",
						message: "ss",
					},
					{
						currentNode: 1,
						time: 'ss',
						idea: 1,
						versionCode: "sss",
						message: "ss",
					}
				],
				vsersionCode: vsersionCode,
				finsh: true,
				showText: '正在下载安装包...'
			};
		},
		created() {
			this.getList();
		},
		methods: {
			upload(url) {
				let that = this;
				uni.showModal({
					title: '更新提示',
					content: '当前存在高级版本,确定下载更新安装包吗?',
					confirmText: '下载更新',
					success: function(res) {
						if (res.confirm) {
							that.finsh = false;
							that.showText = '正在下载安装包...';
							var dtask = plus.downloader.createDownload(url, {}, function(d, status) {
								that.finsh = true;
								// 下载完成  
								if (status == 200) {
									plus.runtime.install(plus.io.convertLocalFileSystemURL(d
										.filename), {}, {}, function(error) {
										uni.showToast({
											title: '安装成功',
											duration: 1500
										});
									})
								} else {
									uni.showToast({
										title: '更新失败',
										duration: 1500
									});
								}
							});
							dtask.start()
						};
					}
				})
			},
			updateVersion() {
				this.finsh = false;
				this.api.getNewestVersion().then(res => {
					console.log(res[1].data.data.versionCode);
					if (res[1].data.data.versionCode == this.vsersionCode) {
						uni.showToast({
							title: '这已是最新版本',
							duration: 1500
						})
					} else {
						this.upload(res[1].data.data.uploadUrl);
					}
				})
				this.finsh = true;

			},
			getList() {
				this.list = [];
				this.api.listAppVersionRecord().then(res => {
					console.log(res);
					for (var i = res[1].data.data.length - 1; i >= 0; i--) {
						this.list.push(res[1].data.data[i]);
					}
					//this.list = res[1].data.data
				})
			},
			getNewest() {

			}
		}
	};
</script>

<style lang="scss" scoped>
	.steps {
		.reading {
			position: absolute;
			left: 50rpx;
			color: #55aa00;
			font-weight: 600;
		}

		.step {
			display: flex;

			.step_left {
				width: 140rpx;
				margin-top: -14rpx;
				font-size: 26rpx;
				line-height: 36rpx;
				text-align: right;
			}

			.step_mid {
				width: 40rpx;
				display: flex;
				flex-wrap: wrap;
				justify-content: center;
				margin: 0 25rpx;

				.step_dot {
					width: 40rpx;
					height: 40rpx;
					background: #fafafa;
					border: 5rpx solid #f5f5f5;
					border-radius: 50%;
					color: #ffffff;
					font-size: 28rpx;
					text-align: center;
					line-height: 40rpx;

				}

				.active_dot {
					background: #00ff7f;
					border: 5rpx solid #e3ebff;
				}

				.step_line {
					width: 4rpx;
					height: 160rpx;
					background-color: #eeeeee;
				}

				.active_line {
					background: #00ff00;
				}
			}

			.step_right {
				width: 430rpx;
				height: fit-content;
				padding: 25rpx 30rpx;
				margin-top: -14rpx;
				background-color: #fcfcfc;
				border-radius: 10rpx;
				display: flex;
				flex-wrap: wrap;
				align-content: center;

				view {
					width: 100%;
				}

				.step_name {
					font-size: 30rpx;
					margin-bottom: 10rpx;
				}

				.step_idea {
					color: #999999;
					font-size: 26rpx;
					line-height: 40rpx;
				}
			}
		}
	}

	.top {
		margin-top: 50rpx;
		margin-left: 50rpx;
	}

	.startUpdate {
		float: right;
		margin-right: 50rpx;
		color: #007AFF;
	}
</style>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值