<template>
	<view class="p-2">
		<view class="p-32 white">
			<view class="flex-row">
				<u-image width="128rpx" height="128rpx" shape="circle" :src="avatar">
					<u-loading slot="loading"></u-loading>
				</u-image>
				<view class="flex-col flex-jus-sp m-l-32">
					<d-text :text="info.name||''" className="fs-36" :bold="true"></d-text>
					<d-text :text="identity==3?'导医':'客服'" :bold="true"></d-text>
				</view>
			</view>
		</view>
		<!-- 菜单卡：绑定微信 / 业务项 / 设置 / 切换账号 -->
		<view class="p-row-32 b-r-8 white m-t-2">
			<view class="wx-bind-wrap p-col-24">
				<wx-bind-entry ref="wxBindEntry" />
			</view>
			<view class="p-col-32 bottom-border" @click="$go('../../subPackages/sub_my/my_commonReply/index')">
				<view class="flex-row flex-jus-sp flex-ali-center">
					<u-icon margin-left="20" label-size="32" label-color="#31353D" name="chat" label="快捷回复" size="40"
						color="#6C7380"></u-icon>
					<u-icon name="arrow-right" size="32" color="#A7ABB0"></u-icon>
				</view>
			</view>
			<view class="p-col-32 bottom-border flex-jus-sp flex-row flex-ali-center" @click="$go()">
				<u-icon margin-left="20" label-size="32" label-color="#31353D" name="kefu-ermai" label="联系客服" size="40"
					color="#6C7380"></u-icon>
				<view class="flex-row flex-ali-center">
					<view class="m-r-16 flex-row flex-jus-center flex-ali-center badge">
						<u-badge type="error" count="7" :absolute="false"></u-badge>
					</view>
					<u-icon name="arrow-right" size="32" color="#A7ABB0"></u-icon>
				</view>
			</view>
			<view class="p-col-32 bottom-border" @click="$go('../../subPackages/sub_pharmacist/pharmacist_setInfo')">
				<view class="flex-row flex-jus-sp flex-ali-center">
					<u-icon margin-left="20" label-size="32" label-color="#31353D" name="setting" label="设置" size="40"
						color="#6C7380"></u-icon>
					<u-icon name="arrow-right" size="32" color="#A7ABB0"></u-icon>
				</view>
			</view>
			<view class="account-switch-wrap p-col-8">
				<account-switch-entry />
			</view>
		</view>
		<!-- 独立绿色退出按钮 -->
		<view class="logout-wrap p-row-32 m-t-12">
			<u-button :throttle-time="0" shape="circle"
				:custom-style="{ backgroundColor: '#6ACDBB', color: '#fff', height: '96rpx' }"
				@click="logout">退出登录</u-button>
		</view>
	</view>
</template>

<script>
	/**
	 * 导医/客服「我的」：绑定微信 + 切换账号 + 退出登录上提到主页（对齐医生）
	 */
	import { logout } from '@/api/all.js'
	import WxBindEntry from '@/components/wx-bind-entry/wx-bind-entry.vue'
	import AccountSwitchEntry from '@/components/account-switch/account-switch-entry.vue'
	export default {
		components: { WxBindEntry, AccountSwitchEntry },
		props: {
			avatar: {
				type: String,
				default: ''
			},
			info: {
				type: Object,
				default: () => {
					return {}
				}
			}
		},
		data() {
			return {
				identity: (uni.getStorageSync('userInfo') || {}).role || 3,
			};
		},
		methods: {
			/** 父页 onShow 时刷新绑定微信入口展示状态 */
			refreshWxBind() {
				const ref = this.$refs.wxBindEntry
				if (ref && typeof ref.refresh === 'function') {
					ref.refresh()
				}
			},
			logout() {
				logout({ store_id: uni.getStorageSync('store_id') || 11001 }).then((res) => {
					if (res.errcode != -1) {
						uni.clearStorage()
						uni.clearStorageSync()
						this.$go('/pages/login/index', 2)
					} else {
						this.$toast(res.msg);
					}
				})
			},
		},
		options: {
			styleIsolation: 'shared'
		},
	};
</script>
<style>
	page {
		background-color: #F9FAFB;
	}
</style>
<style lang="scss">
	.badge {
		background-color: #F7F8FA;
		border-radius: 32rpx;
		width: 64rpx;
		height: 40rpx;
	}
	.wx-bind-wrap {
		border-bottom: 1rpx solid #f0f0f0;
	}
	.logout-wrap {
		margin-bottom: 32rpx;
	}
</style>
