Commit 855ef303 by huangqy

222

parent 4b4a3b8b
...@@ -388,11 +388,11 @@ ...@@ -388,11 +388,11 @@
<el-dialog :append-to-body="true" <el-dialog :append-to-body="true"
:title="title" :title="title"
:visible.sync="dialogVisible" :visible.sync="dialogVisible"
width="700px" width="650px"
:close-on-click-modal="false" :close-on-click-modal="false"
@close="addClose()" @close="addClose()"
> >
<el-form :model="setFormData" :rules="setFormDataRules" ref="setFromRef" size="medium" label-position="right" label-width="90px"> <el-form :model="setFormData" :rules="setFormDataRules" ref="setFromRef" size="medium" label-width="90px">
<el-form-item label="状态 :" prop="rackStatus"> <el-form-item label="状态 :" prop="rackStatus">
<el-select <el-select
......
...@@ -3,53 +3,36 @@ ...@@ -3,53 +3,36 @@
<div class="body" :style="'height:' + height + 'px'"> <div class="body" :style="'height:' + height + 'px'">
<div style="border: 2px solid #43A747;"> <div style="border: 2px solid #43A747;">
<el-card :style="'height:' + (height - 60) + 'px;overflow-y: auto;position:relative;'"> <el-card :style="'height:' + (height - 60) + 'px;overflow-y: auto;position:relative;'">
<el-radio-group v-model="layer" size="small"> <el-radio-group v-model="layer" size="small" @change="changeLayer">
<el-radio-button v-for="item in layerList" :key="item.vlayer" :label="'第' + item.vlayer + '层'"></el-radio-button> <el-radio-button v-for="item in layerList" :key="item.vlayer" :label="'第' + item.vlayer + '层'"></el-radio-button>
</el-radio-group> </el-radio-group>
<el-row> <el-row>
<el-col :span="18"> <el-col :span="18">
<el-card style="height: 620px; overflow: auto;"> <el-card style="height: 620px; overflow: auto;">
<!-- <grid-layout <div v-for="(item,index) in this.ArrayListX" :key="index">
:layout.sync="layout" <ul :style="'grid-template-columns: repeat('+ item.length +', 4%);'" >
:col-num="this.maxRank" <li v-for="(items,k) in item" :key="k+''+index" @click="onClick(items)" :class="items.x === 0 || items.y === 0 ? 'box' : items.status === 'E' ? 'boxE' : items.status === 'P' ? 'boxP': items.status === 'F' ? 'boxF' : items.status === 'A' ? 'boxA' : items.status === 'W' ? 'boxW' : items.status === 'C' ? 'boxC' : '' ">
:row-height="20" {{ items.x === 0 ? items.y : items.y ===0 ? items.x : ''}}
:is-draggable="false" </li>
:is-resizable="false"
:is-mirrored="false"
:vertical-compact="true"
:margin="[10, 10]"
:use-css-transforms="true"
>
<grid-item v-for="item in layout"
:x="item.x"
:y="item.y"
:w="item.w"
:h="item.h"
:i="item.i"
:key="item.i">
{{item.i}}
</grid-item>
</grid-layout> -->
<ul :style="'grid-template-columns: repeat('+ (this.maxRank + 1) +', 3%);margin-right: 20px;'">
<li id="box" v-for="item in this.maxRank * (this.maxRow + 1)" :key="item"><span v-if="item-1 !==0">{{ item - 1 < 53 ? (item - 1) : ((item - 1) % 52) }}</span></li>
</ul> </ul>
</div>
</el-card> </el-card>
</el-col> </el-col>
<el-col :push="1" :span="5"> <el-col :push="1" :span="5">
<el-card> <el-card>
<el-descriptions title="库位使用率" :column="1" border> <el-descriptions title="库位使用率" :column="1" border>
<el-descriptions-item label="使用率">48.48%</el-descriptions-item> <el-descriptions-item label="使用率">{{rightForm.percentage}}</el-descriptions-item>
<el-descriptions-item label="空闲库位">1082</el-descriptions-item> <el-descriptions-item label="空闲库位">{{rightForm.unUseCount}}</el-descriptions-item>
<el-descriptions-item label="已用库位">1018</el-descriptions-item> <el-descriptions-item label="已用库位">{{rightForm.useCount}}</el-descriptions-item>
</el-descriptions> </el-descriptions>
<el-descriptions title="库存信息" :column="1" border style="margin-top:1px;"> <el-descriptions title="库存信息" :column="1" border style="margin-top:1px;">
<el-descriptions-item label="库位编号">011111</el-descriptions-item> <el-descriptions-item label="库位编号">{{rightForm.positionCode}}</el-descriptions-item>
<el-descriptions-item label="物料名称">0</el-descriptions-item> <el-descriptions-item label="物资名称">{{rightForm.goodsName}}</el-descriptions-item>
<el-descriptions-item label="物料编号">0</el-descriptions-item> <el-descriptions-item label="物资编码">{{rightForm.goodsCode}}</el-descriptions-item>
<el-descriptions-item label="托盘号">0</el-descriptions-item> <el-descriptions-item label="规格">{{rightForm.modelName}}</el-descriptions-item>
<el-descriptions-item label="数量">0</el-descriptions-item> <el-descriptions-item label="托盘号">{{rightForm.palletId}}</el-descriptions-item>
<el-descriptions-item label="单位">0</el-descriptions-item> <el-descriptions-item label="数量">{{rightForm.qty}}</el-descriptions-item>
<el-descriptions-item label="单位">{{rightForm.fwOrgName}}</el-descriptions-item>
</el-descriptions> </el-descriptions>
</el-card> </el-card>
</el-col> </el-col>
...@@ -61,50 +44,19 @@ ...@@ -61,50 +44,19 @@
</template> </template>
<script> <script>
import VueGridLayout from 'vue-grid-layout';
var testLayout = [
{"x":0,"y":0,"w":1,"h":1,"i":"0"},
{"x":2,"y":0,"w":1,"h":1,"i":"1"},
{"x":4,"y":0,"w":1,"h":1,"i":"2"},
{"x":6,"y":0,"w":1,"h":1,"i":"3"},
{"x":8,"y":0,"w":1,"h":1,"i":"4"},
{"x":10,"y":0,"w":1,"h":1,"i":"5"},
{"x":0,"y":5,"w":1,"h":1,"i":"6"},
{"x":2,"y":5,"w":1,"h":1,"i":"7"},
{"x":4,"y":5,"w":1,"h":1,"i":"8"},
{"x":6,"y":3,"w":1,"h":1,"i":"9"},
{"x":8,"y":4,"w":1,"h":1,"i":"10"},
{"x":10,"y":4,"w":1,"h":1,"i":"11"},
{"x":0,"y":10,"w":1,"h":1,"i":"12"},
{"x":2,"y":10,"w":1,"h":1,"i":"13"},
{"x":4,"y":8,"w":1,"h":1,"i":"14"},
{"x":6,"y":8,"w":1,"h":1,"i":"15"},
{"x":8,"y":10,"w":1,"h":1,"i":"16"},
{"x":10,"y":4,"w":1,"h":1,"i":"17"},
{"x":0,"y":9,"w":1,"h":1,"i":"18"},
{"x":2,"y":6,"w":1,"h":1,"i":"19"}
];
export default { export default {
data () { data () {
return { return {
height: document.documentElement.clientHeight - 176, height: document.documentElement.clientHeight - 176,
layer: '', layer: '',
layerList: [], layerList: [],
maxRow: '', xyData: [],
maxRank: '', maxXy: {},
// 布局位置数据 ArrayListX:[],
layout: testLayout, ArrayListY:[],
// 布局二维数组地图 rightForm: {}
layoutMap: [],
// 布局列数
layoutColNum: 50
} }
}, },
components: {
GridLayout: VueGridLayout.GridLayout,
GridItem: VueGridLayout.GridItem
},
created () { created () {
this.getStoreLayer() this.getStoreLayer()
}, },
...@@ -122,8 +74,55 @@ export default { ...@@ -122,8 +74,55 @@ export default {
if (res.code !== 99200) return this.$message.error(res.message) if (res.code !== 99200) return this.$message.error(res.message)
this.layerList = res.data this.layerList = res.data
this.layer = '第' + res.data[0].vlayer + '层' this.layer = '第' + res.data[0].vlayer + '层'
this.maxRank = res.data[0].maxRank await this.getRackByLayer()
this.maxRow = res.data[0].maxRow for(var i=0;i<=res.data[0].maxRow;i++){
this.ArrayListY = [];
for(var j=0;j<=res.data[0].maxRank;j++){
this.ArrayListY.push({x: j, y: i, status: this.findStatus(j, i), positionCode: this.findPositionCode(j, i) });
}
this.ArrayListX.push(this.ArrayListY);
}
},
async getRackByLayer() {
const {data: res} = await this.$axios.get('/summary/getRackByLayer?VLayer=' + this.layer.substring(1,2))
if (res.code !== 99200) return this.$message.error(res.message)
this.xyData = res.data.map(i => {
return {vrank: i.vrank,vrow: i.vrow,status: i.status, positionCode: i.positionCode}
})
},
findStatus(x, y) {
var resA = this.xyData.filter(i => i.vrank === x)
if (resA) {
if (resA.find(j => j.vrow === y)) {
return resA.find(j => j.vrow === y).status
}
}
return '';
},
findPositionCode(x, y) {
var resA = this.xyData.filter(i => i.vrank === x)
if (resA) {
if (resA.find(j => j.vrow === y)) {
return resA.find(j => j.vrow === y).positionCode
}
}
return '';
},
async changeLayer() {
await this.getRackByLayer()
this.ArrayListX = []
for(var i=0;i<=this.layerList[this.layer.substring(1,2) - 1].maxRow;i++){
this.ArrayListY = [];
for(var j=0;j<=this.layerList[this.layer.substring(1,2) -1].maxRank;j++){
this.ArrayListY.push({x: j, y: i, status: this.findStatus(j, i), positionCode: this.findPositionCode(j, i)});
}
this.ArrayListX.push(this.ArrayListY);
}
},
async onClick(items) {
const {data: res} = await this.$axios.get('/summary/getRackDetail?VLayer=' + this.layer.substring(1,2) + '&positionCode=' + items.positionCode+ '&storeCode=' + JSON.parse(sessionStorage.getItem('storeList')))
if (res.code !== 99200) return this.$message.error(res.message)
this.rightForm = res.data
} }
} }
...@@ -137,38 +136,52 @@ export default { ...@@ -137,38 +136,52 @@ export default {
align-items: center; align-items: center;
margin-bottom: 1px; margin-bottom: 1px;
border: 1px solid rgb(235,238,245); border: 1px solid rgb(235,238,245);
height: 55px;
} }
ul { ul {
list-style: none; list-style: none;
display: grid; display: grid;
grid-row-gap: 5px; grid-row-gap: 10px;
grid-column-gap: 5px; grid-column-gap: 10px;
margin-bottom: 5px; margin-bottom: 10px;
} }
li{ li {
font-size: 1em; font-size: 1em;
line-height: 40px;
text-align: center; text-align: center;
border: 1px solid #e5e4e9;
}
#box {
cursor:pointer cursor:pointer
} }
#box1 { .box {
border: 2px solid #e5e4e9;
}
.boxE {
background-color: #d0e4a9; background-color: #d0e4a9;
border: 2px solid #e5e4e9;
} }
#box2 { .boxP {
background-color: #0376c2; background-color: #0376c2;
border: 2px solid #e5e4e9;
} }
#box3 { .boxF {
background-color: #8cacea; background-color: #8cacea;
border: 2px solid #e5e4e9;
} }
.boxA {
.vue-grid-item.cssTransforms { background-color: greenyellow;
border: 1px solid #0376c2; border: 2px solid #e5e4e9;
}
.boxW {
background-color: red;
border: 2px solid #e5e4e9;
}
.boxC {
background-color: #FF8833;
border: 2px solid #e5e4e9;
} }
</style> </style>
...@@ -81,13 +81,18 @@ ...@@ -81,13 +81,18 @@
<el-dialog :append-to-body="true" :title="title" :visible.sync="addFlag" width="20%" @close="addClose()" :close-on-click-modal="false"> <el-dialog :append-to-body="true" :title="title" :visible.sync="addFlag" width="20%" @close="addClose()" :close-on-click-modal="false">
<!-- 表单区域 --> <!-- 表单区域 -->
<el-form :model="formData" :rules="setFormDataRules" ref="setFromRef" label-width="100px"> <el-form :model="formData" :rules="setFormDataRules" ref="setFromRef" label-width="100px">
<el-form-item label="巷道 :" prop="vAisle"> <!-- <el-form-item label="巷道 :" prop="vAisle">
<el-input <el-input
clearable clearable
style="width: 60%" style="width: 60%"
placeholder="请输入巷道" placeholder="请输入巷道"
v-model="formData.vAisle" v-model="formData.vAisle"
/> />
</el-form-item> -->
<el-form-item label="区 :" prop="areaCode">
<el-select v-model="formData.areaCode" placeholder="请选择区域" style="width: 60%">
<el-option v-for="area in areaList" :key="area" :label="area" :value="area"></el-option>
</el-select>
</el-form-item> </el-form-item>
<el-form-item label="层 :" prop="vLayer"> <el-form-item label="层 :" prop="vLayer">
<el-input <el-input
...@@ -97,6 +102,14 @@ ...@@ -97,6 +102,14 @@
v-model="formData.vLayer" v-model="formData.vLayer"
/> />
</el-form-item> </el-form-item>
<el-form-item label="列 :" prop="vRank">
<el-input
clearable
style="width: 60%"
placeholder="请输入列"
v-model="formData.vRank"
/>
</el-form-item>
</el-form> </el-form>
<!-- 按钮区域 --> <!-- 按钮区域 -->
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
...@@ -118,17 +131,23 @@ export default { ...@@ -118,17 +131,23 @@ export default {
rodaData: [], rodaData: [],
// 表单验证规则 // 表单验证规则
setFormDataRules: { setFormDataRules: {
vAisle: [ areaCode: [
{ required: true, message: '此项为必填项', trigger: 'blur' } { required: true, message: '此项为必填项', trigger: 'blur' }
], ],
vRank: [
{ required: true, message: '此项为必填项', trigger: 'blur' },
],
vLayer: [ vLayer: [
{ required: true, message: '此项为必填项', trigger: 'blur' }, { required: true, message: '此项为必填项', trigger: 'blur' },
], ],
}, },
formData: {}, formData: {
vAisle: 1
},
title: '', title: '',
// 操作区域-添加弹框 // 操作区域-添加弹框
addFlag: false, addFlag: false,
areaList: [],
// 筛选数据 // 筛选数据
searchData: { searchData: {
...@@ -161,26 +180,30 @@ export default { ...@@ -161,26 +180,30 @@ export default {
takeCheck () { takeCheck () {
this.title = '巷道抽检' this.title = '巷道抽检'
this.addFlag = true this.addFlag = true
this.getAllAreaCode()
},
async getAllAreaCode() {
const { data: res } = await this.$axios.get('/storeInv/getAllAreaCode')
if (res.code !== 99200) return this.$message(res.message)
this.areaList = res.data
}, },
// 取消弹窗事件 // 取消弹窗事件
addClose () { addClose () {
this.$refs.setFromRef.resetFields() this.$refs.setFromRef.resetFields()
this.formData = {
vAisle: 1
}
}, },
// 确认提交 // 确认提交
addClick () { addClick () {
// 添加 // 添加
this.$confirm('此操作将抽检, 是否抽检'+ this.formData.vAisle + '巷道' + this.formData.vLayer + '层', '提示', { this.$confirm('此操作将抽检, 是否抽检'+ this.formData.vLayer + '层', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning' type: 'warning'
}).then(async () => { }).then(async () => {
const { data: res } = await this.$axios.get('/storeInv/aisleOutStore', { const { data: res } = await this.$axios.get('/storeInv/aisleOutStore', {params: this.formData})
params: {
vAisle: this.formData.vAisle,
vLayer: this.formData.vLayer
}
})
if (res.code !== 99200) return this.$message.error(res.message) if (res.code !== 99200) return this.$message.error(res.message)
this.$message.success(res.message) this.$message.success(res.message)
// 创建成功关闭弹出框 // 创建成功关闭弹出框
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论