<template>
  <BasicModal
    v-bind="$attrs"
    :title="title"
    @register="registerInnerModal"
    @ok="handleSubmit"
    :width="1000"
  >
    <div style="width: 100%; text-align: center; font-size: 20px">无感化维保考核报告</div>

    <Descriptions title="维保信息" bordered :column="{ xxl: 1, xl: 2, lg: 2, md: 2, sm: 2, xs: 1 }">
      <DescriptionsItem label="电梯名称"> 光电谷D1</DescriptionsItem>
      <DescriptionsItem label="维保单位">湖北菱力达电梯有限公司</DescriptionsItem>
      <DescriptionsItem label="维保类型">半月维保</DescriptionsItem>
      <DescriptionsItem label="维保日期">2024-10-03</DescriptionsItem>
      <DescriptionsItem label="设备注册代码">30134201152011120017</DescriptionsItem>
      <DescriptionsItem label="维保结果">不合格</DescriptionsItem>
      <DescriptionsItem label="	维保用时">31分钟14秒</DescriptionsItem>
    </Descriptions>

    <div style="width: 100%; text-align: left; font-size: 16px; font-weight: bolder; margin: 16px 0"
      >维保考核表</div
    >
    <Table :columns="columns" :data-source="data" bordered>
      <template #bodyCell="{ column, text }">
        <template v-if="column.dataIndex === 'name'">
          <a href="javascript:;">{{ text }}</a>
        </template>
      </template>
    </Table>
  </BasicModal>
</template>
  
  <script setup lang="ts">
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { computed, ref, unref } from 'vue';
import { infoList } from '@/api/basicInfo/elevator';
import { formEvaSchemas, evaColumns, modalEvaSchemas } from './workData.data';
import { BasicForm, useForm } from '@/components/Form';
import { useMessage } from '@/hooks/web/useMessage';
import { workDataDistribute } from '@/api/workPlace/workInfo';
import {
  Descriptions,
  DescriptionsItem,
  Table,
  TableSummary,
  TableSummaryCell,
  TableSummaryRow,
} from 'ant-design-vue';
import type { TableColumnType } from 'ant-design-vue';
defineOptions({ name: 'WorkDataModal' });
const { createMessage } = useMessage();
const emit = defineEmits(['register', 'reload']);

const isUpdate = ref<number>(1);
const title = computed<string>(() => {
  return '维保考核';
});
const sharedOnCell = (_, index) => {
  if (index === 4) {
    return { colSpan: 0 };
  }
};
const data = [
  {
    key: '1',
    name: 'John Brown',
    age: 32,
    tel: '0571-22098909',
    phone: 18889898989,
    
  },
  {
    key: '2',
    name: 'Jim Green',
    tel: '0571-22098333',
    phone: 18889898888,
    age: 42,
   
  },
  {
    key: '3',
    name: 'Joe Black',
    age: 32,
    tel: '0575-22098909',
    phone: 18900010002,
    
  },
  {
    key: '4',
    name: 'Jim Red',
    age: 18,
    tel: '0575-22098909',
    phone: 18900010002,
    
  },
  {
    key: '5',
    name: '维保结果',
    age: 18,
    tel: '都是爱的深爱的',
    phone: 18900010002,
    
  },
];

const columns: TableColumnType[] = [
  {
    title: '考核内容',
    dataIndex: 'name',
    align:'center',
    customCell: (_, index) => ({
      colSpan: index < data.length-1 ? 1 : 3,
    }),
  },
  {
    title: '考核依据',
    dataIndex: 'age',
    customCell: sharedOnCell,
  },
  {
    title: '考核结果',
    colSpan: 1,
    dataIndex: 'tel',
    
  },
  {
    title: '验证记录或视图资料',
    colSpan: 1,
    dataIndex: 'phone',
    customCell: sharedOnCell,
  },

];
const [registerTable, { getSelectRows }] = useTable({
  rowSelection: {
    type: 'checkbox',
  },
  title: '电梯列表',
  showTableSetting: false,
  api: infoList,
  showIndexColumn: true,
  rowKey: 'id',
  useSearchForm: true,
  formConfig: {
    schemas: formEvaSchemas,
    baseColProps: {
      xs: 24,
      sm: 24,
      md: 24,
      lg: 15,
    },
  },
  columns: evaColumns,
  // 需要添加上部门参数
});
const [registerInnerModal, { modalLoading, closeModal }] = useModalInner(
  async (data: { record?: Recordable; update: number }) => {
    modalLoading(true);
    const { record, update } = data;
    isUpdate.value = update;

    modalLoading(false);
  },
);
const [registerForm, { setFieldsValue, resetForm, validate }] = useForm({
  labelWidth: 100,
  showActionButtonGroup: false,
  baseColProps: { span: 24 },
  schemas: modalEvaSchemas,
});
async function handleSubmit() {
  try {
    modalLoading(true);
    const data = await validate();
    const elevatorList = getSelectRows().map((item) => {
      return {
        id: item.id,
        name: item.elevatorName,
      };
    });

    if (elevatorList.length <= 0) {
      createMessage.error('请选择电梯');
      return;
    }
    const passData = {
      ...data,
      elevatorList,
    };
    console.log(passData);
    await workDataDistribute(passData);
    emit('reload');
    closeModal();
    await resetForm();
  } catch (e) {
    console.warn(e);
  } finally {
    modalLoading(false);
  }
}
</script>
  
  <style scoped>
</style>
  