<template>
	<view class="profile-page">
		<!-- 自定义顶部导航栏 -->
		<view class="custom-navbar">
			<!-- 左侧返回按钮和标题 -->
			<view class="navbar-left">
				<image class="back-icon"
					src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/456f4e6c-e86a-42c9-a272-484db9af6c7c"
					mode="aspectFit" @click="handleBack"></image>
				<text class="navbar-title">我的资料</text>
			</view>

			<!-- 右侧状态栏 -->
			<view class="navbar-right">
				<!-- <view class="nav-status-item" @click="handleShareWechat">
          <image class="nav-status-icon" src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/8a412688-b794-4407-bba6-a6dc65d75f08" mode="aspectFit"></image>
          <text class="nav-status-text">分享到微信</text>
        </view>
        <view class="nav-status-item" @click="handleViewShop">
          <image class="nav-status-icon" :src="identity == '2' ? 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/2b5de852-2d35-4786-a643-d20cabb3eaee' : 'https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/85638da9-804e-4811-8378-d1bb6007f99d'" mode="aspectFit"></image>
          <text class="nav-status-text">{{ identity == '2' ? '查看店铺' : '查看手艺人' }}</text>
        </view> -->
			</view>
		</view>

		<!-- 内容区域 -->
		<view class="content">
			<!-- 基础资料部分 -->
			<view class="section-card">
				<view class="section-header">
					<view class="title-bar"></view>
					<text class="section-title">基础资料</text>
				</view>
				<text class="section-desc">店铺信息将影响顾客到店消费体验，请确保信息准确。</text>

				<view class="subsection">
					<view class="subsection-content">
						<!-- 营业时间（商家） / 服务时间（手艺人） -->
						<view class="info-item" @click="navigateToTimeSetting">
							<view class="info-left">
								<image class="item-icon"
									src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/21f1efaf-0c17-49b0-a2b2-e0fd573b92b3"
									mode="aspectFit"></image>
								<text class="item-label">{{ identity == '2' ? '营业时间' : '服务时间' }}</text>
							</view>
							<view>
								<image
									src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/338d957b-cbb6-409b-9e7a-ef5faa0f9b70.png"
									mode="widthFix"
									style="width:26rpx;margin-top: 26rpx;position: relative;top: 4rpx;left: -10rpx;"
									v-if="!userInfo.business_time">
								</image>
								<text style="margin-right: 16rpx;"
									:style="{ color: userInfo.business_time ? '#c9c9c9' : '#ec5d57' }">
									{{ userInfo.business_time ? '已设置' : '待完善' }}
								</text>
								<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit">
								</image>
							</view>
						</view>
						<view class="info-item" @click="navigateToServiceSkill">
							<view class="info-left">
								<image class="item-icon"
									src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/b90e2322-a261-4c17-a581-85010c3bc112"
									mode="aspectFit"></image>
								<text class="item-label">服务技能</text>
							</view>
							<view>
								<image
									src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/338d957b-cbb6-409b-9e7a-ef5faa0f9b70.png"
									mode="widthFix"
									style="width:26rpx;margin-top: 26rpx;position: relative;top: 4rpx;left: -10rpx;"
									v-if="!userInfo.servers_kill_arr || userInfo.servers_kill_arr.length === 0">
								</image>
								<text style="margin-right: 16rpx;"
									:style="{ color: (userInfo.servers_kill_arr && userInfo.servers_kill_arr.length > 0) ? '#c9c9c9' : '#ec5d57' }">
									{{ (userInfo.servers_kill_arr && userInfo.servers_kill_arr.length > 0) ? '已设置' :
										'待完善' }}
								</text>
								<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit">
								</image>
							</view>
						</view>

						<!-- 门店信息 -->
						<view class="info-item" v-if="identity == '2'" @click="navigateToShopInfo">
							<view class="info-left">
								<image class="item-icon"
									src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/e9618006-db69-446e-92e1-ba9dd81e79f9"
									mode="aspectFit"></image>
								<text class="item-label">门店信息</text>
							</view>
							<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
						</view>

						<!-- 服务区域（手艺人显示） -->
						<view class="info-item" v-if="identity == '1'" @click="navigateToServiceArea">
							<view class="info-left">
								<image class="item-icon"
									src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/a35603b1-50fb-4248-9f2e-2dd4d5e249c0"
									mode="aspectFit"></image>
								<text class="item-label">服务区域</text>
							</view>
							<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
						</view>

						<!-- 个人信息（手艺人显示） -->
						<view class="info-item" v-if="identity == '1'" @click="navigateToPersonalInfo">
							<view class="info-left">
								<image class="item-icon"
									src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/77dc7a16-3b86-44e5-8acc-5f3b85ffc137"
									mode="aspectFit"></image>
								<text class="item-label">个人信息</text>
							</view>
							<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
						</view>

						<!-- 个人信息（手艺人显示） -->
						<view class="info-item" @click="navigateToimg">
							<view class="info-left">
								<image class="item-icon"
									src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/53a9d1e1-e2d2-4001-b599-82e0c0747f1a.png"
									mode="aspectFit"></image>
								<text class="item-label">相册管理</text>
							</view>
							<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
						</view>

						<!-- 个人信息（手艺人显示） -->
						<view class="info-item" @click="navigateTovideo">
							<view class="info-left">
								<image class="item-icon"
									src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/6fc821cd-8dd1-41f1-8854-889fb5f76b78.png"
									mode="aspectFit"></image>
								<text class="item-label">视频管理</text>
							</view>
							<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
						</view>

					</view>
				</view>
			</view>

			<!-- 经营资质部分 -->
			<view class="section-card">
				<view class="section-header">
					<view class="title-bar"></view>
					<text class="section-title">经营资质</text>
				</view>

				<view class="subsection-content">
					<!-- 资质信息 -->
					<view class="info-item" @click="navigateToQualification">
						<view class="info-left">
							<image class="item-icon"
								src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/2677692c-5931-4ac7-846e-b6d321184789"
								mode="aspectFit"></image>
							<text class="item-label">资质信息</text>
						</view>
						<view>
							<image
								src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/338d957b-cbb6-409b-9e7a-ef5faa0f9b70.png"
								mode="widthFix"
								style="width:26rpx;margin-top: 26rpx;position: relative;top: 4rpx;left: -10rpx;"
								v-if="userInfo.credentials_state === 0">
							</image>
							<text style="margin-right: 16rpx;"
								:style="{ color: userInfo.credentials_state === 0 ? '#ec5d57' : userInfo.credentials_state === 1 ? '#e59e45' : '#c9c9c9' }">
								{{ userInfo.credentials_state === 0 ? '待完善' : userInfo.credentials_state === 1 ? '审核中' :
								'已认证' }}
							</text>
							<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit">
							</image>
						</view>
					</view>

					<!-- 所属门店（手艺人显示） -->
					<view class="info-item" v-if="identity == '1'" @click="navigateToBelongShop">
						<view class="info-left">
							<image class="item-icon"
								src="https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/system/b5541cb5-58c1-4e72-b88f-5cf6450338a8"
								mode="aspectFit"></image>
							<text class="item-label">所属门店</text>
						</view>
						<image class="arrow-right" src="/static/images/arrow_right.png" mode="aspectFit"></image>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		handleImgSizeUni
	} from '@/utils/service.js'
	import request from "../../utils/request";

	export default {
		data() {
			return {
				identity: '',
				currentUserId: '', // 当前用户ID
				userInfo: {}, // 用户信息
				sharing: false // 添加分享状态标记
			}
		},
		onLoad() {
			// 页面显示时重新加载身份信息，确保数据最新
			this.loadIdentity()
			console.log('当前身份:', this.identity)
			// 加载用户信息
			this.loadUserInfo()
		},
		onShow() {
			// 页面显示时也重新加载，确保数据最新
			this.loadIdentity()
			this.loadUserInfo()
		},
		methods: {
			// 返回按钮处理
			handleBack() {
				uni.navigateBack()
			},

			// 分享到微信
			handleShareWechat() {
				console.log('分享到微信')

				this.handleShareProcess()
			},

			async handleShareProcess() {
				// 如果正在分享中，防止重复点击
				if (this.sharing) {
					return;
				}

				// 设置分享状态
				this.sharing = true;

				try {
					// 显示加载提示
					uni.showLoading({
						title: '正在准备分享...',
						mask: true
					});

					// 确保用户信息已加载
					if (!this.currentUserId) {
						await this.loadUserInfo()
					}

					// 检查是否已加载用户信息
					if (!this.currentUserId) {
						uni.showToast({
							title: '无法获取用户信息',
							icon: 'none'
						})
						return
					}

					// 根据环境处理
					// #ifdef APP-PLUS
					this.handleAppAutoShare()
					// #endif

					// #ifdef MP-WEIXIN
					this.handleMpAutoShare()
					// #endif

					// #ifdef H5
					this.handleH5Share()
					// #endif
				} catch (error) {
					console.error('分享过程出错:', error);
					uni.hideLoading();
					this.sharing = false;
					uni.showToast({
						title: '分享失败，请重试',
						icon: 'none'
					});
				}
			},

			// H5环境分享
			handleH5Share() {
				// 在H5环境，通常使用浏览器的分享功能或复制链接
				const shareUrl = window.location.href
				uni.showModal({
					title: '分享提示',
					// content: `请复制链接分享给好友：${shareUrl}`,
					content: `请在美融融Plus APP 环境下使用此功能`,

					showCancel: false,
					confirmText: '好的',
					success: (res) => {
						if (res.confirm) {
							// // 复制链接到剪贴板
							// uni.setClipboardData({
							//   data: shareUrl,
							//   success: () => {
							//     uni.showToast({
							//       title: '链接已复制',
							//       icon: 'success'
							//     })
							//   }
							// })
						}
					}
				})
			},

			// 小程序环境处理
			handleMpAutoShare() {
				// 小程序无法自动触发分享，跳转后提示用户手动操作
				const url = this.identity == '2' ?
					`/pages/user/store-detail?id=${this.currentUserId}` :
					`/pages/user/syr-detail?id=${this.currentUserId}`;

				uni.navigateTo({
					url: url,
					success: () => {
						setTimeout(() => {
							uni.showToast({
								title: '请点击右上角分享',
								icon: 'none',
								duration: 2000
							});
						}, 500);
					}
				});
			},

			// APP环境自动分享
			handleAppAutoShare() {
				if (!this.currentUserId) {
					uni.showToast({
						title: '无法获取用户信息',
						icon: 'none'
					});
					return;
				}

				// 清除旧的分享标记
				uni.removeStorage({
					key: 'share_success'
				});

				// 跳转到店铺主页并自动触发分享
				const url = this.identity == '2' ?
					`/pages/user/store-detail?id=${this.currentUserId}&autoShare=1` :
					`/pages/user/syr-detail?id=${this.currentUserId}&autoShare=1`;

				uni.navigateTo({
					url: url,
					success: () => {
						console.log('跳转成功，将自动触发分享');
						// 跳转成功后立即隐藏loading，避免页面闪烁
						setTimeout(() => {
							uni.hideLoading();
							this.sharing = false;
						}, 200);
					},
					fail: () => {
						console.log('跳转失败:', err);
						uni.hideLoading();
						this.sharing = false;
						this.showManualShareOption();
					}
				});
			},

			// 执行APP分享
			executeAppShare(imageUrl) {
				// 备用图片地址
				const backupImageUrl =
					"https://mrrplus.oss-cn-beijing.aliyuncs.com/photo/yh/1756713709528-717.png?x-oss-process=image/resize,p_40"

				// 根据身份设置不同的分享标题
				const shareTitle = this.identity == '2' ?
					"好友刚推了个超赞商家！点开认识TA ~" :
					"好友刚推了个超赞手艺人！点开认识TA ~"

				// 生成分享配置
				const shareConfig = {
					provider: "weixin",
					scene: "WXSceneSession",
					type: 5,
					title: shareTitle,
					miniProgram: {
						id: "gh_89c92e18b70b", // 小程序原始ID
						path: this.getSharePath(), // 动态分享路径
						type: 0, // 正式版
						webUrl: "https://www.baidu.com/", // 降级网页地址
					},
					imageUrl: imageUrl,
					success: (res) => {
						console.log("分享成功:", JSON.stringify(res))
						uni.showToast({
							title: '分享成功',
							icon: 'success'
						})
					},
					fail: (err) => {
						console.log("分享失败:", JSON.stringify(err))
						// 尝试使用备用图片
						if (imageUrl !== backupImageUrl) {
							console.log("尝试使用备用图片分享...")
							this.executeAppShare(backupImageUrl)
						} else {
							uni.showToast({
								title: '分享失败',
								icon: 'none'
							})
						}
					}
				}

				// 检查是否支持分享API
				if (uni.share) {
					uni.share(shareConfig)
				} else {
					uni.showToast({
						title: '当前环境不支持分享',
						icon: 'none'
					})
				}
			},

			// 获取分享路径
			getSharePath() {
				// 根据身份生成不同的分享路径
				if (this.identity == '2') {
					// 商家分享店铺详情页
					return `/pages/user/store-detail?id=${this.currentUserId || ''}`
				} else {
					// 手艺人分享个人主页
					return `/pages/user/syr-detail?id=${this.currentUserId || ''}`
				}
			},

			// 查看店铺
			async handleViewShop() {
				console.log('查看店铺')

				// 确保用户信息已加载
				if (!this.currentUserId) {
					await this.loadUserInfo()
				}

				// 如果仍然没有用户ID，提示用户手动输入或联系客服
				if (!this.currentUserId) {
					uni.showModal({
						title: '提示',
						content: '无法获取用户信息，请联系客服或稍后重试',
						showCancel: false,
						confirmText: '确定'
					})
					return
				}

				// 根据身份跳转到不同的页面
				if (this.identity == '2') {
					// 商家跳转到店铺主页
					uni.navigateTo({
						url: '/pages/user/store-detail?id=' + this.currentUserId
					})
				} else {
					// 手艺人跳转到个人主页
					uni.navigateTo({
						url: '/pages/user/syr-detail?id=' + this.currentUserId
					})
				}
			},

			// 加载用户信息 - 主要使用接口获取
			async loadUserInfo() {
				try {
					// 根据身份设置type参数（参考个人中心页面的逻辑）
					let type = 1 // 默认值
					if (this.identity == '1') {
						type = 2 // 手艺人
					} else if (this.identity == '2') {
						type = 3 // 商家
					}

					console.log('调用接口获取用户信息，type:', type)

					// 调用接口获取用户信息
					const result = await request.post('/sj/user/getUser', {
						type
					})

					if (result.data && result.data.id) {
						this.userInfo = result.data
						this.currentUserId = result.data.id

						// 存储到本地，避免重复调用
						uni.setStorageSync('userInfo', result.data)
						console.log('从接口获取用户信息成功:', this.userInfo)
					} else {
						console.log('接口返回数据异常:', result)
					}
				} catch (error) {
					console.log('获取用户信息失败:', error)

					// 降级方案：尝试从其他可能的位置获取用户ID
					this.tryAlternativeUserInfo()
					uni.hideLoading();
				}
			},

			// 备用方案：从其他位置获取用户信息
			tryAlternativeUserInfo() {
				try {
					const app = getApp()

					// 方法1: 从全局数据获取用户ID
					if (app.globalData.userInfo && app.globalData.userInfo.id) {
						this.currentUserId = app.globalData.userInfo.id
						this.userInfo = app.globalData.userInfo
						console.log('从全局数据获取用户ID:', this.currentUserId)
						return
					}

					// 方法2: 从本地存储获取完整的用户信息
					const userInfo = uni.getStorageSync('userInfo')
					if (userInfo && userInfo.id) {
						this.currentUserId = userInfo.id
						this.userInfo = userInfo
						console.log('从存储获取用户ID:', this.currentUserId)
						return
					}

					// 方法3: 直接获取用户ID
					const userId = uni.getStorageSync('userId')
					if (userId) {
						this.currentUserId = userId
						console.log('从存储获取用户ID:', userId)
						return
					}

					console.log('所有获取用户信息的方法都失败了')
				} catch (e) {
					console.log('备用方案获取用户信息失败:', e)
				}
			},

			loadIdentity() {
				// 从全局数据获取身份
				const app = getApp()
				const globalIdentity = app.globalData.artisanType
				console.log('从全局数据获取身份:', globalIdentity)

				if (globalIdentity) {
					this.identity = globalIdentity
					uni.setStorageSync('user_identity', globalIdentity)
				} else {
					// 如果全局数据没有，尝试从本地存储获取
					const localIdentity = uni.getStorageSync('user_identity')
					if (localIdentity) {
						this.identity = localIdentity
						console.log('从本地存储获取身份:', localIdentity)
					} else {
						console.log('未获取到身份信息')
						// 默认设为手艺人
						this.identity = '1'
					}
				}

				console.log('当前身份:', this.identity)
			},

			navigateToTimeSetting() {
				if (this.identity == '2') {
					// 商家跳转到营业时间页面
					uni.navigateTo({
						url: '/pages/shop/business-time'
					})
				} else {
					// 手艺人跳转到服务时间页面
					uni.navigateTo({
						url: '/pages/artisan/service-time'
					})
				}
			},

			navigateToServiceSkill() {
				if (this.identity == '2') {
					// 商家跳转到商家服务技能页面
					uni.navigateTo({
						url: '/pages/shop/service-skills'
					})
				} else {
					// 手艺人跳转到手艺人服务技能页面
					uni.navigateTo({
						url: '/pages/artisan/service-skills'
					})
				}
			},

			navigateToShopInfo() { // 商家：门店信息 
				uni.navigateTo({
					url: '/pages/shop/sj-info-change'
				})
			},

			navigateToServiceArea() { // 手艺人：服务区域
				uni.navigateTo({
					url: '/pages/artisan/service-area'
				})
			},

			navigateToPersonalInfo() { // 手艺人：个人信息
				uni.navigateTo({
					url: '/pages/artisan/syr-info-change'
				})
			},

			navigateToimg() { // 图片管理
				uni.navigateTo({
					url: '/pages/shop/photoAlbum/photoManage?type=1'
				})
			},

			navigateTovideo() { // 视频管理
				uni.navigateTo({
					url: '/pages/shop/photoAlbum/photoManage?type=2'
				})
			},

			navigateToQualification() { 
                const state = this.userInfo.credentials_state;

                if (state === 1) {
                    // === 1. 审核中 ===
                    // 跳转到最新确认的专属进度/客服二维码页面
                    uni.navigateTo({
                        url: '/pages/ruzhu/submitres'
                    });
                } else if (state === 0) {
                    // === 2. 待完善 / 被驳回 ===
                    // 同步首页逻辑：判断是老手还是纯新手
                    if (this.userInfo.id_type !== 0) {
                        // 已经开启过入驻，直接空降到最后一步（门店信息）
                        uni.navigateTo({
                            url: '/pages/ruzhu/ruzhu?step=3'
                        });
                    } else {
                        // 完全没入驻过的纯新手，老老实实从第一步开始
                        uni.navigateTo({
                            url: '/pages/ruzhu/ruzhu'
                        });
                    }
                } else {
                    // === 3. 已认证 ===
                    // 跳转到资质信息的查看/修改页面
                    uni.navigateTo({
                        url: '/pages/shop/qualification_sj_change'
                    });
                }
            },

			navigateToBelongShop() { // 手艺人：所属门店
				uni.navigateTo({
					url: '/pages/artisan/belong_shop'
				})
			}
		}
	}
</script>

<style>
	.profile-page {
		min-height: 100vh;
		background-color: #f5f5f5;
	}

	/* 自定义导航栏样式 */
	.custom-navbar {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		height: 108rpx;
		/* 使用标准导航栏高度 */
		background: white;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 32rpx;
		z-index: 999;
		box-sizing: border-box;
		/* 适配不同机型的顶部安全区域 */
		padding-top: var(--status-bar-height);
		height: calc(128rpx + var(--status-bar-height));
	}

	/* 导航栏左侧 */
	.navbar-left {
		display: flex;
		align-items: center;
	}

	.back-icon {
		width: 16rpx;
		height: 32rpx;
		margin-right: 23rpx;
	}

	.navbar-title {
		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		font-size: 32rpx;
		color: #333333;
		line-height: 45rpx;
		text-align: left;
		font-style: normal;
	}

	/* 导航栏右侧状态栏 */
	.navbar-right {
		display: flex;
		align-items: center;
	}

	.nav-status-item {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-left: 11rpx;
		padding: 16rpx;
	}

	.nav-status-icon {
		width: 44rpx;
		height: 44rpx;
		margin-bottom: 7rpx;
	}

	.nav-status-text {
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		font-size: 20rpx;
		color: #333333;
		line-height: 28rpx;
		text-align: left;
		font-style: normal;
	}

	.content {
		padding: 20rpx;
		/* 动态计算内容区域的上边距 */
		padding-top: calc(128rpx + var(--status-bar-height) + 20rpx);
	}

	/* 部分卡片 */
	.section-card {
		background: white;
		border-radius: 20rpx;
		padding: 20rpx 20rpx 0 20rpx;
		margin-bottom: 20rpx;
	}

	.section-header {
		display: flex;
		align-items: center;
		margin-bottom: 8rpx;
	}

	.section-title {
		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		font-size: 32rpx;
		color: #1D2129;
		line-height: 48rpx;
		text-align: left;
		font-style: normal;
	}

	.title-bar {
		width: 6rpx;
		height: 30rpx;
		background-color: #E8101E;
		margin-right: 10rpx;
		border-radius: 5rpx;
	}

	.section-desc {
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #666666;
		line-height: 33rpx;
		text-align: left;
		font-style: normal;
		margin-left: 20rpx;
		letter-spacing: 0.5rpx;
	}

	/* 子部分 */
	.subsection {
		/* margin-top: 10rpx; */
		/* margin-left: 17rpx; */
	}

	.subsection-content {
		border-radius: 12rpx;
		overflow: hidden;
		margin-left: 17rpx;
	}

	/* 信息项 */
	.info-item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 32rpx 0;
		border-bottom: 1rpx solid #f0f0f0;
	}

	.info-item:last-child {
		border-bottom: none;
	}

	.info-left {
		display: flex;
		align-items: center;
	}

	.item-icon {
		width: 48rpx;
		height: 48rpx;
		margin-right: 24rpx;
	}

	.item-label {
		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		font-size: 28rpx;
		color: #333333;
		line-height: 40rpx;
		text-align: left;
		font-style: normal;
	}

	.arrow-right {
		margin-right: 19rpx;
		width: 11rpx;
		height: 22rpx;
	}
</style>