<template>
	<view>
		<!-- <loadlogo v-if="!loadlogo" /> -->
		<view class="container">
			<far-bottom></far-bottom>
			<view class="changeshop-content p-r p-left-right-30">
				<!-- 我的店铺循环模板 -->
				<view class="m-btm20" v-for="(item, index) in userStoreList" @click="go(item.storeid,item.status)">
					<view class="menu-style   ">
						<view class="menu-style dis-flex flex-x-between flex-y-center">
							<view class="dis-flex flex-y-center">
								<image class="menu-style-bg" :src="item.storelogo" />
								<view class="dis-flex flex-dir-column">
									<view class="f-32 over" style="padding-bottom: 12upx;">{{ item.storename }}</view>
									<view class="f-24 dis-flex flex-y-center" style="padding-bottom: 20upx;" v-if="!!item.checkStore">
										<view class="circle"></view>
										当前店铺
									</view>
									<view v-if="item.status == '0' || item.status == '1' || item.status == '3' || item.status == '4'" class="stutsTips" :class="item.status == '0' ? 'status0' : item.status == '1' ? 'status3' : item.status == '3' ? 'status1' :item.status == '4' ? 'status4' :''">
										<text class="stutsTipsText" :class="item.status == '0' ? 'text0' : item.status == '1' ? 'text1' : item.status == '3' ? 'text3' :item.status == '4' ? 'text4' :''">
											{{ item.status == '0' ? '未支付' : item.status == '1' ? '待审核' : item.status == '3' ? '被驳回' :item.status == '4'? '未认证':'' }}
										</text>
										<br/>
									</view>
								</view>
								
							</view>
							<view class="flex-shrink">
								<view class="f-24 col-9 t-c">{{ item.ismain }}</view>
								<view class="f-28 col-f4 t-c">{{item.agent_name}}</view>
							</view>
							
						</view>
						
					</view>
					
					<view class="bottomStuatus" v-if="item.status == '0' || item.status == '3'|| item.status == '4'">
						<view class="marL30 diy-nav-list border-line border-top bottomStuatus1">
							<view>
								<image :src="imgfixUrls + 'merchant/changeStore.png'" class="changeStoreImage"></image>
								<text class="stuatusText">{{ item.reject }}</text>
							</view>
							<view class="buttonStuatus" @click.stop="goStatus(item.storeid, item.status, item.orderid)">
								<text class="buttonStuatusText">{{ item.status == '0' ? '支付' : item.status == '4'?'认证':'修改' }}</text>
							</view>
						</view>
					</view>
					
				</view>
				<!-- 我的店铺循环模板 -->
			</view>
		</view>
		<!-- <TabBars :tabBarAct="0" /> -->
	</view>
</template>
<script>
	import App from '@/common/js/app.js';
	import Loadlogo from '@/components/template/loadlogo';
	import TabBars from '@/components/template/tabBar.vue';
	export default {
		data() {
			return {
				loadlogo: false,
				userStoreList: {},
				checkStoreid: null
			};
		},
		components: {
			Loadlogo,
			TabBars
		},
		computed: {},
		onShow(e) {
			let _this = this;

			if (!!uni.getStorageSync('checkStoreid')) {
				_this.checkStoreid = uni.getStorageSync('checkStoreid');
			}
			_this.init();
		},
		mounted() {},
		methods: {
			goStatus(id, status, orderid) {
				let _this = this;
				if (status == '0') {
					if (orderid == '0') {
						console.info(1111111111)
						App.navigationTo({
							url: 'pages/mainPages/Settled/Settled?page=2&storeid=' + id
						});
					} else {
						console.info(22222222)
						App.navigationTo({
							url: 'pages/mainPages/payment/payment?orderid=' + orderid + '&plugin=store'
						});
					}
				} else if (status == '3') {
					console.info(3333333333)
					App.navigationTo({
						url: 'pages/subPages/merchant/set/set?storeid=' + id
					});
				}else if(status == '4'){
					console.log();
					uni.setStorageSync('checkStoreid', id);
					App.navigationTo({
						url: 'pages/subPages/attestationCenter/index?rzType=2'
					});
				}
			},
			init() {
				let _this = this;
				_this.getUserStoreList();
			},
			go(storeid, status) {
				if (status == '2') {
					uni.setStorageSync('checkStoreid', storeid);
					App.navigationTo({
						url: 'pages/subPages/merchant/merchantHome/merchantHome'
					});
				}

			},
			// 切换商户列表
			getUserStoreList() {
				let _this = this;
				let data = {};
				App._post_form(
					'&p=store&do=userStoreList',
					data,
					res => {
						uni.hideLoading();
						_this.userStoreList = res.data;
						for (let i = 0; i < res.data.length; i++) {
							console.info();
							console.info();
							if (_this.checkStoreid == res.data[i].storeid) {
								res.data[i]['checkStore'] = true;
								console.info(res.data);
							}
						}
					},
					fail => {
						App.navigationTo({
							url: 'pages/mainPages/userCenter/userCenter'
						});
					}
				);
			},
			navgateTo(e, navType) {
				let _this = this;
				switch (navType) {
					case 'contactway':
						App.navigationTo({
							url: 'pages/subPages/dealer/contactway/contactway'
						});
						break;
					case 'withdraw':
						App.navigationTo({
							url: 'pages/subPages/dealer/withdraw/withdraw'
						});
						break;
					case 'setshop':
						App.navigationTo({
							url: 'pages/subPages/dealer/setshop/setshop'
						});
						break;
					case 'order':
						App.navigationTo({
							url: 'pages/subPages/merchant/merchantUserCenter/merchantUserCenter'
						});
						break;
					case 'rank':
						App.navigationTo({
							url: 'pages/subPages/dealer/rank/rank'
						});
						break;
					case 'level':
						App.navigationTo({
							url: 'pages/subPages/dealer/level/level'
						});
						break;
					case 'client':
						App.navigationTo({
							url: 'pages/subPages/dealer/client/client'
						});
						break;
					case 'help':
						App.navigationTo({
							url: 'pages/subPages/dealer/richtext/setrich'
						});
						break;
					case 'gener':
						App.navigationTo({
							url: 'pages/subPages/dealer/gener/gener'
						});
						break;
					case 'poster':
						// #ifdef H5
						location.href = e.currentTarget.dataset.url;
						// #endif
						break;
					case 'shops':
						// #ifdef H5
						location.href = e.currentTarget.dataset.url;
						// #endif
						break;
				}
			}
		}
	};
</script>

<style lang="scss">
	.text0 {
		color: #ffffff;
	}

	.text1 {
		color: #3388ff;
	}

	.text3 {
		color: #ff4444;
	}
	
	.text4{
		color: #333333;
	}
	.status3 {
		background: rgba(243, 247, 253, 1);
	}

	.status1 {
		background: #fef3f3;
	}

	.status0 {
		background: #45e7ab;
		
	}
	
	.status4 {
		background: #CCCCCC;
		// width: 300upx!important;
		// font-size: 10upx!important;
	}

	.stutsTips {
		width: 90upx;
		height: 38upx;
		border-radius: 4upx;
		font-size: 0;
		text-align: center;
	}

	.stutsTipsText {
		line-height: 38upx;
		font-size: 24upx;
	}

	.changeStoreImage {
		width: 50upx;
		height: 50upx;
		vertical-align: middle;
	}

	.buttonStuatusText {
		line-height: 40upx;
		vertical-align: middle;
		font-size: 24upx;
		color: rgba(51, 136, 255, 1);
	}

	.buttonStuatus {
		margin-top: 20upx;
		font-size: 0;
		text-align: center;
		width: 88upx;
		height: 40upx;
		border: 1upx solid rgba(51, 136, 255, 1);
		border-radius: 4upx;
	}

	.stuatusText {
		vertical-align: middle;
		line-height: 86upx;
		font-size: 24upx;
		color: rgba(153, 153, 153, 1);
	}

	.marL30 {
		margin: 0 30upx;
	}

	.bottomStuatus {
		justify-content: space-between;
		display: flex;
		height: 86upx;
		background: #ffffff;
	}

	.bottomStuatus1 {
		justify-content: space-between;
		display: flex;
		height: 86upx;
		width: 630upx;
		background: #ffffff;
	}

	.over {
		display: inline-block;
		width: 300upx;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	page {
		background-color: #f7f7f7;
	}

	.container {

		//圆形
		.circle {
			width: 14upx;
			height: 14upx;
			background: rgb(69, 231, 171);
			border-radius: 50%;
			margin-right: 4px;
		}


		// 详情内容
		.changeshop-content {
			padding-bottom: 120upx;
			margin-top: 37upx;

			// 工具导航
			.tool-tab {
				padding: 30upx 0;

				.tool-tab-title {
					padding: 0 30upx;
				}

				.tool-item {
					.tool-item-icon {
						margin: 0 auto 20upx;
						display: block;
						width: 80upx;
						height: 80upx;
					}
				}
			}

			// 菜单样式
			.menu-style {
				background-color: #ffffff;
				position: relative;
				padding: 30upx;
				border-radius: 10upx;

				.menu-style-bg {
					width: 101upx;
					height: 101upx;
					margin-right: 32upx;
					border-radius: 101upx;
				}
			}
		}
	}
</style>
