更新
This commit is contained in:
@@ -11,6 +11,16 @@
|
||||
<span slot="title">首页</span>
|
||||
</el-menu-item>
|
||||
|
||||
<el-menu-item index="OperationMonitor" @click="$router.push({ name: 'OperationMonitor' })">
|
||||
<icon-svg name="shouye" class="site-sidebar__menu-icon"></icon-svg>
|
||||
<span slot="title">运行监控</span>
|
||||
</el-menu-item>
|
||||
|
||||
<el-menu-item index="instock" @click="$router.push({ name: 'instock' })">
|
||||
<icon-svg name="shouye" class="site-sidebar__menu-icon"></icon-svg>
|
||||
<span slot="title">扫码入库</span>
|
||||
</el-menu-item>
|
||||
|
||||
<el-submenu index="info">
|
||||
<template slot="title">
|
||||
<icon-svg name="shoucang" class="site-sidebar__menu-icon"></icon-svg>
|
||||
|
||||
447
src/views/modules/work/OperationMonitor.vue
Normal file
447
src/views/modules/work/OperationMonitor.vue
Normal file
@@ -0,0 +1,447 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2022-05-31 15:49:03
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2022-06-06 15:27:38
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div>
|
||||
<div
|
||||
style="width:100%;height:100%;border-bottom:1px dotted #ff0000;padding-bottom:10px"
|
||||
>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="6"><div class="Ugui"></div></el-col>
|
||||
<el-col :span="18">
|
||||
<div class="zhigui">
|
||||
<div class="car" id="car"></div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="wareBody">
|
||||
<div
|
||||
v-for="(item, index) in shelfArr"
|
||||
:key="index"
|
||||
class="shelfBox"
|
||||
ref="shelfBox"
|
||||
v-bind:class="[
|
||||
item.taskType === 0 ? 'deliveryShelfBox' : 'normalShelfBox'
|
||||
]"
|
||||
>
|
||||
<el-popover trigger="hover" word-wrap placement="top-start">
|
||||
<label style="margin-left:20px">货位信息</label>
|
||||
<br />
|
||||
<label>操作台号：{{ item.name }}</label>
|
||||
<div slot="reference">
|
||||
<label>{{ item.name }}</label>
|
||||
</div>
|
||||
</el-popover>
|
||||
</div>
|
||||
</div>
|
||||
<div class="line">分隔线</div>
|
||||
<div class="wareBody">
|
||||
<div
|
||||
v-for="(item, index) in shelfArr"
|
||||
:key="index"
|
||||
class="shelfBox"
|
||||
ref="shelfBox"
|
||||
v-bind:class="[
|
||||
item.taskType === 0 ? 'deliveryShelfBox' : 'normalShelfBox'
|
||||
]"
|
||||
>
|
||||
<el-popover trigger="hover" word-wrap placement="top-start">
|
||||
<label style="margin-left:20px">货位信息</label>
|
||||
<br />
|
||||
<label>操作台号：{{ item.name }}</label>
|
||||
<div slot="reference">
|
||||
<label>{{ item.name }}</label>
|
||||
</div>
|
||||
</el-popover>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
shelfArr: [
|
||||
{
|
||||
name: 1,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 2,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 3,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 4,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 5,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 6,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 7,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 8,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 9,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 10,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 11,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 12,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 13,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 14,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 15,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 16,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 17,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 18,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 1,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 2,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 3,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 4,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 5,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 6,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 7,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 8,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 9,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 10,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 11,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 12,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 13,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 14,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 15,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 16,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 17,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 18,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 1,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 2,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 3,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 4,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 5,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 6,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 7,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 8,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 9,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 10,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 11,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 12,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 13,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 14,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 15,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 16,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 17,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 18,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 1,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 2,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 3,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 4,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 5,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 6,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 7,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 8,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 9,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 10,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 11,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 12,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 13,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 14,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 15,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 16,
|
||||
taskType: 0
|
||||
},
|
||||
{
|
||||
name: 17,
|
||||
taskType: 1
|
||||
},
|
||||
{
|
||||
name: 18,
|
||||
taskType: 0
|
||||
}
|
||||
],
|
||||
car: '',
|
||||
zhigui: '',
|
||||
motion: ''
|
||||
}
|
||||
},
|
||||
created () {},
|
||||
mounted () {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init () {
|
||||
this.car = document.getElementById('car')
|
||||
this.motion = setInterval(() => {
|
||||
this.car.style.left = this.car.offsetLeft - 1 + 'px'
|
||||
if (this.car.offsetLeft <= 0) {
|
||||
clearInterval(this.motion)
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.zhigui {
|
||||
height: 250px;
|
||||
background: url("../../../assets/img/直轨.jpeg") repeat;
|
||||
background-size: 100% 100%;
|
||||
padding-top: 100px;
|
||||
position: relative;
|
||||
}
|
||||
.Ugui {
|
||||
height: 250px;
|
||||
transform: rotate(180deg);
|
||||
background: url("../../../assets/img/U轨道.jpeg") repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.wareBody {
|
||||
margin: auto;
|
||||
height: 90%;
|
||||
background-color: #f0f0f0;
|
||||
border: 2px solid #cdcdc5;
|
||||
border-radius: 5px;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
min-width: 1200px;
|
||||
position: relative;
|
||||
padding: 20px;
|
||||
}
|
||||
.shelfBox {
|
||||
width: 5.5%;
|
||||
height: 50px;
|
||||
padding: 20px;
|
||||
border: 2px solid #cdcdc5;
|
||||
border-radius: 5px;
|
||||
line-height: 10px;
|
||||
text-align: center;
|
||||
color: white;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.deliveryShelfBox {
|
||||
background-color: rgb(245, 72, 72);
|
||||
}
|
||||
|
||||
.normalShelfBox {
|
||||
background-color: #09bb07;
|
||||
}
|
||||
.car {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
background-color: rgb(116, 79, 250);
|
||||
background: url("../../../assets/img/car.jpeg") repeat;
|
||||
background-size: 100% 100%;
|
||||
right: 0;
|
||||
position: absolute;
|
||||
}
|
||||
.line {
|
||||
padding: 0 20px 0;
|
||||
margin: 20px auto;
|
||||
line-height: 3px;
|
||||
border-left: 500px solid rgb(137, 139, 131);
|
||||
border-right: 500px solid rgb(137, 139, 131);
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
78
src/views/modules/work/instock.vue
Normal file
78
src/views/modules/work/instock.vue
Normal file
@@ -0,0 +1,78 @@
|
||||
<!--
|
||||
* @Author: zwq
|
||||
* @Date: 2022-06-30 15:48:10
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2022-06-30 16:36:31
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<el-card class="box-card">
|
||||
<div slot="header" style="text-align:center;">
|
||||
<el-input
|
||||
ref="input"
|
||||
v-model="scancode"
|
||||
placeholder="请输入内容"
|
||||
style="width:300px"
|
||||
@keyup.enter.native="dataFormSubmit()"
|
||||
autofocus
|
||||
></el-input>
|
||||
</div>
|
||||
<img src="~@/assets/img/instock.png" />
|
||||
<!-- <el-table :data="tableData" height="500" style="width: 100%">
|
||||
<el-table-column prop="code" label="入库码"> </el-table-column>
|
||||
<el-table-column prop="status" label="状态"> </el-table-column>
|
||||
</el-table> -->
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
scancode: '',
|
||||
tableData: [
|
||||
]
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.input.focus()
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
dataFormSubmit () {
|
||||
const tDataObj = {}
|
||||
tDataObj.code = this.scancode
|
||||
this.$http({
|
||||
url: this.$http.adornUrl('/work/scancode/instock'),
|
||||
method: 'post',
|
||||
data: this.$http.adornData({
|
||||
'task': this.scancode
|
||||
})
|
||||
}).then(({data}) => {
|
||||
if (data && data.code === 0) {
|
||||
tDataObj.status = '成功'
|
||||
this.scancode = ''
|
||||
this.$message({
|
||||
message: '操作成功',
|
||||
type: 'success',
|
||||
duration: 1500
|
||||
})
|
||||
} else {
|
||||
tDataObj.status = '失败'
|
||||
this.scancode = ''
|
||||
this.$message.error(data.msg)
|
||||
}
|
||||
})
|
||||
this.tableData.push(tDataObj)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.box-card /deep/ .el-card__header {
|
||||
background-color: #eee8aa;
|
||||
padding: none;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user