ieplus-app/src/pagesMain/pages/me/components/me-menu.vue

<template>
  <view class="">
    <view class="mx-30">
      <view class="mt-40 text-30 text-fore-title font-bold mb-16">常用功能</view>
      <view class="shadow-card rounded-8 py-20 grid grid-cols-4 bg-white">
        <view v-for="item in menus" :key="item.name" class="flex flex-col items-center" @click="handleClick(item)">
          <ie-image :src="item.icon" custom-class="w-70 h-70 rounded-full" />
          <view class="mt-10 text-28 text-fore-subtitle">{{ item.name }}</view>
        </view>
      </view>
      <view class="mt-40 text-30 text-fore-title font-bold">其他功能</view>
    </view>
    <view class="-mt-10 rounded-8 py-20">
      <uv-cell-group :border="false">
        <uv-cell isLink :cellStyle="cellStyle"
          @click="handleNavigate('/pagesOther/pages/personal-center/basic-info/basic-info', '基本资料')">
          <template #title>
            <view class="flex items-center gap-x-10">
              <ie-image src="/static/personal/icon_jibenziliao@2x.png" custom-class="w-34 h-34" />
              <text class="text-30 text-fore-subtitle">基本资料</text>
            </view>
          </template>

        </uv-cell>
        <uv-cell isLink :cellStyle="cellStyle"
          @click="handleNavigate('/pagesOther/pages/personal-center/change-pwd/change-pwd', '修改密码')">
          <template #title>
            <view class="flex items-center gap-x-10">
              <ie-image src="/static/personal/icon_password@2x.png" custom-class="w-36 h-36" />
              <text class="text-30 text-fore-subtitle">修改密码</text>
            </view>
          </template>
        </uv-cell>
        <uv-cell isLink :cellStyle="cellStyle" @click="handleQuestion">
          <template #title>
            <view class="flex items-center gap-x-10">
              <uv-icon name="question-circle" size="16" color="#888888" />
              <text class="text-30 text-fore-subtitle">常见问题</text>
            </view>
          </template>
        </uv-cell>
      </uv-cell-group>
    </view>
    <view v-if="userStore.isLogin" class="mt-80 w-400 mx-auto">
      <uv-button type="error" size="medium" shape="circle" text="退出登陆" plain @click="handleLogout"></uv-button>
    </view>
  </view>
</template>
<script lang="ts" setup>
import useTransferPage from '@/hooks/useTransferPage';
import useUserStore from '@/store/userStore';
const { transferTo } = useTransferPage();
const userStore = useUserStore();

type MenuItem = {
  name: string;
  icon: string;
  pagePath: string;
};

const menus = [
  {
    name: '测评报告',
    icon: '/static/personal/test_report.png',
    pagePath: '/pagesOther/pages/test-center/list/list',
  },
  {
    name: '我的收藏',
    icon: '/static/personal/my_collected.png',
    pagePath: '/pagesOther/pages/personal-center/my-concerned/my-concerned',
  },
  {
    name: '我的志愿表',
    icon: '/static/personal/my_simulated.png',
    pagePath: '/pagesOther/pages/ie/entry-ai-list/entry-ai-list',
  },
  {
    name: '绑定会员卡',
    icon: '/static/personal/bind_card.png',
    pagePath: '/pagesOther/pages/personal-center/bind-card/bind-card',
  }
];
const cellStyle = {
  padding: '30rpx 30rpx'
}
const handleClick = async (item: MenuItem) => {
  const isLogin = await userStore.checkLogin();
  if (isLogin) {
    transferTo(item.pagePath);
  }
}
const handleNavigate = async (pagePath: string, title: string) => {
  const isLogin = await userStore.checkLogin();
  if (isLogin) {
    transferTo(pagePath, {
      data: {
        settingName: title
      }
    });
  }
}
const handleQuestion = async () => {
  const isLogin = await userStore.checkLogin();
  if (isLogin) {
    transferTo('/pagesOther/pages/h5/h5', {
      data: {
        title: '常见问题',
        url: 'https://www.dz1kt.com/admin/FAQ/FAQ_IE.html'
      }
    });
  }
}
const handleLogout = async () => {
  const confirm = await userStore.askLogout();
  if (confirm) {

  }
}
</script>
<style lang="scss" scoped></style>