<template>
	<view class="p-root-bind-apply g_w_all g_h_all g_bg_f_5 g_kuaishou">
		<rh-loading :loading='loading' v-if="loading && speed == -1"/>
		<view class="g_pt_130" v-if="!loading && speed == 0">
			<rh-empty />
		</view>
		<view class="" v-if="speed > 0">
			<view v-for="(item,index) in list" :key="index">
				<u-sticky @fixed="handleFixed(item,index)"
								  @unfixed="handleUnFixed(item,index)"
									:index='index'
									offset-top='96'
				>
					<view class="">
						<view class="g_c_9 g_fs_14 g_pt_12 g_pb_12 g_pl_16 g_pr_16 true g_bg_f_5"
									v-if="item.isShowTime"
						>{{item.time}}</view>
						<view class="g_c_3 g_fs_14 g_pt_12 g_pb_12 g_pl_16 g_pr_16 g_bg_f_5 false"
									v-if="!item.isShowTime"
						>
							{{stickyText}}
						</view>
					</view>
				</u-sticky>
				<view class="g_flex_row_start g_pl_16 g_pr_16 g_bg_f" 
						  v-for="(itm,inx) in item.children" :key="inx"
							@click="goPage(itm,item)"
							hover-class="thover"
				>
					<view class="g_flex_none g_mr_11 m-avatar g_flex_column_center" style="position: relative;">
						<rh-image :url="itm.logo" size='80' radius="50" v-if="itm.logo" />
						<rh-image size='80' radius="50" v-if="!itm.logo" />
						
						<!-- <view class="g_flex_c"
									v-if="itm.supplierAccount == 1"
									style="position:absolute; overflow:hidden;width: 20px;height: 10px;right: -2px;top: 0;"
						>
							<image :src="cdnBaseImg + 'fadanhao.svg'"
										 mode="widthFix" 
										 style="width: 16px;height: 13px;"
							></image>
						</view> -->
					</view>
					<view class="g_flex_1 g_border_e_b_l g_flex_column_center" style="height: 60px;">
						<view class="g_flex_row_between">
							<view class="g_flex_1 g_h_48"
									  :class="itm.remark || itm.tel ? 'g_flex_column_center' : 'g_flex_column_center'"
							>
								<view class="g_fs_17 g_c_3 g_ell_1">{{itm.fullName || itm.agencyName}}</view>
								<view class="g_fs_14 g_c_9" v-if="itm.remark || itm.tel" style="margin-top: 4px;">
									{{itm.remark && itm.remark.trim() ? itm.remark : (itm.tel ? itm.tel : '-')}}
								</view>
							</view>
							<view class="g_flex_none g_flex_column_center" style="margin-left: 12px;">
								<!-- 三天前：未通过的为已过期，已通过的不动 -->
								<view v-if="type == 1">
									<view v-if="itm.recordStatus == 1" class="g_fs_14 g_c_9">
										{{item.time == '三天前' ? '已过期' : '等待通过'}}
									</view>
									<view v-if="itm.recordStatus == 2">
										<view class="g_radius_14 g_h_28 g_border_e g_fs_14 g_c_6 g_pr_8 g_pl_8 g_flex_row_center flex_center">
											<i class="iconfont icon-duihao g_fsi_12 g_mr_6 "></i>
											已通过
										</view>
									</view>
								</view>
								<view v-if="type == 2">
									<view v-if="itm.recordStatus == 1 && item.time == '近三天'"
												class="g_fs_14 g_c_6 g_bg_f_5 g_pt_8 g_pb_8 g_pl_11 g_pr_11 g_radius_8"
												@click.stop="handleTongguo(itm,item)"
									>通过</view>
									<view v-if="itm.recordStatus == 1 && item.time == '三天前'" class="g_fs_14 g_c_9">已过期</view>
									<view v-if="itm.recordStatus == 2" class="g_fs_14 g_c_9">已通过</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view>
				<g-panel-hr str="没有更多了" />
			</view>
			<view class="g_h_50 g_w_all"></view>
		</view>
	</view>
</template>

<script>
	export default{
		onReady() {
			this.G.setNavStyle();
		},
		onShareAppMessage(){
			return this.G.shareFun();
		},
		data(){
			return{
				cdnBaseImg:this.G.store().cdnBaseImg,
				loading:true,
				speed:-1,
				title:'',
				list:[],
				stickyText:"近三天",
				type:1,
				keys:''
			}
		},
		props:{
			keyword:{
				default:()=>{
					return ''
				}
			}
		},
		onShow() {
			this.type = 2;
			this.keys = this.keyword;
			this.getList();
		},
		watch:{
			'keyword'(val){
				this.keys = val;
				this.loading = true;
				this.speed = -1;
				this.getList();
			},
		},
		methods:{
			getList(){
				let that = this;
				that.G.Get(that.api.bind_recordList + '/' + that.type,{
					pageNum: 1,
					pageSize: 200,
					type:that.type,
					keys:that.keys
				},(res)=>{
					if(res.length == 0){
						that.loading = false;
					}else{
						that.loading = true;
					}
					console.log("申请列表：",res)
					that.speed = res.length;
					if(that.speed == 0){
						that.list = [];
					}else{
						const now = new Date().getTime();
						const threeDaysAgo = now - 3 * 24 * 60 * 60 * 1000;
						const resultArray = res.reduce((acc, item) => {
						  const timeCategory = item.createTime >= threeDaysAgo ? '近三天' : '三天前';
						  const existingCategory = acc.find(category => category.time === timeCategory);
						  if (existingCategory) {
						    existingCategory.children.push(item);
						  } else {
						    acc.push({
						      time: item.createTime >= threeDaysAgo ? '近三天' : '三天前',
						      children: [item]
						    });
						  }
						  return acc;
						}, []);
						console.log('申请列表：',resultArray)
						resultArray.forEach((item,index) => {
							item.isShowTime = true;
						})
						that.list = resultArray;
						that.$forceUpdate();
					}
				},()=>{
					that.loading = false;
				})
			},
			handleTongguo($itm,$item){
				let that = this;
				that.G.Get(
					that.api.bind_recordSubmit + "/" + $itm.id,
					{
						id: $itm.id,
					},
					(res) => {
						uni.showToast({
							title: "已通过验证",
							success() {},
						});
						$itm.recordStatus = 2;
					}
				);
			},
			goPage($itm,$item){
				let that = this;
				console.log('当前行点击事件：',$itm)
				// if($itm.recordStatus == 1){
					// 等待通过
					uni.navigateTo({
						url:'/root/bind/view?id=' + $itm.id + '&type=2&status=' + $itm.recordStatus + '&time=' + $item.time
					})
				// }else{
				// 	let params = {
				// 		id:$itm.agencyId,
				// 		type:that.type,
				// 		isShowMore:false,
				// 		isShowJob:false
				// 	}
					
				// 	if(that.type == 1){// 
				// 		if($itm.recordStatus == 2){// 已关注
				// 			params.isShowMore = true;
				// 			params.isShowJob = true;
				// 		}
				// 	}else{// 粉丝
				// 		if($itm.recordStatus == 2){// 已通过
				// 			// if(){// 是我的发单号
				// 			// 	params.isShowMore = true;
				// 			// 	params.isShowJob = true;
				// 			// }else{// 不是我的发单号
				// 				params.isShowMore = true;
				// 				params.isShowJob = false;
				// 			// }
				// 		}
				// 	}
					
				// 	uni.navigateTo({
				// 		url:'/root/detail/userShare?' + that.G.objToStr(params)
				// 	})
				// }
			},
			handleFixed($item,$index){
				this.stickyText = $item.time;
				this.$forceUpdate();
				$item.isShowTime = false;
			},
			handleUnFixed($item,$index){
				this.stickyText = $item.time;
				this.$forceUpdate();
				$item.isShowTime = true;
			}
		}
	}
</script>

<style lang="scss">
	.thover, .g_bg_f.thover, .item.thover {
		opacity: 0.8;
		background-color: #f5f5f5 !important;
	}
	.g_border_e_b_l{
		border-bottom: 0.5px solid #eee;
	}
</style>