空管耐用品库存管理前端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

327 lines
9.1 KiB

<template>
<basic-container>
<avue-crud :option="option" :table-loading="loading" :data="data" ref="crud" v-model="form" :page.sync="page"
:permission="permissionList" @search-change="searchChange" @search-reset="searchReset"
@selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
@refresh-change="refreshChange" @on-load="onLoad" >
<!-- @row-click="rowSelect" -->
<template slot-scope="scope" slot="menuLeft">
<el-button size="small" type="primary" @click="handleDesign()">新增出库单
</el-button>
<!-- <el-button size="small" plain @click="handleExport()">出库单导出
</el-button> -->
</template>
<!-- <template slot-scope="scope" slot="purchaseEndInfo">
<el-button type="text" @click.stop="purchaseFn(scope.row)"
v-if="scope.row.purchaseEndInfo != '无'">
{{scope.row.purchaseEndInfo }}</el-button>
<span>{{ scope.row.purchaseEndInfo || '无' }}</span>
</template> -->
<template slot-scope="scope" slot="demandEndInfo">
<el-button
type="text"
@click.stop="purchaseFn(scope.row)"
v-if="scope.row.demandEndInfo && scope.row.demandEndInfo !== ''"
>{{ scope.row.demandEndInfo }}</el-button
>
<span v-else>无</span>
</template>
<template #menu="scope">
<el-button type="text" @click.stop="handleDetails(scope.row)">详情</el-button>
<el-button type="text" v-if="scope.row.status == 1" @click.stop="handleEdit(scope.row)">编辑</el-button>
</template>
</avue-crud>
<outDialog v-if="outDialogVisible" :repairVisible='outDialogVisible' :outDialogTiltle="outDialogTiltle"
:outDialogType="outDialogType" @handleCloseDetail="handleCloseDetail" type="一级库" @submitSuccess="handleSubmitSuccess"
:id="id">
</outDialog>
<!-- 需求单明细 -->
<needDialog :showDialog="purchaseOpen" v-if="purchaseOpen" @closeDialog="closeDialog"
:purchaseTitle="purchaseTitle">
</needDialog>
</basic-container>
</template>
<script>
import { getList } from "@/api/firstOrder/outbound";
import outDialog from './components/outDialog.vue';
import needDialog from './components/needDialog.vue';
export default {
components: {
outDialog,
needDialog
},
data() {
return {
form: { outDate: [] },
selectionList: [],
query: {},
loading: true,
page: {
pageSize: 10,
currentPage: 1,
total: 0
},
option: {
height: 'auto',
calcHeight: 30,
tip: false,
searchShow: true,
searchMenuSpan: 12,
border: true,
index: true,
selection: true,
viewBtn: false,
editBtn: false,
delBtn: false,
addBtn: false,
dialogClickModal: false,
selection: false,
printBtn: false,
refreshBtn: false,
gridBtn: false,
gridBackgroundImage: false,
gridSpan: false,
filterBtn: false,
columnBtn: false,
menuWidth: 120,
menu: true,
menuAlign: "left",
searchMenuPosition: "right",
excelBtn: true,
column: [
{
label: "需求单名称",
prop: "demandEndInfo",
width: 180,
headerAlign: "center",
align: "center",
formatter: (row, column) => {
const value = row.demandEndInfo;
if (value === null || value === undefined || value === "") {
return "无";
}
return value;
}
},
{
label: "出库单号",
prop: "orderNo",
width: 140,
headerAlign: "center",
align: "center",
},
// {
// label: "出库类型",
// prop: "outType",
// width: 140,
// headerAlign: "center",
// align: "center",
// },
{
label: "出库日期",
prop: "outDate",
search: true,
type: "datetime",
searchRange: true,
startPlaceholder: '开始时间',
endPlaceholder: "结束时间",
format: 'yyyy-MM-dd HH:mm:ss',
valueFormat: 'yyyy-MM-dd HH:mm:ss',
width: 140,
headerAlign: "center",
align: "center",
},
{
label: "事由",
prop: "reason",
search: false,
headerAlign: "center",
align: "center",
},
{
label: "物资类型",
prop: "materialType",
search: false,
type: 'select',
headerAlign: "center",
align: "center",
dicData: [{
label: '办公物资',
value: '1'
},
{
label: '其他物资',
value: '2'
}]
},
// {
// label: "部门",
// prop: "department",
// align: "center",
// headerAlign: "center",
// formatter: (row, column) => {
// const value = row.department;
// if (value === null || value === undefined || value === "") {
// return "无";
// }
// return value;
// }
// },
{
label: "出库人",
prop: "shipperName",
search: true,
searchParam: 'inOperator',
align: "center",
headerAlign: "center",
},
{
label: "状态",
prop: "status",
type: 'select',
dicData: [
{
label: '暂存',
value: 1
},
{
label: '待审批',
value: 2
},
{
label: '已审批',
value: 3
},
]
},
]
},
data: [],
outDialogVisible: false,
outDialogTiltle: '出库',
outDialogType: '',//弹框类型
purchaseOpen: false,
purchaseTitle: '',
inTitle: '',
};
},
computed: {
},
methods: {
handleDesign() {
this.outDialogVisible = true
this.outDialogType = 'add'
this.outDialogTiltle = '新增出库'
},
// 详情
handleDetails(row) {
console.log(row, 'row详情')
this.outDialogVisible = true
this.outDialogType = 'details'
this.outDialogTiltle = '详情'
this.id = row.id
console.log(this.id,'详情的id')
},
// 编辑
handleEdit(row) {
this.outDialogVisible = true
this.outDialogType = 'edit'
this.outDialogTiltle = '编辑'
this.id = row.id
},
// 需求单
purchaseFn(row) {
console.log('xuqiudanchuku')
this.purchaseOpen = true
this.purchaseTitle = row.demandEndInfo + '需求单详情'
this.id = row.id
},
closeDialog() {
this.purchaseOpen = false
},
handleCloseDetail() {
this.outDialogVisible = false
},
handleExport() {
this.$message({
type: "success",
message: "出库单导出成功!"
})
},
// 行点击事件
rowSelect() {
this.outDialogVisible = true
this.outDialogType = 'outbound'
this.outDialogTiltle = '出库'
},
searchReset() {
this.query = {};
this.form.outDate = []
this.form.inOperatorName = ''
this.form.inOperator = ''
this.onLoad(this.page);
},
searchChange(params, done) {
if (params && params.inOperatorName && !params.inOperator) {
params.inOperator = params.inOperatorName;
delete params.inOperatorName;
}
this.query = params;
this.page.currentPage = 1;
this.onLoad(this.page, params);
done();
},
selectionChange(list) {
this.selectionList = list;
},
selectionClear() {
this.selectionList = [];
this.$refs.crud.toggleSelection();
},
currentChange(currentPage) {
this.page.currentPage = currentPage;
},
sizeChange(pageSize) {
this.page.pageSize = pageSize;
},
refreshChange() {
this.onLoad(this.page, this.query);
},
//新增提交或暂存后更新页面
handleSubmitSuccess() {
this.onLoad(this.page)
},
//请求列表数据
onLoad(page, params = {}) {
this.loading = true;
const queryParams = {
...params,
...this.query,
pageSize: page.pageSize,
pageNum: page.currentPage
};
if (queryParams.outDate && Array.isArray(queryParams.outDate)) {
queryParams.startTime = queryParams.outDate[0];
queryParams.endTime = queryParams.outDate[1];
delete queryParams.outDate;
}
getList(page.currentPage, page.pageSize, queryParams).then(res => {
console.log('列表', res.data.result)
this.data = res.data.result.list;
this.loading = false;
this.page.total = res.data.result.total;
});
}
}
};
</script>
<style></style>