完成备件模块

zhuguifei

2025-04-16 609b918b24e8dbbe75bf2eaef7a532308d83a708

 eims-ui/apps/web-antd/src/views/eims/spare-in/spare-in-drawer.vue

@@ -1,7 +1,7 @@
<script setup lang="ts">
import { computed, ref } from 'vue';

import { useVbenDrawer } from '@vben/common-ui';
import { useVbenDrawer, useVbenModal } from '@vben/common-ui';
import { $t } from '@vben/locales';
import { addFullName, cloneDeep, getPopupContainer } from '@vben/utils';

@@ -11,7 +11,72 @@

import { drawerSchema } from './data';
import CodeInput from '#/views/eims/components/code-input.vue';
import spareModal from '#/views/eims/components/spare-modal.vue';
import SelectSpareTable from '#/views/eims/spare-out/select-spare-table.vue';
import { message } from 'ant-design-vue';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { renderDict } from '#/utils/render';
import { DictEnum } from '@vben/constants';
/**
 * 出库单选择的备件数据
 */
const outSpareList = ref([]);
const selectSpareTable = ref();
const outCol: VxeGridProps['columns'] = [
  {
    field: 'action',
    slots: { default: 'action' },
    title: '删除',
    width: 60
  },
  {
    title: '备件名称',
    field: 'name',
    width: 180
  },
  {
    title: '备件编码',
    field: 'code',
    width: 120
  },
  {
    title: '备件型号',
    field: 'modelNo',
    width: 100
  },
  {
    title: '计量单位',
    field: 'unit',
    slots: {
      default: ({ row }) => {
        if (!row.unit || row.unit === '') {
          return '';
        }
        return renderDict(row.unit, DictEnum.EIMS_SPARE_UNIT);
      }
    },
    width: 80
  },

  {
    title: '实际库存',
    field: 'actualStock',
    width: 100
  },
  {
    title: '数量',
    field: 'quantity',
    editRender: {
      name: 'input'
    },
    width: 80
  },
  {
    title: '参考价',
    field: 'referPrice',
    width: 90
  }
];
const emit = defineEmits<{ reload: [] }>();

const isUpdate = ref(false);
@@ -39,6 +104,7 @@
    if (!isOpen) {
      return null;
    }
    outSpareList.value = [];
    drawerApi.drawerLoading(true);
    const { id } = drawerApi.getData() as { id?: number | string };
    isUpdate.value = !!id;
@@ -48,6 +114,10 @@
    if (isUpdate.value && id) {
      const record = await getSpareInout(id);
      await formApi.setValues(record);
      outSpareList.value = record?.spareList;
      if (isUpdate.value && record.chargeDept) {
        await setupUserOptions(record.chargeDept);
      }
    }

    drawerApi.drawerLoading(false);
@@ -127,7 +197,15 @@
    if (!valid) {
      return;
    }
    const selectSpareList = selectSpareTable.value.tableData();
    // 检测是否输入出库数量
    const eList = selectSpareList.filter((item: any) => !item.quantity || item.quantity <= 0);
    if (selectSpareList.length<= 0 || eList.length > 0) {
      message.error('入库数量为空，请检查！');
      return false;
    }
    const data = cloneDeep(await formApi.getValues());
    data.spareList = selectSpareList;
    await (isUpdate.value ? updateSpareInout(data) : addSpareInout(data));
    emit('reload');
    await handleCancel();
@@ -142,14 +220,42 @@
  drawerApi.close();
  await formApi.resetForm();
}

// 备件modal
const [SpareModal, spareModalApi] = useVbenModal({
  connectedComponent: spareModal,
  draggable: true,
  title: '选择备件'
});

function handleSpareModal() {
  spareModalApi.setData({});
  spareModalApi.open();
}

/**
 * 选择的备件
 * @param spareList
 */
function selectSpare(spareList: any) {
  outSpareList.value = spareList;
}
</script>

<template>
  <BasicDrawer :close-on-click-modal="false" :title="title" class="w-[600px]">
  <BasicDrawer :close-on-click-modal="false" :title="title" class="w-[1000px]">
    <BasicForm>
      <template #orderCode="slotProps">
        <CodeInput v-bind="slotProps" :disabled="isUpdate" prefix="RK" />
      </template>
      <template #openSpare="slotProps">
        <a-button type="primary" v-bind="slotProps" :disabled="isUpdate" @click.stop="handleSpareModal">添加备件</a-button>
      </template>
      <template #outSpareList>
        <SelectSpareTable ref="selectSpareTable" :columns="outCol" :data="outSpareList" :is-update="isUpdate" />
      </template>
    </BasicForm>

    <SpareModal class="w-[1200px]" @update-select="selectSpare" />
  </BasicDrawer>
</template>