<template>
  <Cupopup mode="bottom" v-model:visible="ruleShow" title="用户服务协议及隐私政策" @cancel="handleClick('cancel')" @confirm="handleClick('confirm')">
    <view class="space-y-20rpx">
      <view class="indent-46rpx">
        小程序用户协议和隐私政策是小程序开发者为保障用户合法权益和保护用户隐私而制
      </view>
      <view>定的两个重要文件。下面分别介绍一下小程序用户协议和隐私政策的内容和要点：</view>
      <view>用户协议： 用户协议是小程序开发者与用户之间达成的协议， 规定了用户使用小程序的
        条件、权利和义务等内容。用户在使用小程序之前需要同意用户协议，否则无法使用小程序。
      </view>
      <view> 一般来说，小程序用户协议包括以下几个方面的内容：</view>
      <view>1. 用户注册和账号管理规定：包括用户注册、账号安全和管理等规定。</view>
      <view>2. 使用规范和限制： 包括用户在小程序上发布内容的规范、禁止发布的内容和行为等规定。</view>
      <view>3. 用户权利和义务：包括用户在使用小程序时享有的权利和应承担的义务等规定。</view>
      <view>4. 免责声明和责任限制：包括小程序开发者对小程序服务的免责声明和责任限制等规定。</view>
      <view>5. 争议解决方式：包括双方在发生争议时解决方式的规定。</view>
      <view>6. 隐私政策： 隐私政策是小程序开发者为保护用户隐私而制定的政策， 规定了小程序开发
        者在收集、使用、存储、保护用户个人信息时应遵守的原则和措施。用户在使用小程序 时， 需要同意隐私政策， 否则无法使用小程序。
        一般来
      </view>
    </view>
  </Cupopup>
</template>
<script setup>
import Cupopup from '@/components/CuPopup/index.vue'
import {ref, watch, watchEffect} from 'vue'

const props = defineProps({
  visible: {
    type: Boolean,
    default: false,
  }
})
const ruleShow = ref(props.visible)
const emit = defineEmits(['update:visible', 'onClick'])

const handleClick = (e) => {
  emit('onClick', e)
}

watchEffect(() => {
  ruleShow.value = props.visible
})

watch(() => ruleShow.value, (val) => {
  emit('update:visible', val)
})


</script>
<style scoped lang="scss">

</style>