<template>
  <div class="ui-shopAgreement">
    <div v-if="policyTitle" class="ui-content">
      <div class="font_32 bold text-center ui-title">{{ policyTitle }}</div>
      <richTextParsing :rich-text="policy"></richTextParsing>
    </div>
  </div>
</template>
<script setup lang="ts">
  import { onMounted, ref } from 'vue';
  import router from '@/router';
  import requestGo from '@/utils/requestApp';

  defineOptions({ name: 'AppShopAgreement' });

  const id = ref<any>('');
  const policy = ref<any>('');
  const policyTitle = ref<any>('');

  // 获取商品详情
  const getDetail = () => {
    requestGo({ url: `/app/v2/policy/detail/${id.value}`, method: 'get' })
      .then((res) => {
        const result = res.data;
        policy.value = result.content;
        policyTitle.value = result.title;
      })
      .catch((err) => {
        console.log(err);
      });
  };

  onMounted(() => {
    let route = router.currentRoute.value.params;
    let policyTitle = router.currentRoute.value.query;
    id.value = route.id;

    getDetail();
    document.title = policyTitle.title as any;
  });
</script>
<style lang="scss" scoped>
  .ui-shopAgreement {
    background: #f8f8f8;
    overflow-y: auto;
    min-height: 100vh;
  }

  .ui-content {
    padding: px2rem(30);

    .ui-title {
      padding: 0 px2rem(50) px2rem(30) px2rem(50);
    }
  }
</style>
