operatingCompany/operatingCompany/pages/shop/shopIndex/editWork.vue

<template>
	<view class="content">
		<view class="suggestLine" v-for="(item,index) in list">
			<view class="suggestLineTop">建议({{index+1}})</view>
			<view class="suggestCont">{{item.suggest}}</view>
			<view class="suggestLineBottom">
				<view class="suggestLineBottomTxt">预计完成日期:{{item.orderFinishTime.slice(0,item.orderFinishTime.length-8)}}</view>
				<view class="suggestLineBottomTxt">负责人:{{item.managerName}}</view>
			</view>
			<image src="../../../static/img/report_weixiugai@2x.png" mode="" class="exeStateImg" v-if="item.exeState==0"></image>
			<image src="../../../static/img/_report_yixiugai@2x.png" mode="" class="exeStateImg" v-if="item.exeState==1"></image>
		    <view class="lineBottom" v-if="item.exeState==0">
				<view class="goEditBtn" @click="edit(item)">修改作业</view>
			</view>
			<view class="workBox" v-if="item.exeState==1">
				<view class="workTitle">作业情况</view>
				<view class="exeContent">
					<view class="exeContent" v-if="item.exeContent">{{item.exeContent}}</view>
				</view>
				<view class="workImgBox">
					<image :src="img" mode="" v-for="(img,i) in item.exeImg.split(',')" class="workImg" @click="previewImage(img)"></image>
				</view>
			</view>
			<view v-if="item.exeState==1" class="suggestLineBottom">实际完成日期:{{item.exeTime.slice(0,item.exeTime.length-8)}}</view>
		</view>
	</view>
</template>

<script>
	import nodata from '@/components/nodata/nodata.vue'	
	export default {
		components: {
			   nodata
		},
		data() {
			return {
				sheetID:'',
				list:'',
				type:0,
			}
		},
		onLoad(opt) {
		   this.sheetID=opt.sheetID
           this.getData()
		},
		onShow() {
			if(this.sheetID){
				this.getData()	
			}

		},
		methods: {
			previewImage(img){
				var arr=[];
				arr.push(img)
				// 预览图片
				uni.previewImage({
					urls: arr,
					longPressActions: {
						itemList: ['发送给朋友', '保存图片', '收藏'],
						success: function(data) {
							console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
						},
						fail: function(err) {
							console.log(err.errMsg);
						}
					}
				});
			},
			getData() {
				uni.showLoading({
					title: '加载中'
				})
				let url = 'accompany/SuperCheckSheet/querySuperCheckSheetSuggestList',
				params = {
				  sheetID:this.sheetID
				 }
				this.$http(url, params, 'GET').then(res => {
					var list=res.data;
					var list1=[];
					var list2=[];
					list.forEach(item=>{
						if(item.exeState==1){
							list2.push(item)
						}else{
							list1.push(item)
						}
					})
					
                  this.list=list1.concat(list2)
				})
			},
			edit(item){
				this.type=0;
				this.list.forEach(item=>{
					if(item.exeState==0){
						this.type++
					}
				})
				uni.navigateTo({
					url:'editWorkDetail?id='+item.id+'&type='+this.type+'&sheetID='+this.sheetID
				})
			}
		},
		// 下拉刷新 上拉加载更多
		onPullDownRefresh() {
			this.getData()
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},
	}
</script>

<style scoped>
	.content {
		background: #F4F5F7;
		min-height: 100vh;
		padding: 24rpx 20rpx;
	}

	/* #ifdef H5 */
	.content {
		background: #F4F5F7;
		min-height: calc(100vh - 44px);
		padding: 24rpx 20rpx;
	}

	/* #endif */
	.suggestLine{
		background: #FFFFFF;
		border-radius: 10rpx;
		margin-top: 20rpx;
		position: relative;
	}
	.suggestLineTop{
		height: 76rpx;
		background: linear-gradient(270deg, rgba(255, 255, 255, 0.1) 0%, #FFE2D5 100%);
		line-height: 76rpx;
		color: #3C3C3C;
		font-size: 28rpx;
		padding-left: 20rpx;
	}
	.suggestCont{
		color: #3C3C3C;
		font-size: 28rpx;
		line-height: 40rpx;
		padding: 30rpx 20rpx;
	}
	.suggestLineBottom{
		display: flex;
		justify-content: space-between;
		color: #999999;
		font-size: 26rpx;
		padding: 0 20rpx 30rpx 20rpx;
		border-bottom: 1px solid #EEEEEE;
	}
	.exeStateImg{
		width: 116rpx;
		height: 96rpx;
		position: absolute;
		top: 0;
		right: 0;
		z-index: 11;
	}
	.goEditBtn{
		width: 150rpx;
		height: 56rpx;
		border-radius: 36rpx;
		border: 2rpx solid #FF4F00;
		line-height: 56rpx;
		text-align: center;
		font-size: 28rpx;
		color: #FF4F00;
	}
	.lineBottom{
		display: flex;
		justify-content: flex-end;
		padding: 20rpx;
		
	}
	.workBox{
		padding: 20rpx;
	}
	.workTitle{
		font-size: 26rpx;
		color: #666666;
		padding-bottom: 16rpx;
	}
	.exeContent{
		font-size: 28rpx;
		color: #3C3C3C;
		line-height: 40rpx;
	}
	.workImg{
		width: 150rpx;
		height: 150rpx;
		margin-right: 16rpx;
		margin-top: 20rpx;
	}
	.workImgBox{
		display: flex;
		flex-wrap: wrap;
	}
</style>