mt-fe-group/11-wms
12
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

更新驾驶舱 #10

Merged
zwq merged 1 commits from zwq into master 2022-11-08 16:09:28 +08:00
Conversation 0 Commits 1 Files Changed 5 +41 -35
5 changed files with 41 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 3ed9692541 - Show all commits

10
src/views/OperationalOverview/components/baseTable.vue
View File

@ -1,7 +1,7 @@
<!-- <!--
* @Date: 2020-12-14 09:07:03 * @Date: 2020-12-14 09:07:03
* @LastEditors: gtz * @LastEditors: zwq
* @LastEditTime: 2022-06-14 11:12:39 * @LastEditTime: 2022-11-08 15:30:44
* @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseTable.vue * @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseTable.vue
* @Description: * @Description:
--> -->
@ -9,7 +9,7 @@
<div class="visual-base-table-container"> <div class="visual-base-table-container">
<el-table <el-table
v-loading="isLoading" v-loading="isLoading"
:header-cell-style="{background:'rgba(79,114,136,0.29)',color:'#fff',height: 28 * beilv + 'px',lineHeight: 28 * beilv + 'px',padding: 0,fontSize: 12 * beilv + 'px'}" :header-cell-style="{background:'rgba(32, 55, 96, 0.5)',color:'#fff',height: 28 * beilv + 'px',lineHeight: 28 * beilv + 'px',padding: 0,fontSize: 12 * beilv + 'px'}"
:row-style="setRowStyle" :row-style="setRowStyle"
:data="renderData" :data="renderData"
border border
@ -111,7 +111,7 @@ export default {
setRowStyle(v) { setRowStyle(v) {
if (v.rowIndex % 2 === 0) { if (v.rowIndex % 2 === 0) {
return { return {
background: 'rgba(76,97,123,0.2)', background: 'rgba(14, 32, 62, 0.5)',
color: 'rgba(255,255,255,0.5)', color: 'rgba(255,255,255,0.5)',
height: 26 * this.beilv + 'px', height: 26 * this.beilv + 'px',
lineHeight: 26 * this.beilv + 'px', lineHeight: 26 * this.beilv + 'px',
@ -120,7 +120,7 @@ export default {
} }
} else { } else {
return { return {
background: 'rgba(79,114,136,0.29)', background: 'rgba(32, 55, 96, 0.5)',
color: 'rgba(255,255,255,0.5)', color: 'rgba(255,255,255,0.5)',
height: 26 * this.beilv + 'px', height: 26 * this.beilv + 'px',
lineHeight: 26 * this.beilv + 'px', lineHeight: 26 * this.beilv + 'px',

1
src/views/OperationalOverview/components/newBar.vue
View File

@ -175,7 +175,6 @@ export default {
] ]
} }
this.$nextTick(() => { this.$nextTick(() => {
console.log(this.series)
this.initChart() this.initChart()
}) })
}, },

8
src/views/OperationalOverview/components/newPie.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq * @Author: zwq
* @Date: 2022-01-21 14:43:06 * @Date: 2022-01-21 14:43:06
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2022-11-02 16:52:34 * @LastEditTime: 2022-11-08 15:09:11
* @Description: * @Description:
--> -->
<template> <template>
@ -112,14 +112,16 @@ export default {
rich: { rich: {
a: { a: {
align: 'center', align: 'center',
fontSize: 10, fontSize: 13,
color: 'rgba(255, 255, 255, 0.7)', color: 'rgba(255, 255, 255, 0.7)',
padding: [0, 4],
lineHeight: 16 lineHeight: 16
}, },
b: { b: {
// verticalAlign: 'top', // verticalAlign: 'top',
align: 'center', align: 'center',
fontSize: 10, padding: [0, 4],
fontSize: 13,
color: 'rgba(255, 255, 255)' color: 'rgba(255, 255, 255)'
}, },
c: { c: {

41
src/views/OperationalOverview/components/storageCockpitArea.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq * @Author: zwq
* @Date: 2020-12-29 16:37:56 * @Date: 2020-12-29 16:37:56
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2022-11-03 08:58:07 * @LastEditTime: 2022-11-08 16:06:39
* @Description: * @Description:
--> -->
<template> <template>
@ -10,20 +10,31 @@
<div <div
v-for="i in areaArr" v-for="i in areaArr"
:key="i" :key="i"
:style="{ height: 135 * beilv + 'px', marginTop: 11 * beilv + 'px' }" :style="{ height: 135 * beilv + 'px',width: 730 * beilv + 'px', marginTop: 11 * beilv + 'px' }"
class="area" class="area"
> >
<el-row> <el-row>
<el-col :span="1"><div class="areaName">{{ i }}</div></el-col> <el-col :span="1">
<div class="areaName" :style="{ fontSize: 24 * beilv + 'px',lineHeight: 40 * beilv + 'px', marginTop: 20 * beilv + 'px' }">{{ i }}</div>
</el-col>
<el-col :span="23"> <el-col :span="23">
<div class="locationFlex"> <div class="locationFlex">
<div <div
v-for="l in 72" v-for="l in 72"
:key="l" :key="l"
:class="l>Math.round(Math.random()*100)?'waring':''" :class="l > Math.round(Math.random() * 100) ? 'waring' : ''"
:style="{ marginRight: 6 * beilv + 'px',marginTop: 2 * beilv + 'px',marginBottom: 1 * beilv + 'px',width: 30 * beilv + 'px',height: 28 * beilv + 'px'}" :style="{
marginRight: 6 * beilv + 'px',
marginTop: 2 * beilv + 'px',
marginBottom: 1 * beilv + 'px',
height: 28 * beilv + 'px',
lineHeight: 28 * beilv + 'px',
fontSize: 12 * beilv + 'px'
}"
class="location" class="location"
>{{ l }}</div> >
{{ l }}
</div>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
@ -53,33 +64,29 @@ export default {
<style scoped> <style scoped>
.area { .area {
background-image: linear-gradient(to right, rgba(59, 76, 118,0.6), transparent); background-image: linear-gradient(to right, rgba(59, 76, 118, 0.6), transparent);
background-size: 100% 100%; background-size: 100% 100%;
padding: 5px 0; padding: 5px 0;
padding-left: 15px; padding-left: 15px;
text-align: center; text-align: center;
border-radius: 4px; border-radius: 4px;
border: 1px dotted #5EC3D8; border: 1px dotted #5ec3d8;
} }
.areaName { .areaName {
margin-top: 100%;
font-weight: 600; font-weight: 600;
font-size: 24px;
line-height: 30px;
} }
.locationFlex{ .locationFlex {
margin-left: 25px; margin-left: 25px;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
align-content: space-between; align-content: space-between;
} }
.location{ .location {
background: #63cf74; background: #63cf74;
width: 4.5%;
border-radius: 4px; border-radius: 4px;
font-size: 12px;
line-height: 25px;
} }
.waring{ .waring {
background: #FF5D6B; background: #ff5d6b;
} }
</style> </style>

16
src/views/OperationalOverview/storageCockpit.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq * @Author: zwq
* @Date: 2021-07-19 15:18:30 * @Date: 2021-07-19 15:18:30
* @LastEditors: zwq * @LastEditors: zwq
* @LastEditTime: 2022-11-03 16:03:03 * @LastEditTime: 2022-11-08 15:50:35
* @Description: * @Description:
--> -->
<template> <template>
@ -20,7 +20,7 @@
<el-button <el-button
type="text" type="text"
class="title-button" class="title-button"
:style="{ right: 33 * beilv + 'px', top: 37 * beilv + 'px' }" :style="{ right: 9 * beilv + 'px', top: 37 * beilv + 'px',fontSize: 35 * beilv + 'px' }"
@click="changeFullScreen" @click="changeFullScreen"
> >
<svg-icon v-if="isFullScreen" icon-class="unFullScreenView" /> <svg-icon v-if="isFullScreen" icon-class="unFullScreenView" />
@ -126,7 +126,7 @@
<new-pie <new-pie
:id="'pie-chart1'" :id="'pie-chart1'"
:show-center-title="true" :show-center-title="true"
:legend-config="{ left: '1%', top: '30%', itemGap: 5 }" :legend-config="{ left: '2%', top: '30%', itemGap: 10 }"
:series-data="legendData1" :series-data="legendData1"
:beilv="beilv" :beilv="beilv"
:height="226" :height="226"
@ -144,7 +144,7 @@
:height="226" :height="226"
:beilv="beilv" :beilv="beilv"
/> />
<div class="barDiv" :style="{width: 345* beilv + 'px'}" /> <div class="barDiv" :style="{width: 355* beilv + 'px'}" />
</div> </div>
<div class="div-box" :style="{textAlign: 'center', padding: 8 * beilv + 'px', paddingTop: 15 * beilv + 'px'}"> <div class="div-box" :style="{textAlign: 'center', padding: 8 * beilv + 'px', paddingTop: 15 * beilv + 'px'}">
<span v-html="titleLeftSVG" /> <span v-html="titleLeftSVG" />
@ -155,7 +155,7 @@
<new-pie <new-pie
:id="'pie-chart3'" :id="'pie-chart3'"
:show-center-title="true" :show-center-title="true"
:legend-config="{ left: '1%', top: '30%', itemGap: 5 }" :legend-config="{ left: '2%', top: '30%', itemGap: 10 }"
:series-data="legendData3" :series-data="legendData3"
:beilv="beilv" :beilv="beilv"
:height="226" :height="226"
@ -616,7 +616,6 @@ export default {
text-align: center; text-align: center;
.title-button { .title-button {
color: #00fff0; color: #00fff0;
font-size: 32px;
position: absolute; position: absolute;
} }
} }
@ -634,7 +633,7 @@ export default {
} }
.leftText{ .leftText{
display: inline-block; display: inline-block;
width: 100px; width: 40%;
text-align: right; text-align: right;
} }
.rightText{ .rightText{
@ -648,14 +647,13 @@ export default {
border-radius: 4px; border-radius: 4px;
} }
.barDiv { .barDiv {
height: 46px; height: 40px;
opacity: 0.5; opacity: 0.5;
position: absolute; position: absolute;
bottom: 40px; bottom: 40px;
left:55px; left:55px;
transform: skewX(-30deg); transform: skewX(-30deg);
background: linear-gradient(180deg, rgba(59, 76, 118, 0) 0%, #49fbd6 100%); background: linear-gradient(180deg, rgba(59, 76, 118, 0) 0%, #49fbd6 100%);
border: 1px solid #3c7080;
} }
.now-team-title { .now-team-title {
margin: 0; margin: 0;