<template>
  <Nav title="圈子设置"></Nav>
  <div class="item">
    <label>消息提醒</label>
    <van-switch v-model="checked" size="16px"/>
  </div>
  <div class="item">
    <div class="flex">
      <label>到期时间</label>
      <span>2023/10/22</span>
    </div>
    <p>立即续费<van-icon name="arrow"/></p>
   </div>
   <div class="item">
    <label>客服电话</label>
    <a href="tel:16888888888">16888888888</a>
  </div>
</template>

<script setup>
import Nav from "@/components/NavBar.vue";

</script>
<style scoped lang='scss'>
::v-deep .van-nav-bar {
  background: #fff;
}
.item{
  display: flex;
  padding: 32px 0;
  margin: 0 32px;
  justify-content: space-between;
  font-size: 28px;
  border-bottom: 1px solid rgba(156,156,156,0.1);
  .flex{
    display: flex;
  }
  label{
    margin-right: 20px;
  }
  a{
    color: #03a9f4;
  }
}
</style>