canrd-outside / order-erp-front · Files

<template>

  <BasicTable @register="registerTable" :bordered="true">

    <template #toolbar>

      <!-- <a-button

        v-if="props.column !== 3 && props.column !== 6"
        type="primary"
        @click="handleCreateModal"
        >新建</a-button
      >
      <a-button v-if="props.column == 6" type="primary" @click="handleCostCreate">新建</a-button>

      <a-button v-if="props.column == 9" type="primary" @click="handleProduCostCreate"
        >新建</a-button
      > -->
      <a-button
        v-if="props.column !== 3 && props.column !== 6 && props.column !== 9"
        type="primary"
        @click="handleCreateModal"
        >新建</a-button
      >

      <a-button v-else-if="props.column == 6" type="primary" @click="handleCostCreate">
        新建</a-button
      >

      <a-button v-else-if="props.column == 9" type="primary" @click="handleProduCostCreate">
        新建</a-button
      >

    </template>
    <template #bodyCell="{ column, record }">
      <template v-if="column.key === 'action'">
        <TableAction :actions="createActions(record)" />
      </template>
    </template>
  </BasicTable>

  <CostEdit @register="registerEdit" @success="handleModalSuccess" />

  <ProduCostEdit @register="registerProduEdit" @success="handleModalSuccess" />

  <CostCreate @register="registerCostCreate" @modal-success="handleModalSuccess" />

  <ProduCostCreate @register="registerProduCostCreate" @modal-success="handleModalSuccess" />

  <CreateModal
    @register="createModalRegister"
    @modal-success="handleModalSuccess"
    :column="props.column"
  />
</template>
<script setup lang="ts">
  import { BasicTable, useTable, TableAction } from '/@/components/Table';
  import CreateModal from './CreateModal.vue';
  import { deleteConfig, getList, saveConfig } from '/@/api/sys/config';
  import { COLUMNS } from './data';
  import { useModal } from '/@/components/Modal';

  import { useDrawer } from '/@/components/Drawer';
  import CostEdit from './costEdit.vue';

  import ProduCostEdit from './ProduCostEdit.vue';

  import CostCreate from './costCreate.vue';

  import ProduCostCreate from './ProduCostCreate.vue';

  const props = defineProps({
    searchInfo: {
      type: Object,
    },
    column: {
      type: Number,
    },
  });
  const [createModalRegister, { openModal }] = useModal();

  const [registerCostCreate, { openModal: openCostCreateModal }] = useModal();
  const [registerEdit, { openDrawer: openDrawerEdit }] = useDrawer();

  const [registerProduEdit, { openDrawer: openDrawerProduEdit }] = useDrawer();
  const [registerProduCostCreate, { openModal: openProduCreateModal }] = useModal();

  const [registerTable, { reload }] = useTable({
    api: getList,

    searchInfo: { ...props.searchInfo, pageSize: 1000 },
    pagination: false,

    columns: COLUMNS[props.column!],
    rowKey: 'id',
    actionColumn: {
      width: 160,
      title: 'Action',
      dataIndex: 'action',
    },
  });

  function handleCreateModal() {
    openModal(true);
  }

  function createActions(record: any): any[] {
    if (!record.editable) {
      return [

        // {
        //   ...(props.column !== 6 && {
        //     label: '编辑',
        //     onClick: handleEdit.bind(null, record),
        //   }),
        // },
        ...(props.column === 6
          ? [
              {
                label: '编辑',
                onClick: handleCostEdit.bind(null, record),
              },
            ]

          : props.column === 9
          ? [
              {
                label: '编辑',
                onClick: handleProduEdit.bind(null, record),
              },
            ]

          : props.column !== 6
          ? [
              {
                label: '编辑',
                onClick: handleEdit.bind(null, record),
              },
            ]
          : []),

        {
          ...(props.column !== 3 && {
            label: '删除',
            // onClick: handleDelete.bind(null, record),
            popConfirm: {
              title: '确认删除？',
              confirm: handleDelete.bind(null, record),
            },
          }),
        },
      ];
    }
    return [
      {
        label: '保存',
        onClick: handleSave.bind(null, record),
      },
      {
        label: '取消',
        popConfirm: {
          title: '是否取消编辑',
          confirm: handleCancel.bind(null, record),
        },
      },
    ];
  }

  async function handleSave(record) {

    if (props.column === 3) {
      await saveConfig({ id: record.id, settingValue: record.settingValue });
    } else {
      await saveConfig({ id: record.id, relationValue: record.relationValue });
    }

    handleCancel(record);
    reload();
  }

  function handleCostEdit(record: any) {
    openDrawerEdit(true, {
      data: record,
      isUpdate: true,
    });
  }

  function handleProduEdit(record: any) {
    openDrawerProduEdit(true, {
      data: record,
      isUpdate: true,
    });
  }

  function handleCostCreate(record: any) {
    openCostCreateModal(true, {
      data: record,
      isUpdate: true,
    });
  }

  function handleProduCostCreate(record: any) {
    openProduCreateModal(true, {
      data: record,
      isUpdate: true,
    });
  }

  function handleEdit(record: any) {
    record.onEdit?.(true);
  }

  function handleCancel(record) {
    record.onEdit?.(false, false);
  }

  function handleModalSuccess() {
    reload();
  }

  async function handleDelete(record) {
    await deleteConfig({ ids: [record.id] });
    reload();
  }
</script>
<style></style>