<template>
  <FlexCol :innerStyle="{
    backgroundImage: 'url(https://xy.wenlvti.net/app_static/images/mine/TopBanner.png)',
    backgroundSize: '100% auto',
    backgroundRepeat: 'no-repeat',
    backgroundPosition: 'top center',
    minHeight: '100vh',
  }">
    <StatusBarSpace />
    <NavBar leftButton="back" />
    <FlexCol gap="gap.xl" padding="space.lg">
      <FlexCol center>
        <Text fontConfig="h2">非遗数字化资源信息校对管理员</Text>
        <FlexRow>
          <Text fontConfig="subText">技术支持：18649931391</Text>
        </FlexRow>
      </FlexCol>
      <FlexRow justify="space-between">
        <FlexRow align="center" gap="gap.md">
          <Avatar 
            randomColor
            :src="authStore.userInfo?.avatar" 
            defaultAvatar="https://mncdn.wenlvti.net/app_static/minnan/logo.png"
          />
          <Text fontConfig="h4" maxWidth="400rpx" :lines="1">{{ authStore.userInfo?.nickname }}</Text>
        </FlexRow>
        <FlexRow :flexShrink="0">
          <WxButton openType="contact">
            <Button type="text" icon="wechat">在线客服</Button>
          </WxButton>
        </FlexRow>
      </FlexRow>
      <CellGroup round>
      <Cell icon="https://mncdn.wenlvti.net/uploads/20250313/9fb29e8bdb66490034145c90f892773a.png" title="传承协议签署表" showArrow touchable @click="navTo('assessment/argeement-sign-list')" />
      <Cell icon="https://mncdn.wenlvti.net/uploads/20250313/66d4665b1da5075e60148312469b2630.png" title="自查评估表" showArrow touchable @click="navTo('assessment/evaluation-list')" />
      </CellGroup>
      <CellGroup round>
        <Cell title="返回闽南文化" showArrow touchable @click="back()" />
        <Cell title="修改密码" showArrow touchable @click="navTo('user/change-password')" />
        <Cell v-if="!isBindWx" title="绑定微信" showArrow touchable @click="navTo('user/bind-wx')" />
        <Cell title="退出登录" showArrow touchable @click="onLogout" />
      </CellGroup>
    </FlexCol>
    <XBarSpace />
  </FlexCol>
</template>

<script setup lang="ts">
import { useAuthStore } from '@/store/auth';
import CellGroup from '@/components/basic/CellGroup.vue';
import Cell from '@/components/basic/Cell.vue';
import Text from '@/components/basic/Text.vue';
import FlexCol from '@/components/layout/FlexCol.vue';
import FlexRow from '@/components/layout/FlexRow.vue';
import WxButton from '@/components/basic/WxButton.vue';
import XBarSpace from '@/components/layout/space/XBarSpace.vue';
import StatusBarSpace from '@/components/layout/space/StatusBarSpace.vue';
import NavBar from '@/components/nav/NavBar.vue';
import Avatar from '@/components/display/Avatar.vue';
import Button from '@/components/basic/Button.vue';
import { back, navTo } from '@/components/utils/PageAction';
import { confirm } from '@/components/utils/DialogAction';
import { useIsBindWx } from './composeable/isBindWx';

const authStore = useAuthStore();
const { isBindWx } = useIsBindWx();

function onLogout() {
  confirm({
    content: '您确定要退出登录吗？',
  }).then((res) => {
    if (res) {
      authStore.logout();
      back();
    }
  });
}
</script>