style: lint格式化文件
This commit is contained in:
@ -1,31 +1,31 @@
|
||||
<template>
|
||||
<PageWrapper dense fixedHeight contentFullHeight>
|
||||
<a-tabs v-model:activeKey="activeKey" destroyInactiveTabPane>
|
||||
<a-tab-pane key="1" tab="物料类别配置">
|
||||
<MaterialCategory />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="物料属性配置">
|
||||
<MaterialProperty />
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</PageWrapper>
|
||||
<PageWrapper dense fixedHeight contentFullHeight>
|
||||
<a-tabs v-model:activeKey="activeKey" destroyInactiveTabPane>
|
||||
<a-tab-pane key="1" tab="物料类别配置">
|
||||
<MaterialCategory />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="物料属性配置">
|
||||
<MaterialProperty />
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</PageWrapper>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { PageWrapper } from '/@/components/Page';
|
||||
import MaterialCategory from './components/MaterialCategory.vue';
|
||||
import MaterialProperty from './components/MaterialProperty.vue';
|
||||
import { ref } from 'vue';
|
||||
import { PageWrapper } from '/@/components/Page';
|
||||
import MaterialCategory from './components/MaterialCategory.vue';
|
||||
import MaterialProperty from './components/MaterialProperty.vue';
|
||||
|
||||
const activeKey = ref('1');
|
||||
const activeKey = ref('1');
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
:deep(.ant-tabs-nav) {
|
||||
background: #fff;
|
||||
padding-left: 10px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
:deep(.ant-tabs-nav) {
|
||||
background: #fff;
|
||||
padding-left: 10px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
:deep(.vben-basic-table-form-container) {
|
||||
margin-right: 0;
|
||||
}
|
||||
:deep(.vben-basic-table-form-container) {
|
||||
margin-right: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,326 +1,311 @@
|
||||
<template>
|
||||
<PageWrapper dense fixedHeight contentFullHeight>
|
||||
<BasicTableErp @register="registerTable" v-if="!isView">
|
||||
<template #toolbar>
|
||||
<a-button type="primary" @click="handleCheck"> 盘点 </a-button>
|
||||
<a-button type="primary" @click="handleHistory"> 历史明细 </a-button>
|
||||
<a-button type="primary" @click="handleScrap"> 报废 </a-button>
|
||||
<a-button type="primary" @click="handleCreate"> {{ t('新增') }} </a-button>
|
||||
<a-button type="primary" @click="handleImport"> {{ t('导入') }} </a-button>
|
||||
<a-button type="primary" @click="handleExport"> {{ t('导出') }} </a-button>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'state'">
|
||||
<a-switch v-model:checked="record.state" :checkedValue="1" :unCheckedValue="0" disabled />
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'action'">
|
||||
<TableAction
|
||||
:actions="[
|
||||
{
|
||||
icon: 'ant-design:eye-outlined',
|
||||
onClick: handleView.bind(null, record),
|
||||
},
|
||||
{
|
||||
icon: 'clarity:note-edit-line',
|
||||
onClick: handleEdit.bind(null, record),
|
||||
},
|
||||
{
|
||||
icon: 'ant-design:delete-outlined',
|
||||
color: 'error',
|
||||
onClick: handleDelete.bind(null, record),
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTableErp>
|
||||
<MaterialInfo :id="recordId" @return-page="isView = false" v-else />
|
||||
<MaterialModal @register="registerModal" @success="reload" />
|
||||
<StockModal @register="registerStockModal" @success="handleReload" />
|
||||
<HistoryModal @register="registerHistoryModal" @success="handleReload" />
|
||||
<ImportModal
|
||||
@register="registerImportModal"
|
||||
importUrl="/caseErpMaterial/caseErpMaterial/import"
|
||||
@success="reload"
|
||||
/>
|
||||
</PageWrapper>
|
||||
<PageWrapper dense fixedHeight contentFullHeight>
|
||||
<BasicTableErp @register="registerTable" v-if="!isView">
|
||||
<template #toolbar>
|
||||
<a-button type="primary" @click="handleCheck"> 盘点 </a-button>
|
||||
<a-button type="primary" @click="handleHistory"> 历史明细 </a-button>
|
||||
<a-button type="primary" @click="handleScrap"> 报废 </a-button>
|
||||
<a-button type="primary" @click="handleCreate"> {{ t('新增') }} </a-button>
|
||||
<a-button type="primary" @click="handleImport"> {{ t('导入') }} </a-button>
|
||||
<a-button type="primary" @click="handleExport"> {{ t('导出') }} </a-button>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'state'">
|
||||
<a-switch v-model:checked="record.state" :checkedValue="1" :unCheckedValue="0" disabled />
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'action'">
|
||||
<TableAction
|
||||
:actions="[
|
||||
{
|
||||
icon: 'ant-design:eye-outlined',
|
||||
onClick: handleView.bind(null, record)
|
||||
},
|
||||
{
|
||||
icon: 'clarity:note-edit-line',
|
||||
onClick: handleEdit.bind(null, record)
|
||||
},
|
||||
{
|
||||
icon: 'ant-design:delete-outlined',
|
||||
color: 'error',
|
||||
onClick: handleDelete.bind(null, record)
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTableErp>
|
||||
<MaterialInfo :id="recordId" @return-page="isView = false" v-else />
|
||||
<MaterialModal @register="registerModal" @success="reload" />
|
||||
<StockModal @register="registerStockModal" @success="handleReload" />
|
||||
<HistoryModal @register="registerHistoryModal" @success="handleReload" />
|
||||
<ImportModal @register="registerImportModal" importUrl="/caseErpMaterial/caseErpMaterial/import" @success="reload" />
|
||||
</PageWrapper>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { createVNode, ref } from 'vue';
|
||||
import { useTable, TableAction, BasicColumn, FormSchema } from '/@/components/Table';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { PageWrapper } from '/@/components/Page';
|
||||
import {
|
||||
getMaterialPageList,
|
||||
deleteMaterialList,
|
||||
exportInfo,
|
||||
downloadTemplate,
|
||||
} from '/@/api/erp/material/list';
|
||||
import { getPropertylList } from '/@/api/erp/material/property';
|
||||
import { getCategoryList } from '/@/api/erp/material/category';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { ImportModal } from '/@/components/Import';
|
||||
import { downloadByData } from '/@/utils/file/download';
|
||||
import MaterialModal from './components/MaterialModal.vue';
|
||||
import MaterialInfo from './components/MaterialInfo.vue';
|
||||
import StockModal from './components/StockModal.vue';
|
||||
import HistoryModal from './components/HistoryModal.vue';
|
||||
import BasicTableErp from '/@/components/Table/src/BasicTableErp.vue';
|
||||
const { t } = useI18n();
|
||||
const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '物料编码',
|
||||
dataIndex: 'code',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '物料名称',
|
||||
dataIndex: 'name',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '规格型号',
|
||||
dataIndex: 'model',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '当前库存',
|
||||
dataIndex: 'inventory',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '单位',
|
||||
dataIndex: 'unitName',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '物料类别',
|
||||
dataIndex: 'typeName',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '物料属性',
|
||||
dataIndex: 'propertyName',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'state',
|
||||
sorter: true,
|
||||
},
|
||||
];
|
||||
|
||||
const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'name',
|
||||
label: '物料名称',
|
||||
component: 'Input',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料名称',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'classesId',
|
||||
label: '物料类别',
|
||||
component: 'ApiSelect',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请选择物料类别',
|
||||
api: getCategoryList,
|
||||
labelField: 'typeName',
|
||||
valueField: 'id',
|
||||
getPopupContainer: () => document.body,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'propertyId',
|
||||
label: '物料属性',
|
||||
component: 'ApiSelect',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请选择物料属性',
|
||||
api: getPropertylList,
|
||||
labelField: 'propertyName',
|
||||
valueField: 'id',
|
||||
getPopupContainer: () => document.body,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'state',
|
||||
label: '状态',
|
||||
component: 'Select',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请选择状态',
|
||||
options: [
|
||||
{ label: '启用', value: 1 },
|
||||
{ label: '未启用', value: 0 },
|
||||
],
|
||||
getPopupContainer: () => document.body,
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
const { notification } = useMessage();
|
||||
const [registerModal, { openModal }] = useModal();
|
||||
const [registerStockModal, { openModal: openStockModal }] = useModal();
|
||||
const [registerHistoryModal, { openModal: openHistoryModal }] = useModal();
|
||||
const [registerImportModal, { openModal: openImportModal }] = useModal();
|
||||
|
||||
const isView = ref(false);
|
||||
const recordId = ref('');
|
||||
const customRow = (record) => {
|
||||
return {
|
||||
onClick: () => {
|
||||
let selectedRowKeys = [...getSelectRowKeys()];
|
||||
if (selectedRowKeys.indexOf(record.id) >= 0) {
|
||||
let index = selectedRowKeys.indexOf(record.id);
|
||||
selectedRowKeys.splice(index, 1);
|
||||
} else {
|
||||
selectedRowKeys.push(record.id);
|
||||
}
|
||||
setSelectedRowKeys(selectedRowKeys);
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
const [registerTable, { reload, setSelectedRowKeys, getSelectRowKeys, getSelectRows }] = useTable(
|
||||
{
|
||||
title: '物料清单',
|
||||
api: getMaterialPageList,
|
||||
rowKey: 'id',
|
||||
columns,
|
||||
formConfig: {
|
||||
rowProps: {
|
||||
gutter: 16,
|
||||
import { createVNode, ref } from 'vue';
|
||||
import { useTable, TableAction, BasicColumn, FormSchema } from '/@/components/Table';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { PageWrapper } from '/@/components/Page';
|
||||
import { getMaterialPageList, deleteMaterialList, exportInfo, downloadTemplate } from '/@/api/erp/material/list';
|
||||
import { getPropertylList } from '/@/api/erp/material/property';
|
||||
import { getCategoryList } from '/@/api/erp/material/category';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { ImportModal } from '/@/components/Import';
|
||||
import { downloadByData } from '/@/utils/file/download';
|
||||
import MaterialModal from './components/MaterialModal.vue';
|
||||
import MaterialInfo from './components/MaterialInfo.vue';
|
||||
import StockModal from './components/StockModal.vue';
|
||||
import HistoryModal from './components/HistoryModal.vue';
|
||||
import BasicTableErp from '/@/components/Table/src/BasicTableErp.vue';
|
||||
const { t } = useI18n();
|
||||
const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '物料编码',
|
||||
dataIndex: 'code',
|
||||
sorter: true
|
||||
},
|
||||
schemas: searchFormSchema,
|
||||
},
|
||||
useSearchForm: true,
|
||||
showTableSetting: true,
|
||||
striped: false,
|
||||
actionColumn: {
|
||||
width: 120,
|
||||
title: t('操作'),
|
||||
dataIndex: 'action',
|
||||
slots: { customRender: 'action' },
|
||||
},
|
||||
rowSelection: {
|
||||
type: 'checkbox',
|
||||
},
|
||||
customRow,
|
||||
},
|
||||
);
|
||||
{
|
||||
title: '物料名称',
|
||||
dataIndex: 'name',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '规格型号',
|
||||
dataIndex: 'model',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '当前库存',
|
||||
dataIndex: 'inventory',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '单位',
|
||||
dataIndex: 'unitName',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '物料类别',
|
||||
dataIndex: 'typeName',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '物料属性',
|
||||
dataIndex: 'propertyName',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'state',
|
||||
sorter: true
|
||||
}
|
||||
];
|
||||
|
||||
const handleCreate = () => {
|
||||
openModal(true, {
|
||||
isUpdate: false,
|
||||
const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'name',
|
||||
label: '物料名称',
|
||||
component: 'Input',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料名称'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'classesId',
|
||||
label: '物料类别',
|
||||
component: 'ApiSelect',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请选择物料类别',
|
||||
api: getCategoryList,
|
||||
labelField: 'typeName',
|
||||
valueField: 'id',
|
||||
getPopupContainer: () => document.body
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'propertyId',
|
||||
label: '物料属性',
|
||||
component: 'ApiSelect',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请选择物料属性',
|
||||
api: getPropertylList,
|
||||
labelField: 'propertyName',
|
||||
valueField: 'id',
|
||||
getPopupContainer: () => document.body
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'state',
|
||||
label: '状态',
|
||||
component: 'Select',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请选择状态',
|
||||
options: [
|
||||
{ label: '启用', value: 1 },
|
||||
{ label: '未启用', value: 0 }
|
||||
],
|
||||
getPopupContainer: () => document.body
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
const { notification } = useMessage();
|
||||
const [registerModal, { openModal }] = useModal();
|
||||
const [registerStockModal, { openModal: openStockModal }] = useModal();
|
||||
const [registerHistoryModal, { openModal: openHistoryModal }] = useModal();
|
||||
const [registerImportModal, { openModal: openImportModal }] = useModal();
|
||||
|
||||
const isView = ref(false);
|
||||
const recordId = ref('');
|
||||
const customRow = (record) => {
|
||||
return {
|
||||
onClick: () => {
|
||||
let selectedRowKeys = [...getSelectRowKeys()];
|
||||
if (selectedRowKeys.indexOf(record.id) >= 0) {
|
||||
let index = selectedRowKeys.indexOf(record.id);
|
||||
selectedRowKeys.splice(index, 1);
|
||||
} else {
|
||||
selectedRowKeys.push(record.id);
|
||||
}
|
||||
setSelectedRowKeys(selectedRowKeys);
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
const [registerTable, { reload, setSelectedRowKeys, getSelectRowKeys, getSelectRows }] = useTable({
|
||||
title: '物料清单',
|
||||
api: getMaterialPageList,
|
||||
rowKey: 'id',
|
||||
columns,
|
||||
formConfig: {
|
||||
rowProps: {
|
||||
gutter: 16
|
||||
},
|
||||
schemas: searchFormSchema
|
||||
},
|
||||
useSearchForm: true,
|
||||
showTableSetting: true,
|
||||
striped: false,
|
||||
actionColumn: {
|
||||
width: 120,
|
||||
title: t('操作'),
|
||||
dataIndex: 'action',
|
||||
slots: { customRender: 'action' }
|
||||
},
|
||||
rowSelection: {
|
||||
type: 'checkbox'
|
||||
},
|
||||
customRow
|
||||
});
|
||||
};
|
||||
|
||||
const handleView = (record) => {
|
||||
isView.value = true;
|
||||
recordId.value = record.id;
|
||||
};
|
||||
|
||||
const handleEdit = (record) => {
|
||||
openModal(true, {
|
||||
id: record.id,
|
||||
isUpdate: true,
|
||||
});
|
||||
};
|
||||
|
||||
const handleDelete = (record) => {
|
||||
Modal.confirm({
|
||||
title: t('提示信息'),
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: t('是否确认删除？'),
|
||||
okText: t('确认'),
|
||||
cancelText: t('取消'),
|
||||
async onOk() {
|
||||
await deleteMaterialList(record.id);
|
||||
notification.success({
|
||||
message: t('提示'),
|
||||
description: t('删除成功'),
|
||||
const handleCreate = () => {
|
||||
openModal(true, {
|
||||
isUpdate: false
|
||||
});
|
||||
};
|
||||
|
||||
const handleView = (record) => {
|
||||
isView.value = true;
|
||||
recordId.value = record.id;
|
||||
};
|
||||
|
||||
const handleEdit = (record) => {
|
||||
openModal(true, {
|
||||
id: record.id,
|
||||
isUpdate: true
|
||||
});
|
||||
};
|
||||
|
||||
const handleDelete = (record) => {
|
||||
Modal.confirm({
|
||||
title: t('提示信息'),
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: t('是否确认删除？'),
|
||||
okText: t('确认'),
|
||||
cancelText: t('取消'),
|
||||
async onOk() {
|
||||
await deleteMaterialList(record.id);
|
||||
notification.success({
|
||||
message: t('提示'),
|
||||
description: t('删除成功')
|
||||
});
|
||||
reload();
|
||||
},
|
||||
onCancel() {}
|
||||
});
|
||||
};
|
||||
|
||||
const handleCheck = () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要盘点的数据'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
openStockModal(true, {
|
||||
id: getSelectRowKeys()[getSelectRowKeys().length - 1],
|
||||
type: 'check',
|
||||
baseInfo: getSelectRows()[getSelectRows().length - 1]
|
||||
});
|
||||
};
|
||||
|
||||
const handleHistory = () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要查询历史记录的数据'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
openHistoryModal(true, {
|
||||
id: getSelectRowKeys()[getSelectRowKeys().length - 1]
|
||||
});
|
||||
};
|
||||
|
||||
const handleScrap = () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要报废的数据'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
openStockModal(true, {
|
||||
id: getSelectRowKeys()[getSelectRowKeys().length - 1],
|
||||
type: 'scrap',
|
||||
baseInfo: getSelectRows()[getSelectRows().length - 1]
|
||||
});
|
||||
};
|
||||
|
||||
const handleReload = () => {
|
||||
setSelectedRowKeys([]);
|
||||
reload();
|
||||
},
|
||||
onCancel() {},
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
const handleCheck = () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要盘点的数据',
|
||||
});
|
||||
return false;
|
||||
}
|
||||
openStockModal(true, {
|
||||
id: getSelectRowKeys()[getSelectRowKeys().length - 1],
|
||||
type: 'check',
|
||||
baseInfo: getSelectRows()[getSelectRows().length - 1],
|
||||
});
|
||||
};
|
||||
|
||||
const handleHistory = () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要查询历史记录的数据',
|
||||
});
|
||||
return false;
|
||||
}
|
||||
openHistoryModal(true, {
|
||||
id: getSelectRowKeys()[getSelectRowKeys().length - 1],
|
||||
});
|
||||
};
|
||||
|
||||
const handleScrap = () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要报废的数据',
|
||||
});
|
||||
return false;
|
||||
}
|
||||
openStockModal(true, {
|
||||
id: getSelectRowKeys()[getSelectRowKeys().length - 1],
|
||||
type: 'scrap',
|
||||
baseInfo: getSelectRows()[getSelectRows().length - 1],
|
||||
});
|
||||
};
|
||||
|
||||
const handleReload = () => {
|
||||
setSelectedRowKeys([]);
|
||||
reload();
|
||||
};
|
||||
|
||||
const handleImport = () => {
|
||||
openImportModal(true, {
|
||||
title: t('快速导入'),
|
||||
api: downloadTemplate,
|
||||
templateTitle: '物料清单模板',
|
||||
});
|
||||
};
|
||||
const handleExport = async () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要导出的数据',
|
||||
});
|
||||
return false;
|
||||
}
|
||||
const res = await exportInfo(getSelectRowKeys());
|
||||
downloadByData(
|
||||
res.data,
|
||||
'物料清单.xlsx',
|
||||
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
|
||||
);
|
||||
};
|
||||
const handleImport = () => {
|
||||
openImportModal(true, {
|
||||
title: t('快速导入'),
|
||||
api: downloadTemplate,
|
||||
templateTitle: '物料清单模板'
|
||||
});
|
||||
};
|
||||
const handleExport = async () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要导出的数据'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
const res = await exportInfo(getSelectRowKeys());
|
||||
downloadByData(res.data, '物料清单.xlsx', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -1,109 +1,105 @@
|
||||
<template>
|
||||
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
|
||||
<BasicForm @register="registerForm" />
|
||||
</BasicModal>
|
||||
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
|
||||
<BasicForm @register="registerForm" />
|
||||
</BasicModal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, computed, unref } from 'vue';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { FormSchema } from '/@/components/Table';
|
||||
import {
|
||||
getCategoryListInfo,
|
||||
updateCategoryList,
|
||||
addCategoryList,
|
||||
} from '/@/api/erp/material/category';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { ref, computed, unref } from 'vue';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { FormSchema } from '/@/components/Table';
|
||||
import { getCategoryListInfo, updateCategoryList, addCategoryList } from '/@/api/erp/material/category';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
|
||||
const { t } = useI18n();
|
||||
const FormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'typeName',
|
||||
label: '物料类别',
|
||||
component: 'Input',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料类别',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'state',
|
||||
label: '状态',
|
||||
component: 'Switch',
|
||||
colProps: { span: 24 },
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'InputTextArea',
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入备注',
|
||||
},
|
||||
},
|
||||
];
|
||||
const { t } = useI18n();
|
||||
const FormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'typeName',
|
||||
label: '物料类别',
|
||||
component: 'Input',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料类别'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'state',
|
||||
label: '状态',
|
||||
component: 'Switch',
|
||||
colProps: { span: 24 }
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'InputTextArea',
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入备注'
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
const { notification } = useMessage();
|
||||
const isUpdate = ref(true);
|
||||
const rowId = ref('');
|
||||
const { notification } = useMessage();
|
||||
const isUpdate = ref(true);
|
||||
const rowId = ref('');
|
||||
|
||||
const emit = defineEmits(['success']);
|
||||
const emit = defineEmits(['success']);
|
||||
|
||||
const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
|
||||
labelWidth: 100,
|
||||
schemas: FormSchema,
|
||||
showActionButtonGroup: false,
|
||||
actionColOptions: {
|
||||
span: 23,
|
||||
},
|
||||
});
|
||||
const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
|
||||
labelWidth: 100,
|
||||
schemas: FormSchema,
|
||||
showActionButtonGroup: false,
|
||||
actionColOptions: {
|
||||
span: 23
|
||||
}
|
||||
});
|
||||
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
resetFields();
|
||||
setModalProps({ confirmLoading: false });
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
resetFields();
|
||||
setModalProps({ confirmLoading: false });
|
||||
|
||||
isUpdate.value = !!data?.isUpdate;
|
||||
if (unref(isUpdate)) {
|
||||
rowId.value = data.id;
|
||||
const record = await getCategoryListInfo(data.id);
|
||||
setFieldsValue({
|
||||
...record,
|
||||
});
|
||||
} else {
|
||||
setFieldsValue({
|
||||
state: 1,
|
||||
});
|
||||
isUpdate.value = !!data?.isUpdate;
|
||||
if (unref(isUpdate)) {
|
||||
rowId.value = data.id;
|
||||
const record = await getCategoryListInfo(data.id);
|
||||
setFieldsValue({
|
||||
...record
|
||||
});
|
||||
} else {
|
||||
setFieldsValue({
|
||||
state: 1
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
const getTitle = computed(() => (!unref(isUpdate) ? '新增物料类别' : '编辑物料类别'));
|
||||
|
||||
async function handleSubmit() {
|
||||
try {
|
||||
const values = await validate();
|
||||
setModalProps({ confirmLoading: true });
|
||||
|
||||
if (!unref(isUpdate)) {
|
||||
await addCategoryList(values);
|
||||
notification.success({
|
||||
message: '新增物料类别',
|
||||
description: t('成功')
|
||||
});
|
||||
} else {
|
||||
values.id = rowId.value;
|
||||
await updateCategoryList(values);
|
||||
notification.success({
|
||||
message: '编辑物料类别',
|
||||
description: t('成功')
|
||||
});
|
||||
}
|
||||
|
||||
closeModal();
|
||||
emit('success');
|
||||
} catch (error) {
|
||||
setModalProps({ confirmLoading: false });
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const getTitle = computed(() => (!unref(isUpdate) ? '新增物料类别' : '编辑物料类别'));
|
||||
|
||||
async function handleSubmit() {
|
||||
try {
|
||||
const values = await validate();
|
||||
setModalProps({ confirmLoading: true });
|
||||
|
||||
if (!unref(isUpdate)) {
|
||||
await addCategoryList(values);
|
||||
notification.success({
|
||||
message: '新增物料类别',
|
||||
description: t('成功'),
|
||||
});
|
||||
} else {
|
||||
values.id = rowId.value;
|
||||
await updateCategoryList(values);
|
||||
notification.success({
|
||||
message: '编辑物料类别',
|
||||
description: t('成功'),
|
||||
});
|
||||
}
|
||||
|
||||
closeModal();
|
||||
emit('success');
|
||||
} catch (error) {
|
||||
setModalProps({ confirmLoading: false });
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,170 +1,170 @@
|
||||
<template>
|
||||
<BasicModal v-bind="$attrs" @register="registerModal" title="历史明细" :width="1000">
|
||||
<a-tabs v-model:activeKey="activeKey" :style="{ height: '100%' }">
|
||||
<a-tab-pane key="1" tab="全部">
|
||||
<BasicTable @register="registerAllTable">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'type'">
|
||||
<span :style="getType('style', record.type)">{{ getType('text', record.type) }}</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'operateType'">
|
||||
<span :style="getOperateType('style', record.operateType)">
|
||||
{{ getOperateType('text', record.operateType) }}
|
||||
</span>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="入库详情">
|
||||
<BasicTable @register="registerInStoreTable">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'type'">
|
||||
<span :style="getType('style', record.type)">{{ getType('text', record.type) }}</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'operateType'">
|
||||
<span :style="getOperateType('style', record.operateType)">
|
||||
{{ getOperateType('text', record.operateType) }}
|
||||
</span>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="出库详情">
|
||||
<BasicTable @register="registerOutStoreTable">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'type'">
|
||||
<span :style="getType('style', record.type)">{{ getType('text', record.type) }}</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'operateType'">
|
||||
<span :style="getOperateType('style', record.operateType)">
|
||||
{{ getOperateType('text', record.operateType) }}
|
||||
</span>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</BasicModal>
|
||||
<BasicModal v-bind="$attrs" @register="registerModal" title="历史明细" :width="1000">
|
||||
<a-tabs v-model:activeKey="activeKey" :style="{ height: '100%' }">
|
||||
<a-tab-pane key="1" tab="全部">
|
||||
<BasicTable @register="registerAllTable">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'type'">
|
||||
<span :style="getType('style', record.type)">{{ getType('text', record.type) }}</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'operateType'">
|
||||
<span :style="getOperateType('style', record.operateType)">
|
||||
{{ getOperateType('text', record.operateType) }}
|
||||
</span>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="入库详情">
|
||||
<BasicTable @register="registerInStoreTable">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'type'">
|
||||
<span :style="getType('style', record.type)">{{ getType('text', record.type) }}</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'operateType'">
|
||||
<span :style="getOperateType('style', record.operateType)">
|
||||
{{ getOperateType('text', record.operateType) }}
|
||||
</span>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="出库详情">
|
||||
<BasicTable @register="registerOutStoreTable">
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'type'">
|
||||
<span :style="getType('style', record.type)">{{ getType('text', record.type) }}</span>
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'operateType'">
|
||||
<span :style="getOperateType('style', record.operateType)">
|
||||
{{ getOperateType('text', record.operateType) }}
|
||||
</span>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</BasicModal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { BasicTable, useTable, BasicColumn } from '/@/components/Table';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { getMaterialHistoryPageList } from '/@/api/erp/material/list';
|
||||
const allColumns: BasicColumn[] = [
|
||||
{
|
||||
title: '库存类别',
|
||||
dataIndex: 'type',
|
||||
},
|
||||
{
|
||||
title: '产品名称',
|
||||
dataIndex: 'name',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '操作类型',
|
||||
dataIndex: 'operateType',
|
||||
},
|
||||
{
|
||||
title: '操作时间',
|
||||
dataIndex: 'createDate',
|
||||
},
|
||||
{
|
||||
title: '数量',
|
||||
dataIndex: 'count',
|
||||
width: 100,
|
||||
},
|
||||
{
|
||||
title: '库存结余',
|
||||
dataIndex: 'localInventory',
|
||||
width: 100,
|
||||
},
|
||||
];
|
||||
const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '库存类别',
|
||||
dataIndex: 'type',
|
||||
},
|
||||
{
|
||||
title: '产品名称',
|
||||
dataIndex: 'name',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '操作类型',
|
||||
dataIndex: 'operateType',
|
||||
},
|
||||
{
|
||||
title: '操作时间',
|
||||
dataIndex: 'createDate',
|
||||
},
|
||||
{
|
||||
title: '数量',
|
||||
dataIndex: 'count',
|
||||
width: 100,
|
||||
},
|
||||
];
|
||||
const activeKey = ref('1');
|
||||
const rowId = ref('');
|
||||
const [registerModal, { setModalProps }] = useModalInner(async (data) => {
|
||||
setModalProps({ destroyOnClose: true, fixedHeight: true });
|
||||
rowId.value = data.id;
|
||||
activeKey.value = '1';
|
||||
});
|
||||
import { ref } from 'vue';
|
||||
import { BasicTable, useTable, BasicColumn } from '/@/components/Table';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { getMaterialHistoryPageList } from '/@/api/erp/material/list';
|
||||
const allColumns: BasicColumn[] = [
|
||||
{
|
||||
title: '库存类别',
|
||||
dataIndex: 'type'
|
||||
},
|
||||
{
|
||||
title: '产品名称',
|
||||
dataIndex: 'name',
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
title: '操作类型',
|
||||
dataIndex: 'operateType'
|
||||
},
|
||||
{
|
||||
title: '操作时间',
|
||||
dataIndex: 'createDate'
|
||||
},
|
||||
{
|
||||
title: '数量',
|
||||
dataIndex: 'count',
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
title: '库存结余',
|
||||
dataIndex: 'localInventory',
|
||||
width: 100
|
||||
}
|
||||
];
|
||||
const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '库存类别',
|
||||
dataIndex: 'type'
|
||||
},
|
||||
{
|
||||
title: '产品名称',
|
||||
dataIndex: 'name',
|
||||
width: 200
|
||||
},
|
||||
{
|
||||
title: '操作类型',
|
||||
dataIndex: 'operateType'
|
||||
},
|
||||
{
|
||||
title: '操作时间',
|
||||
dataIndex: 'createDate'
|
||||
},
|
||||
{
|
||||
title: '数量',
|
||||
dataIndex: 'count',
|
||||
width: 100
|
||||
}
|
||||
];
|
||||
const activeKey = ref('1');
|
||||
const rowId = ref('');
|
||||
const [registerModal, { setModalProps }] = useModalInner(async (data) => {
|
||||
setModalProps({ destroyOnClose: true, fixedHeight: true });
|
||||
rowId.value = data.id;
|
||||
activeKey.value = '1';
|
||||
});
|
||||
|
||||
const [registerAllTable] = useTable({
|
||||
title: '库存数据列表',
|
||||
api: getMaterialHistoryPageList,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: rowId.value, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns: allColumns,
|
||||
});
|
||||
const [registerInStoreTable] = useTable({
|
||||
api: getMaterialHistoryPageList,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: rowId.value, type: 1, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns,
|
||||
});
|
||||
const [registerOutStoreTable] = useTable({
|
||||
api: getMaterialHistoryPageList,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: rowId.value, type: 0, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns,
|
||||
});
|
||||
const [registerAllTable] = useTable({
|
||||
title: '库存数据列表',
|
||||
api: getMaterialHistoryPageList,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: rowId.value, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns: allColumns
|
||||
});
|
||||
const [registerInStoreTable] = useTable({
|
||||
api: getMaterialHistoryPageList,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: rowId.value, type: 1, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns
|
||||
});
|
||||
const [registerOutStoreTable] = useTable({
|
||||
api: getMaterialHistoryPageList,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: rowId.value, type: 0, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns
|
||||
});
|
||||
|
||||
const getType = (type, record) => {
|
||||
if (type === 'style') {
|
||||
return { color: record === 1 ? '#5e95ff' : '#f59a23' };
|
||||
} else {
|
||||
return record === 1 ? '入库' : '出库';
|
||||
}
|
||||
};
|
||||
const getType = (type, record) => {
|
||||
if (type === 'style') {
|
||||
return { color: record === 1 ? '#5e95ff' : '#f59a23' };
|
||||
} else {
|
||||
return record === 1 ? '入库' : '出库';
|
||||
}
|
||||
};
|
||||
|
||||
const getOperateType = (type, record) => {
|
||||
switch (record) {
|
||||
case -1:
|
||||
return type === 'style' ? { color: '#f59a23' } : '盘点减少';
|
||||
case 0:
|
||||
return type === 'style' ? { color: '#ec808d' } : '报废';
|
||||
case 1:
|
||||
return type === 'style' ? { color: '#5e95ff' } : '盘点增加';
|
||||
case 2:
|
||||
return type === 'style' ? { color: '#f59a23' } : '订单销售';
|
||||
case 3:
|
||||
return type === 'style' ? { color: '#5e95ff' } : '库存采购';
|
||||
default:
|
||||
break;
|
||||
}
|
||||
};
|
||||
const getOperateType = (type, record) => {
|
||||
switch (record) {
|
||||
case -1:
|
||||
return type === 'style' ? { color: '#f59a23' } : '盘点减少';
|
||||
case 0:
|
||||
return type === 'style' ? { color: '#ec808d' } : '报废';
|
||||
case 1:
|
||||
return type === 'style' ? { color: '#5e95ff' } : '盘点增加';
|
||||
case 2:
|
||||
return type === 'style' ? { color: '#f59a23' } : '订单销售';
|
||||
case 3:
|
||||
return type === 'style' ? { color: '#5e95ff' } : '库存采购';
|
||||
default:
|
||||
break;
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
:deep(.ant-tabs-content) {
|
||||
height: 100% !important;
|
||||
}
|
||||
:deep(.ant-tabs-content) {
|
||||
height: 100% !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,213 +1,200 @@
|
||||
<template>
|
||||
<PageWrapper fixedHeight contentFullHeight>
|
||||
<BasicTableErp @register="registerTable">
|
||||
<template #toolbar>
|
||||
<a-button type="primary" @click="handleCreate"> {{ t('新增') }} </a-button>
|
||||
<a-button type="primary" @click="handleImport"> {{ t('导入') }} </a-button>
|
||||
<a-button type="primary" @click="handleExport"> {{ t('导出') }} </a-button>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'state'">
|
||||
<a-switch v-model:checked="record.state" :checkedValue="1" :unCheckedValue="0" disabled />
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'action'">
|
||||
<TableAction
|
||||
:actions="[
|
||||
{
|
||||
icon: 'clarity:note-edit-line',
|
||||
onClick: handleEdit.bind(null, record),
|
||||
},
|
||||
{
|
||||
icon: 'ant-design:delete-outlined',
|
||||
color: 'error',
|
||||
onClick: handleDelete.bind(null, record),
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTableErp>
|
||||
<CategoryModal @register="registerModal" @success="reload" />
|
||||
<ImportModal
|
||||
@register="registerImportModal"
|
||||
importUrl="/caseErpMaterial/caseErpMaterialClasses/import"
|
||||
@success="reload"
|
||||
/>
|
||||
</PageWrapper>
|
||||
<PageWrapper fixedHeight contentFullHeight>
|
||||
<BasicTableErp @register="registerTable">
|
||||
<template #toolbar>
|
||||
<a-button type="primary" @click="handleCreate"> {{ t('新增') }} </a-button>
|
||||
<a-button type="primary" @click="handleImport"> {{ t('导入') }} </a-button>
|
||||
<a-button type="primary" @click="handleExport"> {{ t('导出') }} </a-button>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'state'">
|
||||
<a-switch v-model:checked="record.state" :checkedValue="1" :unCheckedValue="0" disabled />
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'action'">
|
||||
<TableAction
|
||||
:actions="[
|
||||
{
|
||||
icon: 'clarity:note-edit-line',
|
||||
onClick: handleEdit.bind(null, record)
|
||||
},
|
||||
{
|
||||
icon: 'ant-design:delete-outlined',
|
||||
color: 'error',
|
||||
onClick: handleDelete.bind(null, record)
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTableErp>
|
||||
<CategoryModal @register="registerModal" @success="reload" />
|
||||
<ImportModal @register="registerImportModal" importUrl="/caseErpMaterial/caseErpMaterialClasses/import" @success="reload" />
|
||||
</PageWrapper>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { createVNode } from 'vue';
|
||||
import { useTable, TableAction, BasicColumn, FormSchema } from '/@/components/Table';
|
||||
import BasicTableErp from '/@/components/Table/src/BasicTableErp.vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { PageWrapper } from '/@/components/Page';
|
||||
import {
|
||||
getCategoryPageList,
|
||||
deleteCategoryList,
|
||||
exportInfo,
|
||||
downloadTemplate,
|
||||
} from '/@/api/erp/material/category';
|
||||
import { ImportModal } from '/@/components/Import';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { downloadByData } from '/@/utils/file/download';
|
||||
import { createVNode } from 'vue';
|
||||
import { useTable, TableAction, BasicColumn, FormSchema } from '/@/components/Table';
|
||||
import BasicTableErp from '/@/components/Table/src/BasicTableErp.vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { PageWrapper } from '/@/components/Page';
|
||||
import { getCategoryPageList, deleteCategoryList, exportInfo, downloadTemplate } from '/@/api/erp/material/category';
|
||||
import { ImportModal } from '/@/components/Import';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { downloadByData } from '/@/utils/file/download';
|
||||
|
||||
import CategoryModal from './CategoryModal.vue';
|
||||
const { t } = useI18n();
|
||||
const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '物料类别',
|
||||
dataIndex: 'typeName',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '创建人',
|
||||
dataIndex: 'createUserName',
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createDate',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'state',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remark',
|
||||
sorter: true,
|
||||
},
|
||||
];
|
||||
|
||||
const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'typeName',
|
||||
label: '物料类别',
|
||||
component: 'Input',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料类别',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'createDate',
|
||||
label: '创建时间',
|
||||
component: 'RangePicker',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
format: 'YYYY-MM-DD',
|
||||
},
|
||||
},
|
||||
];
|
||||
const { notification } = useMessage();
|
||||
const [registerModal, { openModal }] = useModal();
|
||||
const [registerImportModal, { openModal: openImportModal }] = useModal();
|
||||
|
||||
const customRow = (record) => {
|
||||
return {
|
||||
onClick: () => {
|
||||
let selectedRowKeys = [...getSelectRowKeys()];
|
||||
if (selectedRowKeys.indexOf(record.id) >= 0) {
|
||||
let index = selectedRowKeys.indexOf(record.id);
|
||||
selectedRowKeys.splice(index, 1);
|
||||
} else {
|
||||
selectedRowKeys.push(record.id);
|
||||
import CategoryModal from './CategoryModal.vue';
|
||||
const { t } = useI18n();
|
||||
const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '物料类别',
|
||||
dataIndex: 'typeName',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '创建人',
|
||||
dataIndex: 'createUserName'
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createDate',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'state',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remark',
|
||||
sorter: true
|
||||
}
|
||||
setSelectedRowKeys(selectedRowKeys);
|
||||
},
|
||||
];
|
||||
|
||||
const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'typeName',
|
||||
label: '物料类别',
|
||||
component: 'Input',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料类别'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'createDate',
|
||||
label: '创建时间',
|
||||
component: 'RangePicker',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
format: 'YYYY-MM-DD'
|
||||
}
|
||||
}
|
||||
];
|
||||
const { notification } = useMessage();
|
||||
const [registerModal, { openModal }] = useModal();
|
||||
const [registerImportModal, { openModal: openImportModal }] = useModal();
|
||||
|
||||
const customRow = (record) => {
|
||||
return {
|
||||
onClick: () => {
|
||||
let selectedRowKeys = [...getSelectRowKeys()];
|
||||
if (selectedRowKeys.indexOf(record.id) >= 0) {
|
||||
let index = selectedRowKeys.indexOf(record.id);
|
||||
selectedRowKeys.splice(index, 1);
|
||||
} else {
|
||||
selectedRowKeys.push(record.id);
|
||||
}
|
||||
setSelectedRowKeys(selectedRowKeys);
|
||||
}
|
||||
};
|
||||
};
|
||||
};
|
||||
const [registerTable, { reload, setSelectedRowKeys, getSelectRowKeys }] = useTable({
|
||||
title: '物料类别配置',
|
||||
api: getCategoryPageList,
|
||||
rowKey: 'id',
|
||||
columns,
|
||||
formConfig: {
|
||||
rowProps: {
|
||||
gutter: 16,
|
||||
},
|
||||
schemas: searchFormSchema,
|
||||
fieldMapToTime: [['createDate', ['startTime', 'endTime'], 'YYYY-MM-DD', true]],
|
||||
},
|
||||
useSearchForm: true,
|
||||
showTableSetting: true,
|
||||
striped: false,
|
||||
actionColumn: {
|
||||
width: 80,
|
||||
title: t('操作'),
|
||||
dataIndex: 'action',
|
||||
slots: { customRender: 'action' },
|
||||
},
|
||||
rowSelection: {
|
||||
type: 'checkbox',
|
||||
},
|
||||
customRow,
|
||||
});
|
||||
|
||||
const handleCreate = () => {
|
||||
openModal(true, {
|
||||
isUpdate: false,
|
||||
const [registerTable, { reload, setSelectedRowKeys, getSelectRowKeys }] = useTable({
|
||||
title: '物料类别配置',
|
||||
api: getCategoryPageList,
|
||||
rowKey: 'id',
|
||||
columns,
|
||||
formConfig: {
|
||||
rowProps: {
|
||||
gutter: 16
|
||||
},
|
||||
schemas: searchFormSchema,
|
||||
fieldMapToTime: [['createDate', ['startTime', 'endTime'], 'YYYY-MM-DD', true]]
|
||||
},
|
||||
useSearchForm: true,
|
||||
showTableSetting: true,
|
||||
striped: false,
|
||||
actionColumn: {
|
||||
width: 80,
|
||||
title: t('操作'),
|
||||
dataIndex: 'action',
|
||||
slots: { customRender: 'action' }
|
||||
},
|
||||
rowSelection: {
|
||||
type: 'checkbox'
|
||||
},
|
||||
customRow
|
||||
});
|
||||
};
|
||||
|
||||
const handleEdit = (record) => {
|
||||
openModal(true, {
|
||||
id: record.id,
|
||||
isUpdate: true,
|
||||
});
|
||||
};
|
||||
|
||||
const handleDelete = (record) => {
|
||||
Modal.confirm({
|
||||
title: t('提示信息'),
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: t('是否确认删除？'),
|
||||
okText: t('确认'),
|
||||
cancelText: t('取消'),
|
||||
async onOk() {
|
||||
await deleteCategoryList(record.id);
|
||||
notification.success({
|
||||
message: t('提示'),
|
||||
description: t('删除成功'),
|
||||
const handleCreate = () => {
|
||||
openModal(true, {
|
||||
isUpdate: false
|
||||
});
|
||||
reload();
|
||||
},
|
||||
onCancel() {},
|
||||
});
|
||||
};
|
||||
const handleImport = () => {
|
||||
openImportModal(true, {
|
||||
title: t('快速导入'),
|
||||
api: downloadTemplate,
|
||||
templateTitle: '物料类别模板',
|
||||
});
|
||||
};
|
||||
const handleExport = async () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要导出的数据',
|
||||
});
|
||||
return false;
|
||||
}
|
||||
const res = await exportInfo(getSelectRowKeys());
|
||||
downloadByData(
|
||||
res.data,
|
||||
'物料类别.xlsx',
|
||||
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
|
||||
);
|
||||
};
|
||||
};
|
||||
|
||||
const handleEdit = (record) => {
|
||||
openModal(true, {
|
||||
id: record.id,
|
||||
isUpdate: true
|
||||
});
|
||||
};
|
||||
|
||||
const handleDelete = (record) => {
|
||||
Modal.confirm({
|
||||
title: t('提示信息'),
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: t('是否确认删除？'),
|
||||
okText: t('确认'),
|
||||
cancelText: t('取消'),
|
||||
async onOk() {
|
||||
await deleteCategoryList(record.id);
|
||||
notification.success({
|
||||
message: t('提示'),
|
||||
description: t('删除成功')
|
||||
});
|
||||
reload();
|
||||
},
|
||||
onCancel() {}
|
||||
});
|
||||
};
|
||||
const handleImport = () => {
|
||||
openImportModal(true, {
|
||||
title: t('快速导入'),
|
||||
api: downloadTemplate,
|
||||
templateTitle: '物料类别模板'
|
||||
});
|
||||
};
|
||||
const handleExport = async () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要导出的数据'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
const res = await exportInfo(getSelectRowKeys());
|
||||
downloadByData(res.data, '物料类别.xlsx', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
:deep(.vben-page-wrapper-content) {
|
||||
margin: 0;
|
||||
}
|
||||
:deep(.vben-page-wrapper-content) {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
:deep(.ant-table-wrapper) {
|
||||
height: calc(100% - 12px);
|
||||
}
|
||||
:deep(.ant-table-wrapper) {
|
||||
height: calc(100% - 12px);
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,387 +1,381 @@
|
||||
<template>
|
||||
<div class="info-box">
|
||||
<div>
|
||||
<a-button @click="emit('returnPage')">返回</a-button>
|
||||
<span class="text-base font-bold pl-5">物料详情查看</span>
|
||||
<div class="info-box">
|
||||
<div>
|
||||
<a-button @click="emit('returnPage')">返回</a-button>
|
||||
<span class="text-base font-bold pl-5">物料详情查看</span>
|
||||
</div>
|
||||
<a-divider />
|
||||
<a-card :bordered="false">
|
||||
<div class="title-name">{{ baseInfo?.name }}</div>
|
||||
<div class="title-info">
|
||||
<span>创建人：{{ baseInfo?.createUserName }}</span>
|
||||
<span>创建时间：{{ baseInfo?.createDate }}</span>
|
||||
<span>最后修改人：{{ baseInfo?.modifyUserName }}</span>
|
||||
<span>最后修改时间：{{ baseInfo?.modifyDate }}</span>
|
||||
</div>
|
||||
</a-card>
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="物料信息">
|
||||
<div class="sub-title">基础信息</div>
|
||||
<div class="title-info">
|
||||
<span>物料编码：{{ baseInfo?.code }}</span>
|
||||
<span>物料名称：{{ baseInfo?.name }}</span>
|
||||
<span>规格型号：{{ baseInfo?.model }}</span>
|
||||
<span>单位：{{ baseInfo?.unitName }}</span>
|
||||
<span>物料类别：{{ baseInfo?.typeName }}</span>
|
||||
<span>物料属性：{{ baseInfo?.propertyName }}</span>
|
||||
<span>状态：{{ baseInfo?.state === 1 ? '启用' : '禁用' }}</span>
|
||||
</div>
|
||||
<div class="my-6 img-box">
|
||||
<span>图片资料：</span>
|
||||
<a-image-preview-group v-if="imgList.length">
|
||||
<a-image v-for="(item, index) in imgList" :key="index" :src="item.fileUrl" />
|
||||
</a-image-preview-group>
|
||||
<span style="color: #999" v-else>暂无数据</span>
|
||||
</div>
|
||||
<div class="sub-title">库存信息</div>
|
||||
<a-table :dataSource="materialDataSource" :columns="materialColumns" :pagination="false" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="采购记录">
|
||||
<BasicTable @register="registerPurchaseTable" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="入库记录">
|
||||
<BasicTable @register="registerInStoreTable" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="4" tab="出库记录">
|
||||
<BasicTable @register="registerOutStoreTable" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="5" tab="操作记录">
|
||||
<BasicTable @register="registerLogTable" />
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
<a-divider />
|
||||
<a-card :bordered="false">
|
||||
<div class="title-name">{{ baseInfo?.name }}</div>
|
||||
<div class="title-info">
|
||||
<span>创建人：{{ baseInfo?.createUserName }}</span>
|
||||
<span>创建时间：{{ baseInfo?.createDate }}</span>
|
||||
<span>最后修改人：{{ baseInfo?.modifyUserName }}</span>
|
||||
<span>最后修改时间：{{ baseInfo?.modifyDate }}</span>
|
||||
</div>
|
||||
</a-card>
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="物料信息">
|
||||
<div class="sub-title">基础信息</div>
|
||||
<div class="title-info">
|
||||
<span>物料编码：{{ baseInfo?.code }}</span>
|
||||
<span>物料名称：{{ baseInfo?.name }}</span>
|
||||
<span>规格型号：{{ baseInfo?.model }}</span>
|
||||
<span>单位：{{ baseInfo?.unitName }}</span>
|
||||
<span>物料类别：{{ baseInfo?.typeName }}</span>
|
||||
<span>物料属性：{{ baseInfo?.propertyName }}</span>
|
||||
<span>状态：{{ baseInfo?.state === 1 ? '启用' : '禁用' }}</span>
|
||||
</div>
|
||||
<div class="my-6 img-box">
|
||||
<span>图片资料：</span>
|
||||
<a-image-preview-group v-if="imgList.length">
|
||||
<a-image v-for="(item, index) in imgList" :key="index" :src="item.fileUrl" />
|
||||
</a-image-preview-group>
|
||||
<span style="color: #999" v-else>暂无数据</span>
|
||||
</div>
|
||||
<div class="sub-title">库存信息</div>
|
||||
<a-table :dataSource="materialDataSource" :columns="materialColumns" :pagination="false" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="采购记录">
|
||||
<BasicTable @register="registerPurchaseTable" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="入库记录">
|
||||
<BasicTable @register="registerInStoreTable" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="4" tab="出库记录">
|
||||
<BasicTable @register="registerOutStoreTable" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="5" tab="操作记录">
|
||||
<BasicTable @register="registerLogTable" />
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { BasicTable, useTable, BasicColumn, FormSchema } from '/@/components/Table';
|
||||
import {
|
||||
getMaterialListInfo,
|
||||
getPurchaseInfo,
|
||||
getInStoreInfo,
|
||||
getOutStoreInfo,
|
||||
getLogInfo,
|
||||
} from '/@/api/erp/material/list';
|
||||
import { getFileList } from '/@/api/system/file';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { BasicTable, useTable, BasicColumn, FormSchema } from '/@/components/Table';
|
||||
import { getMaterialListInfo, getPurchaseInfo, getInStoreInfo, getOutStoreInfo, getLogInfo } from '/@/api/erp/material/list';
|
||||
import { getFileList } from '/@/api/system/file';
|
||||
|
||||
const materialColumns = [
|
||||
{
|
||||
title: '本地仓库',
|
||||
dataIndex: 'localHouse',
|
||||
key: 'localHouse',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: 'A02仓库',
|
||||
dataIndex: 'aHouse',
|
||||
key: 'aHouse',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '原料仓库',
|
||||
dataIndex: 'rawMaterialHouse',
|
||||
key: 'rawMaterialHouse',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '研发仓库',
|
||||
dataIndex: 'researchHouse',
|
||||
key: 'researchHouse',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '总库存',
|
||||
dataIndex: 'totalHouse',
|
||||
key: 'totalHouse',
|
||||
align: 'center',
|
||||
},
|
||||
];
|
||||
const purchaseColumns: BasicColumn[] = [
|
||||
{
|
||||
dataIndex: 'number',
|
||||
title: '采购单号',
|
||||
align: 'center',
|
||||
},
|
||||
|
||||
{
|
||||
dataIndex: 'theme',
|
||||
title: '采购主题',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'purchaseDate',
|
||||
title: '采购日期',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'purchasePersonName',
|
||||
title: '采购人员',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'purchaseDeptName',
|
||||
title: '采购部门',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'supplierName',
|
||||
title: '供应商',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'count',
|
||||
title: '采购数量',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'amountSum',
|
||||
title: '采购金额',
|
||||
align: 'center',
|
||||
},
|
||||
];
|
||||
const inStoreColumns: BasicColumn[] = [
|
||||
{
|
||||
dataIndex: 'number',
|
||||
title: '入库单号',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'theme',
|
||||
title: '入库主题',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'date',
|
||||
title: '入库日期',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'insertType',
|
||||
title: '入库类型',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'count',
|
||||
title: '数量',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'person',
|
||||
title: '入库人员',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'store',
|
||||
title: '入库仓库',
|
||||
align: 'center',
|
||||
},
|
||||
];
|
||||
const outStoreColumns: BasicColumn[] = [
|
||||
{
|
||||
dataIndex: 'number',
|
||||
title: '出库单号',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'theme',
|
||||
title: '出库主题',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'date',
|
||||
title: '出库日期',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'outType',
|
||||
title: '出库类型',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'count',
|
||||
title: '数量',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'person',
|
||||
title: '出库人员',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'store',
|
||||
title: '出库仓库',
|
||||
align: 'center',
|
||||
},
|
||||
];
|
||||
const logColumns: BasicColumn[] = [
|
||||
{
|
||||
dataIndex: 'operateUserAccount',
|
||||
title: '操作人',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'createDate',
|
||||
title: '操作时间',
|
||||
align: 'center',
|
||||
},
|
||||
{
|
||||
dataIndex: 'executeResultJson',
|
||||
title: '操作内容',
|
||||
align: 'center',
|
||||
},
|
||||
];
|
||||
|
||||
const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'keyword',
|
||||
label: '',
|
||||
component: 'Input',
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
placeholder: '请输入要查询的关键字',
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
const props = defineProps({
|
||||
id: String,
|
||||
});
|
||||
const emit = defineEmits(['returnPage']);
|
||||
const materialDataSource = ref<any>([]);
|
||||
|
||||
const activeKey = ref('1');
|
||||
const baseInfo = ref();
|
||||
const imgList = ref<any>([]);
|
||||
onMounted(async () => {
|
||||
baseInfo.value = await getMaterialListInfo(props.id!);
|
||||
materialDataSource.value = [
|
||||
{
|
||||
localHouse: baseInfo.value.localHouse,
|
||||
aHouse: baseInfo.value.aHouse,
|
||||
rawMaterialHouse: baseInfo.value.rawMaterialHouse,
|
||||
researchHouse: baseInfo.value.researchHouse,
|
||||
totalHouse: baseInfo.value.totalHouse,
|
||||
},
|
||||
const materialColumns = [
|
||||
{
|
||||
title: '本地仓库',
|
||||
dataIndex: 'localHouse',
|
||||
key: 'localHouse',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: 'A02仓库',
|
||||
dataIndex: 'aHouse',
|
||||
key: 'aHouse',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '原料仓库',
|
||||
dataIndex: 'rawMaterialHouse',
|
||||
key: 'rawMaterialHouse',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '研发仓库',
|
||||
dataIndex: 'researchHouse',
|
||||
key: 'researchHouse',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
title: '总库存',
|
||||
dataIndex: 'totalHouse',
|
||||
key: 'totalHouse',
|
||||
align: 'center'
|
||||
}
|
||||
];
|
||||
if (baseInfo.value.fileId) {
|
||||
imgList.value = await getFileList({ folderId: baseInfo.value.fileId });
|
||||
}
|
||||
});
|
||||
const purchaseColumns: BasicColumn[] = [
|
||||
{
|
||||
dataIndex: 'number',
|
||||
title: '采购单号',
|
||||
align: 'center'
|
||||
},
|
||||
|
||||
const [registerPurchaseTable] = useTable({
|
||||
api: getPurchaseInfo,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: props.id, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns: purchaseColumns,
|
||||
formConfig: {
|
||||
schemas: searchFormSchema,
|
||||
},
|
||||
useSearchForm: true,
|
||||
bordered: true,
|
||||
pagination: false,
|
||||
});
|
||||
const [registerInStoreTable] = useTable({
|
||||
api: getInStoreInfo,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: props.id, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns: inStoreColumns,
|
||||
formConfig: {
|
||||
schemas: searchFormSchema,
|
||||
},
|
||||
useSearchForm: true,
|
||||
bordered: true,
|
||||
pagination: false,
|
||||
});
|
||||
const [registerOutStoreTable] = useTable({
|
||||
api: getOutStoreInfo,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: props.id, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns: outStoreColumns,
|
||||
formConfig: {
|
||||
schemas: searchFormSchema,
|
||||
},
|
||||
useSearchForm: true,
|
||||
bordered: true,
|
||||
pagination: false,
|
||||
});
|
||||
const [registerLogTable] = useTable({
|
||||
api: getLogInfo,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: props.id, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns: logColumns,
|
||||
formConfig: {
|
||||
schemas: searchFormSchema,
|
||||
},
|
||||
useSearchForm: true,
|
||||
bordered: true,
|
||||
pagination: false,
|
||||
});
|
||||
{
|
||||
dataIndex: 'theme',
|
||||
title: '采购主题',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'purchaseDate',
|
||||
title: '采购日期',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'purchasePersonName',
|
||||
title: '采购人员',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'purchaseDeptName',
|
||||
title: '采购部门',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'supplierName',
|
||||
title: '供应商',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'count',
|
||||
title: '采购数量',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'amountSum',
|
||||
title: '采购金额',
|
||||
align: 'center'
|
||||
}
|
||||
];
|
||||
const inStoreColumns: BasicColumn[] = [
|
||||
{
|
||||
dataIndex: 'number',
|
||||
title: '入库单号',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'theme',
|
||||
title: '入库主题',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'date',
|
||||
title: '入库日期',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'insertType',
|
||||
title: '入库类型',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'count',
|
||||
title: '数量',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'person',
|
||||
title: '入库人员',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'store',
|
||||
title: '入库仓库',
|
||||
align: 'center'
|
||||
}
|
||||
];
|
||||
const outStoreColumns: BasicColumn[] = [
|
||||
{
|
||||
dataIndex: 'number',
|
||||
title: '出库单号',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'theme',
|
||||
title: '出库主题',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'date',
|
||||
title: '出库日期',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'outType',
|
||||
title: '出库类型',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'count',
|
||||
title: '数量',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'person',
|
||||
title: '出库人员',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'store',
|
||||
title: '出库仓库',
|
||||
align: 'center'
|
||||
}
|
||||
];
|
||||
const logColumns: BasicColumn[] = [
|
||||
{
|
||||
dataIndex: 'operateUserAccount',
|
||||
title: '操作人',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'createDate',
|
||||
title: '操作时间',
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
dataIndex: 'executeResultJson',
|
||||
title: '操作内容',
|
||||
align: 'center'
|
||||
}
|
||||
];
|
||||
|
||||
const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'keyword',
|
||||
label: '',
|
||||
component: 'Input',
|
||||
colProps: { span: 4 },
|
||||
componentProps: {
|
||||
placeholder: '请输入要查询的关键字'
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
const props = defineProps({
|
||||
id: String
|
||||
});
|
||||
const emit = defineEmits(['returnPage']);
|
||||
const materialDataSource = ref<any>([]);
|
||||
|
||||
const activeKey = ref('1');
|
||||
const baseInfo = ref();
|
||||
const imgList = ref<any>([]);
|
||||
onMounted(async () => {
|
||||
baseInfo.value = await getMaterialListInfo(props.id!);
|
||||
materialDataSource.value = [
|
||||
{
|
||||
localHouse: baseInfo.value.localHouse,
|
||||
aHouse: baseInfo.value.aHouse,
|
||||
rawMaterialHouse: baseInfo.value.rawMaterialHouse,
|
||||
researchHouse: baseInfo.value.researchHouse,
|
||||
totalHouse: baseInfo.value.totalHouse
|
||||
}
|
||||
];
|
||||
if (baseInfo.value.fileId) {
|
||||
imgList.value = await getFileList({ folderId: baseInfo.value.fileId });
|
||||
}
|
||||
});
|
||||
|
||||
const [registerPurchaseTable] = useTable({
|
||||
api: getPurchaseInfo,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: props.id, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns: purchaseColumns,
|
||||
formConfig: {
|
||||
schemas: searchFormSchema
|
||||
},
|
||||
useSearchForm: true,
|
||||
bordered: true,
|
||||
pagination: false
|
||||
});
|
||||
const [registerInStoreTable] = useTable({
|
||||
api: getInStoreInfo,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: props.id, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns: inStoreColumns,
|
||||
formConfig: {
|
||||
schemas: searchFormSchema
|
||||
},
|
||||
useSearchForm: true,
|
||||
bordered: true,
|
||||
pagination: false
|
||||
});
|
||||
const [registerOutStoreTable] = useTable({
|
||||
api: getOutStoreInfo,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: props.id, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns: outStoreColumns,
|
||||
formConfig: {
|
||||
schemas: searchFormSchema
|
||||
},
|
||||
useSearchForm: true,
|
||||
bordered: true,
|
||||
pagination: false
|
||||
});
|
||||
const [registerLogTable] = useTable({
|
||||
api: getLogInfo,
|
||||
beforeFetch: (paramas) => {
|
||||
return { id: props.id, ...paramas };
|
||||
},
|
||||
rowKey: 'id',
|
||||
columns: logColumns,
|
||||
formConfig: {
|
||||
schemas: searchFormSchema
|
||||
},
|
||||
useSearchForm: true,
|
||||
bordered: true,
|
||||
pagination: false
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.info-box {
|
||||
background-color: #fff;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 16px;
|
||||
margin-right: 8px;
|
||||
.info-box {
|
||||
background-color: #fff;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 16px;
|
||||
margin-right: 8px;
|
||||
|
||||
.title-name {
|
||||
font-size: 18px;
|
||||
color: #444;
|
||||
font-weight: 700;
|
||||
margin-bottom: 25px;
|
||||
.title-name {
|
||||
font-size: 18px;
|
||||
color: #444;
|
||||
font-weight: 700;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.title-info span {
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
color: #333;
|
||||
font-weight: 700;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.img-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.title-info span {
|
||||
margin-right: 40px;
|
||||
:deep(.ant-image) {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
padding: 5px;
|
||||
border: 1px solid silver;
|
||||
border-radius: 4px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
color: #333;
|
||||
font-weight: 700;
|
||||
margin-bottom: 24px;
|
||||
:deep(.ant-image-img) {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.img-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
:deep(.ant-divider) {
|
||||
height: 1px;
|
||||
background-color: #dcdfe6;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ant-image) {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
padding: 5px;
|
||||
border: 1px solid silver;
|
||||
border-radius: 4px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
:deep(.ant-card-body) {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
:deep(.ant-image-img) {
|
||||
height: 100%;
|
||||
}
|
||||
:deep(.ant-tabs) {
|
||||
height: 70%;
|
||||
}
|
||||
|
||||
:deep(.ant-divider) {
|
||||
height: 1px;
|
||||
background-color: #dcdfe6;
|
||||
}
|
||||
|
||||
:deep(.ant-card-body) {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
:deep(.ant-tabs) {
|
||||
height: 70%;
|
||||
}
|
||||
|
||||
:deep(.ant-tabs-content) {
|
||||
height: 100%;
|
||||
}
|
||||
:deep(.ant-tabs-content) {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,221 +1,204 @@
|
||||
<template>
|
||||
<BasicModal
|
||||
v-bind="$attrs"
|
||||
@register="registerModal"
|
||||
:title="getTitle"
|
||||
@ok="handleSubmit"
|
||||
@cancel="folderId = ''"
|
||||
>
|
||||
<BasicForm @register="registerForm">
|
||||
<template #code="{ model }">
|
||||
<a-input
|
||||
v-model:value="model.code"
|
||||
placeholder="请输入物料编码"
|
||||
:readonly="model.isSysCodeBoolean"
|
||||
/>
|
||||
</template>
|
||||
<template #isSysCodeBoolean="{ model }">
|
||||
<a-checkbox v-model:checked="model.isSysCodeBoolean" @change="handleSysChange">
|
||||
用系统编号
|
||||
</a-checkbox>
|
||||
</template>
|
||||
<template #imgUpload>
|
||||
<Upload v-model:value="folderId" listType="picture" />
|
||||
</template>
|
||||
</BasicForm>
|
||||
</BasicModal>
|
||||
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" @cancel="folderId = ''">
|
||||
<BasicForm @register="registerForm">
|
||||
<template #code="{ model }">
|
||||
<a-input v-model:value="model.code" placeholder="请输入物料编码" :readonly="model.isSysCodeBoolean" />
|
||||
</template>
|
||||
<template #isSysCodeBoolean="{ model }">
|
||||
<a-checkbox v-model:checked="model.isSysCodeBoolean" @change="handleSysChange"> 用系统编号 </a-checkbox>
|
||||
</template>
|
||||
<template #imgUpload>
|
||||
<Upload v-model:value="folderId" listType="picture" />
|
||||
</template>
|
||||
</BasicForm>
|
||||
</BasicModal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, computed, unref } from 'vue';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { FormSchema } from '/@/components/Table';
|
||||
import Upload from '/@/components/Form/src/components/Upload.vue';
|
||||
import {
|
||||
getMaterialListInfo,
|
||||
updateMaterialList,
|
||||
addMaterialList,
|
||||
getMaterialCode,
|
||||
} from '/@/api/erp/material/list';
|
||||
import { getUnitList } from '/@/api/erp/unit/list';
|
||||
import { getPropertylList } from '/@/api/erp/material/property';
|
||||
import { getCategoryList } from '/@/api/erp/material/category';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { ref, computed, unref } from 'vue';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { FormSchema } from '/@/components/Table';
|
||||
import Upload from '/@/components/Form/src/components/Upload.vue';
|
||||
import { getMaterialListInfo, updateMaterialList, addMaterialList, getMaterialCode } from '/@/api/erp/material/list';
|
||||
import { getUnitList } from '/@/api/erp/unit/list';
|
||||
import { getPropertylList } from '/@/api/erp/material/property';
|
||||
import { getCategoryList } from '/@/api/erp/material/category';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
|
||||
const { t } = useI18n();
|
||||
const FormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'code',
|
||||
label: '物料编码',
|
||||
component: 'Input',
|
||||
slot: 'code',
|
||||
rules: [
|
||||
const { t } = useI18n();
|
||||
const FormSchema: FormSchema[] = [
|
||||
{
|
||||
required: true,
|
||||
validator: (_, value) => {
|
||||
if (getFieldsValue().isSysCodeBoolean) return Promise.resolve();
|
||||
if (value === '') {
|
||||
return Promise.reject('请输入物料编码');
|
||||
} else if (!/^[0-9a-zA-Z_]{6,15}$/.test(value)) {
|
||||
return Promise.reject('请输入由6-15位的数字、字母、下划线组成的字符串');
|
||||
} else {
|
||||
return Promise.resolve();
|
||||
}
|
||||
},
|
||||
field: 'code',
|
||||
label: '物料编码',
|
||||
component: 'Input',
|
||||
slot: 'code',
|
||||
rules: [
|
||||
{
|
||||
required: true,
|
||||
validator: (_, value) => {
|
||||
if (getFieldsValue().isSysCodeBoolean) return Promise.resolve();
|
||||
if (value === '') {
|
||||
return Promise.reject('请输入物料编码');
|
||||
} else if (!/^[0-9a-zA-Z_]{6,15}$/.test(value)) {
|
||||
return Promise.reject('请输入由6-15位的数字、字母、下划线组成的字符串');
|
||||
} else {
|
||||
return Promise.resolve();
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
colProps: { span: 18 }
|
||||
},
|
||||
],
|
||||
colProps: { span: 18 },
|
||||
},
|
||||
{
|
||||
field: 'isSysCodeBoolean',
|
||||
label: '',
|
||||
component: 'Input',
|
||||
slot: 'isSysCodeBoolean',
|
||||
required: true,
|
||||
colProps: { span: 5, offset: 1 },
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
label: '物料名称',
|
||||
component: 'Input',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料名称',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'model',
|
||||
label: '规格型号',
|
||||
component: 'Input',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入规格型号',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'unitId',
|
||||
label: '单位',
|
||||
component: 'ApiSelect',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请选择单位',
|
||||
api: getUnitList,
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
getPopupContainer: () => document.body,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'classesId',
|
||||
label: '物料类别',
|
||||
component: 'ApiSelect',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请选择物料类别',
|
||||
api: getCategoryList,
|
||||
labelField: 'typeName',
|
||||
valueField: 'id',
|
||||
getPopupContainer: () => document.body,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'propertyId',
|
||||
label: '物料属性',
|
||||
component: 'ApiSelect',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请选择物料属性',
|
||||
api: getPropertylList,
|
||||
labelField: 'propertyName',
|
||||
valueField: 'id',
|
||||
getPopupContainer: () => document.body,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'fileId',
|
||||
label: '图片上传',
|
||||
component: 'Upload',
|
||||
slot: 'imgUpload',
|
||||
colProps: { span: 24 },
|
||||
},
|
||||
];
|
||||
{
|
||||
field: 'isSysCodeBoolean',
|
||||
label: '',
|
||||
component: 'Input',
|
||||
slot: 'isSysCodeBoolean',
|
||||
required: true,
|
||||
colProps: { span: 5, offset: 1 }
|
||||
},
|
||||
{
|
||||
field: 'name',
|
||||
label: '物料名称',
|
||||
component: 'Input',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料名称'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'model',
|
||||
label: '规格型号',
|
||||
component: 'Input',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入规格型号'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'unitId',
|
||||
label: '单位',
|
||||
component: 'ApiSelect',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请选择单位',
|
||||
api: getUnitList,
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
getPopupContainer: () => document.body
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'classesId',
|
||||
label: '物料类别',
|
||||
component: 'ApiSelect',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请选择物料类别',
|
||||
api: getCategoryList,
|
||||
labelField: 'typeName',
|
||||
valueField: 'id',
|
||||
getPopupContainer: () => document.body
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'propertyId',
|
||||
label: '物料属性',
|
||||
component: 'ApiSelect',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请选择物料属性',
|
||||
api: getPropertylList,
|
||||
labelField: 'propertyName',
|
||||
valueField: 'id',
|
||||
getPopupContainer: () => document.body
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'fileId',
|
||||
label: '图片上传',
|
||||
component: 'Upload',
|
||||
slot: 'imgUpload',
|
||||
colProps: { span: 24 }
|
||||
}
|
||||
];
|
||||
|
||||
const { notification } = useMessage();
|
||||
const isUpdate = ref(true);
|
||||
const rowId = ref('');
|
||||
const folderId = ref('');
|
||||
const { notification } = useMessage();
|
||||
const isUpdate = ref(true);
|
||||
const rowId = ref('');
|
||||
const folderId = ref('');
|
||||
|
||||
const emit = defineEmits(['success']);
|
||||
const emit = defineEmits(['success']);
|
||||
|
||||
const [registerForm, { setFieldsValue, resetFields, validate, getFieldsValue }] = useForm({
|
||||
labelWidth: 100,
|
||||
schemas: FormSchema,
|
||||
showActionButtonGroup: false,
|
||||
actionColOptions: {
|
||||
span: 23,
|
||||
},
|
||||
});
|
||||
const [registerForm, { setFieldsValue, resetFields, validate, getFieldsValue }] = useForm({
|
||||
labelWidth: 100,
|
||||
schemas: FormSchema,
|
||||
showActionButtonGroup: false,
|
||||
actionColOptions: {
|
||||
span: 23
|
||||
}
|
||||
});
|
||||
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
resetFields();
|
||||
setModalProps({ confirmLoading: false, destroyOnClose: true });
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
resetFields();
|
||||
setModalProps({ confirmLoading: false, destroyOnClose: true });
|
||||
|
||||
isUpdate.value = !!data?.isUpdate;
|
||||
if (unref(isUpdate)) {
|
||||
rowId.value = data.id;
|
||||
const record = await getMaterialListInfo(data.id);
|
||||
folderId.value = record.fileId;
|
||||
setFieldsValue({
|
||||
...record,
|
||||
});
|
||||
} else {
|
||||
folderId.value = '';
|
||||
const materialCode = await getMaterialCode();
|
||||
setFieldsValue({ code: materialCode, isSysCodeBoolean: true });
|
||||
}
|
||||
});
|
||||
isUpdate.value = !!data?.isUpdate;
|
||||
if (unref(isUpdate)) {
|
||||
rowId.value = data.id;
|
||||
const record = await getMaterialListInfo(data.id);
|
||||
folderId.value = record.fileId;
|
||||
setFieldsValue({
|
||||
...record
|
||||
});
|
||||
} else {
|
||||
folderId.value = '';
|
||||
const materialCode = await getMaterialCode();
|
||||
setFieldsValue({ code: materialCode, isSysCodeBoolean: true });
|
||||
}
|
||||
});
|
||||
|
||||
const getTitle = computed(() => (!unref(isUpdate) ? '新增物料' : '编辑物料'));
|
||||
const getTitle = computed(() => (!unref(isUpdate) ? '新增物料' : '编辑物料'));
|
||||
|
||||
const handleSysChange = async (e) => {
|
||||
let materialCode = '';
|
||||
if (e.target.checked) {
|
||||
materialCode = await getMaterialCode();
|
||||
}
|
||||
setFieldsValue({ code: materialCode });
|
||||
};
|
||||
const handleSysChange = async (e) => {
|
||||
let materialCode = '';
|
||||
if (e.target.checked) {
|
||||
materialCode = await getMaterialCode();
|
||||
}
|
||||
setFieldsValue({ code: materialCode });
|
||||
};
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
setFieldsValue({ fileId: folderId.value });
|
||||
const values = await validate();
|
||||
setModalProps({ confirmLoading: true });
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
setFieldsValue({ fileId: folderId.value });
|
||||
const values = await validate();
|
||||
setModalProps({ confirmLoading: true });
|
||||
|
||||
if (!unref(isUpdate)) {
|
||||
await addMaterialList(values);
|
||||
notification.success({
|
||||
message: '新增物料',
|
||||
description: t('成功'),
|
||||
});
|
||||
} else {
|
||||
values.id = rowId.value;
|
||||
await updateMaterialList(values);
|
||||
notification.success({
|
||||
message: '编辑物料',
|
||||
description: t('成功'),
|
||||
});
|
||||
}
|
||||
if (!unref(isUpdate)) {
|
||||
await addMaterialList(values);
|
||||
notification.success({
|
||||
message: '新增物料',
|
||||
description: t('成功')
|
||||
});
|
||||
} else {
|
||||
values.id = rowId.value;
|
||||
await updateMaterialList(values);
|
||||
notification.success({
|
||||
message: '编辑物料',
|
||||
description: t('成功')
|
||||
});
|
||||
}
|
||||
|
||||
closeModal();
|
||||
emit('success');
|
||||
} catch (error) {
|
||||
setModalProps({ confirmLoading: false });
|
||||
}
|
||||
};
|
||||
closeModal();
|
||||
emit('success');
|
||||
} catch (error) {
|
||||
setModalProps({ confirmLoading: false });
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -1,212 +1,199 @@
|
||||
<template>
|
||||
<PageWrapper fixedHeight contentFullHeight>
|
||||
<BasicTableErp @register="registerTable">
|
||||
<template #toolbar>
|
||||
<a-button type="primary" @click="handleCreate"> {{ t('新增') }} </a-button>
|
||||
<a-button type="primary" @click="handleImport"> {{ t('导入') }} </a-button>
|
||||
<a-button type="primary" @click="handleExport"> {{ t('导出') }} </a-button>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'state'">
|
||||
<a-switch v-model:checked="record.state" :checkedValue="1" :unCheckedValue="0" disabled />
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'action'">
|
||||
<TableAction
|
||||
:actions="[
|
||||
{
|
||||
icon: 'clarity:note-edit-line',
|
||||
onClick: handleEdit.bind(null, record),
|
||||
},
|
||||
{
|
||||
icon: 'ant-design:delete-outlined',
|
||||
color: 'error',
|
||||
onClick: handleDelete.bind(null, record),
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTableErp>
|
||||
<PropertyModal @register="registerModal" @success="reload" />
|
||||
<ImportModal
|
||||
@register="registerImportModal"
|
||||
importUrl="/caseErpMaterial/caseErpMaterialProperty/import"
|
||||
@success="reload"
|
||||
/>
|
||||
</PageWrapper>
|
||||
<PageWrapper fixedHeight contentFullHeight>
|
||||
<BasicTableErp @register="registerTable">
|
||||
<template #toolbar>
|
||||
<a-button type="primary" @click="handleCreate"> {{ t('新增') }} </a-button>
|
||||
<a-button type="primary" @click="handleImport"> {{ t('导入') }} </a-button>
|
||||
<a-button type="primary" @click="handleExport"> {{ t('导出') }} </a-button>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex == 'state'">
|
||||
<a-switch v-model:checked="record.state" :checkedValue="1" :unCheckedValue="0" disabled />
|
||||
</template>
|
||||
<template v-if="column.dataIndex == 'action'">
|
||||
<TableAction
|
||||
:actions="[
|
||||
{
|
||||
icon: 'clarity:note-edit-line',
|
||||
onClick: handleEdit.bind(null, record)
|
||||
},
|
||||
{
|
||||
icon: 'ant-design:delete-outlined',
|
||||
color: 'error',
|
||||
onClick: handleDelete.bind(null, record)
|
||||
}
|
||||
]"
|
||||
/>
|
||||
</template>
|
||||
</template>
|
||||
</BasicTableErp>
|
||||
<PropertyModal @register="registerModal" @success="reload" />
|
||||
<ImportModal @register="registerImportModal" importUrl="/caseErpMaterial/caseErpMaterialProperty/import" @success="reload" />
|
||||
</PageWrapper>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { createVNode } from 'vue';
|
||||
import { useTable, TableAction, BasicColumn, FormSchema } from '/@/components/Table';
|
||||
import BasicTableErp from '/@/components/Table/src/BasicTableErp.vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { PageWrapper } from '/@/components/Page';
|
||||
import {
|
||||
getPropertylPageList,
|
||||
deletePropertyList,
|
||||
exportInfo,
|
||||
downloadTemplate,
|
||||
} from '/@/api/erp/material/property';
|
||||
import { ImportModal } from '/@/components/Import';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { downloadByData } from '/@/utils/file/download';
|
||||
import PropertyModal from './PropertyModal.vue';
|
||||
const { t } = useI18n();
|
||||
const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '物料属性',
|
||||
dataIndex: 'propertyName',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '创建人',
|
||||
dataIndex: 'createUserName',
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createDate',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'state',
|
||||
sorter: true,
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remark',
|
||||
sorter: true,
|
||||
},
|
||||
];
|
||||
|
||||
const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'propertyName',
|
||||
label: '物料属性',
|
||||
component: 'Input',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料类别',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'createDate',
|
||||
label: '创建时间',
|
||||
component: 'RangePicker',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
format: 'YYYY-MM-DD',
|
||||
},
|
||||
},
|
||||
];
|
||||
const { notification } = useMessage();
|
||||
const [registerModal, { openModal }] = useModal();
|
||||
const [registerImportModal, { openModal: openImportModal }] = useModal();
|
||||
|
||||
const customRow = (record) => {
|
||||
return {
|
||||
onClick: () => {
|
||||
let selectedRowKeys = [...getSelectRowKeys()];
|
||||
if (selectedRowKeys.indexOf(record.id) >= 0) {
|
||||
let index = selectedRowKeys.indexOf(record.id);
|
||||
selectedRowKeys.splice(index, 1);
|
||||
} else {
|
||||
selectedRowKeys.push(record.id);
|
||||
import { createVNode } from 'vue';
|
||||
import { useTable, TableAction, BasicColumn, FormSchema } from '/@/components/Table';
|
||||
import BasicTableErp from '/@/components/Table/src/BasicTableErp.vue';
|
||||
import { useModal } from '/@/components/Modal';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { PageWrapper } from '/@/components/Page';
|
||||
import { getPropertylPageList, deletePropertyList, exportInfo, downloadTemplate } from '/@/api/erp/material/property';
|
||||
import { ImportModal } from '/@/components/Import';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { Modal } from 'ant-design-vue';
|
||||
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
||||
import { downloadByData } from '/@/utils/file/download';
|
||||
import PropertyModal from './PropertyModal.vue';
|
||||
const { t } = useI18n();
|
||||
const columns: BasicColumn[] = [
|
||||
{
|
||||
title: '物料属性',
|
||||
dataIndex: 'propertyName',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '创建人',
|
||||
dataIndex: 'createUserName'
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createDate',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'state',
|
||||
sorter: true
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remark',
|
||||
sorter: true
|
||||
}
|
||||
setSelectedRowKeys(selectedRowKeys);
|
||||
},
|
||||
];
|
||||
|
||||
const searchFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'propertyName',
|
||||
label: '物料属性',
|
||||
component: 'Input',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料类别'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'createDate',
|
||||
label: '创建时间',
|
||||
component: 'RangePicker',
|
||||
colProps: { span: 8 },
|
||||
componentProps: {
|
||||
format: 'YYYY-MM-DD'
|
||||
}
|
||||
}
|
||||
];
|
||||
const { notification } = useMessage();
|
||||
const [registerModal, { openModal }] = useModal();
|
||||
const [registerImportModal, { openModal: openImportModal }] = useModal();
|
||||
|
||||
const customRow = (record) => {
|
||||
return {
|
||||
onClick: () => {
|
||||
let selectedRowKeys = [...getSelectRowKeys()];
|
||||
if (selectedRowKeys.indexOf(record.id) >= 0) {
|
||||
let index = selectedRowKeys.indexOf(record.id);
|
||||
selectedRowKeys.splice(index, 1);
|
||||
} else {
|
||||
selectedRowKeys.push(record.id);
|
||||
}
|
||||
setSelectedRowKeys(selectedRowKeys);
|
||||
}
|
||||
};
|
||||
};
|
||||
};
|
||||
const [registerTable, { reload, setSelectedRowKeys, getSelectRowKeys }] = useTable({
|
||||
title: '物料属性配置',
|
||||
api: getPropertylPageList,
|
||||
rowKey: 'id',
|
||||
columns,
|
||||
formConfig: {
|
||||
rowProps: {
|
||||
gutter: 16,
|
||||
},
|
||||
schemas: searchFormSchema,
|
||||
fieldMapToTime: [['createDate', ['startTime', 'endTime'], 'YYYY-MM-DD', true]],
|
||||
},
|
||||
useSearchForm: true,
|
||||
showTableSetting: true,
|
||||
striped: false,
|
||||
actionColumn: {
|
||||
width: 80,
|
||||
title: t('操作'),
|
||||
dataIndex: 'action',
|
||||
slots: { customRender: 'action' },
|
||||
},
|
||||
rowSelection: {
|
||||
type: 'checkbox',
|
||||
},
|
||||
customRow,
|
||||
});
|
||||
|
||||
const handleCreate = () => {
|
||||
openModal(true, {
|
||||
isUpdate: false,
|
||||
const [registerTable, { reload, setSelectedRowKeys, getSelectRowKeys }] = useTable({
|
||||
title: '物料属性配置',
|
||||
api: getPropertylPageList,
|
||||
rowKey: 'id',
|
||||
columns,
|
||||
formConfig: {
|
||||
rowProps: {
|
||||
gutter: 16
|
||||
},
|
||||
schemas: searchFormSchema,
|
||||
fieldMapToTime: [['createDate', ['startTime', 'endTime'], 'YYYY-MM-DD', true]]
|
||||
},
|
||||
useSearchForm: true,
|
||||
showTableSetting: true,
|
||||
striped: false,
|
||||
actionColumn: {
|
||||
width: 80,
|
||||
title: t('操作'),
|
||||
dataIndex: 'action',
|
||||
slots: { customRender: 'action' }
|
||||
},
|
||||
rowSelection: {
|
||||
type: 'checkbox'
|
||||
},
|
||||
customRow
|
||||
});
|
||||
};
|
||||
|
||||
const handleEdit = (record) => {
|
||||
openModal(true, {
|
||||
id: record.id,
|
||||
isUpdate: true,
|
||||
});
|
||||
};
|
||||
|
||||
const handleDelete = (record) => {
|
||||
Modal.confirm({
|
||||
title: t('提示信息'),
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: t('是否确认删除？'),
|
||||
okText: t('确认'),
|
||||
cancelText: t('取消'),
|
||||
async onOk() {
|
||||
await deletePropertyList(record.id);
|
||||
notification.success({
|
||||
message: t('提示'),
|
||||
description: t('删除成功'),
|
||||
const handleCreate = () => {
|
||||
openModal(true, {
|
||||
isUpdate: false
|
||||
});
|
||||
reload();
|
||||
},
|
||||
onCancel() {},
|
||||
});
|
||||
};
|
||||
const handleImport = () => {
|
||||
openImportModal(true, {
|
||||
title: t('快速导入'),
|
||||
api: downloadTemplate,
|
||||
templateTitle: '物料属性模板',
|
||||
});
|
||||
};
|
||||
const handleExport = async () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要导出的数据',
|
||||
});
|
||||
return false;
|
||||
}
|
||||
const res = await exportInfo(getSelectRowKeys());
|
||||
downloadByData(
|
||||
res.data,
|
||||
'物料属性.xlsx',
|
||||
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
|
||||
);
|
||||
};
|
||||
};
|
||||
|
||||
const handleEdit = (record) => {
|
||||
openModal(true, {
|
||||
id: record.id,
|
||||
isUpdate: true
|
||||
});
|
||||
};
|
||||
|
||||
const handleDelete = (record) => {
|
||||
Modal.confirm({
|
||||
title: t('提示信息'),
|
||||
icon: createVNode(ExclamationCircleOutlined),
|
||||
content: t('是否确认删除？'),
|
||||
okText: t('确认'),
|
||||
cancelText: t('取消'),
|
||||
async onOk() {
|
||||
await deletePropertyList(record.id);
|
||||
notification.success({
|
||||
message: t('提示'),
|
||||
description: t('删除成功')
|
||||
});
|
||||
reload();
|
||||
},
|
||||
onCancel() {}
|
||||
});
|
||||
};
|
||||
const handleImport = () => {
|
||||
openImportModal(true, {
|
||||
title: t('快速导入'),
|
||||
api: downloadTemplate,
|
||||
templateTitle: '物料属性模板'
|
||||
});
|
||||
};
|
||||
const handleExport = async () => {
|
||||
if (!getSelectRowKeys().length) {
|
||||
notification.warning({
|
||||
message: 'Tip',
|
||||
description: '请选择需要导出的数据'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
const res = await exportInfo(getSelectRowKeys());
|
||||
downloadByData(res.data, '物料属性.xlsx', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
:deep(.vben-page-wrapper-content) {
|
||||
margin: 0;
|
||||
}
|
||||
:deep(.vben-page-wrapper-content) {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
:deep(.ant-table-wrapper) {
|
||||
height: calc(100% - 12px);
|
||||
}
|
||||
:deep(.ant-table-wrapper) {
|
||||
height: calc(100% - 12px);
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,109 +1,105 @@
|
||||
<template>
|
||||
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
|
||||
<BasicForm @register="registerForm" />
|
||||
</BasicModal>
|
||||
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit">
|
||||
<BasicForm @register="registerForm" />
|
||||
</BasicModal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, computed, unref } from 'vue';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { FormSchema } from '/@/components/Table';
|
||||
import {
|
||||
getPropertyListInfo,
|
||||
updatePropertyList,
|
||||
addPropertyList,
|
||||
} from '/@/api/erp/material/property';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { ref, computed, unref } from 'vue';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { FormSchema } from '/@/components/Table';
|
||||
import { getPropertyListInfo, updatePropertyList, addPropertyList } from '/@/api/erp/material/property';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
|
||||
const { t } = useI18n();
|
||||
const FormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'propertyName',
|
||||
label: '物料属性',
|
||||
component: 'Input',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料属性',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'state',
|
||||
label: '状态',
|
||||
component: 'Switch',
|
||||
colProps: { span: 24 },
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'InputTextArea',
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入备注',
|
||||
},
|
||||
},
|
||||
];
|
||||
const { t } = useI18n();
|
||||
const FormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'propertyName',
|
||||
label: '物料属性',
|
||||
component: 'Input',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入物料属性'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'state',
|
||||
label: '状态',
|
||||
component: 'Switch',
|
||||
colProps: { span: 24 }
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'InputTextArea',
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入备注'
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
const { notification } = useMessage();
|
||||
const isUpdate = ref(true);
|
||||
const rowId = ref('');
|
||||
const { notification } = useMessage();
|
||||
const isUpdate = ref(true);
|
||||
const rowId = ref('');
|
||||
|
||||
const emit = defineEmits(['success']);
|
||||
const emit = defineEmits(['success']);
|
||||
|
||||
const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
|
||||
labelWidth: 100,
|
||||
schemas: FormSchema,
|
||||
showActionButtonGroup: false,
|
||||
actionColOptions: {
|
||||
span: 23,
|
||||
},
|
||||
});
|
||||
const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
|
||||
labelWidth: 100,
|
||||
schemas: FormSchema,
|
||||
showActionButtonGroup: false,
|
||||
actionColOptions: {
|
||||
span: 23
|
||||
}
|
||||
});
|
||||
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
resetFields();
|
||||
setModalProps({ confirmLoading: false });
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
resetFields();
|
||||
setModalProps({ confirmLoading: false });
|
||||
|
||||
isUpdate.value = !!data?.isUpdate;
|
||||
if (unref(isUpdate)) {
|
||||
rowId.value = data.id;
|
||||
const record = await getPropertyListInfo(data.id);
|
||||
setFieldsValue({
|
||||
...record,
|
||||
});
|
||||
} else {
|
||||
setFieldsValue({
|
||||
state: 1,
|
||||
});
|
||||
isUpdate.value = !!data?.isUpdate;
|
||||
if (unref(isUpdate)) {
|
||||
rowId.value = data.id;
|
||||
const record = await getPropertyListInfo(data.id);
|
||||
setFieldsValue({
|
||||
...record
|
||||
});
|
||||
} else {
|
||||
setFieldsValue({
|
||||
state: 1
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
const getTitle = computed(() => (!unref(isUpdate) ? '新增物料属性' : '编辑物料属性'));
|
||||
|
||||
async function handleSubmit() {
|
||||
try {
|
||||
const values = await validate();
|
||||
setModalProps({ confirmLoading: true });
|
||||
|
||||
if (!unref(isUpdate)) {
|
||||
await addPropertyList(values);
|
||||
notification.success({
|
||||
message: '新增物料属性',
|
||||
description: t('成功')
|
||||
});
|
||||
} else {
|
||||
values.id = rowId.value;
|
||||
await updatePropertyList(values);
|
||||
notification.success({
|
||||
message: '编辑物料属性',
|
||||
description: t('成功')
|
||||
});
|
||||
}
|
||||
|
||||
closeModal();
|
||||
emit('success');
|
||||
} catch (error) {
|
||||
setModalProps({ confirmLoading: false });
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const getTitle = computed(() => (!unref(isUpdate) ? '新增物料属性' : '编辑物料属性'));
|
||||
|
||||
async function handleSubmit() {
|
||||
try {
|
||||
const values = await validate();
|
||||
setModalProps({ confirmLoading: true });
|
||||
|
||||
if (!unref(isUpdate)) {
|
||||
await addPropertyList(values);
|
||||
notification.success({
|
||||
message: '新增物料属性',
|
||||
description: t('成功'),
|
||||
});
|
||||
} else {
|
||||
values.id = rowId.value;
|
||||
await updatePropertyList(values);
|
||||
notification.success({
|
||||
message: '编辑物料属性',
|
||||
description: t('成功'),
|
||||
});
|
||||
}
|
||||
|
||||
closeModal();
|
||||
emit('success');
|
||||
} catch (error) {
|
||||
setModalProps({ confirmLoading: false });
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,148 +1,142 @@
|
||||
<template>
|
||||
<BasicModal
|
||||
v-bind="$attrs"
|
||||
@register="registerModal"
|
||||
:title="getTitle"
|
||||
@ok="handleSubmit"
|
||||
:width="600"
|
||||
>
|
||||
<a-row> 产品编码： {{ baseInfo?.code }} </a-row>
|
||||
<a-row> 产品名称： {{ baseInfo?.name }} </a-row>
|
||||
<a-row> 规格型号： {{ baseInfo?.model }} </a-row>
|
||||
<a-row> 产品单位： {{ baseInfo?.unitName }} </a-row>
|
||||
<a-row class="count-row"> 当前数量： {{ baseInfo?.inventory }} </a-row>
|
||||
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" :width="600">
|
||||
<a-row> 产品编码： {{ baseInfo?.code }} </a-row>
|
||||
<a-row> 产品名称： {{ baseInfo?.name }} </a-row>
|
||||
<a-row> 规格型号： {{ baseInfo?.model }} </a-row>
|
||||
<a-row> 产品单位： {{ baseInfo?.unitName }} </a-row>
|
||||
<a-row class="count-row"> 当前数量： {{ baseInfo?.inventory }} </a-row>
|
||||
|
||||
<BasicForm @register="registerForm" />
|
||||
</BasicModal>
|
||||
<BasicForm @register="registerForm" />
|
||||
</BasicModal>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { FormSchema } from '/@/components/Table';
|
||||
import { updateMaterialStock } from '/@/api/erp/material/list';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
import { ref } from 'vue';
|
||||
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||||
import { BasicForm, useForm } from '/@/components/Form/index';
|
||||
import { FormSchema } from '/@/components/Table';
|
||||
import { updateMaterialStock } from '/@/api/erp/material/list';
|
||||
import { useMessage } from '/@/hooks/web/useMessage';
|
||||
import { useI18n } from '/@/hooks/web/useI18n';
|
||||
|
||||
const { t } = useI18n();
|
||||
const CheckFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'type',
|
||||
label: '操作类型',
|
||||
component: 'Select',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请选择操作类型',
|
||||
allowClear: false,
|
||||
options: [
|
||||
{ label: '增加库存', value: 1 },
|
||||
{ label: '减少库存', value: -1 },
|
||||
],
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'count',
|
||||
label: '操作数量',
|
||||
component: 'InputNumber',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入操作数量',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'InputTextArea',
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入备注',
|
||||
},
|
||||
},
|
||||
];
|
||||
const { t } = useI18n();
|
||||
const CheckFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'type',
|
||||
label: '操作类型',
|
||||
component: 'Select',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请选择操作类型',
|
||||
allowClear: false,
|
||||
options: [
|
||||
{ label: '增加库存', value: 1 },
|
||||
{ label: '减少库存', value: -1 }
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'count',
|
||||
label: '操作数量',
|
||||
component: 'InputNumber',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入操作数量'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'InputTextArea',
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入备注'
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
const ScrapFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'count',
|
||||
label: '报废数量',
|
||||
component: 'InputNumber',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入报废数量',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'InputTextArea',
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入备注',
|
||||
},
|
||||
},
|
||||
];
|
||||
const ScrapFormSchema: FormSchema[] = [
|
||||
{
|
||||
field: 'count',
|
||||
label: '报废数量',
|
||||
component: 'InputNumber',
|
||||
required: true,
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入报废数量'
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'remark',
|
||||
label: '备注',
|
||||
component: 'InputTextArea',
|
||||
colProps: { span: 24 },
|
||||
componentProps: {
|
||||
placeholder: '请输入备注'
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
const { notification } = useMessage();
|
||||
const rowId = ref('');
|
||||
const getTitle = ref('');
|
||||
const type = ref('');
|
||||
const baseInfo = ref();
|
||||
const formSchema = ref<any[]>([]);
|
||||
const emit = defineEmits(['success', 'register']);
|
||||
const { notification } = useMessage();
|
||||
const rowId = ref('');
|
||||
const getTitle = ref('');
|
||||
const type = ref('');
|
||||
const baseInfo = ref();
|
||||
const formSchema = ref<any[]>([]);
|
||||
const emit = defineEmits(['success', 'register']);
|
||||
|
||||
const [registerForm, { resetFields, validate }] = useForm({
|
||||
labelWidth: 100,
|
||||
schemas: formSchema,
|
||||
showActionButtonGroup: false,
|
||||
actionColOptions: {
|
||||
span: 23,
|
||||
},
|
||||
});
|
||||
const [registerForm, { resetFields, validate }] = useForm({
|
||||
labelWidth: 100,
|
||||
schemas: formSchema,
|
||||
showActionButtonGroup: false,
|
||||
actionColOptions: {
|
||||
span: 23
|
||||
}
|
||||
});
|
||||
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
resetFields();
|
||||
setModalProps({ confirmLoading: false, destroyOnClose: true });
|
||||
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||||
resetFields();
|
||||
setModalProps({ confirmLoading: false, destroyOnClose: true });
|
||||
|
||||
rowId.value = data.id;
|
||||
baseInfo.value = data.baseInfo;
|
||||
type.value = data.type;
|
||||
if (type.value === 'check') {
|
||||
getTitle.value = '盘点';
|
||||
formSchema.value = CheckFormSchema;
|
||||
} else {
|
||||
getTitle.value = '报废';
|
||||
formSchema.value = ScrapFormSchema;
|
||||
}
|
||||
});
|
||||
rowId.value = data.id;
|
||||
baseInfo.value = data.baseInfo;
|
||||
type.value = data.type;
|
||||
if (type.value === 'check') {
|
||||
getTitle.value = '盘点';
|
||||
formSchema.value = CheckFormSchema;
|
||||
} else {
|
||||
getTitle.value = '报废';
|
||||
formSchema.value = ScrapFormSchema;
|
||||
}
|
||||
});
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
const values = await validate();
|
||||
values.id = rowId.value;
|
||||
if (type.value === 'scrap') values.type = 0;
|
||||
setModalProps({ confirmLoading: true });
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
const values = await validate();
|
||||
values.id = rowId.value;
|
||||
if (type.value === 'scrap') values.type = 0;
|
||||
setModalProps({ confirmLoading: true });
|
||||
|
||||
await updateMaterialStock(values);
|
||||
notification.success({
|
||||
message: getTitle.value,
|
||||
description: t('成功'),
|
||||
});
|
||||
await updateMaterialStock(values);
|
||||
notification.success({
|
||||
message: getTitle.value,
|
||||
description: t('成功')
|
||||
});
|
||||
|
||||
closeModal();
|
||||
emit('success');
|
||||
} catch (error) {
|
||||
setModalProps({ confirmLoading: false });
|
||||
}
|
||||
};
|
||||
closeModal();
|
||||
emit('success');
|
||||
} catch (error) {
|
||||
setModalProps({ confirmLoading: false });
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.ant-row {
|
||||
padding: 10px 30px;
|
||||
}
|
||||
.ant-row {
|
||||
padding: 10px 30px;
|
||||
}
|
||||
|
||||
.count-row {
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
.count-row {
|
||||
border-top: 1px solid #ddd;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user