<script setup lang="ts">
import { ref } from "vue";
import request, { download } from '~/utils/request';
import { handleImageUrl } from '~/utils/index';


// #region (constant)
const TABLE_KEY = 'xxbg_id'
const URL_CUT = '/xdjx/xypjgl_bbgl'
const commonUrl = ref("");
const filename = ref("");
// #endregion

// #region (type)
type TYPE_TABLE_FIELD = {
  [TABLE_KEY]: string;
  'xxbg_bbmc': string; // 报表名称
  'xxbg_cjr': string; // 创建人
  'xxbg_cjsj': string; // 创建时间
  'xxbg_bbsj_json': string; // 报表数据JSON
  'xxbg_bbsz_json': string; // 报表设置JSON
  'xxbg_bbfj': string
}
// #endregion

// #region (variable)
const loading = ref(true)
// #endregion

// #region (props)
const props = defineProps<{
  aid: string,
}>()
// #endregion

function detailApi(_id: string) {
  return request({
    url: URL_CUT + '/detail',
    data: {
      [TABLE_KEY]: _id,
    }
  })
}

const detail_Data = ref<TYPE_TABLE_FIELD>()

// #region (page init)
async function init() {
  const res = await detailApi(props.aid)
  detail_Data.value = (res.data.one_info)
  // let url = handleImageUrl(detail_Data.value.xxbg_bbfj)

  let arr = detail_Data.value.xxbg_bbfj.split("|");
  if (arr[0] && arr[1]) {
    commonUrl.value = arr[0];
    filename.value = arr[1];
  }
  loading.value = false
}
init()
// #endregion

</script>

<template>
  <div :loading="loading">
    <template v-if="detail_Data">
      <div class="flex mb-2">
        <!-- <div>报表名称</div> -->
        <div class="text-2xl" >{{ detail_Data.xxbg_bbmc }}</div>
      </div>
      <!-- <div class="flex">
        <div>创建人</div><div>{{detail_Data.xxbg_cjr}}</div>
      </div>
      <div class="flex">
        <div>创建时间</div><div>{{detail_Data.xxbg_cjsj}}</div>
      </div>
      <div class="flex">
        <div>报表数据JSON</div><div>{{detail_Data.xxbg_bbsj_json}}</div>
      </div>
      <div class="flex">
        <div>报表设置JSON</div><div>{{detail_Data.xxbg_bbsz_json}}</div>
      </div> -->
      <!-- <iframe class="w-full h-700px"
        :src="`https://view.officeapps.live.com/op/view.aspx?src=${handleImageUrl(detail_Data.xxbg_bbfj)}`"
        frameborder="0"></iframe> -->
      <preview-attach class="w-full mt-4" :commonUrl="commonUrl" :filename="filename"></preview-attach>
    </template>
  </div>

</template>
