|
@@ -1,67 +1,46 @@
|
|
<template>
|
|
<template>
|
|
- <div class="padding">
|
|
|
|
- <el-row :gutter="12">
|
|
|
|
|
|
+ <div class="padding-lg">
|
|
|
|
+ <el-row :gutter="20">
|
|
<el-col :xl="6" :lg="6" :md="6" :sm="24" :xs="24">
|
|
<el-col :xl="6" :lg="6" :md="6" :sm="24" :xs="24">
|
|
- <el-card class="box-card cardSty" :body-style="{ padding: '10px !important' }">
|
|
|
|
- <div class="titleSty">轴功率仪</div>
|
|
|
|
- <el-row :gutter="12" class="text-center">
|
|
|
|
- <template v-for="(item,index) in shaftMeter" :key="index">
|
|
|
|
- <el-col :xl="8" :lg="8" :md="8" :sm="24" :xs="24">
|
|
|
|
- <gaugeChart :name="item.name" :data="item" height="calc(29vh - 118px)"/>
|
|
|
|
- <div class="titleSty text-ngreen">{{item.title}}</div>
|
|
|
|
- </el-col>
|
|
|
|
- </template>
|
|
|
|
- </el-row>
|
|
|
|
- </el-card>
|
|
|
|
- <el-card class="box-card cardSty margin-tb-sm" :body-style="{ padding: '10px !important' }">
|
|
|
|
- <div class="grid col-4">
|
|
|
|
- <div class="flex align-center" style="height: calc(51vh - 75px);position: relative;"
|
|
|
|
- v-for="(pitem,pndex) in typeData.oilsProg" :key="pndex">
|
|
|
|
- <div class="shTitleSty">{{pitem.name}}</div>
|
|
|
|
- <div style="margin-top:calc(46vh - 100px);" >
|
|
|
|
- <div style="transform: rotate(-90deg);transform-origin: left center;margin-left: 20px;">
|
|
|
|
- <el-progress
|
|
|
|
- :show-text="false"
|
|
|
|
- color="#c8753b"
|
|
|
|
- style="width: calc(46vh - 100px);"
|
|
|
|
- :stroke-width="12"
|
|
|
|
- :percentage="pitem.value"></el-progress>
|
|
|
|
- </div>
|
|
|
|
- <div class="text-xl text-ngreen">{{pitem.value}}{{pitem.unit}}</div>
|
|
|
|
|
|
+ <el-card class="box-card cardSty" :body-style="{ padding: '10px 20px !important' }">
|
|
|
|
+ <div class="grid col-3">
|
|
|
|
+ <div v-for="(stem,sndex) in sailForm" :key="sndex">
|
|
|
|
+ <div class="titleSty">{{stem.name}}</div>
|
|
|
|
+ <div style="height: calc(14vh - 72px);line-height: calc(14vh - 72px);">
|
|
|
|
+ <span class="text-bold text-purple" style="font-size: 1.8rem;">{{stem.value}}</span> {{stem.unit}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-card>
|
|
|
|
+ <el-card class="box-card cardSty margin-tb" :body-style="{ padding: '10px !important' }">
|
|
|
|
+ <div class="titleSty padding-left-sm">燃油日消耗量</div>
|
|
|
|
+ <line-chart name="dayFuelConsu" :data="dayFuelData" height="calc(23vh - 84px)"/>
|
|
|
|
+ </el-card>
|
|
<el-card class="box-card cardSty" :body-style="{ padding: '10px !important' }">
|
|
<el-card class="box-card cardSty" :body-style="{ padding: '10px !important' }">
|
|
- <div class="grid col-2">
|
|
|
|
- <div v-for="(item,index) in typeData.oilsForm" :key="index">
|
|
|
|
- <div class="titleSty">{{ item.name }}</div>
|
|
|
|
- <div style="height: calc(20vh - 87px);" class="flex align-center text-bold text-ngreen">
|
|
|
|
- <svg-icon style="font-size: 2.2rem;" class="text-white margin-right-xs" :icon-class="item.icon"/>
|
|
|
|
- <template v-for="(sitem,sindex) in getValue(item.value)" :key="sindex">
|
|
|
|
- <span class="margin-right-xs txtSty">{{sitem}}</span>
|
|
|
|
- </template>
|
|
|
|
- <span>{{ item.unit }}</span>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <div class="titleSty padding-left-sm">燃油小时消耗量</div>
|
|
|
|
+ <line-chart name="hourFuelConsu" :data="hourFuelData" height="calc(23vh - 84px)"/>
|
|
|
|
+ </el-card>
|
|
|
|
+ <el-card class="box-card cardSty margin-top" :body-style="{ padding: '10px !important' }">
|
|
|
|
+ <bar-chart name="compFuel" :data="compFuelData" height="calc(40vh - 89px)"/>
|
|
</el-card>
|
|
</el-card>
|
|
</el-col>
|
|
</el-col>
|
|
<el-col :xl="13" :lg="13" :md="13" :sm="24" :xs="24">
|
|
<el-col :xl="13" :lg="13" :md="13" :sm="24" :xs="24">
|
|
<!-- 航速航向 -->
|
|
<!-- 航速航向 -->
|
|
- <el-card class="box-card cardSty" :body-style="{ height: 'calc(14.5vh - 20px)',padding: '10px !important' }">
|
|
|
|
- <div class="grid col-4 text-ngreen">
|
|
|
|
|
|
+ <el-card class="box-card cardSty" :body-style="{ padding: '10px !important' }">
|
|
|
|
+ <div class="grid col-4 text-purple">
|
|
<div v-for="(aitem,andex) in aisForm" :key="andex">
|
|
<div v-for="(aitem,andex) in aisForm" :key="andex">
|
|
- <div class="titleSty">{{aitem.name}}:</div>
|
|
|
|
- <div style="height: calc(14.5vh - 74px);line-height: calc(13.5vh - 74px);" class="text-center text-bold text-xl">
|
|
|
|
|
|
+ <div class="titleSty">{{aitem.name}}</div>
|
|
|
|
+ <div style="height: calc(14vh - 72px);line-height: calc(14vh - 72px);font-size: 1.8rem;" class="text-center text-bold text-purple">
|
|
{{aitem.value}}{{aitem.unit}}
|
|
{{aitem.value}}{{aitem.unit}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-card>
|
|
- <el-card class="box-card cardSty margin-tb-sm" :body-style="{ height: 'calc(70vh - 84px)',padding: '10px !important' }">
|
|
|
|
- 嗨咦
|
|
|
|
|
|
+ <!-- 地图 -->
|
|
|
|
+ <el-card class="box-card cardSty margin-tb" :body-style="{ height: 'calc(70.5vh - 96px)',padding: '0 !important' }">
|
|
|
|
+ <ship-map/>
|
|
</el-card>
|
|
</el-card>
|
|
|
|
+ <!-- 碳排放 -->
|
|
<el-card class="box-card cardSty" :body-style="{ padding: '10px !important' }">
|
|
<el-card class="box-card cardSty" :body-style="{ padding: '10px !important' }">
|
|
<div class="flex align-center" style="height: 100%;">
|
|
<div class="flex align-center" style="height: 100%;">
|
|
<div class="shTitleSty">碳排放</div>
|
|
<div class="shTitleSty">碳排放</div>
|
|
@@ -69,10 +48,7 @@
|
|
<div v-for="(citem,cndex) in coForm" :key="cndex">
|
|
<div v-for="(citem,cndex) in coForm" :key="cndex">
|
|
<div class="titleSty">{{citem.name}}</div>
|
|
<div class="titleSty">{{citem.name}}</div>
|
|
<div style="height: calc(15.5vh - 72px);line-height: calc(15.5vh - 72px);"
|
|
<div style="height: calc(15.5vh - 72px);line-height: calc(15.5vh - 72px);"
|
|
- class="text-center text-bold text-xl text-ngreen">
|
|
|
|
- <svg-icon v-if="citem.icon"
|
|
|
|
- style="font-size: 2.2rem;vertical-align: middle;"
|
|
|
|
- class="text-white margin-right" :icon-class="citem.icon"/>
|
|
|
|
|
|
+ class="text-center text-bold text-xxl text-purple">
|
|
<span>{{citem.value}}{{citem.unit}}</span>
|
|
<span>{{citem.value}}{{citem.unit}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@@ -81,67 +57,92 @@
|
|
</el-card>
|
|
</el-card>
|
|
</el-col>
|
|
</el-col>
|
|
<el-col :xl="5" :lg="5" :md="5" :sm="24" :xs="24">
|
|
<el-col :xl="5" :lg="5" :md="5" :sm="24" :xs="24">
|
|
|
|
+ <!-- 消耗量 -->
|
|
<el-card class="box-card cardSty" :body-style="{ padding: '10px !important' }">
|
|
<el-card class="box-card cardSty" :body-style="{ padding: '10px !important' }">
|
|
|
|
+ <div class="grid col-2 text-center">
|
|
|
|
+ <div v-for="(otem,ondex) in oilsForm" :key="ondex">
|
|
|
|
+ <div class="titleSty">{{otem.name}}</div>
|
|
|
|
+ <div style="height: calc(14vh - 72px);line-height: calc(14vh - 72px);" class="text-bold text-xxl text-purple">
|
|
|
|
+ <span>{{otem.value}} {{otem.unit}}</span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </el-card>
|
|
|
|
+ <!-- 风速、风向 -->
|
|
|
|
+ <el-card class="box-card cardSty margin-tb" :body-style="{ padding: '10px !important' }">
|
|
<div class="grid col-2">
|
|
<div class="grid col-2">
|
|
<div v-for="(witem,wndex) in windForm" :key="wndex">
|
|
<div v-for="(witem,wndex) in windForm" :key="wndex">
|
|
- <div class="titleSty text-ngreen">{{witem.name}}</div>
|
|
|
|
- <div style="height: calc(14.5vh - 72px);line-height: calc(13.5vh - 72px);" class="text-center text-bold text-xl">
|
|
|
|
|
|
+ <div class="titleSty">{{witem.name}}</div>
|
|
|
|
+ <div style="height: calc(14vh - 76px);line-height: calc(14vh - 72px);" class="text-center text-bold text-xl">
|
|
<div>
|
|
<div>
|
|
- <svg-icon :icon-class="witem.icon" style="font-size: 2rem;vertical-align: middle;" class="margin-right-sm"></svg-icon>
|
|
|
|
- <span>{{witem.value}} {{witem.unit}}</span>
|
|
|
|
|
|
+ <svg-icon :icon-class="witem.icon" style="font-size: 2.8rem;vertical-align: middle;" class="margin-right-sm text-purple"></svg-icon>
|
|
|
|
+ <span class="text-bold text-xxl">{{witem.value}}</span>
|
|
|
|
+ <span>{{witem.unit}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-card>
|
|
- <el-card class="box-card cardSty margin-tb-sm" :body-style="{ padding: '5px 10px !important' }">
|
|
|
|
- <div style="height: calc(25vh - 30px);" class="flex align-center">
|
|
|
|
|
|
+ <!-- 船舶吃水 -->
|
|
|
|
+ <el-card class="box-card cardSty" :body-style="{ padding: '5px 10px !important' }">
|
|
|
|
+ <div style="height: calc(21vh - 52px);" class="flex align-center">
|
|
<div style="width: 20%;"><div class="shTitleSty">船舶吃水</div></div>
|
|
<div style="width: 20%;"><div class="shTitleSty">船舶吃水</div></div>
|
|
<div style="width: 80%;height: 100%;">
|
|
<div style="width: 80%;height: 100%;">
|
|
- <div class="flex align-center text-center" style="height: 33.33%;"
|
|
|
|
|
|
+ <div class="flex align-center text-center" style="height: 50%;"
|
|
v-for="(dtem,dndex) in dritForm" :key="dndex">
|
|
v-for="(dtem,dndex) in dritForm" :key="dndex">
|
|
- <div class="text-bold text-xl text-ngreen flex-sub">
|
|
|
|
|
|
+ <div class="text-bold text-xxl text-purple flex-sub">
|
|
{{dtem.value1}}{{dtem.unit}}
|
|
{{dtem.value1}}{{dtem.unit}}
|
|
</div>
|
|
</div>
|
|
<div class="flex-sub">
|
|
<div class="flex-sub">
|
|
- <svg-icon :icon-class="dtem.icon" style="font-size: 2.6rem;"></svg-icon>
|
|
|
|
|
|
+ <svg-icon :icon-class="dtem.icon" style="font-size: 2.8rem;"></svg-icon>
|
|
</div>
|
|
</div>
|
|
<div class="flex-sub">
|
|
<div class="flex-sub">
|
|
- <span class="text-sm" v-if="isNaN(parseFloat(dtem.value2))">{{dtem.value2}}</span>
|
|
|
|
- <span class="text-bold text-xl text-ngreen" v-else>{{dtem.value2}}{{dtem.unit}}</span>
|
|
|
|
|
|
+ <span class="text-bold text-xxl text-purple">{{dtem.value2}}{{dtem.unit}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-card>
|
|
- <el-card class="box-card cardSty" :body-style="{ padding: '10px !important' }">
|
|
|
|
- <div style="height: calc(10.75vh - 22px);" class="flex align-center"
|
|
|
|
|
|
+ <!-- 横倾、纵倾 -->
|
|
|
|
+ <el-card class="box-card cardSty margin-tb" :body-style="{ padding: '10px !important' }">
|
|
|
|
+ <div style="height: calc(10.5vh - 33px);" class="flex align-center"
|
|
v-for="(htem,hndex) in tiltForm" :key="hndex">
|
|
v-for="(htem,hndex) in tiltForm" :key="hndex">
|
|
<div style="width: 20%;"><div class="shTitleSty">{{htem.name}}</div></div>
|
|
<div style="width: 20%;"><div class="shTitleSty">{{htem.name}}</div></div>
|
|
<div class="flex align-center justify-around" style="width: 80%;">
|
|
<div class="flex align-center justify-around" style="width: 80%;">
|
|
- <div class="text-bold text-xl text-ngreen">
|
|
|
|
|
|
+ <div class="text-bold text-xxl text-purple">
|
|
{{htem.type == "left"?"-":"+"}}{{htem.value}}{{htem.unit}}
|
|
{{htem.type == "left"?"-":"+"}}{{htem.value}}{{htem.unit}}
|
|
</div>
|
|
</div>
|
|
<div :style="{ transform: 'rotate('+(htem.type == 'left'?htem.value:'-'+htem.value)+'deg)','transform-origin': 'center' }">
|
|
<div :style="{ transform: 'rotate('+(htem.type == 'left'?htem.value:'-'+htem.value)+'deg)','transform-origin': 'center' }">
|
|
- <svg-icon :icon-class="htem.icon" style="font-size: 3.2rem;"></svg-icon>
|
|
|
|
|
|
+ <svg-icon :icon-class="htem.icon" style="font-size: 2.8rem;"></svg-icon>
|
|
</div>
|
|
</div>
|
|
- <div class="text-bold text-xl text-ngreen">
|
|
|
|
|
|
+ <div class="text-bold text-xxl text-purple">
|
|
{{htem.type == "left"?"+":"-"}}{{htem.value}}{{htem.unit}}
|
|
{{htem.type == "left"?"+":"-"}}{{htem.value}}{{htem.unit}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-card>
|
|
- <el-card class="box-card cardSty margin-tb-sm"
|
|
|
|
- :body-style="{ height: 'calc(14.5vh - 22px)',padding: '10px !important' }">
|
|
|
|
- <div class="flex flex-direction justify-around" style="height: 100%;">
|
|
|
|
- <div class="text-ngreen text-bold"><span class="inblock" style="width: 30%;">纬度</span><span>33°05678E</span></div>
|
|
|
|
- <div class="text-ngreen text-bold"><span class="inblock" style="width: 30%;">经度</span><span>113°56243N</span></div>
|
|
|
|
|
|
+ <!-- 富余水深、状态 -->
|
|
|
|
+ <el-card class="box-card cardSty" :body-style="{ padding: '10px 14px !important' }">
|
|
|
|
+ <div style="height: calc(10.5vh - 33px);" class="flex align-center text-center"
|
|
|
|
+ v-for="(wtem,hndex) in waterDepth" :key="hndex">
|
|
|
|
+ <div class="text-bold text-df flex-sub text-left">
|
|
|
|
+ {{wtem.name}}
|
|
|
|
+ </div>
|
|
|
|
+ <div class=" flex-sub">
|
|
|
|
+ <svg-icon :icon-class="wtem.icon" style="font-size: 2.8rem;"></svg-icon>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="text-bold text-xl text-purple flex-sub">
|
|
|
|
+ <span class="text-xxl" v-if="isNaN(parseFloat(wtem.value))">{{wtem.value}}</span>
|
|
|
|
+ <span class="text-xxl" v-else>{{wtem.value}}{{wtem.unit}}</span>
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-card>
|
|
- <el-card class="box-card cardSty" :body-style="{ height: 'calc(22.5vh - 48px)',padding: '10px !important' }">
|
|
|
|
- <div class="text-ngreen text-bold">提示:</div>
|
|
|
|
- <div class="flex justify-center align-center text-ngreen text-xxl" style="height:calc(100% - 40px);">
|
|
|
|
- 目前一切正常
|
|
|
|
|
|
+ <!-- 经纬度 -->
|
|
|
|
+ <el-card class="box-card cardSty margin-top"
|
|
|
|
+ :body-style="{ height: 'calc(9vh - 9px)',padding: '10px !important' }">
|
|
|
|
+ <div class="flex justify-around align-center text-bold text-bGray" style="height: 100%;">
|
|
|
|
+ <div><span>纬度</span><span class="text-purple text-xl margin-left">33°05678E</span></div>
|
|
|
|
+ <div><span>经度</span><span class="text-purple text-xl margin-left">113°56243N</span></div>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
</el-card>
|
|
</el-col>
|
|
</el-col>
|
|
@@ -150,8 +151,9 @@
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
- import { getManyShip } from "@/api/shipxy";
|
|
|
|
- import gaugeChart from "@/components/Echarts/gaugeChart";
|
|
|
|
|
|
+ import lineChart from "@/components/Echarts/LineChart";
|
|
|
|
+ import BarChart from "@/components/Echarts/BarChart";
|
|
|
|
+ import shipMap from "@/components/Map/ShipList/index";
|
|
const typeData = computed(() => {
|
|
const typeData = computed(() => {
|
|
return {
|
|
return {
|
|
oilsForm: 1 == 1?[{
|
|
oilsForm: 1 == 1?[{
|
|
@@ -211,6 +213,69 @@
|
|
}
|
|
}
|
|
});
|
|
});
|
|
const data = reactive({
|
|
const data = reactive({
|
|
|
|
+ sailForm: [{
|
|
|
|
+ name: "轴转速",
|
|
|
|
+ value: 270,
|
|
|
|
+ unit: "KN*m"
|
|
|
|
+ },{
|
|
|
|
+ name: "轴功率",
|
|
|
|
+ value: 25,
|
|
|
|
+ unit: "Kw"
|
|
|
|
+ },{
|
|
|
|
+ name: "扭矩",
|
|
|
|
+ value: 25,
|
|
|
|
+ unit: "r/min"
|
|
|
|
+ }],
|
|
|
|
+ dayFuelData: {
|
|
|
|
+ name: "",
|
|
|
|
+ xAxis: ["1", "2", "3", "4", "5", "6"],
|
|
|
|
+ data: [{
|
|
|
|
+ name: '燃油日消耗量',
|
|
|
|
+ type: 'line',
|
|
|
|
+ stack: 'Total',
|
|
|
|
+ unit: "L",
|
|
|
|
+ smooth: true,
|
|
|
|
+ data: [15.3, 26.1, 14.1, 16.1, 13.1, 16.4]
|
|
|
|
+ }]
|
|
|
|
+ },
|
|
|
|
+ hourFuelData: {
|
|
|
|
+ name: "",
|
|
|
|
+ xAxis: ["09:00", "10:00", "11:00", "1200", "13:00", "14:00"],
|
|
|
|
+ data: [{
|
|
|
|
+ name: '燃油小时消耗量',
|
|
|
|
+ type: 'line',
|
|
|
|
+ stack: 'Total',
|
|
|
|
+ unit: "L",
|
|
|
|
+ smooth: true,
|
|
|
|
+ data: [15.3, 26.1, 14.1, 16.1, 13.1, 16.4]
|
|
|
|
+ }]
|
|
|
|
+ },
|
|
|
|
+ compFuelData: {
|
|
|
|
+ name: "",
|
|
|
|
+ xAxis: ["一月", "二月", "三月", "四月", "五月", "六月"],
|
|
|
|
+ data: [{
|
|
|
|
+ name: '单位运输功燃油消耗量',
|
|
|
|
+ type: 'bar',
|
|
|
|
+ color: "#009dff",
|
|
|
|
+ data: [15.3, 26.1, 14.1, 16.1, 13.1, 16.4]
|
|
|
|
+ },{
|
|
|
|
+ name: '单位航行距离燃油消耗量',
|
|
|
|
+ type: 'bar',
|
|
|
|
+ color: "#22e4ff",
|
|
|
|
+ data: [10, 14, 18, 19, 13, 10]
|
|
|
|
+ }],
|
|
|
|
+ },
|
|
|
|
+ oilsForm: [{
|
|
|
|
+ name: "燃油航次消耗量",
|
|
|
|
+ value: 44,
|
|
|
|
+ unit: "L",
|
|
|
|
+ icon: "jiayouzhan_1"
|
|
|
|
+ },{
|
|
|
|
+ name: "年度总燃料消耗量",
|
|
|
|
+ value: 25,
|
|
|
|
+ unit: "L",
|
|
|
|
+ icon: "jiayouzhan"
|
|
|
|
+ }],
|
|
windForm: [{
|
|
windForm: [{
|
|
name: "风速",
|
|
name: "风速",
|
|
value: 12.5,
|
|
value: 12.5,
|
|
@@ -243,8 +308,7 @@
|
|
coForm: [{
|
|
coForm: [{
|
|
name: "单位航行距离CO2排放量",
|
|
name: "单位航行距离CO2排放量",
|
|
value: 217,
|
|
value: 217,
|
|
- unit: "t",
|
|
|
|
- icon: "CO2nongdu"
|
|
|
|
|
|
+ unit: "t"
|
|
},{
|
|
},{
|
|
name: "单位运输功CO2排放量",
|
|
name: "单位运输功CO2排放量",
|
|
value: 27,
|
|
value: 27,
|
|
@@ -263,7 +327,7 @@
|
|
value: 7,
|
|
value: 7,
|
|
type: "left",
|
|
type: "left",
|
|
unit: "°",
|
|
unit: "°",
|
|
- icon: "a-jizhuangxiangchuanxin"
|
|
|
|
|
|
+ icon: "hengqin"
|
|
},{
|
|
},{
|
|
name: "纵倾",
|
|
name: "纵倾",
|
|
value: 5,
|
|
value: 5,
|
|
@@ -278,17 +342,22 @@
|
|
unit: "M",
|
|
unit: "M",
|
|
icon: "inclination"
|
|
icon: "inclination"
|
|
},{
|
|
},{
|
|
- name: "纵倾",
|
|
|
|
|
|
+ name: "",
|
|
value1: 8,
|
|
value1: 8,
|
|
value2: 8,
|
|
value2: 8,
|
|
unit: "M",
|
|
unit: "M",
|
|
- icon: "a-jizhuangxiangchuanxin"
|
|
|
|
- },{
|
|
|
|
- name: "纵倾",
|
|
|
|
- value1: 27,
|
|
|
|
- value2: "富余水深",
|
|
|
|
|
|
+ icon: "hengqin"
|
|
|
|
+ }],
|
|
|
|
+ waterDepth: [{
|
|
|
|
+ name: "富余水深",
|
|
|
|
+ value: 27,
|
|
unit: "M",
|
|
unit: "M",
|
|
- icon: "draft"
|
|
|
|
|
|
+ icon: "lunchuan"
|
|
|
|
+ },{
|
|
|
|
+ name: "船舶状态",
|
|
|
|
+ value: "航行",
|
|
|
|
+ unit: "",
|
|
|
|
+ icon: "shipsaili"
|
|
}],
|
|
}],
|
|
shaftMeter: [{
|
|
shaftMeter: [{
|
|
title: "轴转速",
|
|
title: "轴转速",
|
|
@@ -313,7 +382,21 @@
|
|
unit: "r/min"
|
|
unit: "r/min"
|
|
}]
|
|
}]
|
|
});
|
|
});
|
|
- const { aisForm, oilsForm, coForm, oilsProg, windForm, dritForm, tiltForm, shaftMeter } = toRefs(data);
|
|
|
|
|
|
+ const {
|
|
|
|
+ aisForm,
|
|
|
|
+ oilsForm,
|
|
|
|
+ coForm,
|
|
|
|
+ oilsProg,
|
|
|
|
+ windForm,
|
|
|
|
+ dritForm,
|
|
|
|
+ tiltForm,
|
|
|
|
+ shaftMeter,
|
|
|
|
+ waterDepth,
|
|
|
|
+ sailForm,
|
|
|
|
+ dayFuelData,
|
|
|
|
+ hourFuelData,
|
|
|
|
+ compFuelData
|
|
|
|
+ } = toRefs(data);
|
|
const getValue = function(value){
|
|
const getValue = function(value){
|
|
return (value+"").split("")
|
|
return (value+"").split("")
|
|
}
|
|
}
|
|
@@ -322,7 +405,7 @@
|
|
<style scoped lang="scss">
|
|
<style scoped lang="scss">
|
|
|
|
|
|
.shTitleSty{
|
|
.shTitleSty{
|
|
- font-size: 0.9rem;
|
|
|
|
|
|
+ font-size: 1rem;
|
|
font-weight: bold;
|
|
font-weight: bold;
|
|
writing-mode: vertical-rl;
|
|
writing-mode: vertical-rl;
|
|
letter-spacing: 6px;
|
|
letter-spacing: 6px;
|