<template>
  <BasicModal v-bind="$attrs" :title="title" @register="registerInnerModal" :width="1200">
    <template #footer>
      <div v-if="isUpdate !== 3">
        <a-button type="default" @click="handleCancle">返回</a-button>
      </div>
    </template>
    <BasicTable @register="registerTable">
      <template #toolbar>
        <a-button
          type="primary"
          danger
          @click="multipleRemove(infoRemove)"
          :disabled="!selected"
          v-auth="'tenement:info:remove'"
          >删除</a-button
        >
        <a-button type="primary" @click="handleAdd" v-auth="'tenement:info:add'"
          >添加物业单位</a-button
        >
      </template>
      <template #bodyCell="{ column, record }">
        <template v-if="column.key === 'action'">
          <TableAction
            stopButtonPropagation
            :actions="[
              {
                label: '删除',

                type: 'primary',
                danger: true,
                ghost: true,
                auth: 'tenement:info:remove',
                popConfirm: {
                  placement: 'left',
                  title: '是否删除物业单位基础信息;[' + record.id + ']?',
                  confirm: handleDelete.bind(null, record),
                },
              },
            ]"
          />
        </template>
      </template>
    </BasicTable>
    <addUserModal @register="registerModal" @reload="reload"></addUserModal>
  </BasicModal>
</template>

<script setup lang="ts">
import { BasicModal, useModalInner } from "@/components/Modal";
import { computed, reactive, ref, unref } from "vue";
import { infoInfo, infoAdd, infoUpdate, infoList } from "@/api/basicInfo/tenement";
import { energyModalSchemas } from "./info.data";
import { BasicTable, useTable, TableAction } from "@/components/Table";
import { formSchemas, columns } from "./info.data";
import addUserModal from "./AddUserModal.vue";
import { useModal } from "@/components/Modal";
defineOptions({ name: "InfoModal" });

const emit = defineEmits(["register", "reload"]);
const postList = ref<Post[]>([]);
const isUpdate = ref<number>(1);
const title = computed<string>(() => {
  return "关联物业单位";
});

const [registerInnerModal, { modalLoading, closeModal }] = useModalInner(
  async (data: { record?: Recordable; update: number }) => {
    modalLoading(true);
    const { record, update } = data;
    isUpdate.value = update;

    modalLoading(false);
  }
);
const [registerModal, { openModal }] = useModal();
const [registerTable, { reload, multipleRemove, selected, getForm }] = useTable({
  rowSelection: {
    type: "checkbox",
  },
  title: "",
  api: infoList,
  showIndexColumn: false,
  rowKey: "id",
  useSearchForm: false,
  formConfig: {
    schemas: formSchemas,
    baseColProps: {
      xs: 24,
      sm: 24,
      md: 24,
      lg: 6,
    },
  },
  columns: columns,
  actionColumn: {
    width: 250,
    title: "操作",
    key: "action",
    fixed: "right",
  },
});
function handleCancle() {
  closeModal();
}
function handleEdit(record: Recordable) {
  openModal(true, { record, update: 1 });
}

function handleAdd() {
  openModal(true, { update: 2 });
}
function handCheck(record: Recordable) {
  openModal(true, { record, update: 3 });
}
async function handleDelete(record: Recordable) {
  await infoRemove([record.id]);
  await reload();
}
</script>

<style scoped></style>
