menduner-uniapp/pages/index/my.vue

<template>
  <view>
    <view class="text-center" @tap="handleLogin">
      <img src="https://minio.citupro.com/dev/menduner/7.png" alt="" class="img-box">
      <view class="font-weight-bold font-size-20">点击登录</view>
    </view>
    <view style="margin-top: 80rpx;">
		<uni-grid :column="4" :show-border="false">
			<uni-grid-item :index="0" v-for="(val, index) in grid" :key="index" class="text-center">
				<uni-icons :type="val.icon" size="40" color="#00897B"></uni-icons>
				<text class="font-size-13 color-999 mt-5">{{ val.title }}</text>
			</uni-grid-item>
		</uni-grid>
    </view>
    <view style="height: 10rpx; background-color: #f8f8fa;"></view>

    <view class="card">
		<uni-list>
			<uni-list-item v-for="item in list" :key="item.title" :title="item.title" link showArrow :rightText="item.rightTex || ''"></uni-list-item>
		</uni-list>
	</view>

    <AuthModal ref="authModal"></AuthModal>
  </view>
</template>

<script setup>
import { ref } from 'vue'
import AuthModal from '@/components/AuthModal'

const authModal = ref()
const grid = [
  { title: '全部', icon: 'list' },
  { title: '被查看', icon: 'eye-filled' },
  { title: '面试邀约', icon: 'auth-filled' },
  { title: '不合适', icon: 'closeempty' }
]

const list = [
	{	title:'我的简历',	path:''	},					
	{ title:'职位订阅', path:'' },
	{	title:'意见反馈',	path:'' },
	{ title:'切换为招聘者', path:'', rightTex: '我要招人' }
]

const handleLogin = () => {
  authModal.value.open()
}
</script>

<style scoped lang="scss">
.img-box {
  width: 150rpx;
  height: 150rpx;
  border: 2rpx solid #ccc;
  border-radius: 50%;
}
::v-deep .uni-list-item{
	height: 140rpx !important;
	line-height: 140rpx !important;
}
::v-deep .uni-list-item__content-title{
	font-size: 32rpx !important;
	font-weight: 500;
}
</style>