<template>
  <PageLayout title="Disclaimer" description="Once the configuration is complete, the content will be displayed as a checkbox on the Home Valuation registration page.">
    <template #button>
      <button class="btn-save" @click.prevent="onSave">{{saving ? 'Saving..' : 'Save'}}</button>
    </template>
    <div class="lofty-content">
      <disclaimer-input v-model="disclaimerHtml" ref="disclaimerInput"></disclaimer-input>
    </div>
  </PageLayout>
</template>

<script setup>
import PageLayout from "@/admin/common/PageLayout.vue";
import DisclaimerInput from "./disclaimerInput.vue";
import http from "@/api/index.js";
import { showToast } from "@/admin/ui/constant.js";

const disclaimerHtml = ref('');
const saving = ref(false);
const disclaimerInput = useTemplateRef('disclaimerInput')
getDisclaimer()
async function onSave() {
  saving.value = true
  const data = {
    disclaimer: disclaimerHtml.value,
    disclaimerHtml: disclaimerInput.value.getValueString()
  }
  const res = await http.post('/save-data/data/update', {data});
  saving.value = false
  if(res.data) {
    showToast("Saved Successfully");
  } else {
    showToast("Save failed. Please try again.", { duration: 3000, err: true });
  }
}
async function getDisclaimer() {
  const res = await http.get('/save-data/common-info');
  if(res.data.commonData) {
    disclaimerHtml.value = res.data.commonData.disclaimerHtml || ''
  }
}
</script>
<style scoped lang="scss">
.lofty-content {
  padding: 22px 20px 20px;
}
</style>