<template>
  <BasicModal
    v-bind="$attrs"
    @register="register"
    title="场景列表"
    :width="1200"
    :showOkBtn="false"
    @ok="handleSubmit"
  >
    <div class="pt-3px pr-3px">
      <div class="table_list">
        <BasicTable @register="registerSubtable">
          <template #href="{ record }">
            <a
              :title="record.sceneName"
              v-if="record.webSite"
              target="_blank"
              :href="record.webSite"
              >{{ record.title }}</a
            >
            <span v-else-if="record.sceneName">{{ record.sceneName }}</span>
            <span v-else>-</span>
          </template>
        </BasicTable>
      </div>
    </div>
  </BasicModal>
</template>
<script lang="ts">
  import { defineComponent, onMounted, ref, h } from 'vue';
  import { BasicTable, useTable, BasicColumn } from '/@/components/Table';
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { Time } from '/@/components/Time';
  import { useI18n } from '/@/hooks/web/useI18n';
  import { sceneList } from '/@/api/operate';

  const { t } = useI18n();
  export default defineComponent({
    components: { BasicModal, BasicTable },
    props: {
      userData: { type: Object },
    },
    emits: ['update'],
    setup(props, { emit }) {
      const id = ref(null);
      const columns: BasicColumn[] = [
        {
          title: '场景标题',
          dataIndex: 'sceneName',
          ellipsis: true,
          slots: { customRender: 'href' },
          width: 150,
        },
        {
          title: '场景码',
          dataIndex: 'num',
          ellipsis: true,
          width: 180,
        },
        {
          title: '拍摄时间',
          dataIndex: 'createTime',
          width: 180,
          customRender: ({ record }) => {
            return (
              record.createTime &&
              h(Time, {
                value: record.createTime,
                mode: 'datetime',
              })
            );
          },
        },
        {
          title: '计算完成时间',
          dataIndex: 'amount',
          width: 180,
          customRender: ({ record }) => {
            return (
              (record.algorithmTime &&
                h(Time, {
                  value: record.algorithmTime,
                  mode: 'datetime',
                })) ||
              '-'
            );
          },
        },
        {
          title: '人员编号',
          dataIndex: 'ryNo',
          width: 100,
        },
        {
          title: t('routes.staff.userName'),
          dataIndex: 'ryNickName',
          width: 100,
          customRender: ({ record }) => {
            return record.ryNickName || '-';
          },
        },
        {
          title: '状态',
          dataIndex: 'status',
          width: 80,
          customRender: ({ record }) => {
            let str;
            switch (record.status - 0) {
              case 0:
                str = '计算中';
                break;
              case 1:
                str = '计算成功';
                break;
              case -2:
                str = '计算成功';
                break;
              case -1:
                str = '计算失败';
                break;
            }
            return record.payStatus == -2 ? '封存' : str;
          },
        },
      ];
      const [registerSubtable, { reload }] = useTable({
        api: sceneList,
        showIndexColumn: true,
        columns: columns,
        searchInfo: { jyUserId: id },
        rowKey: 'id',
        fetchSetting: {
          pageField: 'pageNum',
          sizeField: 'pageSize',
          listField: 'list',
          totalField: 'total',
        },
        canResize: true,
        bordered: true,
      });

      onMounted(() => {});
      let addListFunc = () => {};
      const [register, { closeModal }] = useModalInner((data) => {
        data && onDataReceive(data);
      });
      function onDataReceive(data) {
        console.log('onDataReceive', data);
        id.value = data.userId;
        reload();
      }
      const handleSubmit = async () => {
        closeModal();
        emit('update');
      };
      return {
        register,
        handleSubmit,
        addListFunc,
        registerSubtable,
        reload,
        t,
      };
    },
  });
</script>
