talk_appAmin/pages/mine/setting/index.vue

<template>
  <view class="">
    <!-- 顶部导航栏 -->
    <up-navbar leftText="" title="" :placeholder="true" :safeAreaInsetTop="true" @leftClick="leftClick"
      :bgColor="bgColor">
      <template #center>
        <div class="navbarcenter"><span class="text1">系统设置</span></div>
      </template>
    </up-navbar>
  </view>
  <view class="list">
    <view class="listInfo" @click="checkUpdate1">
      <view class="text2">检查更新</view>
      <image :src="right2" style="width: 18rpx; height: 32rpx;"></image>
    </view>
    <view class="listInfo" @click="checkUpdate2">
      <view class="text2">用户协议</view>
      <image :src="right2" style="width: 18rpx; height: 32rpx;"></image>
    </view>
    <view class="listInfo" @click="checkUpdate3">
      <view class="text2">隐私协议</view>
      <image :src="right2" style="width: 18rpx; height: 32rpx;"></image>
    </view>
    <view class="listInfo" @click="checkUpdate4">
      <view class="text2">关于我们</view>
      <image :src="right2" style="width: 18rpx; height: 32rpx;"></image>
    </view>
    <view class="listInfo2" @click="checkUpdate5">
      <view class="text2">账号注销</view>
      <image :src="right2" style="width: 18rpx; height: 32rpx;"></image>
    </view>

    <view class="btn" @click="handleLogout">
      <view class="text3">退出登录</view>
    </view>
  </view>

</template>

<script setup>
import { getAndroidV } from "@/api/system/version"
import { useStore } from 'vuex'
import { useRouter } from 'vue-router'
import { ref, getCurrentInstance } from 'vue';
import { getDicts } from "@/api/system/dict/data";
import { onShow, onLoad } from '@dcloudio/uni-app'
import image from 'uview-plus/libs/config/props/image';
const { proxy } = getCurrentInstance();
const isOfficial = ref(true)
const iconConfig = proxy.iconConfig;
const right2 = iconConfig.right2;
const bgColor = ref('#ffffff')
const version = ref(getApp().globalData.config.appInfo.version)
function handleLogout() {
  proxy.$modal.confirm('确定注销并退出系统吗？').then(() => {
    proxy.$store.dispatch('LogOut').then(() => {
      proxy.$tab.reLaunch('/pages/login')
    })
  })
}
const listInfo = (e) => {
  console.log(e)
}
const leftClick = () => {
  proxy.$tab.navigateBack(1)
}
const checkUpdate1 = () => {
  proxy.$modal.loading('正在检查更新，请稍候...');
  getAndroidV().then(e => {
    proxy.$modal.closeLoading();
    if (version.value != e.data.versionName) {
      let info = e.data.versionCode + ":" + e.data.versionName
      proxy.$modal.confirm('新版本' + info + "已发布，点击确定复制下载链接").then(() => {
        uni.setClipboardData({
          data: e.data.downloadUrl,
          success: function () {
            proxy.$modal.showToast("复制成功");
          },
          fail: function () {
            proxy.$modal.showToast("复制失败");
          }

        });
      })

    }else{
      proxy.$modal.msg("您已经是最新版本啦~")
    }
    console.log(e);
  })
  console.log("检查更新");
}
const checkUpdate2 = () => {
  console.log("用户协议");
  proxy.$tab.navigateTo(`/pages/common/webview/index?type=` + 2)
}
const checkUpdate3 = () => {
  console.log("隐私协议");
  proxy.$tab.navigateTo(`/pages/common/webview/index?type=` + 1)
}
const checkUpdate4 = () => {
  proxy.$modal.showToast("╭(●｀∀´●)╯╰(●’◡’●)╮ (●’◡’●)ﾉ ヾ(*´▽‘*)ﾉ");
  console.log("关于我们");
}
const checkUpdate5 = () => {
  proxy.$modal.showToast("请慎重确定您的每一个选择，联系我们，并告知您的想法与困境` (ฅ´ω`ฅ)");
  console.log("账号注销");
}
</script>

<style lang="scss" scoped>
page {
  background-color: #ffffff;
}

.navbarcenter {

  .text1 {
    font-weight: 600;
    font-size: 36rpx;
    color: #000000 !important;
  }
}

.list {
  margin-top: 25rpx;
  width: 686rpx;
  height: 800rpx;
  margin-left: 32rpx;
  margin-right: 32rpx;

  .listInfo {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 80rpx;
    border-bottom: 2rpx solid #f4f5f6;
    /* 设置下边框的宽度和颜色 */
    border-radius: 1rpx 1rpx 0 0;

    /* 可选：设置边框的圆角 */
    .text2 {
      font-weight: 400;
      font-size: 32rpx;
      color: #000000 !important;
    }

    .line {
      width: 100%;
      height: 2rpx;
      margin: 24rpx 0;
    }
  }

  .listInfo2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 80rpx;

    .text2 {
      font-weight: 400;
      font-size: 32rpx;
      color: #000000 !important;
    }

    .line {
      width: 100%;
      height: 2rpx;
      margin: 24rpx 0;
    }
  }

  .btn {
    margin-top: 120rpx;
    width: 100%;
    height: 88rpx;
    text-align: center;
    border-radius: 44rpx 44rpx 44rpx 44rpx;
    background: #00ccbe;
    display: flex;
    justify-content: center;
    align-items: center;

    .text3 {
      font-weight: 400;
      font-size: 32rpx;
      color: #FFFFFF !important;
    }
  }
}
</style>