java_project
/
logpm_page
4
1
Fork 0
Code Issues Pull Requests Activity
Browse Source

贷位可视化页面优化

fix_bug_pro20231227
13208366016 2 years ago
parent
0175a3b632
commit
afa3a67885
1 changed files with 165 additions and 112 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 277
      src/views/basicdata/warehouse/goodsShelf/basicdataGoodsShelfView.vue

277
src/views/basicdata/warehouse/goodsShelf/basicdataGoodsShelfView.vue
Unescape View File

@ -33,19 +33,19 @@
<div class="tips">
<el-button icon="el-icon-refresh" @click="checkshelves" circle></el-button>
<div class="exprbuts" @click="handleExportArea">导出</div>
<div>
<div class="ls-box">
总货位:
<span class="def">{{ countnumber.cargoNub }}</span>
</div>
<div>
<div class="ls-box">
占用货位:
<span class="red">{{ countnumber.employNub }}</span>
</div>
<div>
<div class="ls-box">
未用货位:
<span class="green">{{ countnumber.unusedNub }}</span>
</div>
<div>
<div class="ls-box">
禁用货位:
<span class="red">{{ countnumber.disableNub }}</span>
</div>
@ -66,37 +66,39 @@
</div>
</el-scrollbar>
</div>
<div class="tips">
<div>
总货位:
<span class="def">{{ boxdetails.cargoNub }}</span>
</div>
<div>
占用货位:
<span class="red">{{ boxdetails.employNub }}</span>
</div>
<div>
未用货位:
<span class="green">{{ boxdetails.unusedNub }}</span>
</div>
<div>
禁用货位:
<span class="red">{{ boxdetails.disableNub }}</span>
</div>
<div>
货物总数:
<span class="red">{{ boxdetails.goodsNub }}</span>
</div>
<div class="tips tips-Menu">
<div>
总货位:
<span class="def">{{ boxdetails.cargoNub }}</span>
</div>
<div>
占用货位:
<span class="red">{{ boxdetails.employNub }}</span>
</div>
<div>
未用货位:
<span class="green">{{ boxdetails.unusedNub }}</span>
</div>
<div>
禁用货位:
<span class="red">{{ boxdetails.disableNub }}</span>
</div>
<div>
货物总数:
<span class="red">{{ boxdetails.goodsNub }}</span>
</div>
</div>
<div class="mabx">
<el-scrollbar max-height="70vh">
<el-scrollbar max-height="70vh" class="contentbj">
<div class="contentbx" :style="contenbxsty">
<div class="itemwbox" v-for="item in contenarr">
<div class="itemmibox" v-for="ite in item">
<div v-if="ite.enableStatus == 2">禁用货位</div>
<el-tooltip
:disabled="Number(ite.enableStatus) == 2"
placement="bottom"
hide-after="50"
v-else
>
<template #content>
<div v-if="ite.allocationStatus == 1">没有货位信息</div>
@ -131,11 +133,23 @@
: 'itembox'
"
>
<div class="titls">{{ (arrlist[checkselect]?.warehouseGoodsAreaVOList[checkregionselect].headline)+'-'+ite.layerNum + '层' + '-' + ite.columnNum + '列' }}</div>
<div>{{ '包件数:' + ite.packageNum }}</div>
<div>{{ '订单数:' + ite.orderNum }}</div>
<div>{{ '零担数:' + ite.lessNum }}</div>
<div>{{ '库存品数:' + ite.inventoryNum }}</div>
<div class="titls">
{{
arrlist[checkselect]?.warehouseGoodsAreaVOList[checkregionselect].headline +
'-' +
ite.layerNum +
'层' +
'-' +
ite.columnNum +
'列'
}}
</div>
<div class="tilts-info">
<span>包件数:{{ ite.packageNum }}</span>
<span>订单数:{{ ite.orderNum }}</span>
<span>零担数:{{ ite.lessNum }}</span>
<span>库存品数{{ ite.inventoryNum }}</span>
</div>
</div>
</el-tooltip>
</div>
@ -398,7 +412,6 @@
</div>
<el-input
style="flex: 1"
v-model="inputtxts1"
:placeholder="
'请输入' +
@ -518,7 +531,7 @@ let details = reactive({
checkselectchangearr: [],
isshowdow: false,
inputtxts1: '',
boxdetails:{}
boxdetails: {},
});
onMounted(() => {
details.contenbxsty['--length'] = details.contenarr[0]?.length || 0;
@ -556,32 +569,35 @@ function initpage() {
// let warehousearr=
}
function handleExportArea() {
let id=details.arrlist[details.checkselect]?.id||0
let name=details.arrlist[details.checkselect]?.name||''
if (id ===0){
let id = details.arrlist[details.checkselect]?.id || 0;
let name = details.arrlist[details.checkselect]?.name || '';
if (id === 0) {
proxy.$message({
type: "success",
message: "无选择仓库!"
type: 'success',
message: '无选择仓库!',
});
return;
}
let downloadUrl = `/logpm-basicdata/goodsArea/export-visualizationwarehouse?${proxy.website.tokenHeader}=${getToken()}`;
console.log("id>>>>>>>>>>>>>>",id);
let downloadUrl = `/logpm-basicdata/goodsArea/export-visualizationwarehouse?${
proxy.website.tokenHeader
}=${getToken()}`;
console.log('id>>>>>>>>>>>>>>', id);
let values = {
areaId:id,
areaId: id,
};
proxy.$confirm("是否导出数据?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
NProgress.start();
exportBlob(downloadUrl, values).then(res => {
downloadXls(res.data, name+`${dateNow()}.xlsx`);
NProgress.done();
proxy
.$confirm('是否导出数据?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
})
});
.then(() => {
NProgress.start();
exportBlob(downloadUrl, values).then(res => {
downloadXls(res.data, name + `${dateNow()}.xlsx`);
NProgress.done();
});
});
}
function currentChange(currentPage) {
@ -739,7 +755,7 @@ async function checkshelves() {
console.log(res.data, 'res.data.datares.data.datares.data.datares.data.datares.data.data');
let arrs = [];
let maxlength = 0;
details.boxdetails=res.data.data
details.boxdetails = res.data.data;
res.data.data.list.map(item => {
if (item.columnNum > maxlength) {
maxlength = item.columnNum;
@ -772,8 +788,8 @@ async function checkshelves() {
// }
// };
const showupt = value => {
details.inputtxts=''
details.inputtxts1=''
details.inputtxts = '';
details.inputtxts1 = '';
console.log('112312');
details.isshowupt = value;
switch (details.isshowupt) {
@ -1350,7 +1366,7 @@ const alldown = async () => {
let data = {
allocationId: details.checkite.id,
};
if(details.checkselectchangearr.length==0){
if (details.checkselectchangearr.length == 0) {
proxy.$message({
type: 'error',
message: '请先勾选数据',
@ -1370,7 +1386,7 @@ const alldown = async () => {
break;
case 3:
url = 'downStock';
scope.row.stockType=1;
scope.row.stockType = 1;
scope.row.allocationId = details.checkite.id;
data.upShelfStockList = details.checkselectchangearr;
break;
@ -1388,7 +1404,7 @@ const alldown = async () => {
type: 'success',
message: response.data.msg,
});
searchbutdown()
searchbutdown();
// details.tablistarr = response.data.data.records;
// details.total = response.data.data.total;
} else {
@ -1424,7 +1440,7 @@ const downhj = async scope => {
break;
case 3:
url = 'downStock';
scope.row.stockType=1;
scope.row.stockType = 1;
scope.row.allocationId = details.checkite.id;
data.upShelfStockList = [scope.row];
break;
@ -1442,7 +1458,7 @@ const downhj = async scope => {
type: 'success',
message: response.data.msg,
});
searchbutdown()
searchbutdown();
// details.tablistarr = response.data.data.records;
// details.total = response.data.data.total;
} else {
@ -1524,13 +1540,13 @@ const searchbutdown = async () => {
}
};
const showdown = async value => {
details.inputtxts=''
details.inputtxts1=''
details.inputtxts = '';
details.inputtxts1 = '';
if (value == 5) {
let url = 'downAllocation?ids='+details.checkite.id;
let data={
ids:details.checkite.id
}
let url = 'downAllocation?ids=' + details.checkite.id;
let data = {
ids: details.checkite.id,
};
let response = await posturl(url, data);
if (response.data.code == 200) {
console.log(response.data);
@ -1546,7 +1562,7 @@ const showdown = async value => {
message: response.data.msg,
});
}
return
return;
}
details.isshowdow = value;
switch (details.isshowdow) {
@ -2014,12 +2030,12 @@ const addhuoj = async scope => {
break;
case 4:
url = 'upTray';
let obj={
code:scope.row.palletCode,
allocationId:details.checkite.id
}
let obj = {
code: scope.row.palletCode,
allocationId: details.checkite.id,
};
data =obj
data = obj;
break;
case 5:
url = 'upStock';
@ -2041,7 +2057,7 @@ const addhuoj = async scope => {
type: 'success',
message: response.data.msg,
});
searchbuts()
searchbuts();
// details.tablistarr = response.data.data.records;
// details.total = response.data.data.total;
} else {
@ -2102,7 +2118,7 @@ async function allup() {
type: 'success',
message: response.data.msg,
});
searchbuts()
searchbuts();
// details.tablistarr = response.data.data.records;
// details.total = response.data.data.total;
} else {
@ -2117,11 +2133,11 @@ const removeinputup = () => {
details.inputtxts1 = '';
searchbuts();
};
const removeinputdown=()=>{
const removeinputdown = () => {
details.inputtxts = '';
details.inputtxts1 = '';
searchbutdown();
}
};
const btnsc = scope => {
console.log(scope);
};
@ -2139,8 +2155,8 @@ const selectionChange = scope => {
details.checkselectchangearr = scope;
};
const checkitem = ite => {
details.inputtxts=''
details.inputtxts1=''
details.inputtxts = '';
details.inputtxts1 = '';
if (Number(ite.allocationStatus) == 2) {
details.isshowcon = 2;
details.checkite = ite;
@ -2239,6 +2255,7 @@ const {
}
:root {
--boxcolor: #adadad;
--bordercolor: #ccc;
}
.mabx {
height: 70vh;
@ -2247,12 +2264,17 @@ const {
box-sizing: border-box;
.contentbx {
width: calc(150 * var(--length) * 0.0521vw);
// border: 0 !important;
display: flex;
// flex-direction: column;
align-items: flex-end;
border: 1.5px solid var(--boxcolor);
border: none;
background-color: #fff;
box-sizing: border-box;
align-items: flex-start;
.headtop {
display: flex;
align-items: center;
@ -2295,7 +2317,7 @@ const {
box-sizing: border-box;
color: rgba(237, 25, 25);
&:nth-last-child(1) {
border-right: 0;
// border-right: 0;
}
}
}
@ -2336,15 +2358,16 @@ const {
display: flex;
align-items: center;
justify-content: flex-start;
padding: 20px;
box-sizing: border-box;
background-color: #fff;
width: 99%;
margin: 10px auto;
padding: 4px;
.liebs {
display: flex;
align-items: center;
justify-content: flex-start;
padding-bottom: 15px;
// width: 6000px;
width: 100%;
}
.item {
margin-right: 10px;
@ -2375,7 +2398,8 @@ const {
> .tips {
display: flex;
align-items: center;
.exprbuts{
.exprbuts {
width: 70px;
height: 30px;
color: #666666;
@ -2385,7 +2409,7 @@ const {
display: flex;
align-items: center;
justify-content: center;
border: 1.5px solid #E8E8E8;
border: 1.5px solid #e8e8e8;
cursor: pointer;
}
> div {
@ -2406,35 +2430,64 @@ const {
}
}
.tips {
display: flex;
align-items: center;
.exprbuts {
width: 70px;
height: 30px;
color: #666666;
font-size: 12px;
background-color: #fff;
border-radius: 3px;
display: flex;
align-items: center;
.exprbuts{
width: 70px;
height: 30px;
color: #666666;
font-size: 12px;
background-color: #fff;
border-radius: 3px;
display: flex;
align-items: center;
justify-content: center;
border: 1.5px solid #E8E8E8;
cursor: pointer;
}
> div {
margin-left: 20px;
}
.def {
color: rgb(30, 159, 255);
font-weight: 600;
}
.red {
color: rgb(255, 87, 34);
font-weight: 600;
}
.green {
color: rgb(95, 184, 120);
font-weight: 600;
}
justify-content: center;
border: 1.5px solid #e8e8e8;
cursor: pointer;
}
> div {
margin-left: 20px;
}
.def {
color: rgb(30, 159, 255);
font-weight: 600;
}
.red {
color: rgb(255, 87, 34);
font-weight: 600;
}
.green {
color: rgb(95, 184, 120);
font-weight: 600;
}
}
.tips-Menu {
background-color: #fff;
padding: 8px 0;
width: 99%;
margin: 0 auto;
}
.contentbj {
background-color: #fff;
border: 1px solid var(--bordercolor);
}
.itemwbox:last-child {
.itemmibox {
border-right: 1px solid var(--boxcolor);
}
}
.itemwbox {
overflow: hidden;
}
.itemwbox {
border-top: none !important;
}
.tilts-info {
display: flex;
flex-direction: column;
align-items: flex-start;
width: 120px;
}
</style>

Write Preview
Loading…
Cancel
Save