feat(stock): 添加物料信息和以及物料修改
This commit is contained in:
parent
ffd1e3e16c
commit
8bdb6fc270
|
|
@ -11,60 +11,105 @@
|
|||
<el-button color="green">空闲</el-button>
|
||||
<el-button color="red">占用</el-button>
|
||||
<el-button color="yellow">锁定</el-button>
|
||||
<span style="margin-left: 20px;">层数选择：</span>
|
||||
<el-select v-model="chooseLayer" placeholder="层数选择" @change="getAllLocations">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<el-button color="#00BFFF" style="margin: 0 0 0 auto;" @click="getAllLocations">刷新</el-button>
|
||||
</el-row>
|
||||
<hr style="border: 1px solid #ff0000" />
|
||||
<div>
|
||||
<el-scrollbar max-height="760px">
|
||||
<div v-for="currentRowLocation in allLocations">
|
||||
<span>第{{ currentRowLocation.row }}排</span>
|
||||
<div class="row" v-for="currentLayerLocation in currentRowLocation.currentLayerLocations">
|
||||
<div class="col" v-for="currentColLocation in currentLayerLocation.currentColLocations">
|
||||
<el-scrollbar max-height="600px" :native="true" >
|
||||
<div v-for="currentRowLocation in allLocations" class="scrollbar-flex-content">
|
||||
<span class="row" v-for="currentLayerLocation in currentRowLocation.currentLayerLocations">
|
||||
<span class="col" v-for="currentColLocation in currentLayerLocation.currentColLocations">
|
||||
<el-button :color="getLocationStatus(currentColLocation)"
|
||||
@click="showDialog(currentColLocation)">
|
||||
@click="showDialog(currentColLocation)">
|
||||
<span style="font-size: 13px;">{{ currentColLocation.queue}}排{{ currentColLocation.line}}列{{ currentColLocation.layer}}层 -{{ currentColLocation.wareArea}}</span>
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<hr style="border: 1px solid #000000" />
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
<!-- 库位信息和物料信息弹出框 -->
|
||||
<el-dialog v-model="dialogVisible" :title="currentLocationTitle" width="30%" draggable :show-close="false">
|
||||
<el-form :model="location">
|
||||
<el-tabs
|
||||
v-model="activeTabName"
|
||||
type="card"
|
||||
class="demo-tabs"
|
||||
@tab-click="handleTabClick"
|
||||
>
|
||||
<el-tab-pane label="库位信息" name="location">
|
||||
<el-form :model="location">
|
||||
<el-form-item label="库位号" :label-width="140">
|
||||
<el-input v-model="this.currentSelectedLocation.locationId" style="width: 70%;" readonly />
|
||||
<el-input v-model="this.currentSelectedLocation.locationId" style="width: 70%;" readonly />
|
||||
</el-form-item>
|
||||
<el-form-item label="占用/解除占用库位" :label-width="140">
|
||||
<el-select v-model="location.locationStatus" placeholder="库位是否占用" style="width: 70%;">
|
||||
<el-option label="空闲" :value='0' />
|
||||
<el-option label="占用" :value='1' />
|
||||
</el-select>
|
||||
<el-select v-model="location.locationStatus" placeholder="库位是否占用" style="width: 70%;">
|
||||
<el-option label="空闲" :value='0' />
|
||||
<el-option label="占用" :value='1' />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="锁定/解锁库位" :label-width="140">
|
||||
<el-select v-model="location.isLock" placeholder="库位是否锁定" style="width: 70%;">
|
||||
<el-option label="解锁" :value='0' />
|
||||
<el-option label="锁定" :value='1' />
|
||||
</el-select>
|
||||
<el-select v-model="location.isLock" placeholder="库位是否锁定" style="width: 70%;">
|
||||
<el-option label="解锁" :value='0' />
|
||||
<el-option label="锁定" :value='1' />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="载具" :label-width="140">
|
||||
<el-input v-model="location.vehicleId" style="width: 70%;" />
|
||||
<el-input v-model="location.vehicleId" style="width: 70%;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="库区选择" :label-width="140">
|
||||
<el-select v-model="location.wareArea" placeholder="选择库区" style="width: 70%;">
|
||||
<el-option label="A" value="A" />
|
||||
<el-option label="B" value="B" />
|
||||
<el-option label="C" value="C" />
|
||||
</el-select>
|
||||
<el-select v-model="location.wareArea" placeholder="选择库区" style="width: 70%;">
|
||||
<el-option label="A" value="A" />
|
||||
<el-option label="B" value="B" />
|
||||
<el-option label="C" value="C" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="submitLocationStatus()">
|
||||
确定
|
||||
</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-form>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="物料信息" name="stock">
|
||||
<el-form :model="stock">
|
||||
<el-form-item label="托盘号" :label-width="140">
|
||||
<el-input v-model="stock.vehicleId" style="width: 70%;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="物料号" :label-width="140">
|
||||
<el-input v-model="stock.goodsId" style="width: 70%;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="数量" :label-width="140">
|
||||
<el-input v-model="stock.availableNum" style="width: 70%;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="规格描述" :label-width="140">
|
||||
<el-input v-model="stock.goodsName" style="width: 70%;" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="托盘信息" name="vehicle">Config</el-tab-pane>
|
||||
</el-tabs>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button v-if="activeTabName == 'location'" type="primary" @click="submitLocationStatus()">
|
||||
更新库位信息
|
||||
</el-button>
|
||||
<el-button v-if="activeTabName == 'stock'" type="primary" @click="submitLocationStatus()">
|
||||
<span v-if="isAddStock" @click="handleAddStock">
|
||||
添加物料信息
|
||||
</span>
|
||||
<span v-else @click="handleAddStock">
|
||||
更新物料信息
|
||||
</span>
|
||||
</el-button>
|
||||
<el-button v-if="activeTabName == 'vehicle'" type="primary" @click="submitLocationStatus()">
|
||||
更新托盘信息
|
||||
</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</el-config-provider>
|
||||
|
|
@ -78,10 +123,31 @@ import { ElMessage, ElLoading } from 'element-plus'
|
|||
import { reactive } from 'vue'
|
||||
</script>
|
||||
<script>
|
||||
import {reactive} from "vue";
|
||||
import {addStockInfo, getStockByLocation, updateStockInfo} from "@/api/stock";
|
||||
import {ElLoading, ElMessage} from "element-plus";
|
||||
|
||||
export default {
|
||||
name: 'location',
|
||||
data() {
|
||||
return {
|
||||
isAddStock:true,
|
||||
stock:{},
|
||||
activeTabName:'stock',
|
||||
options: [{
|
||||
value: 1,
|
||||
label: '第一层'
|
||||
}, {
|
||||
value: 2,
|
||||
label: '第二层'
|
||||
}, {
|
||||
value: 3,
|
||||
label: '第三层'
|
||||
}, {
|
||||
value: 4,
|
||||
label: '第四层'
|
||||
}],
|
||||
chooseLayer: 1,
|
||||
dialogVisible: false,
|
||||
currentSelectedLocation: {},
|
||||
allLocations: [],
|
||||
|
|
@ -100,6 +166,43 @@ export default {
|
|||
this.getAllLocations()
|
||||
},
|
||||
methods: {
|
||||
handleAddStock() {
|
||||
if (this.isAddStock) {
|
||||
addStockInfo(this.stock).then(res=> {
|
||||
if (res.data.code == 0) {
|
||||
this.dialogVisible = false
|
||||
ElMessage({
|
||||
message: '添加物料信息成功！',
|
||||
type: 'success',
|
||||
})
|
||||
this.getAllLocations()
|
||||
} else {
|
||||
ElMessage.error(res.data.message)
|
||||
}
|
||||
}).catch(err => {
|
||||
ElMessage.error('添加物料信息失败！',err)
|
||||
})
|
||||
}else {
|
||||
updateStockInfo(this.stock).then(res=>{
|
||||
if (res.data.code == 0) {
|
||||
this.dialogVisible = false
|
||||
ElMessage({
|
||||
message: '更新物料信息成功！',
|
||||
type: 'success',
|
||||
})
|
||||
this.getAllLocations()
|
||||
} else {
|
||||
ElMessage.error(res.data.message)
|
||||
}
|
||||
}).catch(err => {
|
||||
ElMessage.error('更新物料信息失败！',err)
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
handleTabClick(tab, event){
|
||||
console.log(tab,event)
|
||||
},
|
||||
getLocationStatus: (currentColLocation) => {
|
||||
if (currentColLocation.isLock === 1) {
|
||||
return 'yellow'
|
||||
|
|
@ -109,17 +212,32 @@ export default {
|
|||
}
|
||||
return 'green'
|
||||
},
|
||||
getStockLocation(locationId){
|
||||
getStockByLocation({locationId: locationId}).then(res=> {
|
||||
if (res.data.code == 0) {
|
||||
this.isAddStock = false
|
||||
this.stock = res.data.returnData
|
||||
} else {
|
||||
this.isAddStock = true
|
||||
this.stock = {}
|
||||
}
|
||||
}).catch(err => {
|
||||
loading.close()
|
||||
ElMessage.error('查询库存信息失败！')
|
||||
})
|
||||
},
|
||||
getAllLocations() {
|
||||
const loading = ElLoading.service({
|
||||
lock: true,
|
||||
text: 'Loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)',
|
||||
})
|
||||
const data = { areaId: this.areaId }
|
||||
const data = { areaId: this.areaId,layer: this.chooseLayer }
|
||||
getLocations(data).then(res => {
|
||||
loading.close()
|
||||
let sum = 0
|
||||
if (res.data.code == 0) {
|
||||
console.log(res.data.returnData)
|
||||
|
||||
this.allLocations = res.data.returnData
|
||||
} else {
|
||||
ElMessage.error(res.data.message)
|
||||
|
|
@ -135,13 +253,13 @@ export default {
|
|||
showDialog(currentColLocation) {
|
||||
this.dialogVisible = true
|
||||
this.currentSelectedLocation = currentColLocation
|
||||
this.getStockLocation(this.currentSelectedLocation.locationId)
|
||||
this.setCurrentLocationTitle()
|
||||
this.location.locationId = this.currentSelectedLocation.locationId
|
||||
this.location.locationStatus = this.currentSelectedLocation.locationStatus
|
||||
this.location.isLock = this.currentSelectedLocation.isLock
|
||||
this.location.vehicleId = this.currentSelectedLocation.vehicleId
|
||||
this.location.wareArea = this.currentSelectedLocation.wareArea
|
||||
|
||||
},
|
||||
submitLocationStatus() {
|
||||
const loading = ElLoading.service({
|
||||
|
|
@ -186,8 +304,8 @@ export default {
|
|||
}
|
||||
|
||||
.row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
//display: flex;
|
||||
//justify-content: space-between;
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
|
|
@ -202,4 +320,13 @@ export default {
|
|||
width: 100px;
|
||||
height: 50px;
|
||||
}
|
||||
.scrollbar-flex-content {
|
||||
display: flex;
|
||||
}
|
||||
.demo-tabs > .el-tabs__content {
|
||||
padding: 32px;
|
||||
color: #6b778c;
|
||||
font-size: 32px;
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user