mechanicStore-app/pages/myEdit/setting.uvue

<template>
  <view class="setting-page">
    <view class="setting-list">
      <view class="setting-item" @click="goToAccountSecurity">
        <text class="item-text">账号安全</text>
        <u-icon name="arrow-right" size="18" color="#999" />
      </view>
      <view class="setting-item" @click="goToFeedback">
        <text class="item-text">意见反馈</text>
        <u-icon name="arrow-right" size="18" color="#999" />
      </view>
      <view class="setting-item" @click="goToAbout">
        <text class="item-text">关于我们</text>
        <u-icon name="arrow-right" size="18" color="#999" />
      </view>
    </view>
    <view class="logout-section">
      <button class="logout-btn" @click="doLogout">退出登录</button>
    </view>
  </view>
</template>

<script setup lang="ts">
const goToAccountSecurity = () => {
  uni.navigateTo({
    url: '/pages/myEdit/account-security'
  })
}
const goToFeedback = () => {
  uni.navigateTo({
    url: '/pages/myEdit/feedback'
  })
}
const goToAbout = () => {
  uni.navigateTo({
    url: '/pages/myEdit/about'
  })
}
const doLogout = () => {
  // 清除本地 token 或其他信息
  uni.removeStorageSync('token');
  uni.showToast({ title: '已退出登录', icon: 'success' });
  setTimeout(() => {
    uni.reLaunch({
      url: '/pages/login/login'
    })
  }, 500)
}
</script>

<style>
.setting-page {
 
  background: #f7f8fa;
  padding-top: 20rpx;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.setting-list {
  background: #fff;
  border-radius: 20rpx;
  margin: 24rpx 24rpx 0 24rpx;
  box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.03);
  overflow: hidden;
}
.setting-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 32rpx 24rpx;
  border-bottom: 1rpx solid #f1f1f1;
  font-size: 30rpx;
  color: #222;
  background: #fff;
}
.setting-item:last-child {
  border-bottom: none;
}
.item-text {
}
.logout-section {
  margin-top: auto;
  margin-bottom: 60rpx;
  padding: 0 24rpx;
}
.logout-btn {
  width: 100%;
  background: #ff4949;
  color: #fff;
  border-radius: 48rpx;
  font-size: 32rpx;
  padding: 26rpx 0;
  border: none;
  box-shadow: 0 4rpx 10rpx rgba(255,73,73,0.10);
  font-weight: bold;
}
</style>