<template>
	<view class="m-w partol ">
		<view class="logo-back">
		</view>
		<view class="title-font u-p-l-30 u-p-r-30">
			<scroll-view class="cell-item">
				<u-cell-group>
					<u-cell-item title="访客姓名" :arrow="false"
						:title-style="{fontSize:'28rpx',color:'#333333',fontWeight: 'bold'}">
						<view slot="right-icon" class="rig-font">{{menulist.username}}</view>
					</u-cell-item>
					<u-cell-item title="访客手机号" :arrow="false"
						:title-style="{fontSize:'28rpx',color:'#333333',fontWeight: 'bold'}">
						<view slot="right-icon" class="rig-font">{{menulist.userPhone}}</view>
					</u-cell-item>
					<u-cell-item title="访客公司" :arrow="false"
						:title-style="{fontSize:'28rpx',color:'#333333',fontWeight: 'bold'}">
						<view slot="right-icon" class="rig-font">{{menulist.company}}</view>
					</u-cell-item>
					<u-cell-item title="进入事由" :arrow="false"
						:title-style="{fontSize:'28rpx',color:'#333333',fontWeight: 'bold'}">
						<view slot="right-icon" class="rig-font">{{menulist.reason}}</view>
					</u-cell-item>
				</u-cell-group>
				<view class="u-m-l-30">
					<view class="valabel  u-m-t-28  u-m-b-20">出厂备注</view>
					<view class="span-textra ">
						<textarea v-model="remark" style="width: 100%; height: 100%;"></textarea>
					</view>
					<view class="subscribe" @click="temporary">确定核销 </view>
				</view>
			</scroll-view>
		</view>
		<!-- 消息提示组件 -->
		<u-toast ref="exToast" />
	</view>
</template>

<script>
	import {
		visitorlast,
		visitorupdate,
		loginWeixin
	} from '@/api/index'
	export default {
		data() {
			return {
				menulist: null,
				textarea: "测试测试",
				remark: ""
			}
		},
		onLoad() {
			this.init()
		},
		methods: {
			//获取openid
			init() {
				let openid = uni.getStorageSync("openid");
				if (openid) {
					this.getRecord()
				} else {
					uni.login({
						provider: 'weixin',
						success: loginRes => {
							loginWeixin({
									code: loginRes.code
								})
								.then(({
									data,
									code,
									message
								}) => {
									if (code == 200) {
										uni.setStorageSync('openid', data)
										this.getRecord()
									} else {
										this.$refs.exToast.show({
											title: code == 200 ? '查询成功' : message,
											type: code == 200 ? "success" : "warning",
										})
									}

								})
						}
					});
				}
			},
			//获取登记记录
			getRecord() {
				let openid = uni.getStorageSync("openid");
				visitorlast(openid)
					.then(({
						code,
						data,
						message
					}) => {
						this.menulist = data
						this.$refs.exToast.show({
							title: code == 200 ? '查询成功' : message,
							type: code == 200 ? "success" : "warning",
						})
					})
					.catch((err) => {
						this.$refs.exToast.show({
							title: err,
							type: "error",
						})
					})
			},
			//核销按钮
			temporary() {
				visitorupdate({
						id: this.menulist.id,
						remark: this.remark
					})
					.then(({
						data,
						code,
						message
					}) => {
						this.$refs.exToast.show({
							title: code == 200 ? '核销成功' : message,
							type: code == 200 ? "success" : "info",
						})
						setTimeout(() => {
							uni.redirectTo({
								url: "/pages/onsitpection/home/index"
							})
						}, 2000)
					})
					.catch((err) => {
						this.$refs.exToast.show({
							title: err,
							type: "warning"
						})
					})
			}
		}
	}
</script>

<style lang="scss">
	.partol {
		height: 100vh;
		background: #f0f2f5;

		.subscribe {
			width: 650rpx;
			height: 90rpx;
			background: #4A8BFF;
			border-radius: 4rpx;
			font-size: 28rpx;
			text-align: center;
			line-height: 90rpx;
			font-family: Microsoft YaHei-3970(82674968);
			font-weight: bold;
			color: #FFFFFF;
			margin-top: 337rpx;
		}

		.logo-back {
			width: 751rpx;
			height: 350rpx;
			position: relative;

			&::after {
				content: '';
				width: 140%;
				height: 350rpx;
				position: absolute;
				left: -20%;
				top: 0;
				border-radius: 0 0 45% 45%;
				background: #4a8bff !important;
			}

		}

		.valabel {
			font-size: 28rpx;
			font-family: Microsoft YaHei-3970(82674968);
			font-weight: bold;
			color: #333333;
		}

		.span-textra {
			width: 650rpx;
			height: 160rpx;
			border: 1px solid #AAAAAA;
			border-radius: 4rpx;
			padding: 22rpx;

			textarea {
				width: 100%;
				height: 100%;
				color: #000000;
			}

		}

		.title-font {
			width: 100%;
			font-size: 28rpx;
			font-weight: 400;
			color: #FFFFFF;
			position: absolute;
			top: 75rpx;

			.cell-item {
				width: 690rpx;

				height: calc(100vh - 70rpx);
				background: #FFFFFF;
				border-radius: 20rpx 20rpx 0px 0px;
				padding: 1rpx;
				overflow-x: hidden;
				box-sizing: border-box;

			}

			.rig-font {
				font-size: 28rpx;
				font-family: Microsoft YaHei-3970(82674968);
				font-weight: 400;
				color: #808080;
			}
		}

		view {
			line-height: 1;
		}
	}
</style>
