<template>
  <BasicModal v-bind="$attrs" :title="title" @register="registerInnerModal" :width="1200">
    <template #footer>
      <div>
        <a-button type="primary" @click="handleCancle">返回</a-button>
      </div>
    </template>

    <BasicTable @register="registerTable">
      <template #toolbar>
        <a-button
          type="primary"
          danger
          @click="multipleRemove(infoRemove)"
          :disabled="!selected"
          v-auth="'elevator:elevatorAccessory:remove'"
          >删除</a-button
        >
        <a-button type="primary" @click="handleAdd" v-auth="'elevator:elevatorAccessory:add'"
          >新增</a-button
        >
      </template>
      <template #bodyCell="{ column, record }">
        <template v-if="column.key === 'action'">
          <TableAction
            stopButtonPropagation
            :actions="[
              {
                label: '查看',

                type: 'primary',
                ghost: true,
                auth: 'behavior:behaviorMessage:query',
                onClick: handCheck.bind(null, record),
              },
              {
                label: '修改',

                type: 'primary',
                ghost: true,
                auth: 'elevator:elevatorAccessory:edit',
                onClick: handleEdit.bind(null, record),
              },
              {
                label: '删除',

                type: 'primary',
                danger: true,
                ghost: true,
                auth: 'elevator:elevatorAccessory:remove',
                popConfirm: {
                  placement: 'left',
                  title: '是否删除配件信息[' + record.id + ']?',
                  confirm: handleDelete.bind(null, record),
                },
              },
            ]"
          />
        </template>
      </template>
    </BasicTable>
  </BasicModal>
  <AccessAddModal @register="registerModal" @reload="reload" />
</template>

<script setup lang="ts">
import { Descriptions, DescriptionsItem } from "ant-design-vue";
import { BasicModal, useModalInner } from "@/components/Modal";
import { ref } from "vue";
import { BasicTable, useTable, TableAction } from "@/components/Table";
import { infoList } from "@/api/basicInfo/elevator";
import { accessColumns, accessFormSchemas } from "./info.data";
import { useModal } from "@/components/Modal";
import AccessAddModal from "./AcessAddModal.vue";
import { elevatorAccessoryList } from "@/api/basicInfo/evaAccess";
const elevatorInfo = ref<any>({});
const [registerTable, { reload, multipleRemove, selected, getForm }] = useTable({
  rowSelection: {
    type: "checkbox",
  },
  title: "配件列表",
  api: elevatorAccessoryList,
  showIndexColumn: true,
  rowKey: "id",
  useSearchForm: true,
  formConfig: {
    schemas: accessFormSchemas,
    baseColProps: {
      xs: 24,
      sm: 24,
      md: 24,
      lg: 6,
    },
  },
  // 需要添加上部门参数
  beforeFetch(params: Recordable) {
    params.elevatorNum = elevatorInfo.value.elevatorNum;

    return params;
  },
  columns: accessColumns,
  actionColumn: {
    width: 200,
    title: "操作",
    key: "action",
    fixed: "right",
  },
});
const title = ref<string>("电梯配件详情");
const [registerModal, { openModal }] = useModal();
const [registerInnerModal, { modalLoading, closeModal }] = useModalInner(
  async (data: { record?: Recordable }) => {
    modalLoading(true);
    const { record } = data;
    elevatorInfo.value = record;
    reload();
    modalLoading(false);
  }
);
const handleCancle = () => {
  closeModal();
};
function handleEdit(record: Recordable) {
  openModal(true, { record, elevatorInfo: elevatorInfo.value, update: 1 });
}

function handleAdd(record: Recordable) {
  openModal(true, { record, elevatorInfo: elevatorInfo.value, update: 2 });
}
function handCheck(record: Recordable) {
  openModal(true, { record, elevatorInfo: elevatorInfo.value, update: 3 });
}
function handleDelete() {}
</script>
