v3-lab-xcx/pages_manage/views/gradingControl/infoPage.vue

<template>
	<view class="gradingControl-infoPage">
		<view class="text-box">
			<view>管控名称:</view>
			<view>{{newData.name}}</view>
		</view>
		<view class="text-box">
			<view>二级单位:</view>
			<view>{{newData.deptName}}</view>
		</view>
		<view class="text-box">
			<view>安全分类:</view>
			<view>{{newData.typeName}}</view>
		</view>
		<view class="text-box">
			<view>安全分级:</view>
			<view>{{newData.levelName}}</view>
		</view>
		<view class="text-box">
			<view>管控描述:</view>
			<view>{{newData.manageDes}}</view>
		</view>
		<view class="text-box">
			<view>执行状态:</view>
			<view :class="newData.status == 1?'colorA':'colorB'">{{newData.status == 1?'已执行':'未执行'}}</view>
		</view>
		<view class="text-box" v-if="newData.status == 1">
			<view>执行人:</view>
			<view>{{newData.executionUser}}</view>
		</view>
		<view class="text-box" v-if="newData.status == 1">
			<view>执行时间:</view>
			<view>{{newData.executionTime}}</view>
		</view>
		<view class="text-box" v-if="newData.status == 1">
			<view>执行备注:</view>
			<view>{{newData.remark}}</view>
		</view>
		<view class="text-box" v-if="newData.status == 0">
			<view>执行备注:</view>
			<textarea v-model="inputData" class="input-box" placeholder="请输入执行备注" maxlength="50"></textarea>
		</view>
		<view class="null-p"></view>
		<view class="button-p" v-if="newData.status == 0" @click="buttonClick">执行</view>
	</view>
</template>

<script>
	import {
		parseTime
	} from '@/component/public.js'
	import {
		laboratoryGradeManageExecute,
	} from '@/pages_manage/api/index.js'
	export default {
		name: "gradingControl-infoPage",
		data() {
			return {
				//列表数据
				newData: {},
				inputData: "",
			}
		},

		onLoad(option) {
			this.$set(this, 'newData', JSON.parse(decodeURIComponent(option.infoData)));
		},
		onShow() {
			this.$nextTick(() => {
				this.newData.executionTime = parseTime(this.newData.executionTime, "{y}-{m}-{d} {h}:{i}")
			})
		},
		methods: {
			buttonClick() {
				let self = this;
				if (!this.inputData) {
					uni.showToast({
						title: '请输入执行备注',
						icon: "none",
						mask: true,
						duration: 2000
					});
					return
				}
				uni.showModal({
					// title: '确认要退出吗?',
					content: '确认提交?',
					cancelColor: "#999",
					confirmColor: "#0183FA",
					success: function(res) {
						if (res.confirm) {
							self.laboratoryGradeManageExecute();
						} else if (res.cancel) {}
					}
				});
			},
			async laboratoryGradeManageExecute() {
				let obj = {
					id: this.newData.id,
					remark: this.inputData,
					status: 1,
				}
				const {
					data
				} = await laboratoryGradeManageExecute(obj);
				if (data.code == 200) {
					uni.showToast({
						title: data.message,
						icon: "none",
						mask: true,
						duration: 2000
					});
					setTimeout(function() {
						uni.redirectTo({
							url: '/pages_manage/views/gradingControl/gradingControl'
						});
					}, 2000);
				}
			}
		}
	}
</script>

<style lang="stylus" scoped>
	.gradingControl-infoPage {
		height: 100%;
		display: flex;
		flex-direction: column;
		background: #fff;
		padding: 0 20rpx;

		.text-box:nth-child(1) {
			margin-top: 30rpx;
		}

		.text-box {
			display: flex;
			font-size: 32rpx;
			color: #333;

			view:nth-child(1) {
				width: 160rpx;
				line-height: 60rpx;
			}

			view:nth-child(2) {
				flex: 1;
				line-height: 40rpx;
				padding: 10rpx 0;
			}

			.colorA {
				color: #0183FA;
			}

			.colorB {
				color: #666;
			}

			.input-box {
				margin-top: 20rpx;
				height: 200rpx;
				width: 500rpx;
				padding: 10rpx;
				border: 1px solid #dedede;
				border-radius: 12rpx;
			}
		}

		.null-p {
			flex: 1;
		}

		.button-p {
			font-size: 32rpx;
			text-align: center;
			line-height: 60rpx;
			width: 200rpx;
			border-radius: 8rpx;
			margin: 40rpx auto;
			background-color: #0183FA;
			color: #fff;
		}
	}
</style>infoPage