oil-station/fuintAdmin/src/views/convenienceStore/inventory/details.vue
2024-10-31 14:48:14 +08:00

841 lines
28 KiB
Vue

<template>
<div class="app-container">
<div class="card-change-1-search">
<!-- <div slot="header" class="clearfix">-->
<!-- <i class="el-icon-back" @click="goToAbout">返回 | </i>-->
<!-- <span> 盘点详情</span>-->
<!-- </div>-->
<div class="" style="height: 110px; display: flex; justify-content: space-between;">
<div style="height: 100%; display: flex; justify-content: space-between;">
<div style="height: 100%; width: 70%; display: flex; justify-content: space-between;align-items: center">
<div class="box">
<span style="font-size: 26px;color: #0DC291;font-weight: bold">{{ inventoryForm.productQuantity }}</span>
<span style="display: flex">
<div
style="background-color: #0DC291;width: 10px;height: 10px;border-radius: 50%;margin-top: 6px;margin-right: 10px"></div>
商品种类</span>
</div>
<div class="box">
<span
style="font-size: 26px;color: #00CAFF;font-weight: bold">{{ inventoryForm.inventoryQuantity }}</span>
<span style="display: flex">
<div
style="background-color: #00CAFF;width: 10px;height: 10px;border-radius: 50%;margin-top: 6px;margin-right: 10px"></div>
盘点正常商品量</span>
</div>
<div class="box">
<span
style="font-size: 26px;color: #F44522;font-weight: bold">{{ inventoryForm.inventoryDiscrepancy }}</span>
<span style="display: flex">
<div
style="background-color: #F44522;width: 10px;height: 10px;border-radius: 50%;margin-top: 6px;margin-right: 10px"></div>
盘点货损数量</span>
</div>
<div class="box">
<span style="font-size: 26px;color: #FA6400;font-weight: bold">{{ inventoryForm.profitLossAmount }}</span>
<span style="display: flex">
<div
style="background-color: #FA6400;width: 10px;height: 10px;border-radius: 50%;margin-top: 6px;margin-right: 10px"></div>
盈亏金额
</span>
</div>
</div>
<div style="height: 100%; width: 40%; display: flex; flex-direction: column; justify-content: space-between;">
<el-form ref="" label-width="100px">
<el-form-item label="制单人" style="margin-bottom: 1px">
<el-input size="mini" v-model="inventoryForm.creataByName" disabled="true"
style="width: 220Px;margin-bottom: 1px;">
</el-input>
</el-form-item>
<el-form-item label="制单时间" style="margin-bottom: 1px">
<el-input size="mini" v-model="inventoryForm.orderDate" disabled="true"
style="width: 220Px">
</el-input>
</el-form-item>
<el-form-item label="盘点编号" style="margin-bottom: 1px">
<el-input size="mini" v-model="inventoryForm.orderNumber" disabled="true"
style="width: 220Px">
</el-input>
</el-form-item>
</el-form>
<!-- <table class="container1">-->
<!-- <tr>-->
<!-- <td>制单人</td>-->
<!-- <td style="width: 10px;"> </td>-->
<!-- <td style=""><span class="underlined-text" >{{inventoryForm.creataByName}}</span></td>-->
<!-- </tr>-->
<!-- <tr>-->
<!-- <td>制单时间</td>-->
<!-- <td> </td>-->
<!-- <td><span class="underlined-text">{{parseTime(inventoryForm.orderDate)}}</span></td>-->
<!-- </tr>-->
<!-- <tr>-->
<!-- <td>盘点编号</td>-->
<!-- <td> </td>-->
<!-- <td><span class="underlined-text">{{inventoryForm.orderNumber}}</span></td>-->
<!-- </tr>-->
<!-- </table>-->
</div>
</div>
<div style="height: 100%; width: 30%; display: flex; align-items: center; justify-content: flex-end;">
<el-button type="primary" @click="cancelPurchase" v-if="state=='qrts'">关闭</el-button>
<el-button @click="cancelPurchase" v-else>取消</el-button>
<el-button type="success" v-if="state=='await'" :disabled="saveFlag" @click="save()">保存</el-button>
<el-button type="primary" v-if="state=='await'" :disabled="auditFlag" @click="audit()">
保存并审核<!--生成差异单-->
</el-button>
<el-button type="danger" v-if="state=='ysh'" :disabled="voidFlag" @click="abolition()">作废</el-button>
<el-button type="success" v-if="state=='ysh'" @click="exportExcel()">导出</el-button>
<el-button type="primary" v-if="state=='ysh'" :disabled="storageFlag" @click="storage">退货处理库存
</el-button>
</div>
</div>
</div>
<div class="card-change-1-1">
<el-row :gutter="10" class="mb8">
<el-col :span="1.5" style="text-align: right; float: right">
<el-button
v-if="!numberInput"
type="primary"
@click="commodityAdd"
>添加盘点商品
</el-button>
</el-col>
</el-row>
<el-table ref="tables" border
v-loading="loading"
:data="detailsList"
:default-sort="defaultSort">
<el-table-column label="序号" align="center" type="index"/>
<el-table-column label="商品名称" align="center" prop="commodityName"/>
<el-table-column label="品类名称" align="center" prop="cvsGoodName"/>
<el-table-column label="条形码" align="center" prop="goodsNo"/>
<el-table-column label="进货量" align="center" prop="purchase">
<template slot-scope="scope">
{{ scope.row.purchase ? scope.row.purchase : '--' }}
</template>
</el-table-column>
<el-table-column label="商品规格" align="center" prop="goodsSpecs"/>
<el-table-column label="单位" align="center" prop="unit"/>
<el-table-column label="便利店销售量" align="center" prop="goodsSales">
<template slot-scope="scope">
{{ scope.row.goodsSales ? scope.row.goodsSales : '0' }}
</template>
</el-table-column>
<el-table-column label="积分兑换量" align="center" prop="inventorySales">
<template slot-scope="scope">
{{ scope.row.inventorySales ? scope.row.inventorySales : '0' }}
</template>
</el-table-column>
<el-table-column label="兑换券兑换量" align="center" prop="inventorySales">
<template slot-scope="scope">
{{ scope.row.exchangeSales ? scope.row.exchangeSales : '0' }}
</template>
</el-table-column>
<el-table-column label="成本价" align="center" prop="purchasePrice"/>
<el-table-column label="当前库存" align="center" prop="stock"/>
<el-table-column label="盘点正常商品量" align="center" prop="purchasePrice">
<template slot-scope="scope">
<el-input-number :disabled="numberInput" v-model="scope.row.inventoryQuantity" @change="change(scope.row,2)"
controls-position="right" :precision="0" :min="0" :max="100000000" :step="1"
style="max-width: 100%"></el-input-number>
</template>
</el-table-column>
<el-table-column label="盘点货损量" align="center" prop="damageQuantity">
<template slot-scope="scope">
<el-input-number :disabled="numberInput" v-model="scope.row.damageQuantity" @change="change(scope.row,2)"
controls-position="right" :precision="0" :min="0" :max="100000000" :step="1"
style="max-width: 100%"></el-input-number>
</template>
</el-table-column>
<el-table-column label="总盘点量" align="center" prop="inventoryQuantity">
<template slot-scope="scope">
{{ scope.row.inventoryQuantity + scope.row.damageQuantity }}
</template>
</el-table-column>
<el-table-column label="库存差异" align="center" prop="inventoryDiscrepancy"/>
<el-table-column label="盈亏金额" align="center" prop="profitLossAmount"/>
<el-table-column v-if="!numberInput" label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="commodityDel(scope.row)"
>删除
</el-button>
</template>
<!-- v-hasPermi="['']"-->
</el-table-column>
</el-table>
<!-- <pagination-->
<!-- v-show="total>0"-->
<!-- :total="total"-->
<!-- :page.sync="queryParams.page"-->
<!-- :limit.sync="queryParams.pageSize"-->
<!-- @pagination="getList"-->
<!-- />-->
</div>
<el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body :close-on-click-modal="false">
<el-container>
<el-header style="">
<el-form ref="tankForm" :model="commodityForm" label-width="20px" :inline="true">
<el-form-item label="">
<el-select
v-model="commodityForm.cvsGoodId"
placeholder="请选择品类名称"
clearable
>
<el-option v-for="item in cvsGoodList" :key="item.id" :label="item.name" :value="item.id"/>
</el-select>
</el-form-item>
<el-form-item label="" prop="supplierId">
<el-select
v-model="commodityForm.supplierId"
placeholder="请选择供应商名称"
clearable
>
<el-option v-for="item in supplierList" :key="item.id" :label="item.name" :value="item.id"/>
</el-select>
</el-form-item>
<el-form-item label="">
<el-input v-model="commodityForm.remark" placeholder="请输入商品名称,拼音码,条形码等信息"></el-input>
</el-form-item>
<el-form-item style="float: right;margin-right: 0px">
<el-button type="primary" icon="el-icon-search" @click="inquire()">搜索</el-button>
</el-form-item>
</el-form>
</el-header>
<el-main>
<el-table ref="tables"
v-loading="loading"
:data="commodityList"
@selection-change="handleSelectionChange"
border
:default-sort="defaultSort">
<el-table-column
type="selection"
width="55">
</el-table-column>
<el-table-column label="商品名称" align="center" prop="name"/>
<!-- <el-table-column label="商品编码" align="center" prop="goodsNo"/>-->
<el-table-column label="品类名称" prop="cvsGoodId" align="center">
<template slot-scope="scope">
<span>{{ getName(cvsGoodList, scope.row.cvsGoodId) }}</span>
</template>
</el-table-column>
<el-table-column label="供应商" prop="supplierId" align="center">
<template slot-scope="scope">
<span>{{ getName(supplierList, scope.row.supplierId) }}</span>
</template>
</el-table-column>
<el-table-column label="商品规格" align="center" prop="goodsSpecs">
<template slot-scope="scope">
<div>{{scope.row.goodsSpecs || '-'}}</div>
</template>
</el-table-column>
<el-table-column label="单位" align="center" prop="unit"/>
<el-table-column label="当前库存" align="center" prop="stock"/>
</el-table>
</el-main>
</el-container>
<div slot="footer" class="dialog-footer" style="text-align: center">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" @click="addCommodity">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {getAuditPremApi} from "@/api/oilConfig/staff";
import {BigNumber} from "bignumber.js";
import {listLJGoods} from "@/api/convenienceStore/ljgoods";
import {parseTime} from "../../../utils/fuint";
import {selectTree} from "@/api/convenienceStore/goods";
import {listSupplier} from "@/api/convenienceStore/supplier";
import {
auditInventoryApi,
batchProcessingApi,
delDetailsApi,
editInventoryApi,
exportExcelApi,
getInventoryDetailsPageApi,
getSalesByMtInventoryApi,
storageInventoryApi
} from "@/api/convenienceStore/inventory";
export default {
name: "details",
props: [
'PinventoryId',
'PorderNumber',
'PorderDate',
'PapprovalStatus',
'PcreataByName',
],
data() {
return {
detailsList: [],
commodityList: [],
commodityForm: {
cvsGoodId: "",
cvsGood: "",
supplierId: "",
supplier: "",
detailed: "",
remark: "",
page: 1,
pageSize: 10,
isRecovery: 0,
},
inventoryForm: {
inventoryId: this.$props.PinventoryId,
id: this.$props.PinventoryId,
orderNumber: this.$props.PorderNumber,
approvalStatus: this.$props.PapprovalStatus,
orderDate: this.$props.PorderDate,
creataByName: this.$props.PcreataByName,
roductQuantity: 0, // 商品数量
inventoryQuantity: 0,// 盘点数量
damageQuantity: 0,// 货损数量
inventoryDiscrepancy: 0,// 库存差异
profitLossAmount: 0// 盈亏总额
},
inventoryId: this.$props.PinventoryId,
// 商品分类列表
cvsGoodList: [],
// 供应商列表
supplierList: [],
state: this.$props.PapprovalStatus,
saveFlag: false,
auditFlag: true,
voidFlag: true,
storageFlag: true,
multipleSelection: [], // 表格
// 弹出框标题
title: '添加盘点商品',
// 显示搜索条件
showSearch: true,
disableInput: false, // 默认不禁用
// 是否显示弹出层
open: false,
// 总条数
total: 0,
numberInput: false,
// 查询参数
queryParams: {
// supplierId: '',
inventoryId: this.$props.PinventoryId,
page: null,
pageSize: null
},
// 遮罩层
loading: false,
// 默认排序
defaultSort: {prop: 'createTime', order: 'descending'},
// 表单校验
rules: {
supplierName: [
{required: true, message: "供应商名称不能为空", trigger: "blur"},
],
},
}
},
async created() {
if (this.inventoryForm.orderDate) {
this.inventoryForm.orderDate = parseTime(this.inventoryForm.orderDate)
}
// this.inventoryForm.inventoryId = this.$props.PinventoryId
// this.inventoryId = this.$props.PinventoryId
// this.queryParams.inventoryId = this.$props.PinventoryId
// this.inventoryForm.orderNumber = this.$props.PorderNumber
// this.inventoryForm.orderDate = this.$props.PorderDate
// this.inventoryForm.approvalStatus = this.$props.PapprovalStatus
this.state = this.$props.PapprovalStatus
if (this.state == null) {
this.state = 'await'
}
if (this.state == 'await') {
this.numberInput = false
} else {
this.numberInput = true
}
console.log("this.inventoryForm", this.inventoryForm)
if (this.inventoryForm.orderNumber == null) {
this.refresh();
}
if (this.inventoryForm.orderDate == null) {
this.inventoryForm.orderDate = new Date()
}
this.getDetailsList();
this.getQueryList();
this.JudgmentButton();
},
methods: {
// 返回页面
cancelPurchase() {
this.$router.back()
},
parseTime,
getDetailsList() {
let this_ = this
getInventoryDetailsPageApi(this.queryParams).then(res => {
this_.detailsList = res.data.records;
this.total = res.data.total;
this.inventoryForm.productQuantity = res.data.total;
this.sumMethod(res.data.records);
})
},
getCommodityList() {
let this_ = this
listLJGoods(this_.commodityForm).then(res => {
this_.commodityList = res.data.records;
this_.sumMethod(res.data.records);
// this.total = response.data.total;
})
},
// 页面跳转
goToAbout() {
this.$router.push('/convenienceStore/inventory/index');
},
commodityAdd() {
this.open = true;
},
commodityDel(data) {
this.$confirm('确定删除?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
if (data.id != null) {
delDetailsApi(data).then(res => {
})
}
const index = this.detailsList.indexOf(data); // 查找要删除的对象的索引
if (index !== -1) {
this.detailsList.splice(index, 1); // 使用splice方法删除对象
}
this.inventoryForm.productQuantity--;
this.sumMethod(this.detailsList);
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
// 查询商品
inquire() {
this.getCommodityList();
},
// 改变数字时
change(data, flag) {
let profitLossAmount = new BigNumber(data.profitLossAmount);
let inventoryDiscrepancy = new BigNumber(data.inventoryDiscrepancy);
let inventoryQuantity = new BigNumber(data.inventoryQuantity); //正常
let damageQuantity = new BigNumber(data.damageQuantity); //货损
let purchasePrice = new BigNumber(data.purchasePrice);
let stock = new BigNumber(data.stock);
// 计算库存差异
console.log("inventoryQuantity", inventoryQuantity)
console.log("damageQuantity", damageQuantity)
console.log("stock", stock)
let addStocke = inventoryQuantity.minus(damageQuantity) // 正常减货损
// let addStocke = inventoryQuantity.plus(damageQuantity)
inventoryDiscrepancy = addStocke.minus(stock) //
// 计算盈亏金额
profitLossAmount = inventoryDiscrepancy.multipliedBy(purchasePrice);
// data.inventoryDiscrepancy = inventoryDiscrepancy.toNumber();
// data.profitLossAmount = profitLossAmount.toNumber();
// 计算盈亏
// 库存差异
let a = inventoryQuantity.minus(stock)
let b = a.minus(purchasePrice)
// 盈亏金额
data.inventoryDiscrepancy = a.toNumber();
data.profitLossAmount = b.toNumber();
this.sumMethod(this.detailsList)
},
// 计算header数据
sumMethod(data) {
let this_ = this
// if (data.length>0) {
// this_.inventoryForm.productQuantity = data.length
// } else {
// this_.inventoryForm.productQuantity = 0
// }
this_.inventoryForm.productQuantity = data.length,
this_.inventoryForm.inventoryQuantity = new BigNumber(0),
this_.inventoryForm.damageQuantity = new BigNumber(0),
this_.inventoryForm.inventoryDiscrepancy = new BigNumber(0),
this_.inventoryForm.profitLossAmount = new BigNumber(0),
data.forEach(da => {
if (da.inventoryQuantity != null) {
this_.inventoryForm.inventoryQuantity = this_.inventoryForm.inventoryQuantity.plus(da.inventoryQuantity)
}
if (da.inventoryDiscrepancy != null) {
this_.inventoryForm.inventoryDiscrepancy = this_.inventoryForm.inventoryDiscrepancy.plus(da.inventoryDiscrepancy)
}
if (da.profitLossAmount != null) {
this_.inventoryForm.profitLossAmount = this_.inventoryForm.profitLossAmount.plus(da.profitLossAmount)
}
})
},
async addCommodity() {
let this_ = this
let sum = 0;
for (const mul of this.multipleSelection) {
let flag = true;
this_.detailsList.forEach(det => {
if (mul.id == det.goodsId) {
flag = false
sum++
}
})
if (flag) {
let getPurchaseByTankIdData
await getSalesByMtInventoryApi({goodsId: mul.id}).then(res => {
getPurchaseByTankIdData = res.data
})
let now = {
inventoryId: this.inventoryId,
goodsId: mul.id,
commodityName: mul.name,
cvsGoodId: mul.cvsGoodId,
unit: mul.unit,
stock: mul.stock,
purchasePrice: mul.buyingPrice,
goodsNo: mul.goodsNo,
inventoryQuantity: 1,
damageQuantity: 0,
profitLossAmount: 0, // 盈亏金额
inventoryDiscrepancy: 0, // 库存差异
purchase: getPurchaseByTankIdData.purchase,
goodsSales: getPurchaseByTankIdData.goodsSales,
inventorySales: getPurchaseByTankIdData.inventorySales,
exchangeSales: getPurchaseByTankIdData.exchangeSales,
}
this_.detailsList.push(now)
}
}
if (sum > 0) {
this.$modal.msgError("同一货损单不能有两件相同的商品,您选择了" + sum + "件相同的商品,已为您剔除");
}
this_.open = false
this_.open = false
this.multipleSelection = []
this.commodityForm = {
cvsGoodId: "",
cvsGood: "",
supplierId: "",
supplier: "",
detailed: "",
remark: "",
page: 1,
pageSize: 1000,
total: 0,
isRecovery: 0,
}
this.commodityList = []
this_.inventoryForm.inventoryQuantity = this_.inventoryForm.inventoryQuantity + this_.multipleSelection.length
this_.sumMethod(this_.detailsList);
},
// 查询搜索列表信息
getQueryList() {
selectTree().then(response => {
this.cvsGoodList = response.data.records
});
listSupplier().then(response => {
this.supplierList = response.data.records
})
},
cancel() {
this.open = false;
},
// 表格选择器
handleSelectionChange(val) {
this.multipleSelection = val;
},
// 刷新订单编号
refresh() {
let timestamp = new Date().getTime();
let min = 100; // 最小的四位数是 1000
let max = 999; // 最大的四位数是 9999
let randomFourDigitNumber = Math.floor(Math.random() * (max - min + 1)) + min;
this.inventoryForm.orderNumber = timestamp + randomFourDigitNumber.toString();
},
// 判断按钮是否可用
async JudgmentButton() {
let judgmentPermissions1 = await this.judgmentPermissions("盘点商品审核");
if (judgmentPermissions1 > 0) {
this.auditFlag = false,
this.voidFlag = false
}
let judgmentPermissions2 = await this.judgmentPermissions("盘点商品入库");
if (judgmentPermissions2 > 0) {
this.storageFlag = false
}
let judgmentPermissions3 = await this.judgmentPermissions("盘点商品废止");
if (judgmentPermissions3 > 0) {
this.voidFlag = false
} else {
this.voidFlag = true
}
},
// 判断权限
async judgmentPermissions(data) {
let fil = {
auditPrem: data
}
return await getAuditPremApi(fil).then(res => {
return res.data
});
},
async save(flag) {
let this_ = this
// 保存时修改退货单
// inventoryForm: {
// inventoryId:this.$props.PinventoryId,
// id:this.$props.PinventoryId,
// orderNumber: this.$props.PorderNumber,
// approvalStatus: this.$props.PapprovalStatus,
// orderDate: this.$props.PorderDate,
// creataByName: this.$props.PcreataByName,
// roductQuantity:0, // 商品数量
// inventoryQuantity: 0 // 盘点数量
// },
if (this_.detailsList.length <= 0) {
this.$modal.msgError("盘点单不能为空");
return -1;
}
await editInventoryApi(this.inventoryForm).then(res => {
// 批量保存订单
batchProcessingApi(this_.detailsList).then(res => {
this.$modal.msgSuccess("保存成功");
if (flag != -1) {
this.goToAbout();
}
}).catch(res => {
this.$modal.msgError("保存失败");
})
})
},
// 保存并审核
async audit() {
// 保存
let number = await this.save(-1);
if (number != -1) {
// 审核
let fil = {
id: this.inventoryId
}
console.log(" id: this.inventoryId", fil)
await auditInventoryApi(fil).then(res => {
if (res.data) {
this.state = 'ysh'
this.$modal.msgWarning("审核成功");
} else {
this.$modal.msgWarning("暂无审核权限");
}
this.goToAbout()
})
}
},
// 入库
storage() {
let this_ = this;
this.$confirm('确认后盘点中的对应商品入库商品库存将发生变化,且不可逆,确认已按照盘点数量入库吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// 审核
let fil = {
id: this.inventoryId
}
storageInventoryApi(fil).then(res => {
this.state = 'qrts'
this.$modal.msgWarning("入库成功");
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消'
});
});
},
// 作废
abolition() {
if (this.inventoryId < 0) {
this.$modal.msgWarning("数据未保存,不可废弃");
return;
}
this.$confirm('确定要废弃盘点好的数据吗', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
let fil = {
id: this.inventoryId
}
abolitioninventoryApi(fil).then(res => {
if (res.data) {
this.state = 'yzf'
this.$modal.msgWarning("作废成功");
this.goToAbout()
} else {
this.$modal.msgWarning("暂无作废权限");
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消'
});
})
},
async exportExcel() {
let fil = {
inventoryId: this.inventoryId
}
exportExcelApi(fil).then(res => {
console.log("res", res)
// this.downloadFile(res);
const blob = new Blob([res], {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'});
this.$download.saveAs(blob, this.inventoryForm.orderNumber + '.xlsx')
})
},
}
}
</script>
<style scoped lang="scss">
.app-container {
width: 100%;
height: 100%;
background: #f6f8f9;
}
/* .underlined-text {
/* padding-bottom: 10px; /* 通过增加下边距来调整文本与下划线的间距 */
/* text-decoration: underline; 添加下划线 */
/* border-bottom: 1px solid; */
/* padding-bottom: 3px; */
/* } */
.container {
height: 100%;
width: 38%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.container p {
margin: 0; /* 重置段落的上下外边距 */
font-size: 15px; /* 调整文字大小 */
}
.underlined-text {
border-bottom: 1px solid;
padding-bottom: 3px;
/* text-decoration: underline; */
/* vertical-align: middle; */
}
.box {
height: 80%;
width: 212px;
margin-right: 10px;
background: #FFFFFF;
border: 1px solid #FF9655;
border-radius: 10px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: start;
padding-left: 20px;
}
</style>