更新驾驶舱 #6
BIN
src/assets/img/OperationalOverview/title (2).png
Normal file
BIN
src/assets/img/OperationalOverview/title (2).png
Normal file
Binary file not shown.
After Width: | Height: | Size: 84 KiB |
@ -31,8 +31,8 @@ export default {
|
||||
default: 1
|
||||
},
|
||||
height: {
|
||||
type: String,
|
||||
default: '300px'
|
||||
type: Number,
|
||||
default: 300
|
||||
},
|
||||
showLegend: {
|
||||
type: Boolean,
|
||||
|
@ -2,11 +2,11 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2022-01-21 14:43:06
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2022-10-25 09:30:47
|
||||
* @LastEditTime: 2022-11-02 16:52:34
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
<div :id="id" :class="className" :style="{ height: computedHeight, width: width }" />
|
||||
<div :id="id" :class="className" :style="{ height: height * beilv + 'px', width: width }" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@ -35,8 +35,8 @@ export default {
|
||||
default: 1
|
||||
},
|
||||
height: {
|
||||
type: String,
|
||||
default: '300px'
|
||||
type: Number,
|
||||
default: 300
|
||||
},
|
||||
showCenterTitle: {
|
||||
type: Boolean,
|
||||
|
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2020-12-29 16:37:56
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2022-10-25 16:39:57
|
||||
* @LastEditTime: 2022-11-03 08:58:07
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -10,7 +10,7 @@
|
||||
<div
|
||||
v-for="i in areaArr"
|
||||
:key="i"
|
||||
:style="{ height: 135 * beilv + 'px', margin: 8 * beilv + 'px' + ' 0' }"
|
||||
:style="{ height: 135 * beilv + 'px', marginTop: 11 * beilv + 'px' }"
|
||||
class="area"
|
||||
>
|
||||
<el-row>
|
||||
@ -53,13 +53,13 @@ export default {
|
||||
|
||||
<style scoped>
|
||||
.area {
|
||||
background: url('../../../assets/img/OperationalOverview/编组36.png') no-repeat;
|
||||
background-image: linear-gradient(to right, rgba(59, 76, 118,0.6), transparent);
|
||||
background-size: 100% 100%;
|
||||
padding: 5px 10px;
|
||||
margin: 3px 0;
|
||||
padding: 5px 0;
|
||||
padding-left: 15px;
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
background-color: rgb(0, 0, 0, 0.5);
|
||||
border: 1px dotted #5EC3D8;
|
||||
}
|
||||
.areaName {
|
||||
margin-top: 100%;
|
||||
@ -68,7 +68,7 @@ export default {
|
||||
line-height: 30px;
|
||||
}
|
||||
.locationFlex{
|
||||
margin-left: 15px;
|
||||
margin-left: 25px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-content: space-between;
|
||||
|
@ -2,7 +2,7 @@
|
||||
* @Author: zwq
|
||||
* @Date: 2021-07-19 15:18:30
|
||||
* @LastEditors: zwq
|
||||
* @LastEditTime: 2022-10-26 09:57:19
|
||||
* @LastEditTime: 2022-11-03 10:06:28
|
||||
* @Description:
|
||||
-->
|
||||
<template>
|
||||
@ -34,14 +34,18 @@
|
||||
<el-row type="flex" class="h-full flex-col">
|
||||
<el-col :style="{ margin: 8 * beilv + 'px' + ' 0' }" :span="24">
|
||||
<base-container :beilv="beilv" :height="190" :title="'成品入库作业'" :title-icon="'入库管理'">
|
||||
<div style="width:100%">
|
||||
<div :style="{ fontSize: 13 * beilv + 'px' }">
|
||||
<el-row :style="{ marginBottom: 15 * beilv + 'px'}">
|
||||
<el-col :span="12"><div class="inTest" :style="{ padding: 9 * beilv + 'px'}"><span class="leftText">时间:</span><span class="rightText">2022.12.12 13:12:45</span></div></el-col>
|
||||
<el-col :span="12"><div class="inTest" :style="{ padding: 9 * beilv + 'px'}"><span class="leftText">成品编码:</span><span class="rightText">34394233442</span></div></el-col>
|
||||
</el-row>
|
||||
<el-row :style="{ marginBottom: 15 * beilv + 'px'}">
|
||||
<el-col :span="12"><div class="inTest" :style="{ padding: 9 * beilv + 'px'}"><span class="leftText">入库作业号:</span><span class="rightText">347384734</span></div></el-col>
|
||||
<el-col :span="12"><div class="inTest" :style="{ padding: 9 * beilv + 'px'}"><span class="leftText">成品规格:</span><span class="rightText">234*345*34</span></div></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12"><div class="inTest"><span class="leftText">时间:</span><span class="rightText">2022.12.12 13:12:45</span></div></el-col>
|
||||
<el-col :span="12"><div class="inTest"><span class="leftText">成品编码:</span><span class="rightText">34394233442</span></div></el-col>
|
||||
<el-col :span="12"><div class="inTest"><span class="leftText">入库作业号:</span><span class="rightText">347384734</span></div></el-col>
|
||||
<el-col :span="12"><div class="inTest"><span class="leftText">成品规格:</span><span class="rightText">234*345*34</span></div></el-col>
|
||||
<el-col :span="12"><div class="inTest"><span class="leftText">执行叉车:</span><span class="rightText">叉车</span></div></el-col>
|
||||
<el-col :span="12"><div class="inTest"><span class="leftText">库位:</span><span class="rightText">A区34货位3层</span></div></el-col>
|
||||
<el-col :span="12"><div class="inTest" :style="{ padding: 9 * beilv + 'px'}"><span class="leftText">执行叉车:</span><span class="rightText">叉车</span></div></el-col>
|
||||
<el-col :span="12"><div class="inTest" :style="{ padding: 9 * beilv + 'px'}"><span class="leftText">库位:</span><span class="rightText">A区34货位3层</span></div></el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</base-container>
|
||||
@ -49,26 +53,34 @@
|
||||
<el-col :style="{ margin: 8 * beilv + 'px' + ' 0' }" :span="24">
|
||||
<!-- 成品入库列队 -->
|
||||
<base-container :beilv="beilv" :height="190" :title="'成品入库列队'" :title-icon="'编组'">
|
||||
<div style="background:rgba(14, 32, 62, 1);border-radius:5px">
|
||||
<base-table
|
||||
:limit="10"
|
||||
:beilv="beilv"
|
||||
:table-config="inAndOutOfEachLine.tableProps"
|
||||
:table-data="inAndOutOfEachLine.list"
|
||||
/>
|
||||
</div>
|
||||
</base-container>
|
||||
</el-col>
|
||||
<el-col :style="{ margin: 8 * beilv + 'px' + ' 0' }" :span="24">
|
||||
<base-container :beilv="beilv" :height="190" :title="'成品出库作业'" :title-icon="'出库管理'">
|
||||
<div style="width:100%">
|
||||
<div :style="{ fontSize: 13 * beilv + 'px' }">
|
||||
<el-row :style="{ marginBottom: 10 * beilv + 'px'}">
|
||||
<el-col :span="12"><div class="outTest" :style="{ padding: 7 * beilv + 'px'}"><span class="leftText">时间:</span><span class="rightText">2022.12.12 13:12:45</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest" :style="{ padding: 7 * beilv + 'px'}"><span class="leftText">ERP订单:</span><span class="rightText">34394233442</span></div></el-col>
|
||||
</el-row>
|
||||
<el-row :style="{ marginBottom: 10 * beilv + 'px'}">
|
||||
<el-col :span="12"><div class="outTest" :style="{ padding: 7 * beilv + 'px'}"><span class="leftText">成品编码:</span><span class="rightText">34394233442</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest" :style="{ padding: 7 * beilv + 'px'}"><span class="leftText">出库作业号:</span><span class="rightText">347384734</span></div></el-col>
|
||||
</el-row>
|
||||
<el-row :style="{ marginBottom: 10 * beilv + 'px'}">
|
||||
<el-col :span="12"><div class="outTest" :style="{ padding: 7 * beilv + 'px'}"><span class="leftText">成品规格:</span><span class="rightText">234*345*34</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest" :style="{ padding: 7 * beilv + 'px'}"><span class="leftText">执行叉车:</span><span class="rightText">叉车</span></div></el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12"><div class="outTest"><span class="leftText">时间:</span><span class="rightText">2022.12.12 13:12:45</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest"><span class="leftText">ERP订单:</span><span class="rightText">34394233442</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest"><span class="leftText">成品编码:</span><span class="rightText">34394233442</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest"><span class="leftText">出库作业号:</span><span class="rightText">347384734</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest"><span class="leftText">成品规格:</span><span class="rightText">234*345*34</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest"><span class="leftText">执行叉车:</span><span class="rightText">叉车</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest"><span class="leftText">库位:</span><span class="rightText">A区34货位3层</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest"><span class="leftText">库位前置区:</span><span class="rightText">A区34货位3层</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest" :style="{ padding: 7 * beilv + 'px'}"><span class="leftText">库位:</span><span class="rightText">A区34货位3层</span></div></el-col>
|
||||
<el-col :span="12"><div class="outTest" :style="{ padding: 7 * beilv + 'px'}"><span class="leftText">库位前置区:</span><span class="rightText">A区34货位3层</span></div></el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</base-container>
|
||||
@ -76,12 +88,14 @@
|
||||
<el-col :style="{ margin: 8 * beilv + 'px' + ' 0' }" :span="24">
|
||||
<!-- 成品入库列队 -->
|
||||
<base-container :beilv="beilv" :height="190" :title="'成品出库列队'" :title-icon="'编组备份 2'">
|
||||
<div style="background:rgba(14, 32, 62, 1);border-radius:5px">
|
||||
<base-table
|
||||
:limit="10"
|
||||
:beilv="beilv"
|
||||
:table-config="inAndOutOfEachLine.tableProps"
|
||||
:table-data="inAndOutOfEachLine.list"
|
||||
/>
|
||||
</div>
|
||||
</base-container>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -103,9 +117,9 @@
|
||||
<el-row type="flex" class="h-full flex-col">
|
||||
<el-col :style="{ margin: 8 * beilv + 'px' + ' 0' }" :span="24">
|
||||
<base-container :beilv="beilv" :title="'设备工单管理'" :title-icon="'编组(1)'">
|
||||
<div class="div-box" style="text-align: center;">
|
||||
<div class="div-box" :style="{textAlign: 'center', padding: 8 * beilv + 'px', paddingTop: 15 * beilv + 'px',marginBottom: 12 * beilv + 'px'}">
|
||||
<span v-html="titleLeftSVG" />
|
||||
<span style="color: #01CFCC; font-size: 15px; line-height: 18px;">
|
||||
<span style="color: #01CFCC; line-height: 18px;" :style="{ fontSize: 15 * beilv + 'px' }">
|
||||
成品库存一览1
|
||||
</span>
|
||||
<div style="transform: rotateY(180deg); display: inline-block;" v-html="titleLeftSVG" />
|
||||
@ -115,26 +129,26 @@
|
||||
:legend-config="{ left: '1%', top: '30%', itemGap: 5 }"
|
||||
:series-data="legendData1"
|
||||
:beilv="beilv"
|
||||
:height="'220'"
|
||||
:height="226"
|
||||
/>
|
||||
</div>
|
||||
<div class="div-box" style="text-align: center;position:relative">
|
||||
<div class="div-box" :style="{textAlign: 'center', position: 'relative', padding: 8 * beilv + 'px', paddingTop: 15 * beilv + 'px', marginBottom: 12 * beilv + 'px'}">
|
||||
<span v-html="titleLeftSVG" />
|
||||
<span style="color: #01CFCC; font-size: 15px; line-height: 18px;">
|
||||
<span style="color: #01CFCC; line-height: 18px;" :style="{ fontSize: 15 * beilv + 'px' }">
|
||||
成品库存一览2
|
||||
</span>
|
||||
<div style="transform: rotateY(180deg); display: inline-block;" v-html="titleLeftSVG" />
|
||||
<new-bar
|
||||
:name-list="clNameList"
|
||||
:data-list="clDataList"
|
||||
:height="'220'"
|
||||
:height="226"
|
||||
:beilv="beilv"
|
||||
/>
|
||||
<div class="barDiv" :style="{width: 340* beilv + 'px'}" />
|
||||
<div class="barDiv" :style="{width: 345* beilv + 'px'}" />
|
||||
</div>
|
||||
<div class="div-box" style="text-align: center;">
|
||||
<div class="div-box" :style="{textAlign: 'center', padding: 8 * beilv + 'px', paddingTop: 15 * beilv + 'px'}">
|
||||
<span v-html="titleLeftSVG" />
|
||||
<span style="color: #01CFCC; font-size: 15px; line-height: 18px;">
|
||||
<span style="color: #01CFCC; line-height: 18px;" :style="{ fontSize: 15 * beilv + 'px' }">
|
||||
成品库存一览3
|
||||
</span>
|
||||
<div style="transform: rotateY(180deg); display: inline-block;" v-html="titleLeftSVG" />
|
||||
@ -144,7 +158,7 @@
|
||||
:legend-config="{ left: '1%', top: '30%', itemGap: 5 }"
|
||||
:series-data="legendData3"
|
||||
:beilv="beilv"
|
||||
:height="'220'"
|
||||
:height="226"
|
||||
/>
|
||||
</div>
|
||||
</base-container>
|
||||
@ -596,13 +610,13 @@ export default {
|
||||
background-size: cover;
|
||||
.container-title {
|
||||
width: 100%;
|
||||
background: url('../../assets/img/OperationalOverview/title.png') no-repeat;
|
||||
background: url('../../assets/img/OperationalOverview/title (2).png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
color: #00fff0;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
.title-button {
|
||||
color: #00fff0;
|
||||
font-size: 20px;
|
||||
font-size: 32px;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
@ -611,18 +625,12 @@ export default {
|
||||
}
|
||||
}
|
||||
.inTest {
|
||||
font-size: 1.2em;
|
||||
background: url('../../assets/img/OperationalOverview/矩形@2x.png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
padding: 5px 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.outTest {
|
||||
font-size: 1.2em;
|
||||
background: url('../../assets/img/OperationalOverview/矩形@2x(1).png') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
padding: 5px 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.leftText{
|
||||
display: inline-block;
|
||||
@ -636,10 +644,8 @@ export default {
|
||||
background: transparent;
|
||||
box-shadow: inset 0 0 16px 1px rgba(255, 255, 255, 0.5);
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
width: 100%;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.barDiv {
|
||||
height: 46px;
|
||||
|
Loading…
Reference in New Issue
Block a user