<!-- 侵权举报 -->
<template>
	<view class="tort">
		<image src="http://111.198.10.15:11604/png/back_ts.png" style="position:absolute;top: -4rpx;left: 0;z-index: -999; width:100%;height: 300rpx;"></image>
		<view class="bg">
			<image class="decoration" src="http://111.198.10.15:11404/imgs/xj/侵权举报背景.png"></image>
		</view>
		<view class="center-title">侵权举报</view>
		<view class="content">
			<view v-for="(item,index) in tabList" :key="item.id" class="content-main"  @click="changePage(item.id, item.icon)">
				<image :src="item.icon" :style="item.style" mode=""></image>
				<view class="text-area">
					<text class="content-title">{{item.title}}</text>
				</view>
			</view>
		</view>
		
		<u-popup :show="show" @close="close" @open="open">
			<view class="popup-title">
				请选择身份信息
			</view>
			<view class="popup-button">
				<view style="display:none;">
					<button ref="btn" id="talk-btn" class="button" open-type="contact" session-from="sessionFrom" style="display:none;"></button>
				</view>
				<button class="button" @click="clickPerson">个人用户</button>
				<button class="button" @click="clickEnterprise">企业用户</button>
			</view>
			<u-modal
				:show="showMessage" 
				title="举报须知" 
				:content='content'
				:showCancelButton="true"
				:title-style="{
			
					color: '#408bf6'
				}"
				@confirm="confirm"
				@cancel="closeMes"
				confirmColor="#408bf6"
				confirmText="同意"
				cancelText="拒绝"
			>
			</u-modal>
		</u-popup>
	</view>
</template>

<script>
	import { getLocationParams } from '../../common/utils.js';
	export default {
		name: 'center',
		components: {
		},
		data() {
			return {
				show: false,
				showMessage: false,
				index:0,
				content: `
				一、受理范围
				受理新疆属地网站平台发布的涉企侵权信息及境内网站平台发布的涉新疆属地企业网络侵权信息。
				二、受理条件
				举报需由涉事企业或涉事企业委托的代理人提起。
				三、举报要件
				1.提交能够充分陈述举报事项、阐明举报理由的文字举报
				2.提交企业营业执照、组织机构代码证等权利主体资格证明材料
				3.提交举报人姓名、联系方式；
				4.提交足以准确定位侵权信息内容的网址链接；
				5.提交能够证明举报内容侵权的初步证据材料；
				6.提交申明举报真实性、合法性的文字保证。
				四、注意事项
				不得在举报内容中发表违反中华人民共和国宪法和法律的言论，举报主体承担一切因违法留言行为而引起的法律责任。
				`,
				tabList: [
					{
						id: 'report',
						title: '侵权举报',
						icon: 'http://111.198.10.15:11604/png/tort2.png',
						span: '6',
						style: 'width: 72px;height: 72px;'
					},
					{
						id: 'guide',
						title: '侵权指引',
						icon: 'http://111.198.10.15:11604/png/tort1.png',
						span: '6',
						style: 'width: 72px;height: 72px;'
					},
					{
						id: 'egersis',
						title: '案例警醒',
						icon: 'http://111.198.10.15:11604/png/tort3.png',
						span: '12',
						style: 'width: 72px;height: 72px;'
					},
				],
				columns: [
					{
						id: 'person',
						label: '个人用户'
					},
					{
						id: 'firm',
						label: '企业用户'
					},
				]
			}
		},
		mounted(){
			// 开启分享好友、朋友圈
			uni.showShareMenu({
				withShareTicket: true,
				menus: ["shareAppMessage", "shareTimeline"]
			});
		},
		//分享好友
		onShareAppMessage() {
			return {
				title: '新疆网络举报',
				imageUrl: '../../static/share.png',
			};
		},
		//分享朋友圈
		onShareTimeline() {
			return {
				title: '新疆网络举报',
			}
		},
		methods: {
			clickEnterprise() {
				this.showMessage = true
				this.content =  `
				一、受理范围
				受理新疆属地网站平台发布的涉企侵权信息及境内网站平台发布的涉新疆属地企业网络侵权信息。
				二、受理条件
				举报需由涉事企业或涉事企业委托的代理人提起。
				三、举报要件
				1.提交能够充分陈述举报事项、阐明举报理由的文字举报
				2.提交企业营业执照、组织机构代码证等权利主体资格证明材料
				3.提交举报人姓名、联系方式；
				4.提交足以准确定位侵权信息内容的网址链接；
				5.提交能够证明举报内容侵权的初步证据材料；
				6.提交申明举报真实性、合法性的文字保证。
				四、注意事项
				不得在举报内容中发表违反中华人民共和国宪法和法律的言论，举报主体承担一切因违法留言行为而引起的法律责任。
				`
				this.index = 2
			},
			confirm() {
			    this.show = false
				this.showMessage = false
				if (this.index === 1) {
					//  个人用户
					const tempParamForm = {
						reportTypeValue: '10',
						icon: 'http://111.198.10.15:11404/imgs/xj/其他.png',
						label: '其他类',
						reportType: 'other'
					}
					wx.navigateTo({
						url: `/packageIndex/report/report?reportTypeValue=${tempParamForm.reportTypeValue}&icon=` + encodeURIComponent(tempParamForm.icon) + '&label=' + encodeURIComponent(tempParamForm.label) + `&reportType=${tempParamForm.reportType}`+ `&hiddenMessage=${true}`
					})
					// const url = 'https://www.12377.cn'
					// wx.navigateTo({
					// 	url: '/packageToolList/rumorWebView/rumorWebView?url=' + encodeURIComponent(url)
					// })
				} else if (this.index === 2) {
					// 企业用户
				}
			},
			//拒绝举报须知
			refuse(val) {
				this.showMessage = false
			},
			closeMes(val) {
				this.showMessage = false;
			},
			changePage(val, icon) {
				console.log(icon)
				if(val === 'report') { // 侵权举报
					// this.open()
					this.showMessage = false
					this.show = true
				} else if(val === 'guide') { // 侵权指引
					wx.navigateTo({
						url: '/packageMine/tortGuide/tortGuide'
					})
				} else if(val === 'egersis') { // 案例警醒
					wx.navigateTo({
						url: '/packageMine/egersis/egersis'
					})
				}
			},
			// 打开popup
			open() {
				this.show = true
			},
			// 关闭popup
			close() {
				this.show = false
			},
			// 点击个人用户
			clickPerson() {
				// this.show = false
				this.showMessage = true
				this.content = `一、受理范围
新疆属地网站平台发布的涉嫌泄露个人隐私、侮辱谩骂、诽谤诋毁的侵权信息，超出范围的，不予受理。新疆属地外网站平台发布的侵权信息可通过中央网信办违法和不良信息举报中心（https://www.12377.cn）“侵权类”举报。
二、受理条件
举报须由当事人或当事人委托的代理人提起。
三、填写要求
须按照提示要求填写，特别是须按要求提供相关证明证据材料，否则举报无效。
四、注意事项
不得在举报内容中发表违反中华人民共和国宪法和法律的言论，举报人承担一切因违法留言行为而引起的法律责任。`
                 this.index = 1
			},
		}
	}
</script>

<style lang="scss" scoped>
	.tort {
		position: relative;
		width: 100%;
		height: 100%;
		padding: 40rpx;
		padding-top: 380rpx;
		box-sizing: border-box;
		.bg{
			width: 95%;
			// margin: 0 auto;
			position: absolute;
			height: 1075rpx;
			left:50%;
			top:15%;
			transform: translateX(-50%);
			// background-color: #45a6fe;
			background: linear-gradient(to top,#C0D6FF, #EBF0FE);
			z-index: -1000;
			border-radius: 20rpx;
			// background-image: url('http://111.198.10.15:11404/imgs/xj/侵权举报背景.png');
			// background-repeat: no-repeat;
			// background-size:80rpx 80rpx;
			// background-position:30% 70%;
			.decoration{
				// width: 40rpx;
				// height: 40rpx;
				width: 525rpx;
				height: 325rpx;
				position: absolute;
				bottom:1%;
				right:1%;
			}
		}
		.center-title {
			position: absolute;
			top: 40rpx;
			left: 40rpx;
			color: #fff;
			font-size: 48rpx;
			font-weight: 600;
			letter-spacing: 4rpx;
		}
		.content {
			// margin-top: -70rpx;
			position: relative;
			top:-12%;
			display: flex;
			flex-direction: column;
			background-color: #fff;
			border-radius: 16rpx;
			padding: 20rpx;
			box-sizing: border-box;
			background-color: transparent;
			.content-main {
				display: flex;
				align-items: center;
				background: linear-gradient(to bottom, #4f8dfa 0%, #45a6fe 100%);
				margin-top: 40rpx;
				padding: 20rpx;
				padding-left: 60rpx;
				border-radius: 20rpx;
				color: #fff;
				.text-area {
					flex: 1;
					margin-left: 40rpx;
					text-align: center;
					font-weight: 600;
					font-size: 38rpx;
					&:last-child {
						margin-left: 32rpx;
					}
					.content-title {
						margin-right: 20rpx;
					}
				}
			}
		}
		.popup-title {
			font-size: 34rpx;
			font-weight: 600;
			margin: 32rpx 0;
			text-align: center;
		}
		.popup-button {
			display: flex;
			justify-content: space-around;
			padding: 40rpx 20rpx;
			.button {
				width: fit-content;
				font-weight: 600;
				color: #0043ac;
				border: 2rpx solid #0043ac;
				background-color: #fff;
			}
		}
	}
</style>
<style lang="scss">
	.center {
		.u-icon__icon {
			margin-right: -20rpx;
		}
	}
</style>