<template>
  <view class="page-personal-recommend">
    <view class="recommend-con">
      <view class="recommend-set">
        <view class="recommend-til">
          个性化推荐
        </view>
        <switch
          class="switch-btn"
          style="transform:scale(0.7)"
          :checked="isOpen===1"
          color="#fc1b35"
          @change="onRecomChange"
        />
      </view>
      <view class="recommend-tips">
        <text>{{ tips }}</text>
      </view>
    </view>
    <view class="confirm-box">
      <view
        class="confirm-btn"
        @tap="onConfirm"
      >
        确认修改
      </view>
    </view>
  </view>
</template>

<script setup>
const { debounce } = util
const isOpen = ref(0)
const tips = ref('您可以选择开启或关闭个性化推荐设置，开启时，系统将根据个人偏好提升您的使用体验，关闭后您所看到的推荐数据量不会发生变化，但会降低推荐内容与您兴趣偏好的相关度。')
onLoad(() => {
  uni.setNavigationBarTitle({
    title: '个性化推荐'
  })
  onGetUserInfo()
})

// 获取用户信息
const onGetUserInfo = () => {
  const params = {
    url: '/mall4cloud_user/user/ma/user_detail_info',
    method: 'GET'
  }
  http.request(params).then(res => {
    isOpen.value = res.prodRecommendation
  })
}
const onConfirm = debounce(function () {
  const params = {
    url: '/mall4cloud_user/user/set_user_info',
    method: 'PUT',
    data: {
      prodRecommendation: isOpen.value
    }
  }
  http.request(params).then(() => {
    uni.showToast({
      title: '修改成功',
      icon: 'none',
      duration: 1000,
      mask: true
    })
    setTimeout(() => {
      uni.navigateBack(1)
    }, 1000)
  })
})
const onRecomChange = (e) => {
  isOpen.value = e.detail.value ? 1 : 0
}

</script>

<style lang="scss" scoped>
  @use "./personal-recommend.scss";
</style>
