wycore/wyUniapp/pages/inspection/Detail.vue

<template>
	<view >
	<uni-nav-bar  fixed="true"  height="80px" dark color="#ffffff" backgroundColor="#1989fa" shadow left-icon="back"
			title="巡检详情" @clickLeft="GoBack()"/>
	 <view class="uni-flex uni-column" style="display:flex;flex-direction:row;background-color: #1989fa;color:#fff;height: 100px;">
	     <view class="flex-item flex-item-V" style="padding-left:15px;;">
			 <view style="margin:20px 10px 10px 0;font-size:18px;font-weight:bold;">{{this.pointInfo.routename}}</view>
			 <uni-icons type="person" size="18" color="#fff" style="margin-right:10px"></uni-icons>
			 <text style="font-size:16px;">{{this.$store.state.data.userName}}</text>
		 </view>
	    <view class="flex-item flex-item-V" style="margin-left:30px;">
			 <view style="margin-top:20px;font-size:16px;">{{this.pointInfo.pointname}}</view>
			 <view style="margin-top:13px;font-size:16px;">{{this.pointInfo.realtime}}</view>			 
		 </view>	    
	 </view>	
	  <view style="margin:10px 10px;">
		  <uni-forms-item  label="备注说明" >
		   	 <uni-easyinput  type="textarea" v-model="remarkStr" placeholder="请输入备注" />
		   </uni-forms-item>	
		  <uni-file-picker :value="filePathsList" :auto-upload="false" file-mediatype="image" mode="grid" title="上传图片"
		   			file-extname="png,jpg" :limit="3" @select="handleSelect" @delete="handleDelete"/>
	    <button @click="SavePointData()" style="width:100%;height:40px;line-height:40px;border-radius:3px;background-color:#1989fa;color:#fff;border:#1989fa;margin-top:15px">确定</button>
	  
	  </view> 
	
	</view>
</template>

<script>	
   //在使用的文件引入 pathToBase64(将图片转为base64) base64ToPath(将base64转为图片)
	import { pathToBase64, base64ToPath } from 'image-tools'
	export default {
		data() {
			return {		
					pkcode:'',
					remarkStr:'',				
					imageValue: [],
					filePathsList:[],
					pointInfo:{},
				}
		},
	    created(){
			this.pkcode =decodeURIComponent(this.getUrlParam('pkcode'))
			this.getDetail()
		},
		
		methods:{			
			   async handleSelect(res) { // 上传图片			   			    
				var filedata= res.tempFiles[0]				
				var file={}
				file.name =filedata.name
				file.type = filedata.fileType
				file.size = filedata.size
				file.url = filedata.url
			    await pathToBase64(filedata.url).then(base64=>{
										this.base64Data = base64
										file.content = base64
					 			})				
				
				this.imageValue.push(file)
			     
			   },			   
				handleDelete(err) { // 删除图片
				    var that=this;				   						
					const num = that.imageValue.findIndex(v=>v.url==err.tempFilePath)					
					that.imageValue.splice(num,1)
				},				
				
			    getDetail() {				  
				  var data= {
				  	       pkCode: this.pkcode
				  	    }
				  this.$api.GetPointDetail(data).then(res=>{				  						
				  	if (res.isSuccess && res.data !=undefined) {
				  		 this.pointInfo=res.data
				  		 }else{	
							uni.showToast({
								icon:'none',
								title:'未查询到记录'
							})
				  		}										
				  						
				  })			  
							
			    },
				SavePointData(){					
					if(this.remarkStr=='' && (this.imageValue!=undefined && this.imageValue.length==0)){					    
						uni.showToast({
							icon: 'none',
							title: '请填写备注或上传图片'
						});
					    return
					}  
					
					 let files = []
					 this.imageValue.filter(function (item, i) {					     
					     let file = {}
					     file.name = item.name
					     file.type = item.type
					     file.size = item.size
					     file.content = item.content	
					     files.push(file)        
					 })
					
					
					var data ={	
						    autoid: this.pkcode,
						    reamrk: this.remarkStr,
						    fileList: files
						}
						
					this.$api.PlandetailUpdate(data).then(res=>{												
						if(!res.isSuccess){
							uni.showToast({
								icon: 'none',
								title: res.errMsg
							});
							return	     		
						};	
										
						uni.showToast({
							icon: 'none',
							title: '提交成功'
						});												
						
						uni.navigateTo({
						    url:'/pages/inspection/Route?plancode='+encodeURIComponent(this.pointInfo.plancode)+'&plandate='+encodeURIComponent(this.pointInfo.planDate.slice(0,10))+'&plantime='+encodeURIComponent(this.pointInfo.plantime)
						    })				
					})			
									
				},
				GoBack(){
					uni.navigateTo({
						url:'/pages/inspection/Route?plancode='+encodeURIComponent(this.pointInfo.plancode)+'&plandate='+encodeURIComponent(this.pointInfo.planDate.slice(0,10))+'&plantime='+encodeURIComponent(this.pointInfo.plantime)
					})
				},				
				getUrlParam(_key){
					     var pages = getCurrentPages() //获取加载的页面
					      var currentPage = pages[pages.length - 1] //获取当前页面的对象
					      var url = currentPage.route //当前页面url					     
					      var options = currentPage.options //如果要获取url中所带的参数可以查看options 
					 return options[_key];
				}
				
				
		}
}
</script>


<style>
</style>