NN2023021801/addons/dbapp/pagesUser/setting/setting.vue

<script>
import api from '@/api'
export default {
  data() {
    return {
      version: this.$store.state.sysInfo.app_version
    }
  },
  methods: {
    async exit() {
      // await api.logout()
      this.$refs.modal.show = false
      this.$store.commit('exit', 'logout')
    },
    async denyOff() {
      await api.denyOff()
      this.$refs.modal1.show = false
      this.$common.toast('注销成功')
      setTimeout(() => {
        this.$store.commit('exit', 'logout')
      }, 1000)
    }
  }
}
</script>

<template>
  <view>
    <view class="radius10 bg-white w-m mt-10 group">
      <view class="item" @click="$jump({ url: './securityCenter' })">
        <view class="title f28">账号安全</view>
        <u-icon name="arrow-right" color="#5c5c5c"></u-icon>
      </view>

      <view class="item">
        <view class="title f28">版本号</view>
        <view class="value">{{ 'V' + version }}</view>
      </view>

      <view class="item" @click="$refs.modal1.show = true">
        <view class="title f28">注销账号</view>
        <u-icon name="arrow-right" color="#5c5c5c"></u-icon>
      </view>
    </view>

    <u-button
      text="退出登录"
      color="var(--theme)"
      @click="$refs.modal.show = true"
      shape="circle"
      customStyle="width: 650rpx;height: 98rpx; position:fixed;bottom:100rpx;left:50%;transform:translate(-50%)"
    ></u-button>

    <custom-modal ref="modal" @confirm="exit" content="是否确定退出登录？"></custom-modal>

    <custom-modal ref="modal1" @confirm="denyOff" content="是否确定注销账号？"></custom-modal>
  </view>
</template>

<style lang="scss" scoped>
.group {
  padding: 0 24rpx;
  .item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 98rpx;
    line-height: 98rpx;
    box-sizing: border-box;
    .title {
      color: #1e1e1e;
    }

    .value {
      color: #5c5c5c;
      font-size: 28rpx;
    }

    & + .item {
      border-top: 1px solid #f5f5f5;
    }
  }
}
</style>