<template>
	<view>
		<uni-collapse>
		<uni-collapse-item :title="n.personInfo?.name" open v-for="n in list" :key="n.id">
		<view class="collapseBody">
			<!-- n.oldIdcCode -->
			<view>
				<label>姓名：</label>
				{{n.personInfo?.name}}

				<text class="text-danger">{{ n.oldPersonInfo?.name }}</text>
			</view>
			<view>
				<label>会员编号：</label>
				{{n.personInfo?.perCode}}

				<text class="text-danger">{{ n.oldPersonInfo?.perCode }}</text>
			</view>
			<view style="display: flex;">
				<label>有效期：</label>
				<view>
					<view v-if="n.personInfo?.valiDateTime">
						<text v-if="n.personInfo?.beginTime">{{n.personInfo?.beginTime?.slice(0,10)}}</text>
						<text v-if="n.personInfo?.beginTime">至</text>
						<text>{{n.personInfo?.valiDateTime?.slice(0,10)}}</text>
					</view>
					<view class="text-danger" v-if="n.oldPersonInfo?.valiDateTime">
						<text v-if="n.oldPersonInfo?.beginTime">{{ n.oldPersonInfo?.beginTime?.slice(0,10)}}</text>
						<text v-if="n.oldPersonInfo?.beginTime">至</text>
						<text v-if="n.oldPersonInfo?.valiDateTime">{{n.oldPersonInfo?.valiDateTime?.slice(0,10)}}</text>
					</view>
					<view class="text-danger" v-else>--</view>
				</view>
			</view>
			<view style="display: flex;">
				<label>证件号：</label>
				<view>
					{{ n.originIdcCode }}
					<view class="text-danger">{{ n.oldIdcCode }}</view>
				</view>
			</view>
			<view>
				<label>级位详情：</label>
				<view v-if="n.personInfo?.jiList.length>0" class="mt10">
					<uni-table border stripe>
						<uni-tr>
							<uni-th  width="50">序号</uni-th>
							<uni-th >级位</uni-th>
							<uni-th>证书编号</uni-th>
						</uni-tr>
						<uni-tr v-for="(tr,index) in n.personInfo.jiList" :key="index">
							<uni-td>{{index+1}}</uni-td>
							<uni-td>{{szToHz(tr.level)}}级</uni-td>
							<uni-td>{{tr.certCode}}</uni-td>
						</uni-tr>
					</uni-table>
				</view>
				<text v-else class="text-primary">无级位记录</text>
				<view v-if="n.oldPersonInfo?.jiList.length>0" class="mt10">
					<uni-table border stripe>
						<uni-tr>
							<uni-th width="50"><text class="text-danger">序号</text></uni-th>
							<uni-th><text class="text-danger">级位</text></uni-th>
							<uni-th><text class="text-danger">证书编号</text></uni-th>
						</uni-tr>
						<uni-tr v-for="(tr,index) in n.oldPersonInfo.jiList" :key="index">
							<uni-td>{{index+1}}</uni-td>
							<uni-td>{{szToHz(tr.level)}}级</uni-td>
							<uni-td>{{tr.certCode}}</uni-td>
						</uni-tr>
					</uni-table>
				</view>
				<text v-else class="text-danger">无级位记录</text>

			</view>
			<view>
				<label>段位详情：</label>
				<view v-if="n.personInfo?.duanList.length>0" class="mt10">
					<uni-table border stripe>
						<uni-tr>
							<uni-th width="50">序号</uni-th>
							<uni-th>段位</uni-th>
							<uni-th>证书编号</uni-th>
						</uni-tr>
						<uni-tr v-for="(tr,index) in n.personInfo.duanList" :key="index">
							<uni-td>{{index+1}}</uni-td>
							<uni-td>{{szToHz(tr.level)}}段</uni-td>
							<uni-td>{{tr.certCode}}</uni-td>
						</uni-tr>
					</uni-table>
				</view>
				<text v-else class="text-primary">无段位记录</text>
				<view v-if="n.oldPersonInfo?.duanList.length>0" class="mt10">
				<uni-table border stripe>
					<uni-tr>
						<uni-th width="50"><text class="text-danger">序号</text></uni-th>
						<uni-th><text class="text-danger">段位</text></uni-th>
						<uni-th><text class="text-danger">证书编号</text></uni-th>
					</uni-tr>
					<uni-tr v-for="(tr,index) in n.oldPersonInfo.duanList" :key="index">
						<uni-td>{{index+1}}</uni-td>
						<uni-td>{{szToHz(tr.level)}}段</uni-td>
						<uni-td>{{tr.certCode}}</uni-td>
					</uni-tr>
				</uni-table>
				</view>
				<text v-else class="text-danger">无段位记录</text>
			</view>
			<view v-if="n.fileUrl">
				<label>证明材料：</label>
				<text class="text-primary" @click="showImg(n)">
					下载
				</text>
			</view>
		</view>

		</uni-collapse-item>
		</uni-collapse>

	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue'
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import * as api from '@/common/api.js'
	import {
		parseAttachmentJson,
		previewAttachment,
		szToHz
	} from '@/common/utils.js'
	const queryParams = ref({})
	const total = ref(0)
	const list = ref([])
	const popup = ref(null)
	const type = ref('')
	const form = ref({})
	onLoad((option) => {
		if (option.rangeId) {
			queryParams.value.rangeId = option.rangeId
			getList()
		}
	})

	function getList() {
		uni.showLoading({
			title: '加载中'
		})
		api.infoMergeList(queryParams.value).then(res => {
			list.value = res.rows
			list.value.forEach(item => {
				item.fileUrl = parseAttachmentJson(item.fileUrl)
			})
			total.value = res.total
			uni.hideLoading()
		})
	}

	function handleChange(a, b) {
		type.value = b
		form.value = a
		console.log(form.value.newName)
		popup.value.open()
	}

	function handleDelete(row) {
		uni.showModal({
			content: `确认删除会员${row.newName}`,
			success: function(res) {
				if (res.confirm) {
					api.infoMod([row.id]).then(res => {
						uni.showToast({
							title: '操作成功'
						})
						getList()
					})
				}
			}
		})
	}

	function showImg(n) {
		previewAttachment(n.fileUrl, { title: '查看附件' })
	}
</script>
<style scoped lang="scss">
	.flexbox {
		padding: 30rpx 30rpx 0
	}

	.danger-button {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.collapseBody {
		background: #fff;
		padding:0 30rpx;
		box-sizing: border-box;
		font-size: 28rpx;

		view {
			margin: 0 0 20rpx;

			label {
				width: 5em;
				color: #999;
				display: inline-block;
				text-align: right;
			}
		}
	}

	.popBody {
		background: #fff;
		padding: 30rpx;
	}
</style>