P003-WX-HomeTeacher/education_uni/subpkg/manager/suggestion/suggestion_not_end.vue

<template>
<view>
	 <view class="wrapper" v-if="isShow">
		        <view class="suggestHead">
		            <text>建议号</text>
		            <text class="suggestHeadDetail">{{suggestion.id}}</text>
		        </view>
		        <view class="suggestHead">
		            <text>建议人UID</text>
		            <text class="suggestHeadDetailID">{{suggestion.fromUid}}</text>
		        </view>
		        <view class="suggestHead">
		            <text>处理人UID</text>
		            <text class="suggestHeadDetailID">{{suggestion.processorUid}}</text>
		        </view>

		        <view class="suggestHead">
		            <text>建议标题</text>
		            <text class="suggestHeadDetail">{{suggestion.adviseTitle}}</text>
		        </view>
		        <view class="suggestHead">
		            <text>建议内容</text>
		            <text class="suggestHeadDetail">{{suggestion.adviseDetail}}</text>
		        </view>
		        <view class="suggestHead">
		            <text>处理结果</text>
		            <text class="suggestHeadDetail">{{suggestion.result}}</text>
		        </view>
				<view class="suggestHead">
				    <text>建议日期</text>
				    <text class="suggestHeadDetail">{{suggestion.fistDatetime}}</text>
				</view>
		        <view class="suggestHead">
		            <text>结案日期</text>
		            <text class="suggestHeadDetail">{{suggestion.closetime}}</text>
		        </view>
		        <view class="suggestHead">
		            <text>状态</text>
		            <text style="width: 50px;" class="handleStatusDetail">{{suggestion.status}}</text>
		        </view>
	</view>
	<view class="requires2">
		<uni-row >
				<text>待结案条数：{{current}}</text>
		</uni-row>
	</view>

	<!-- 提交按钮 -->
	<view class="suggestBtn" v-if="isShow">
		<button class="cancelBtn" @click="toRefuse">开始结案</button> 
				<modal v-if="areaShow" title="结案描述必填" confirm-text="提交" cancel-text="取消" @cancel="cancelAdd" @confirm="confirmAdd">
				  <input type="text" v-model="areaTxt" placeholder="至少5个字" maxlength="50" />
				</modal>
	</view>
	
</view>	
</template>

<script>
	import { mapState } from 'vuex';

	export default {
		computed: {
			...mapState('m_user', ['token', 'userinfo'])
		},
		data() {
			return {
				areaShow: false,
				areaTxt:'',
				suggestion: {},
				index: 0,
				current:0,
			
				datas: {},
				isShow: false,
				
			};
		},
		onLoad(){
           this.findAllNotEndAdviseList()
		},
		methods:{
			checkIsHaveNext(){
					 this.current = this.current - 1
					 this.index = this.index + 1
					if(this.current == 0){
						this.isShow = false
					}else{
						this.suggestion = this.datas.list[this.index]
					}
				},
				toRefuse(){
					   this.areaShow = true	
					},
				cancelAdd(){
					this.areaShow = false
				},
				confirmAdd(){
					this.areaShow = false
					var strRefuse = this.areaTxt.replace(/\ +/g,"")
					strRefuse = strRefuse.replace(/[\r\n]/g,"")
					if(strRefuse.length < 5){
						uni.$showMsg("有效字数少于5个，请增加！")
					}else{
						strRefuse = this.suggestion.result +'，已处理' + this.userinfo.uid + strRefuse
						// 开始向后端提交数据
						this.submitToBack(this.suggestion.id,"已处理",strRefuse,this.userinfo.uid)
						this.checkIsHaveNext()
					}
				},
			async findAllNotEndAdviseList() {
				const { data: result } = await uni.$http.get('/education/my-suggestion/findAllNotEndAdviseList')
			  // console.log(result)
				this.current = result.data.list.length
					if(this.current > 0){
						this.datas = result.data
						this.suggestion = this.datas.list[this.index ]
						this.isShow = true
					}
								//console.log(this.item)
				},
				async submitToBack(adviseid,status,text,procuid) {
					// 准备参数对象
					const query = {
						adviseid: adviseid,
						status: status,
						text: text,
						procuid: procuid,
					}
					const {
						data: result
					} = await uni.$http.get('/education/my-suggestion/updateAdviseInfo',query)
					//console.log(result)
					uni.$showMsg(result.message , 2000)
				},
		}
	}
</script>

<!-- 设置页面背景 -->
<style lang="scss">
	page{
		height: 100%;
		// background-color: #FFF;
	}
</style>

<style lang="scss" scoped>
// page {
// 	height: 100%;
// 	background-color: #FFF2CC;
// }

.wrapper {
	width: 93%;
	padding: 20rpx;
	margin-left: 10rpx;
	border-radius: 30rpx;
	background-color: #FFF;
	font-size: 30rpx;
}

/* 建议号、建议人、建议日期 */
.suggestHead {
    display: flex;
}

.suggestHeadDetail,
.suggestHeadDetailID {
    margin-left: 20rpx;
    font-weight: bold;
}

/* 建议人和处理人ID */
.suggestHeadDetailID {
    color: #00B0F0;
    text-decoration: underline;
}

/* 建议标题 */
.suggestTitle{
   // margin-top: 10rpx;
    display: flex;
}


/* 状态详情颜色 */
.handleStatusDetail {
	font-weight: bold;
    color: red;
	 margin-left: 20rpx;
}


	.requires2 {
		background-color: #FFF;
		margin: 20rpx 20rpx;
		border-radius: 50rpx;
		font-size: 30rpx;
		padding: 20rpx 20rpx;
		//font-weight: bold;
		color: gray;
		display: flex;
		align-items: center;
		justify-content: center;
		
	}
	
	/* 下方按钮 */
	.suggestBtn{
	    display: flex;
	    padding: 60rpx;
	    justify-content: space-around;
	}
	

	.cancelBtn{
	    font-size: 30rpx;
	    height: 85rpx;
	    width: 200rpx;
	    line-height: 85rpx;
	    border-radius: 50rpx;
	    text-align: center;
	    color: white;
		margin-top: 5rpx;
	}
	

	.cancelBtn{
		background-color: #3ed598;
	}
	
</style>