wx-qhb/pageC/accountSecurity/accountSecurity.vue

<template>
  <view class="page">
    <!-- 		<view class="content-top">
			<view class="first">
				<text>{{i18n.editPassword}}</text>
				<textRight :texts="i18n.setPassword" />
			</view>
			<view class="first">
				<text>{{i18n.editPhone}}</text>
				<textRight texts="178****0000" />
			</view>       
		</view> -->
    <view class="content-bottom">
      <view class="first" @click="toCancellation">
        <text>{{ i18n.accountCancellation }}</text>
        <textRight :texts="i18n.cancellation" />
      </view>
    </view>
  </view>
</template>

<script>
import textRight from "./component/textRight.vue";
export default {
  data() {
    return {};
  },
  components: {
    textRight,
  },
  computed: {
    i18n() {
      return this.$t("index");
    },
  },
  methods: {
    toCancellation() {
      uni.navigateTo({
        url: "/pageC/accountCancellation/accountCancellation",
      });
    },
  },
  mounted() {
    uni.setNavigationBarTitle({
      title: this.i18n.account,
    });
  },
};
</script>

<style scoped lang="scss">
.page {
  padding: 20rpx 24rpx;

  .content-top {
    background-color: #fff;
    border-radius: 16rpx;
    padding: 0 24rpx;

    .first {
      height: 108rpx;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-bottom: 2rpx solid rgba(151, 151, 151, 0.1);
    }
  }
  .content-bottom {
    background-color: #fff;
    border-radius: 16rpx;
    padding: 0 24rpx;
    margin-top: 20rpx;
    .first {
      height: 108rpx;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-bottom: 2rpx solid rgba(151, 151, 151, 0.1);
    }
  }
}
</style>