<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
  <BasicTable @register="registerTable">
    <template #bodyCell="{ column, record, text }">
      <template v-if="column.key === 'action'">
        <TableAction
          :actions="[
            {
              label: '详情',
              onClick: () => {
                handleInfo(record);
              },
            }
          ]"
        />
      </template>
      <template v-if="['typename','tubanlaiyuan','biaozhu'].includes(column.dataIndex)">
        {{ getLabel(column.dataIndex, text) }}
      </template>
    </template>
  </BasicTable>
  <a-modal
    style="width: 100vw; top: 0px; left: 0px; margin: 0px; padding: 0px"
    wrap-class-name="full-modal"
    v-model:open="showInfoOpen"
    title="详情"
    :footer="null"
    :maskClosable="true"
    :destroyOnClose="true"
    @cancel="showInfoOpen = false"
  >
    <ShowInfoModal
      :showInfoData="showInfoData"
      :typenameOptions="typenameOptions"
      :tubanlaiyuanOptions="tubanlaiyuanOptions"
      @reload="reloadList"
    />
  </a-modal>
</PageWrapper>
</template>

<script setup lang="ts">
import { ref } from "vue"
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { columns, searchFormSchema, typenameOptions, tubanlaiyuanOptions } from './utils';
import { LoadRcxjCaseinfo } from '@/api/dailycheck/index'
import ShowInfoModal from '@/views/demo/dailycheck/ShowInfoModal/index.vue'
import dayjs from "dayjs";

const showInfoOpen = ref(false)
const showInfoData = ref();

const [registerTable, { getForm, reload }] = useTable({
  title: '线索列表',
  api: LoadRcxjCaseinfo,
  columns,
  rowKey: 'id',
  useSearchForm: true,
  showTableSetting: true,
  bordered: true,
  formConfig: {
    labelWidth: 120,
    schemas: searchFormSchema,
    showAdvancedButton: false,  // 取消展开/收起按钮
    alwaysShowLines: 0,
  },
  actionColumn: {
    width: 80,
    title: '操作',
    dataIndex: 'action',
    fixed: 'right',
  },
  beforeFetch: (params) => {
    let resultParams = {
      ...params
    }
    if(resultParams.synchronoustimebegin){
      resultParams.synchronoustimebegin = dayjs(resultParams.synchronoustimebegin).startOf('day').format('YYYY-MM-DD HH:mm:ss');
    }
    if(resultParams.synchronoustimeend){
      resultParams.synchronoustimeend = dayjs(resultParams.synchronoustimeend).endOf('day').format('YYYY-MM-DD HH:mm:ss');
    }
    return resultParams
  },
});
function handleInfo(record) {
  showInfoData.value = record
  showInfoOpen.value = true
}
const getLabel = (type, value) => {
  let result: any[] = [];
  let label = '';
  switch (type) {
    case 'typename':
      result = typenameOptions;
      break;
    case 'tubanlaiyuan':
      result = tubanlaiyuanOptions;
      break;
    case 'biaozhu':
      result = [
        { label: '未确认', value: 0},
        { label: '已确认', value: 1},
      ];
      break;
  }
  result.forEach((item) => {
    if (item.value == value) {
      label = item.label;
    }
  });
  return label;
};
const reloadList = () => {
  reload()
}
</script>

<style lang="scss" scoped>
.full-modal {
  .ant-modal {
    min-width: 100vw;
    top: 0px;
    padding: 0px;
    margin: 0px;
  }
  .ant-modal-content {
    display: flex;
    flex-direction: column;
  }
  .ant-modal-body {
    flex: 1;
  }
}
</style>
