381 lines
16 KiB
Vue
381 lines
16 KiB
Vue
<!--
|
||
功能：功能描述 出入库报表
|
||
作者：陶庆峰
|
||
-->
|
||
<template>
|
||
<div class="vue-element-page-wrap" ref="tableContainer">
|
||
<el-row class="page-search" justify="space-between" align="bottom">
|
||
<el-form ref="queryFormRef" :model="queryParams" label-width="60px" label-position="left">
|
||
<el-row :gutter="24" class="form-row">
|
||
<el-col :span="4">
|
||
<el-form-item label="作业类型" prop="UNDOID">
|
||
<el-select multiple filterable v-model="queryParams.RECEIVEREQUESTNAMETYPE" placeholder="选择单据类型"
|
||
style="width: 240px" default-first-option>
|
||
<el-option v-for="item in state.ReceiveList" :key="item.VALUE" :label="item.LABEL"
|
||
:value="item.VALUE" />
|
||
</el-select>
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<el-form-item label="物料号" prop="MATERIALSPECNAME">
|
||
<el-Input v-model="queryParams.MATERIALSPECNAME" clearable />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<el-form-item label="库位状态" prop="STOCKSTATE">
|
||
<el-Input v-model="queryParams.STOCKSTATE" clearable />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<el-form-item label="仓库编码" prop="ERPLOCATION" label-width="65px">
|
||
<el-Input v-model="queryParams.ERPLOCATION" clearable />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<el-form-item label="到货单号" prop="RECEIVEREQUESTNAME">
|
||
<el-Input v-model="queryParams.RECEIVEREQUESTNAME" clearable />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<el-form-item label="出库单号" prop="SHIPREQUESTNAME">
|
||
<el-Input v-model="queryParams.SHIPREQUESTNAME" clearable />
|
||
</el-form-item>
|
||
</el-col>
|
||
|
||
</el-row>
|
||
<el-row :gutter="24" class="form-row">
|
||
<el-col :span="4">
|
||
<el-form-item label="批次" prop="CHARGE">
|
||
<el-Input v-model="queryParams.CHARGE" clearable />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<el-form-item label="开始时间" prop="FROMDATE">
|
||
<el-date-picker v-model="queryParams.FROMDATE" value-format="YYYY/MM/DD HH:mm:ss" type="datetime"
|
||
placeholder="Pick a day" />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="4">
|
||
<el-form-item label="结束时间" prop="TODATE">
|
||
<el-date-picker v-model="queryParams.TODATE" value-format="YYYY/MM/DD HH:mm:ss" type="datetime"
|
||
placeholder="Pick a day" />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-form>
|
||
<div class="page-search-btns">
|
||
<el-button type="primary" @click="handleQueryInfo">搜索</el-button>
|
||
<el-button type="primary" @click="exportExcel">导出</el-button>
|
||
<el-button @click="resetQuery">重置</el-button>
|
||
</div>
|
||
</el-row>
|
||
<div class="vue-element-page-table">
|
||
<div class="page-table-operate">
|
||
<div class="page-table-title">
|
||
<div class="page-table-title-left">
|
||
<span>标签信息</span>
|
||
</div>
|
||
</div>
|
||
<div class="page-table-operateBtns">
|
||
<el-popover :persistent="false" placement="right" popper-class="config-table-wrap" trigger="click">
|
||
<template #reference>
|
||
<el-button class="operateBtns-setting">
|
||
<svg-icon icon-class="table_title" width="16px" height="16px" />
|
||
</el-button>
|
||
</template>
|
||
<ConfigTable :list="materialTableConfig.column" @updateList="updateList" />
|
||
</el-popover>
|
||
</div>
|
||
</div>
|
||
<el-table border v-loading="loading" :data="list" highlight-current-row row-key="id" show-summary style="width: 100%" :height="tableHeight">
|
||
<el-table-column
|
||
type="index"
|
||
width="50"
|
||
label="序号"
|
||
>
|
||
</el-table-column>
|
||
<template v-for="(col, index) in materialTableConfig.column" :key="index">
|
||
<el-table-column v-if="!col.hide" :label="col.header" :width="col.width" show-overflow-tooltip>
|
||
<template #default="scope">
|
||
<span>{{ scope.row[col.field] }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
</template>
|
||
</el-table>
|
||
<pagination v-if="page.total" :total="page.total" v-model:pageNumTo="page.pageNum"
|
||
v-model:pageSizeTo="page.pageSize" @pagination="handleQuery" />
|
||
<div>
|
||
<el-row :gutter="24">
|
||
<el-col :span="5">
|
||
<el-form-item label="标签数量" >
|
||
<el-Input v-model="state.AllNumber" placeholder="标签数量总和" clearable />
|
||
</el-form-item>
|
||
</el-col>
|
||
<el-col :span="5">
|
||
<el-form-item label="物料总和" >
|
||
<el-Input v-model="state.UnitNumber" placeholder="标签数量总和" autosize clearable />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</template>
|
||
<script lang="ts">
|
||
export default {
|
||
name: "StockTransaction"
|
||
};
|
||
</script>
|
||
<script lang="ts" setup>
|
||
import { reactive, ref, onMounted, toRefs, getCurrentInstance } from "vue";
|
||
import { ElForm, ElMessageBox, ElTable } from 'element-plus';
|
||
import { getQueryPageList, getQueryList } from '@/api/common';
|
||
import exportDataToExcel from '@/utils/export-excel';
|
||
import { bTableHeight } from "../../../../composables/calcTableHeight";
|
||
|
||
const { tableContainer, tableHeight, updateTableHeight, handleResize } = bTableHeight(155);
|
||
const { proxy }: any = getCurrentInstance();
|
||
const queryFormRef = ref(ElForm);
|
||
const materialTableConfig = ref({
|
||
loading: false,
|
||
column: [] as any,
|
||
data: [],
|
||
})
|
||
const state = reactive({
|
||
ERPFACTORY: '',
|
||
AllNumber: 0,//标签总数量
|
||
UnitNumber: 0,//各单位数量
|
||
radio1: '出库',
|
||
CHARGE: '',
|
||
ReceiveList: [{ value: '', label: '' }, { value: '45', label: 'DH 到货单入库' }, { value: 'SC46', label: 'AC 生产入库' }, { value: 'ZK4A', label: 'SA 转库入库' },
|
||
{ value: '4C', label: 'DN 销售出库' }, { value: '4E', label: '4E 其他出库' }, { value: '4Y', label: 'TF 调拨出库' }
|
||
] as any,
|
||
queryParams: {
|
||
MATERIALSPECNAME: '',
|
||
RECEIVEREQUESTNAMETYPE: '',
|
||
UNDOID: '',
|
||
STOCKSTATE: '',
|
||
ERPLOCATION: '',
|
||
FROMDATE: '',
|
||
TODATE: '',
|
||
CHARGE: '',
|
||
SITENAME: '',
|
||
ERPFACTORY: '',
|
||
SHIPREQUESTNAME: '',
|
||
RECEIVEREQUESTNAME: '',
|
||
REQUESTNAME: '',
|
||
},
|
||
page: {
|
||
pageNum: 1,
|
||
pageSize: 10,
|
||
total: 0
|
||
},
|
||
|
||
loading: false,
|
||
list: [],
|
||
column: [] as any,
|
||
});
|
||
|
||
const { ERPFACTORY,loading, list, column, queryParams, page } = toRefs(state)
|
||
|
||
onMounted(() => {
|
||
materialTableConfig.value.column = [
|
||
{ header: "标签编号", field: "MATERIALPACKINGNAME", hide: false, width: '320px' },
|
||
{ header: "批次", field: "CHARGE", hide: false, width: '200px' },
|
||
{ header: "组织", field: "ERPFACTORYDESC", hide: false, width: '250px' },
|
||
{ header: "仓库", field: "LOCATIONDESC", hide: false, width: '200px' },
|
||
{ header: "物料", field: "MATERIALSPECNAME", hide: false , width: '100px'},
|
||
{ header: "数量", field: "MATERIALQUANTITY", hide: false, width: '100px' },
|
||
{ header: "物料凭证", field: "UNDOID", hide: false, width: '120px' },
|
||
{ header: "凭证日期", field: "UNDODATE", hide: false, width: '100px' },
|
||
{ header: "制造日期", field: "MAKEDATE", hide: false, width: '150px' },
|
||
{ header: "制造日期", field: "MAKEDATE", hide: false, width: '150px' },
|
||
// { header: "标签类型", field: "MATERIALPACKINGTYPE", hide: false },
|
||
{ header: "品质等级", field: "PACKINGGRADE", hide: false, width: '100px' },
|
||
{ header: "到货单号", field: "RECEIVEREQUESTNAME", hide: false, width: '100px' },
|
||
{ header: "出库单号", field: "SHIPREQUESTNAME", hide: false, width: '100px' },
|
||
// { header: "入库单", field: "RECEIVEACTNO", hide: false, width: '100px' },
|
||
{ header: "最后操作时间", field: "LASTEVENTTIME", hide: false , width: '150px' },
|
||
{ header: "最后操作人员", field: "LASTEVENTUSER", hide: false, width: '120px' },
|
||
{ header: "供应商名称", field: "SUPPLIERNAME", hide: false , width: '120px'},
|
||
{ header: "客户", field: "CUSTOMERNAME", hide: false, width: '120px' },
|
||
// { header: "关联客户", field: "", hide: false },
|
||
{ header: "最后操作名称", field: "DESCRIPTION", hide: false, width: '120px' },
|
||
// { header: "SDK规格", field: "SPECNAME", hide: false },
|
||
{ header: "操作备注", field: "OPTREMARK", hide: false },
|
||
]
|
||
getPRINTLIST()
|
||
handleQuery()
|
||
updateTableHeight();
|
||
window.addEventListener('resize', handleResize);
|
||
|
||
let orgNo: any = localStorage.getItem('orgNo');
|
||
// state.orgNo = JSON.parse(pwd).orgNo;
|
||
state.ERPFACTORY = JSON.parse(orgNo);
|
||
console.log(11111111111,state.ERPFACTORY)
|
||
});
|
||
const updateList = (col: any) => {
|
||
materialTableConfig.value.column = col
|
||
}
|
||
|
||
function getPRINTLIST() {
|
||
getQueryList({
|
||
queryId: "getInvoiceLIST",
|
||
version: "00001",
|
||
params: {
|
||
},
|
||
}).then((res: any) => {
|
||
state.ReceiveList = res.data
|
||
})
|
||
}
|
||
function handleQueryInfo() {
|
||
state.page.pageNum = 1
|
||
handleQuery()
|
||
}
|
||
function handleQuery() {
|
||
Object.keys(state.queryParams).forEach((key) => {
|
||
if (state.queryParams[key] && state.queryParams[key].length === 0) {
|
||
state.queryParams[key] = ''
|
||
}
|
||
});
|
||
state.list = [];
|
||
state.page.total = 0;
|
||
let loactionString = ''
|
||
for (let i = 0; i < state.queryParams.RECEIVEREQUESTNAMETYPE.length; i++) {
|
||
loactionString = loactionString + state.queryParams.RECEIVEREQUESTNAMETYPE[i] + ','
|
||
}
|
||
state.loading = true
|
||
queryFormRef.value.validate((isValid: boolean) => {
|
||
if (isValid) {
|
||
getQueryPageList({
|
||
queryId: "GetMaterialBoxInformationRow",
|
||
version: "WEB0004",
|
||
params: {
|
||
userId: localStorage.getItem('userId'),
|
||
// ...state.queryParams
|
||
MATERIALSPECNAME: state.queryParams.MATERIALSPECNAME ? state.queryParams.MATERIALSPECNAME.split(',') : '',
|
||
UNDOID: state.queryParams.UNDOID,
|
||
STOCKSTATE: state.queryParams.STOCKSTATE,
|
||
ERPLOCATION: state.queryParams.ERPLOCATION,
|
||
FROMDATE: state.queryParams.FROMDATE,
|
||
TODATE: state.queryParams.TODATE,
|
||
SITENAME: '',
|
||
ERPFACTORY: state.ERPFACTORY,
|
||
CHARGE: state.queryParams.CHARGE,
|
||
RECEIVEREQUESTNAMETYPE: loactionString,
|
||
// CHARGE: state.CHARGE,
|
||
RECEIVEREQUESTNAME: state.queryParams.RECEIVEREQUESTNAME,
|
||
SHIPREQUESTNAME: state.queryParams.SHIPREQUESTNAME,
|
||
},
|
||
pageNum: state.page.pageNum,
|
||
pageSize: state.page.pageSize,
|
||
}).then((res: any) => {
|
||
if(res.data.list.length == 0){
|
||
ElMessageBox.alert('查无数据', '提醒框', {
|
||
confirmButtonText: 'OK',
|
||
})
|
||
state.loading = false
|
||
} else {
|
||
state.list = res.data.list;
|
||
state.page.total = res.data.total;
|
||
state.AllNumber = 0
|
||
state.UnitNumber = 0
|
||
getQueryList({
|
||
queryId: "GetMaterialBoxInformationRow",
|
||
version: "WEB00041",
|
||
params: {
|
||
userId: localStorage.getItem('userId'),
|
||
// ...state.queryParams
|
||
MATERIALSPECNAME: state.queryParams.MATERIALSPECNAME ? state.queryParams.MATERIALSPECNAME.split(',') : '',
|
||
UNDOID: state.queryParams.UNDOID,
|
||
STOCKSTATE: state.queryParams.STOCKSTATE,
|
||
ERPLOCATION: state.queryParams.ERPLOCATION,
|
||
FROMDATE: state.queryParams.FROMDATE,
|
||
TODATE: state.queryParams.TODATE,
|
||
SITENAME: '',
|
||
ERPFACTORY: '',
|
||
CHARGE: state.queryParams.CHARGE,
|
||
RECEIVEREQUESTNAMETYPE: loactionString,
|
||
// CHARGE: state.CHARGE,
|
||
RECEIVEREQUESTNAME: state.queryParams.RECEIVEREQUESTNAME,
|
||
SHIPREQUESTNAME: state.queryParams.SHIPREQUESTNAME,
|
||
},
|
||
})
|
||
.then((res: any) => {
|
||
for (let i = 0; i < res.data.length; i++) {
|
||
let number = res.data[i].PACKINGNUMBER == null ? 0 : res.data[i].PACKINGNUMBER
|
||
let Qty = res.data[i].UNITNUMBER == null ? 0 : res.data[i].UNITNUMBER
|
||
state.AllNumber = state.AllNumber + parseFloat(number)
|
||
state.UnitNumber = state.UnitNumber + Qty
|
||
}
|
||
|
||
})
|
||
state.loading = false
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
|
||
function exportExcel() {
|
||
Object.keys(state.queryParams).forEach((key) => {
|
||
if (state.queryParams[key] && state.queryParams[key].length === 0) {
|
||
state.queryParams[key] = ''
|
||
}
|
||
});
|
||
let loactionString = ''
|
||
for (let i = 0; i < state.queryParams.RECEIVEREQUESTNAMETYPE.length; i++) {
|
||
loactionString = loactionString + state.queryParams.RECEIVEREQUESTNAMETYPE[i] + ','
|
||
}
|
||
state.loading = true
|
||
getQueryList({
|
||
queryId: "GetMaterialBoxInformationRow",
|
||
version: "00022",
|
||
params: {
|
||
userId: localStorage.getItem('userId'),
|
||
// ...state.queryParams
|
||
MATERIALSPECNAME: state.queryParams.MATERIALSPECNAME ? state.queryParams.MATERIALSPECNAME.split(',') : '',
|
||
UNDOID: state.queryParams.UNDOID,
|
||
STOCKSTATE: state.queryParams.STOCKSTATE,
|
||
ERPLOCATION: state.queryParams.ERPLOCATION,
|
||
FROMDATE: state.queryParams.FROMDATE,
|
||
TODATE: state.queryParams.TODATE,
|
||
SITENAME: '',
|
||
ERPFACTORY: '',
|
||
CHARGE: state.queryParams.CHARGE,
|
||
RECEIVEREQUESTNAMETYPE: loactionString,
|
||
// CHARGE: state.CHARGE,
|
||
RECEIVEREQUESTNAME: state.queryParams.RECEIVEREQUESTNAME,
|
||
SHIPREQUESTNAME: state.queryParams.SHIPREQUESTNAME
|
||
}
|
||
}).then((res: any) => {
|
||
if (res.data.length > 0) {
|
||
state.loading = false
|
||
exportDataToExcel(res.data, '库存查询')
|
||
} else {
|
||
state.loading = false
|
||
proxy.$ElMessage.warning('当前查询没有数据可以导出');
|
||
}
|
||
});
|
||
}
|
||
|
||
function resetQuery() {
|
||
queryFormRef.value.resetFields();
|
||
handleQuery();
|
||
}
|
||
|
||
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.form-row {
|
||
padding-right: 100px;
|
||
margin-bottom: 7px;
|
||
}
|
||
|
||
.form-row2 {
|
||
padding-right: 30px;
|
||
margin-bottom: 30px;
|
||
}
|
||
</style> |