<template>
	<view class="notice-wrapper">
		<view class="image-wrapper">
			<image class="image" src="../../static/images/notice_logo.png" mode="aspectFill"></image>
		</view>

		<view class="notice-line"></view>
		<!-- officialLogId: "1961375588419149824"
		signName: "贝思畅想科技有限公司TEST"
		verifyRemark:
		"1.贝思畅想科技有限公司TEST贝思畅想科技有限公司TEST贝思畅想科技有限公司TEST贝思畅想科技有限公司TEST贝思畅想科技有限公司TEST贝思畅想科技有限公司TEST贝思畅想科技有限公司TEST↵2.贝思畅想科技有限公司TEST贝思畅想科技有限公司TEST"
		verifyStatus: "未通过"
		verifyTime: "2025-08-29T18:29:15.000+08:00"
		workOrderId: "1961370363385913344"
		workOrderName: "充值审核" -->
		<view class="notice-item">
			<view class="notice-title">企业名称</view>
			<view class="notice-value">{{info.signName}}</view>
		</view>
		<view class="notice-item">
			<view class="notice-title">通知类型</view>
			<view class="notice-value">{{info.workOrderName}}</view>
		</view>
		<view class="notice-item">
			<view class="notice-title">工单编号</view>
			<view class="notice-value">{{info.workOrderId}}</view>
		</view>
		<view class="notice-item">
			<view class="notice-title">处理结果</view>
			<view class="notice-value">{{info.verifyStatus}}</view>
		</view>
		<view class="notice-item" v-if="info.verifyStatus == '未通过'">
			<view class="notice-title weitongguo">未通过原因</view>
			<view class="notice-value" style="white-space: pre-line;">{{info.verifyRemark}}</view>
		</view>
		<view class="notice-item">
			<view class="notice-title">处理时间</view>
			<view class="notice-value">{{formatDate(info.verifyTime)}}</view>
		</view>
		<view class="notice-item" style="margin-top: 20rpx;" @click="copyUrlClick">
			<view class="solution">请登录 {{copyUrl}} 查看</view>
		</view>
		<view class="notice-line"></view>


		<view class="bottom_wrapper fixed-bottom">
			<view class="bottom_title">如有问题请联系销售或拨打全国客服热线</view>
			<view class="bottom_title">{{contect}}</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
	import { ref } from 'vue'
	import { onLoad } from '@dcloudio/uni-app'
	import registerApi from '@/api/register'

	const contect = ref('')
	const id = ref('')
	const info = ref()
	const copyUrl = ref('https://www.zhihangtech.com')
	onLoad((options) => {
		if (options && options.scene) {
			const scene = decodeURIComponent(options.scene).split('=')
			console.log('scene', scene)
			if (scene.length > 1) {
				id.value = scene[1]
				getDetail()
			} else {
				id.value = options.scene
				getDetail()
			}
		}
		getPhone()
	})
	
	function copyUrlClick() {
		uni.setClipboardData({
			data: copyUrl.value,
			success: () => {
				uni.showToast({
					title: '复制成功',
					icon: 'none'
				});
			},
			fail: (err) => {
				uni.showToast({
					title: '复制失败',
					icon: 'none'
				});
			}
		});
	}

	function formatDate(string) {
		const date = new Date(string);
		const year = date.getFullYear();
		const month = String(date.getMonth() + 1).padStart(2, '0');
		const day = String(date.getDate()).padStart(2, '0');
		const hours = String(date.getHours()).padStart(2, '0');
		const minutes = String(date.getMinutes()).padStart(2, '0');
		const seconds = String(date.getSeconds()).padStart(2, '0');

		return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
	}

	function getDetail() {

		registerApi.getNoticeDetail({ officialLogId: id.value }).then((res) => {
			console.log('getNoticeDetail', res)
			info.value = res.data
		}).catch((error) => {
			uni.showToast({
				title: error.msg,
				icon: 'none'
			})
		})
	}

	function getPhone() {
		registerApi.getNotice({ type: 'linkPhone' }).then((res) => {

			if (res.data.noticeContent) {
				contect.value = res.data.noticeContent.replace(/<[^>]*>/g, '');
			}
		}).catch(() => {

		})
	}
</script>

<style lang="scss" scoped>
	.notice-wrapper {
		display: flex;
		flex-direction: column;
		height: 100vh;

		.solution {
			display: flex;
			flex-direction: row;
			justify-content: center;
			width: 100%;
			margin-top: 12rpx;
			margin-bottom: 12rpx;
			flex-wrap: wrap;
			font-family: PingFangSC, PingFang SC;
			font-weight: 500;
			font-size: 28rpx;
			color: #409EFE;
			line-height: 40rpx;
			font-style: normal;
		}

		.image-wrapper {
			display: flex;
			width: 100%;
			height: 140rpx;
			margin-top: 60rpx;
			justify-content: center;

			.image {
				width: 150rpx;
				height: 140rpx;
			}
		}

		.notice-line {
			display: flex;
			margin-top: 60rpx;
			margin-left: 60rpx;
			margin-right: 60rpx;
			height: 1rpx;
			background: #ECEDEF;
			margin-bottom: 48rpx;
		}

		.notice-item {
			display: flex;
			flex-direction: row;
			align-items: center;
			margin-left: 60rpx;
			margin-right: 60rpx;	
			min-height: 62rpx;

			.notice-title {
				display: flex;
				min-width: 192rpx;
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 28rpx;
				color: #707070;
				line-height: 40rpx;
				text-align: left;
				font-style: normal;
				&.weitongguo {
					height: 100%;
					padding-top: 18rpx;
				}
			}

			.notice-value {
				font-family: PingFangSC, PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #1C1C1C;
				line-height: 50rpx;
				text-align: left;
				font-style: normal;
			}
		}

		.bottom_wrapper {
			display: flex;
			flex-direction: column;
			position: fixed;
			left: 0;
			right: 0;
			bottom: 40rpx;
			z-index: 10;

			.bottom_title {
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 28rpx;
				margin-bottom: 20rpx;
				color: #6b6d73;
			}
		}
	}
</style>