bonus-ui/src/views/foodManage/stockManage/warehouseIn/index.vue

404 lines
17 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
<el-form-item label="入库时间">
<el-date-picker
v-model="dateRange"
type="datetimerange"
align="right"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd HH:mm:ss" style="width: 400px"
:default-time="['00:00:00', '23:59:59']"
:picker-options="pickerOptions" >
</el-date-picker>
</el-form-item>
<el-form-item label="入库单号" prop="intoCode">
<el-input v-model="queryParams.intoCode" placeholder="请输入入库单号" maxlength="20" clearable style="width: 240px"/>
</el-form-item>
<el-form-item label="入库状态" prop="status">
<el-select v-model="queryParams.status" placeholder="请选择入库状态" style="width: 240px;">
<el-option label="待入库" :value="1"></el-option>
<el-option label="已入库" :value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="所属区域" prop="areaId">
<el-cascader v-model="queryParams.areaId"
:options="treeAreaOptions" :filterable="true" style="width: 100%;" :show-all-levels="false"
:props="{
emitPath: false,// 若设置 false则只返回该节点的值只返回最后选择的id
checkStrictly: false,//来设置父子节点取消选中关联,从而达到选择任意一级选项的目的
value:'id',label:'label'
}" clearable @change="handleAreaChange">
</el-cascader>
</el-form-item>
<el-form-item label="货品仓库" prop="warehouseId">
<el-select v-model="queryParams.warehouseId" clearable placeholder="请选择货品仓库" style="width: 100%;">
<el-option v-for="item in wareHouseOptions"
:key="item.warehouseId"
:label="item.warehouseName"
:value="item.warehouseId"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="入库类型" prop="intoType">
<el-select v-model="queryParams.intoType" placeholder="请选择入库类型" style="width: 240px;">
<el-option label="采购入库" :value="1"></el-option>
<el-option label="退料入库" :value="2"></el-option>
<el-option label="调拨入库" :value="3"></el-option>
<el-option label="即入即出" :value="4"></el-option>
<el-option label="超市退单入库" :value="5"></el-option>
<el-option label="盘点入库" :value="6"></el-option>
<el-option label="期初入库" :value="7"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
>新增</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="tableListData" height="800">
<el-table-column label="序号" align="center" width="80" type="index">
<template slot-scope="scope">
<span>{{(queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1}}</span>
</template>
</el-table-column>
<el-table-column label="入库单号" align="center" prop="intoCode" :show-overflow-tooltip="true" />
<el-table-column label="入库状态" align="center" prop="status" :show-overflow-tooltip="true" width="100">
<template slot-scope="scope">
<span v-if="scope.row.status==1">待入库</span>
<span v-if="scope.row.status==2">已入库</span>
</template>
</el-table-column>
<el-table-column label="所属区域" align="center" prop="areaName" :show-overflow-tooltip="true"/>
<el-table-column label="货品仓库" align="center" prop="warehouseName" :show-overflow-tooltip="true" />
<el-table-column label="入库类型" align="center" prop="intoType" :show-overflow-tooltip="true" width="100">
<template slot-scope="scope">
<span v-if="scope.row.intoType==1">采购入库</span>
<span v-if="scope.row.intoType==2">退料入库</span>
<span v-if="scope.row.intoType==3">调拨入库</span>
<span v-if="scope.row.intoType==4">即入即出</span>
<span v-if="scope.row.intoType==5">超市退单入库</span>
<span v-if="scope.row.intoType==6">盘点入库</span>
<span v-if="scope.row.intoType==7">期初入库</span>
</template>
</el-table-column>
<!-- <el-table-column label="质检报告" align="center" prop="" :show-overflow-tooltip="true" width="100">
<template slot-scope="scope">
</template>
</el-table-column> -->
<el-table-column label="总金额(元)" align="center" prop="totalAmount" :show-overflow-tooltip="true" width="120">
<template slot-scope="scope">
<span>{{ (scope.row.totalAmount/100).toFixed(2) }}</span>
</template>
</el-table-column>
<el-table-column label="总数量" align="center" prop="totalNum" :show-overflow-tooltip="true" width="120"/>
<el-table-column label="入库时间" align="center" prop="intoDate" :show-overflow-tooltip="true" width="150"/>
<!-- <el-table-column label="关联单号" align="center" prop="" :show-overflow-tooltip="true" width="120"/> -->
<el-table-column label="操作人" align="center" prop="createBy" :show-overflow-tooltip="true" width="120"/>
<el-table-column label="操作时间" align="center" prop="createTime" :show-overflow-tooltip="true" width="150"/>
<el-table-column label="操作" align="center" width="180" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit" v-if="scope.row.status==1"
@click="handleUpdate(scope.row)"
>编辑</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-edit" v-if="scope.row.status==2"
@click="handleView(scope.row)"
>详情</el-button>
<!-- <el-button
size="mini" v-if="scope.row.status==1"
type="text" :disabled="loadingBtn"
icon="el-icon-top"
@click="confirmSubmit(scope.row)"
>提交</el-button> -->
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改参数配置对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { systemAreaTreeApi } from "@/api/base/stall";
import { drpWareHousePageApi } from "@/api/foodManage/stockManage";
import { warehouseInPageApi,delWarehouseInApi } from "@/api/foodManage/stockManage";
export default {
name: "",
dicts: [],
data() {
return {
// 遮罩层
loading: true,
loadingBtn: false,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
//表格数据
tableListData: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
},
treeAreaOptions:[],//区域树
wareHouseOptions:[],//仓库下拉选
dateRange:this.defaultDateRange(),
pickerOptions: {
shortcuts: [{
text: '最近一周',
onClick(picker) {
const start = new Date();
const end = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 6);
picker.$emit('pick', [start, end]);
}
},{
text: '最近一个月',
onClick(picker) {
const start = new Date();
const end = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
picker.$emit('pick', [start, end]);
}
},{
text: '最近三个月',
onClick(picker) {
const start = new Date();
const end = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 91);
picker.$emit('pick', [start, end]);
}
}]
},
// 表单参数
form: {},
// 表单校验
rules: {
// canteenName: [
// { required: true, message: "字典名称不能为空", trigger: "blur" }
// ],
// dictType: [
// { required: true, message: "字典类型不能为空", trigger: "blur" }
// ]
}
};
},
created() {
this.getAreaTreeData();
this.getList();
},
methods: {
//区域树
getAreaTreeData() {
systemAreaTreeApi({}).then((response) => {
this.treeAreaOptions = response.data;
});
},
handleAreaChange(e){
this.getWareHouseData()
},
/** 查询货品下拉结构 */
getWareHouseData() {
drpWareHousePageApi({ areaId:this.queryParams.areaId }).then((response) => {
this.wareHouseOptions = response.rows||[];
this.$set(this.queryParams,'warehouseId',null)
});
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.dateRange = this.defaultDateRange()
this.resetForm("queryForm");
this.handleQuery();
},
/** 查询列表 */
getList() {
this.loading = true;
let param = {
"pageNum": this.queryParams.pageNum,
"pageSize": this.queryParams.pageSize,
"intoCode": this.queryParams.intoCode,
"areaId": this.queryParams.areaId,
"canteenId": this.queryParams.canteenId,
"stallId": this.queryParams.stallId,
"status": this.queryParams.status,
"supplierConfirmStatus": this.queryParams.supplierConfirmStatus,
// "intoType": this.queryParams.intoType
}
if(this.dateRange&&this.dateRange.length>0){
param.startDateTime=this.formatDateTime(this.dateRange[0])
param.endDateTime=this.formatDateTime(this.dateRange[1])
}else{
param.startDateTime=undefined;
param.endDateTime=undefined;
}
warehouseInPageApi(param).then(response => {
this.tableListData = response.rows;
this.total = Number(response.total);
this.loading = false;
});
},
/** 新增按钮操作 */
handleAdd() {
this.$router.push({ path: "/foodManage/stockManage/warehouseInEdit" });
},
/** 修改按钮操作 */
handleView(row) {
this.$router.push({ path: "/foodManage/stockManage/warehouseInDetail",query: {pageJson:JSON.stringify(row)} });
},
/** 修改按钮操作 */
handleUpdate(row) {
this.$router.push({ path: "/foodManage/stockManage/warehouseInEdit",query: {pageJson:JSON.stringify(row)} });
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {};
this.resetForm("form");
},
/** 提交按钮 */
submitForm: function() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.dictId != undefined) {
// updateType(this.form).then(response => {
// this.$modal.msgSuccess("修改成功");
// this.open = false;
// this.getList();
// });
} else {
// addType(this.form).then(response => {
// this.$modal.msgSuccess("新增成功");
// this.open = false;
// this.getList();
// });
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
this.$modal.confirm('是否确认删除数据项?').then(function() {
return delWarehouseInApi({intoIds:[row.intoId]});
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
// 提交按钮
confirmSubmit(row){
// let param = Object.assign({},row);
// this.loadingBtn=true
// param.status=2
// editPurchaseOrderApi(param).then((response) => {
// this.$modal.msgSuccess("提交成功");
// this.getList()
// this.loadingBtn=false
// }).catch(() => {
// this.loadingBtn=false
// });
},
defaultDateRange() {
const end = new Date(new Date().toLocaleDateString());
end.setTime(end.getTime() + 24 * 60 * 60 * 1000 -1);
const start = new Date((new Date().toLocaleDateString()));
start.setTime(start.getTime() - 30 * 24 * 60 * 60 * 1000);
this.start = parseInt(start.getTime() / 1000)
this.end = parseInt(end.getTime() / 1000)
return [start, end]
},
//日期
formatDate(date) {
// 格式化为 YYYY-MM-DD
date = new Date(date)
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
},
//日期时间
formatDateTime(date) {
// 格式化为 YYYY-MM-DD
date = new Date(date)
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始
const day = String(date.getDate()).padStart(2, '0');
const hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()
const minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
const seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
}
}
};
</script>