|  |  |  | 
|---|
|  |  |  | <script setup> | 
|---|
|  |  |  | import { getCurrentInstance, ref, computed, reactive, defineProps } from 'vue'; | 
|---|
|  |  |  | import { useRouter } from "vue-router"; | 
|---|
|  |  |  | import { get, post, postBlob, postForm } from '@/utils/request.js' | 
|---|
|  |  |  | import { message, Modal } from 'ant-design-vue'; | 
|---|
|  |  |  | import { globalState, logout } from '@/config.js'; | 
|---|
|  |  |  | import EditView from './edit.vue' | 
|---|
|  |  |  | import { formatMessage } from '@/utils/localeUtils.js'; | 
|---|
|  |  |  | import useTableSearch from '@/utils/tableUtils.jsx'; | 
|---|
|  |  |  | import ShowOrderDetlComponent from '@/components/orderDetl/show.vue'; | 
|---|
|  |  |  | import { | 
|---|
|  |  |  | DownOutlined, | 
|---|
|  |  |  | UploadOutlined, | 
|---|
|  |  |  | DownloadOutlined, | 
|---|
|  |  |  | } from "@ant-design/icons-vue"; | 
|---|
|  |  |  | const context = getCurrentInstance()?.appContext.config.globalProperties; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const router = useRouter(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const props = defineProps({ | 
|---|
|  |  |  | ioModel: null | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const TABLE_KEY = 'table-order'; | 
|---|
|  |  |  | let currentPage = 1; | 
|---|
|  |  |  | let pageSize = 10; | 
|---|
|  |  |  | const searchInput = ref("") | 
|---|
|  |  |  | const searchParam = ref({ | 
|---|
|  |  |  | orderNo: null, | 
|---|
|  |  |  | orderType: null, | 
|---|
|  |  |  | orderSettle: null, | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | const editChild = ref(null) | 
|---|
|  |  |  | const showOrderDetlChild = ref(null) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const state = reactive({ | 
|---|
|  |  |  | selectedRowKeys: [], | 
|---|
|  |  |  | loading: false, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | let tableData = ref([]); | 
|---|
|  |  |  | getPage(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const { | 
|---|
|  |  |  | getColumnSearchProps, | 
|---|
|  |  |  | handleResizeColumn, | 
|---|
|  |  |  | } = useTableSearch(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const columns = [ | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.order_no', '订单编号'), | 
|---|
|  |  |  | dataIndex: 'orderNo', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('orderNo'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.order_time', '单据日期'), | 
|---|
|  |  |  | dataIndex: 'orderTime', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('orderTime'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.order_type', '单据类型'), | 
|---|
|  |  |  | dataIndex: 'orderType$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('orderType$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.order_settle', '单据状态'), | 
|---|
|  |  |  | dataIndex: 'orderSettle$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('orderSettle$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.ioPri', '优先级'), | 
|---|
|  |  |  | dataIndex: 'ioPri', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('ioPri'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.status', '状态'), | 
|---|
|  |  |  | dataIndex: 'status$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('status$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.create_time', '添加时间'), | 
|---|
|  |  |  | dataIndex: 'createTime$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('createTime$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.create_by', '添加人员'), | 
|---|
|  |  |  | dataIndex: 'createBy$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('createBy$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.update_time', '修改时间'), | 
|---|
|  |  |  | dataIndex: 'updateTime$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('updateTime$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.update_by', '修改人员'), | 
|---|
|  |  |  | dataIndex: 'updateBy$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('updateBy$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.memo', '备注'), | 
|---|
|  |  |  | dataIndex: 'memo', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('memo'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  |  | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('common.operation', '操作'), | 
|---|
|  |  |  | name: 'oper', | 
|---|
|  |  |  | dataIndex: 'oper', | 
|---|
|  |  |  | key: 'oper', | 
|---|
|  |  |  | width: 240, | 
|---|
|  |  |  | fixed: 'right', | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | ]; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const hasSelected = computed(() => state.selectedRowKeys.length > 0); | 
|---|
|  |  |  | const start = () => { | 
|---|
|  |  |  | state.loading = true; | 
|---|
|  |  |  | // ajax request after empty completing | 
|---|
|  |  |  | setTimeout(() => { | 
|---|
|  |  |  | state.loading = false; | 
|---|
|  |  |  | state.selectedRowKeys = []; | 
|---|
|  |  |  | }, 1000); | 
|---|
|  |  |  | }; | 
|---|
|  |  |  | const onSelectChange = selectedRowKeys => { | 
|---|
|  |  |  | // console.log('selectedRowKeys changed: ', selectedRowKeys); | 
|---|
|  |  |  | state.selectedRowKeys = selectedRowKeys; | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function getPage() { | 
|---|
|  |  |  | state.loading = true; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | let apiUrl = '/api/order/page'; | 
|---|
|  |  |  | if (props.ioModel == 'in') { | 
|---|
|  |  |  | apiUrl = '/api/order/in/page'; | 
|---|
|  |  |  | } else if (props.ioModel == 'out') { | 
|---|
|  |  |  | apiUrl = '/api/order/out/page'; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | post(apiUrl, { | 
|---|
|  |  |  | current: currentPage, | 
|---|
|  |  |  | pageSize: pageSize, | 
|---|
|  |  |  | condition: searchInput.value, | 
|---|
|  |  |  | _param: searchParam.value, | 
|---|
|  |  |  | }).then((resp) => { | 
|---|
|  |  |  | let result = resp.data; | 
|---|
|  |  |  | if (result.code == 200) { | 
|---|
|  |  |  | let data = result.data; | 
|---|
|  |  |  | tableData.value = data; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | state.loading = false; | 
|---|
|  |  |  | } else if (result.code === 401) { | 
|---|
|  |  |  | message.error(result.msg); | 
|---|
|  |  |  | logout() | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | message.error(result.msg); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const handleEdit = (item) => { | 
|---|
|  |  |  | editChild.value.open = true; | 
|---|
|  |  |  | editChild.value.formData = item == null ? editChild.value.initFormData : JSON.parse(JSON.stringify(item)); | 
|---|
|  |  |  | editChild.value.isSave = item == null; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const handleDel = (rows) => { | 
|---|
|  |  |  | Modal.confirm({ | 
|---|
|  |  |  | title: formatMessage('page.delete', '删除'), | 
|---|
|  |  |  | content: formatMessage('page.delete.confirm', '确定删除该项吗?'), | 
|---|
|  |  |  | maskClosable: true, | 
|---|
|  |  |  | onOk: async () => { | 
|---|
|  |  |  | const hide = message.loading(formatMessage('common.loading', '请求中')); | 
|---|
|  |  |  | try { | 
|---|
|  |  |  | post('/api/order/remove/' + rows.map((row) => row.id).join(','), {}).then(resp => { | 
|---|
|  |  |  | let result = resp.data; | 
|---|
|  |  |  | if (result.code === 200) { | 
|---|
|  |  |  | message.success(result.msg); | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | message.error(result.msg); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | getPage() | 
|---|
|  |  |  | hide() | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } catch (error) { | 
|---|
|  |  |  | message.error(formatMessage('common.fail', '请求失败')); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const showDetl = (item) => { | 
|---|
|  |  |  | showOrderDetlChild.value.openDetl = true; | 
|---|
|  |  |  | showOrderDetlChild.value.orderId = item.id; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const handleExport = async (intl) => { | 
|---|
|  |  |  | postBlob('/api/order/export', { | 
|---|
|  |  |  | ioModel: props.ioModel, | 
|---|
|  |  |  | condition: searchInput.value, | 
|---|
|  |  |  | _param: searchParam.value, | 
|---|
|  |  |  | }).then(result => { | 
|---|
|  |  |  | const blob = new Blob([result.data], { type: 'application/vnd.ms-excel' }); | 
|---|
|  |  |  | window.location.href = window.URL.createObjectURL(blob); | 
|---|
|  |  |  | return true; | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const onSearch = () => { | 
|---|
|  |  |  | // console.log('search'); | 
|---|
|  |  |  | getPage() | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const onPageChange = (page, size) => { | 
|---|
|  |  |  | currentPage = page; | 
|---|
|  |  |  | pageSize = size; | 
|---|
|  |  |  | getPage(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function handleTableReload(value) { | 
|---|
|  |  |  | getPage() | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const handleSyncOrderClick = (e) => { | 
|---|
|  |  |  | if (e.key == 'import') { | 
|---|
|  |  |  | importTemplate() | 
|---|
|  |  |  | } else if (e.key == 'export') { | 
|---|
|  |  |  | exportTemplate() | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const importTemplate = () => { | 
|---|
|  |  |  | //导入模板 | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const exportTemplate = () => { | 
|---|
|  |  |  | //模板导出 | 
|---|
|  |  |  | postBlob('/api/order/exportTemplate', {}).then(result => { | 
|---|
|  |  |  | const blob = new Blob([result.data], { type: 'application/vnd.ms-excel' }); | 
|---|
|  |  |  | window.location.href = window.URL.createObjectURL(blob); | 
|---|
|  |  |  | return true; | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const fileList = ref([]); | 
|---|
|  |  |  | const handleUploadChange = info => { | 
|---|
|  |  |  | if (info.file.status !== 'uploading') { | 
|---|
|  |  |  | // console.log(info.file, info.fileList); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (info.file.status === 'done') { | 
|---|
|  |  |  | let result = info.file.response; | 
|---|
|  |  |  | if (result.code == 200) { | 
|---|
|  |  |  | message.success(`${info.file.name} ${formatMessage('page.upload.success', '上传成功')}`); | 
|---|
|  |  |  | getPage() | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | message.error(result.msg); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } else if (info.file.status === 'error') { | 
|---|
|  |  |  | message.error(`${info.file.name} file upload failed.`); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const orderTypeQueryList = ref(null); | 
|---|
|  |  |  | orderTypeQuery(); | 
|---|
|  |  |  | function orderTypeQuery() { | 
|---|
|  |  |  | postForm('/api/orderType/query', { | 
|---|
|  |  |  | type: 1 | 
|---|
|  |  |  | }).then(resp => { | 
|---|
|  |  |  | let result = resp.data; | 
|---|
|  |  |  | orderTypeQueryList.value = result.data; | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | const orderSettleQueryList = ref(null); | 
|---|
|  |  |  | orderSettleQuery(); | 
|---|
|  |  |  | function orderSettleQuery() { | 
|---|
|  |  |  | postForm('/api/orderSettle/query', {}).then(resp => { | 
|---|
|  |  |  | let result = resp.data; | 
|---|
|  |  |  | orderSettleQueryList.value = result.data; | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | name: '订单' | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <div> | 
|---|
|  |  |  | <EditView ref="editChild" @tableReload="handleTableReload" | 
|---|
|  |  |  | :ioModel="ioModel == 'in' ? 1 : ioModel == 'out' ? 2 : null" /> | 
|---|
|  |  |  | <div class="table-header"> | 
|---|
|  |  |  | <div> | 
|---|
|  |  |  | <a-input v-model:value="searchParam.orderNo" :placeholder="formatMessage('page.order.orderNo.input', '请输入订单编号')" | 
|---|
|  |  |  | style="width: 140px;margin-right: 10px;" /> | 
|---|
|  |  |  | <a-select v-model:value="searchParam.orderSettle" :placeholder="formatMessage('page.order.orderSettle.select', '请选择单据状态')" | 
|---|
|  |  |  | style="width: 140px;margin-right: 10px;" show-search allowClear :options="orderSettleQueryList" optionFilterProp="label" | 
|---|
|  |  |  | optionLabelProp="label"> | 
|---|
|  |  |  | </a-select> | 
|---|
|  |  |  | <a-select v-model:value="searchParam.orderType" :placeholder="formatMessage('page.order.orderType.select', '请选择单据类型')" | 
|---|
|  |  |  | style="width: 140px;margin-right: 10px;" show-search allowClear :options="orderTypeQueryList" optionFilterProp="label" | 
|---|
|  |  |  | optionLabelProp="label"> | 
|---|
|  |  |  | </a-select> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <a-input-search v-model:value="searchInput" :placeholder="formatMessage('page.input', '请输入')" | 
|---|
|  |  |  | style="width: 200px;" @search="onSearch" /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="table-header-right"> | 
|---|
|  |  |  | <a-dropdown> | 
|---|
|  |  |  | <template #overlay> | 
|---|
|  |  |  | <a-menu @click="handleSyncOrderClick"> | 
|---|
|  |  |  | <a-menu-item key="import"> | 
|---|
|  |  |  | <a-upload v-model:file-list="fileList" name="file" action="/api/order/upload" | 
|---|
|  |  |  | @change="handleUploadChange" :showUploadList="false" :headers="{ | 
|---|
|  |  |  | Authorization: globalState.token | 
|---|
|  |  |  | }"> | 
|---|
|  |  |  | <UploadOutlined /> | 
|---|
|  |  |  | {{ formatMessage('page.order.import', '单据导入') }} | 
|---|
|  |  |  | </a-upload> | 
|---|
|  |  |  | </a-menu-item> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <a-menu-item key="export"> | 
|---|
|  |  |  | <DownloadOutlined /> | 
|---|
|  |  |  | {{ formatMessage('page.order.export.template', '导出模板') }} | 
|---|
|  |  |  | </a-menu-item> | 
|---|
|  |  |  | </a-menu> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | <a-button> | 
|---|
|  |  |  | {{ formatMessage('page.order.sync', '单据同步') }} | 
|---|
|  |  |  | <DownOutlined /> | 
|---|
|  |  |  | </a-button> | 
|---|
|  |  |  | </a-dropdown> | 
|---|
|  |  |  | <a-button @click="handleEdit(null)" type="primary">{{ formatMessage('page.add', '添加') }}</a-button> | 
|---|
|  |  |  | <a-button @click="handleExport">{{ formatMessage('page.export', '导出') }}</a-button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <a-table :row-selection="{ selectedRowKeys: state.selectedRowKeys, onChange: onSelectChange }" | 
|---|
|  |  |  | :data-source="tableData.records" :defaultExpandAllRows="false" :key="TABLE_KEY" rowKey="id" | 
|---|
|  |  |  | :pagination="{ total: tableData.total, onChange: onPageChange }" | 
|---|
|  |  |  | :scroll="{ y: 768, scrollToFirstRowOnChange: true }" :columns="columns" @resizeColumn="handleResizeColumn" | 
|---|
|  |  |  | :loading="state.loading"> | 
|---|
|  |  |  | <template #bodyCell="{ column, text, record }"> | 
|---|
|  |  |  | <template v-if="column.dataIndex === 'oper'"> | 
|---|
|  |  |  | <div style="display: flex;justify-content: space-evenly;"> | 
|---|
|  |  |  | <a-button type="link" primary @click="showDetl(record)">{{ formatMessage('page.order.orderDetl', '订单明细') | 
|---|
|  |  |  | }}</a-button> | 
|---|
|  |  |  | <a-button type="link" primary @click="handleEdit(record)">{{ formatMessage('page.edit', '编辑') }}</a-button> | 
|---|
|  |  |  | <a-button type="link" danger @click="handleDel([record])">{{ formatMessage('page.delete', '删除') | 
|---|
|  |  |  | }}</a-button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </a-table> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <ShowOrderDetlComponent ref="showOrderDetlChild" /> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style></style> | 
|---|
|  |  |  | <script setup> | 
|---|
|  |  |  | import {getCurrentInstance, ref, computed, reactive, defineProps, nextTick} from 'vue'; | 
|---|
|  |  |  | import { useRouter } from "vue-router"; | 
|---|
|  |  |  | import { get, post, postBlob, postForm } from '@/utils/request.js' | 
|---|
|  |  |  | import { message, Modal } from 'ant-design-vue'; | 
|---|
|  |  |  | import { globalState, logout } from '@/config.js'; | 
|---|
|  |  |  | import EditView from './edit.vue' | 
|---|
|  |  |  | import { formatMessage } from '@/utils/localeUtils.js'; | 
|---|
|  |  |  | import useTableSearch from '@/utils/tableUtils.jsx'; | 
|---|
|  |  |  | import ShowOrderDetlComponent from '@/components/orderDetl/show.vue'; | 
|---|
|  |  |  | import OrderPrint from '@/components/print/orderPrint/index.vue' | 
|---|
|  |  |  | import { | 
|---|
|  |  |  | DownOutlined, | 
|---|
|  |  |  | UploadOutlined, | 
|---|
|  |  |  | DownloadOutlined, | 
|---|
|  |  |  | } from "@ant-design/icons-vue"; | 
|---|
|  |  |  | const context = getCurrentInstance()?.appContext.config.globalProperties; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const router = useRouter(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const props = defineProps({ | 
|---|
|  |  |  | ioModel: null | 
|---|
|  |  |  | }) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const TABLE_KEY = 'table-order'; | 
|---|
|  |  |  | let currentPage = 1; | 
|---|
|  |  |  | let pageSize = 10; | 
|---|
|  |  |  | const searchInput = ref("") | 
|---|
|  |  |  | const searchParam = ref({ | 
|---|
|  |  |  | orderNo: null, | 
|---|
|  |  |  | orderType: null, | 
|---|
|  |  |  | orderSettle: null, | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | const editChild = ref(null) | 
|---|
|  |  |  | const showOrderDetlChild = ref(null) | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const state = reactive({ | 
|---|
|  |  |  | selectedRowKeys: [], | 
|---|
|  |  |  | loading: false, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | let tableData = ref([]); | 
|---|
|  |  |  | getPage(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const { | 
|---|
|  |  |  | getColumnSearchProps, | 
|---|
|  |  |  | handleResizeColumn, | 
|---|
|  |  |  | } = useTableSearch(); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const columns = [ | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.order_no', '订单编号'), | 
|---|
|  |  |  | dataIndex: 'orderNo', | 
|---|
|  |  |  | width: 230, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('orderNo'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.order_time', '单据日期'), | 
|---|
|  |  |  | dataIndex: 'orderTime', | 
|---|
|  |  |  | width: 180, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('orderTime'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.order_type', '单据类型'), | 
|---|
|  |  |  | dataIndex: 'orderType$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('orderType$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.order_settle', '单据状态'), | 
|---|
|  |  |  | dataIndex: 'orderSettle$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('orderSettle$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.ioPri', '优先级'), | 
|---|
|  |  |  | dataIndex: 'ioPri', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('ioPri'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.status', '状态'), | 
|---|
|  |  |  | dataIndex: 'status$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('status$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.create_time', '添加时间'), | 
|---|
|  |  |  | dataIndex: 'createTime$', | 
|---|
|  |  |  | width: 180, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('createTime$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.create_by', '添加人员'), | 
|---|
|  |  |  | dataIndex: 'createBy$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('createBy$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.update_time', '修改时间'), | 
|---|
|  |  |  | dataIndex: 'updateTime$', | 
|---|
|  |  |  | width: 180, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('updateTime$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.update_by', '修改人员'), | 
|---|
|  |  |  | dataIndex: 'updateBy$', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('updateBy$'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('db.man_order.memo', '备注'), | 
|---|
|  |  |  | dataIndex: 'memo', | 
|---|
|  |  |  | width: 140, | 
|---|
|  |  |  | ellipsis: true, | 
|---|
|  |  |  | ...getColumnSearchProps('memo'), | 
|---|
|  |  |  | }, | 
|---|
|  |  |  |  | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: formatMessage('common.operation', '操作'), | 
|---|
|  |  |  | name: 'oper', | 
|---|
|  |  |  | dataIndex: 'oper', | 
|---|
|  |  |  | key: 'oper', | 
|---|
|  |  |  | width: 240, | 
|---|
|  |  |  | fixed: 'right', | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | ]; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const hasSelected = computed(() => state.selectedRowKeys.length > 0); | 
|---|
|  |  |  | const start = () => { | 
|---|
|  |  |  | state.loading = true; | 
|---|
|  |  |  | // ajax request after empty completing | 
|---|
|  |  |  | setTimeout(() => { | 
|---|
|  |  |  | state.loading = false; | 
|---|
|  |  |  | state.selectedRowKeys = []; | 
|---|
|  |  |  | }, 1000); | 
|---|
|  |  |  | }; | 
|---|
|  |  |  | const onSelectChange = selectedRowKeys => { | 
|---|
|  |  |  | // console.log('selectedRowKeys changed: ', selectedRowKeys); | 
|---|
|  |  |  | state.selectedRowKeys = selectedRowKeys; | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function getPage() { | 
|---|
|  |  |  | state.loading = true; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | let apiUrl = '/api/order/page'; | 
|---|
|  |  |  | if (props.ioModel == 'in') { | 
|---|
|  |  |  | apiUrl = '/api/order/in/page'; | 
|---|
|  |  |  | } else if (props.ioModel == 'out') { | 
|---|
|  |  |  | apiUrl = '/api/order/out/page'; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | post(apiUrl, { | 
|---|
|  |  |  | current: currentPage, | 
|---|
|  |  |  | pageSize: pageSize, | 
|---|
|  |  |  | condition: searchInput.value, | 
|---|
|  |  |  | _param: searchParam.value, | 
|---|
|  |  |  | }).then((resp) => { | 
|---|
|  |  |  | let result = resp.data; | 
|---|
|  |  |  | if (result.code == 200) { | 
|---|
|  |  |  | let data = result.data; | 
|---|
|  |  |  | tableData.value = data; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | state.loading = false; | 
|---|
|  |  |  | } else if (result.code === 401) { | 
|---|
|  |  |  | message.error(result.msg); | 
|---|
|  |  |  | logout() | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | message.error(result.msg); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const handleEdit = (item) => { | 
|---|
|  |  |  | editChild.value.open = true; | 
|---|
|  |  |  | editChild.value.formData = item == null ? editChild.value.initFormData : JSON.parse(JSON.stringify(item)); | 
|---|
|  |  |  | editChild.value.isSave = item == null; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const handleDel = (rows) => { | 
|---|
|  |  |  | Modal.confirm({ | 
|---|
|  |  |  | title: formatMessage('page.delete', '删除'), | 
|---|
|  |  |  | content: formatMessage('page.delete.confirm', '确定删除该项吗?'), | 
|---|
|  |  |  | maskClosable: true, | 
|---|
|  |  |  | onOk: async () => { | 
|---|
|  |  |  | const hide = message.loading(formatMessage('common.loading', '请求中')); | 
|---|
|  |  |  | try { | 
|---|
|  |  |  | post('/api/order/remove/' + rows.map((row) => row.id).join(','), {}).then(resp => { | 
|---|
|  |  |  | let result = resp.data; | 
|---|
|  |  |  | if (result.code === 200) { | 
|---|
|  |  |  | message.success(result.msg); | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | message.error(result.msg); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | getPage() | 
|---|
|  |  |  | hide() | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } catch (error) { | 
|---|
|  |  |  | message.error(formatMessage('common.fail', '请求失败')); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const showDetl = (item) => { | 
|---|
|  |  |  | showOrderDetlChild.value.openDetl = true; | 
|---|
|  |  |  | showOrderDetlChild.value.orderId = item.id; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const printChild = ref(null); | 
|---|
|  |  |  | // 打印订单 | 
|---|
|  |  |  | const handlePrint = async (record) => { | 
|---|
|  |  |  | let printData = []; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const resp = await get("/api/orderDetl/orderId/" + record.__v_raw.id, {}); | 
|---|
|  |  |  | let result = resp.data; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | result.data.forEach((item) => { | 
|---|
|  |  |  | let newItem = {}; | 
|---|
|  |  |  | newItem.matnr = item.mat$.matnr | 
|---|
|  |  |  | newItem.maktx = item.mat$.maktx | 
|---|
|  |  |  | newItem.specs = item.mat$.specs | 
|---|
|  |  |  | newItem.batch = item.batch | 
|---|
|  |  |  | newItem.anfme = item.anfme | 
|---|
|  |  |  | printData.push(newItem) | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | printChild.value.printData = printData; | 
|---|
|  |  |  | printChild.value.orderNo = record.__v_raw.orderNo | 
|---|
|  |  |  | printChild.value.open = true; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const handleExport = async (intl) => { | 
|---|
|  |  |  | postBlob('/api/order/export', { | 
|---|
|  |  |  | ioModel: props.ioModel, | 
|---|
|  |  |  | condition: searchInput.value, | 
|---|
|  |  |  | _param: searchParam.value, | 
|---|
|  |  |  | }).then(result => { | 
|---|
|  |  |  | const blob = new Blob([result.data], { type: 'application/vnd.ms-excel' }); | 
|---|
|  |  |  | window.location.href = window.URL.createObjectURL(blob); | 
|---|
|  |  |  | return true; | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const onSearch = () => { | 
|---|
|  |  |  | getPage() | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const onPageChange = (page, size) => { | 
|---|
|  |  |  | currentPage = page; | 
|---|
|  |  |  | pageSize = size; | 
|---|
|  |  |  | getPage(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | function handleTableReload(value) { | 
|---|
|  |  |  | getPage() | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const handleSyncOrderClick = (e) => { | 
|---|
|  |  |  | if (e.key == 'import') { | 
|---|
|  |  |  | importTemplate() | 
|---|
|  |  |  | } else if (e.key == 'export') { | 
|---|
|  |  |  | exportTemplate() | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const importTemplate = () => { | 
|---|
|  |  |  | //导入模板 | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const exportTemplate = () => { | 
|---|
|  |  |  | //模板导出 | 
|---|
|  |  |  | postBlob('/api/order/exportTemplate', {}).then(result => { | 
|---|
|  |  |  | const blob = new Blob([result.data], { type: 'application/vnd.ms-excel' }); | 
|---|
|  |  |  | window.location.href = window.URL.createObjectURL(blob); | 
|---|
|  |  |  | return true; | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const fileList = ref([]); | 
|---|
|  |  |  | const handleUploadChange = info => { | 
|---|
|  |  |  | if (info.file.status !== 'uploading') { | 
|---|
|  |  |  | // console.log(info.file, info.fileList); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (info.file.status === 'done') { | 
|---|
|  |  |  | let result = info.file.response; | 
|---|
|  |  |  | if (result.code == 200) { | 
|---|
|  |  |  | message.success(`${info.file.name} ${formatMessage('page.upload.success', '上传成功')}`); | 
|---|
|  |  |  | getPage() | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | message.error(result.msg); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } else if (info.file.status === 'error') { | 
|---|
|  |  |  | message.error(`${info.file.name} file upload failed.`); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | const orderTypeQueryList = ref(null); | 
|---|
|  |  |  | orderTypeQuery(); | 
|---|
|  |  |  | function orderTypeQuery() { | 
|---|
|  |  |  | postForm('/api/orderType/query', { | 
|---|
|  |  |  | type: 1 | 
|---|
|  |  |  | }).then(resp => { | 
|---|
|  |  |  | let result = resp.data; | 
|---|
|  |  |  | orderTypeQueryList.value = result.data; | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | const orderSettleQueryList = ref(null); | 
|---|
|  |  |  | orderSettleQuery(); | 
|---|
|  |  |  | function orderSettleQuery() { | 
|---|
|  |  |  | postForm('/api/orderSettle/query', {}).then(resp => { | 
|---|
|  |  |  | let result = resp.data; | 
|---|
|  |  |  | orderSettleQueryList.value = result.data; | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | name: '订单' | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <div> | 
|---|
|  |  |  | <EditView ref="editChild" @tableReload="handleTableReload" | 
|---|
|  |  |  | :ioModel="ioModel == 'in' ? 1 : ioModel == 'out' ? 2 : null" /> | 
|---|
|  |  |  | <div class="table-header"> | 
|---|
|  |  |  | <div> | 
|---|
|  |  |  | <a-input v-model:value="searchParam.orderNo" :placeholder="formatMessage('page.order.orderNo.input', '请输入订单编号')" | 
|---|
|  |  |  | style="width: 140px;margin-right: 10px;" /> | 
|---|
|  |  |  | <a-select v-model:value="searchParam.orderSettle" :placeholder="formatMessage('page.order.orderSettle.select', '请选择单据状态')" | 
|---|
|  |  |  | style="width: 140px;margin-right: 10px;" show-search allowClear :options="orderSettleQueryList" optionFilterProp="label" | 
|---|
|  |  |  | optionLabelProp="label"> | 
|---|
|  |  |  | </a-select> | 
|---|
|  |  |  | <a-select v-model:value="searchParam.orderType" :placeholder="formatMessage('page.order.orderType.select', '请选择单据类型')" | 
|---|
|  |  |  | style="width: 140px;margin-right: 10px;" show-search allowClear :options="orderTypeQueryList" optionFilterProp="label" | 
|---|
|  |  |  | optionLabelProp="label"> | 
|---|
|  |  |  | </a-select> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <a-input-search v-model:value="searchInput" :placeholder="formatMessage('page.input', '请输入')" | 
|---|
|  |  |  | style="width: 200px;" @search="onSearch" /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="table-header-right"> | 
|---|
|  |  |  | <a-dropdown> | 
|---|
|  |  |  | <template #overlay> | 
|---|
|  |  |  | <a-menu @click="handleSyncOrderClick"> | 
|---|
|  |  |  | <a-menu-item key="import"> | 
|---|
|  |  |  | <a-upload v-model:file-list="fileList" name="file" action="/api/order/upload" | 
|---|
|  |  |  | @change="handleUploadChange" :showUploadList="false" :headers="{ | 
|---|
|  |  |  | Authorization: globalState.token | 
|---|
|  |  |  | }"> | 
|---|
|  |  |  | <UploadOutlined /> | 
|---|
|  |  |  | {{ formatMessage('page.order.import', '单据导入') }} | 
|---|
|  |  |  | </a-upload> | 
|---|
|  |  |  | </a-menu-item> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <a-menu-item key="export"> | 
|---|
|  |  |  | <DownloadOutlined /> | 
|---|
|  |  |  | {{ formatMessage('page.order.export.template', '导出模板') }} | 
|---|
|  |  |  | </a-menu-item> | 
|---|
|  |  |  | </a-menu> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | <a-button> | 
|---|
|  |  |  | {{ formatMessage('page.order.sync', '单据同步') }} | 
|---|
|  |  |  | <DownOutlined /> | 
|---|
|  |  |  | </a-button> | 
|---|
|  |  |  | </a-dropdown> | 
|---|
|  |  |  | <a-button @click="handleEdit(null)" type="primary">{{ formatMessage('page.add', '添加') }}</a-button> | 
|---|
|  |  |  | <a-button @click="handleExport">{{ formatMessage('page.export', '导出') }}</a-button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <a-table :row-selection="{ selectedRowKeys: state.selectedRowKeys, onChange: onSelectChange }" | 
|---|
|  |  |  | :data-source="tableData.records" :defaultExpandAllRows="false" :key="TABLE_KEY" rowKey="id" | 
|---|
|  |  |  | :pagination="{ total: tableData.total, onChange: onPageChange }" | 
|---|
|  |  |  | :scroll="{ y: 768, scrollToFirstRowOnChange: true }" :columns="columns" @resizeColumn="handleResizeColumn" | 
|---|
|  |  |  | :loading="state.loading"> | 
|---|
|  |  |  | <template #bodyCell="{ column, text, record }"> | 
|---|
|  |  |  | <template v-if="column.dataIndex === 'oper'"> | 
|---|
|  |  |  | <div style="display: flex;justify-content: space-evenly;"> | 
|---|
|  |  |  | <a-button type="link" primary @click="showDetl(record)">{{ formatMessage('page.order.orderDetl', '订单明细') | 
|---|
|  |  |  | }}</a-button> | 
|---|
|  |  |  | <a-button type="link" primary @click="handlePrint(record)">{{ formatMessage('page.order.orderDetl', | 
|---|
|  |  |  | '打印订单') | 
|---|
|  |  |  | }}</a-button> | 
|---|
|  |  |  | <a-button type="link" primary @click="handleEdit(record)">{{ formatMessage('page.edit', '编辑') }}</a-button> | 
|---|
|  |  |  | <a-button type="link" danger @click="handleDel([record])">{{ formatMessage('page.delete', '删除') | 
|---|
|  |  |  | }}</a-button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </a-table> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <ShowOrderDetlComponent ref="showOrderDetlChild" /> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <OrderPrint ref="printChild" /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style></style> | 
|---|