zhxf-app/pages/inspectList/unprocessDetail/unprocessDetail.vue

<template>
	<view>
		<view class="timeBox flex justify-between align-center padding-lr-sm">
			<view class="time">{{this.getData.cl_time}}</view>
			<button class="cu-btn radius bg-green sm">{{this.getData.wtype}}</button>
		</view>
		<view >
			<!-- 基本信息start -->
			<view class="basic-info">
				<view class="info-tit margin-left-xs">
					<text class="cuIcon-titles margin-right-xs"></text>
					基本信息
				</view>
				<view class="info-content">
					<view class="info-one-info ">
						<text>{{type==1?this.getData.artificial_code:this.getData.supervise_code}}</text>  
						<text>{{this.getData.content}}</text>
					</view>
				
				</view>
			</view>
			<!-- 基本信息end -->
			
			<!-- 处理信息start -->
			<view class="processStatus">
				<view class="info-tit margin-left-xs">
					<text class="cuIcon-titles margin-right-xs"></text>
					处理内容
				</view>
				<view class="padding-lr padding-bottom-lg">
					<form action="">
						<radio-group name="gender" class=""  @change="RadioChange">
							<label class="margin-right">
								<radio value="0"  checked /><text>单个处理</text>
							</label>
							<label>
								<radio value="1" /><text>批量处理</text>
							</label>
						</radio-group>
						<view class="cu-form-group">
							<textarea class="JTxtArea lg" 
							:maxlength="50" 
							 v-model="msg"
							:data-maxnum="reason.length+'/50'"   placeholder="备注信息,最多可输入50个字..."
							auto-height
							@input="inputReason"
							:name="reason"></textarea>
						</view>
						<view class="btn-area">
							<button class="bg-blue round  margin-top" @click="$noMultipleClicks(powerSubmit)">提 交 </button>
						</view>
					</form>
				</view>
			</view>
			<!-- 处理状态end -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				noClick:true,
				reason: '',
				type: 0,
				msg: '',
				getData:{},
				radioOne: 0,
			}
		},
		onLoad: function(option) {
			this.type=option.type;
			if(option.type==1){
				uni.setNavigationBarTitle({
					title: "消防支队人工督察单详情页",
				});
			}else{
				uni.setNavigationBarTitle({
					title: "消防支队电子督察单详情页",
				});
			}
			this.getDetailData({
				"id": option.id,
				"company_code": uni.getStorageSync('selectedCode')
			})
		},
		methods: {
			RadioChange(e) {
				this.radioOne = e.detail.value;
				console.log(this.radioOne)
			},
			powerSubmit() {
				if(!this.msg.replace(/^\s*/g,'')){
					uni.showToast({
						title: "请输入处理内容",
						icon:"none"
					});
				}else{
					this.powerSubmitRes({
						"id": this.getData.id,
						"company_code":this.getData.company_code,
						"plcl": this.radioOne,
						"artificial_code": this.type==1?this.getData.artificial_id:this.getData.supervise_id,
						"clnr": this.msg,
					})
				}
			},
			async powerSubmitRes(params = {}) {
				const res = await this.$myRequest({
					url: this.type==1?'FireInspector/setManualInspector':'FireInspector/setElectronicInspector',
					data: params
				})
			   if(res.data.flag){
				  uni.showToast({
				  	title: "提交成功",
				  });
				  setTimeout(() => {
				  	uni.navigateTo({
				  		url: '/pages/inspectList/processList/processList?type='+this.type,
				  	});
				  }, 1000);
			   }
			},
			
			//回显信息
			async getDetailData(params = {}) {
				const res = await this.$myRequest({
					url: this.type==1?'FireInspector/getManualInspectorDetails':'FireInspector/getElectronicInspectorDetails',
					data: params,
					showLoading: true
				})
				this.getData = res.data.data[0];
				console.log(this.getData)
			},
			inputReason(e) {
				this.reason = e.detail.value;
			},
			textareaAInput(e) {
				this.textareaAValue = e.detail.value
			},
		}
	}
</script>

<style lang="scss">
	.timeBox {
		height: 88rpx;
		background: #EFF4FF;
		line-height: 88rpx;
		.time {
			color: #333
		}
	}
	.info-tit {
		color: #4074E7;
		line-height: 90rpx;
		height: 90rpx;
	}

	// 基本信息
	.info-content>view {
		margin-left: 24rpx;
		border-bottom: 1px solid #EDEDED;
		line-height: 92rpx;
		color: #666;
	}

	.info-content view text:first-child {
		width: 160rpx;
		display: inline-block
	}
</style>