145 lines
3.0 KiB
Vue
145 lines
3.0 KiB
Vue
<template>
|
||
<div>
|
||
<div class="divRowQC">
|
||
<lable class="lbNoQC">{{data.bikeCode}}</lable>
|
||
<label v-for="(item,index) in data.arrTag" :key="index" :class="getTagClass(item.type)">
|
||
{{item.title}}
|
||
</label>
|
||
|
||
</div>
|
||
<div class="divRowQC" style="color:#adb3b3;font-size: 14px;">
|
||
电量刷新时间：{{data.time}}
|
||
</div>
|
||
<div class="divRowQC" style="display:flex;justify-content: space-between;font-size: 14px;">
|
||
|
||
<label>
|
||
<label :style="{color:data.color}">
|
||
<uni-icons custom-prefix="iconfont" :type="data.icon" :color="data.color" :size="iconsize" />
|
||
{{data.soc}}%
|
||
</label>
|
||
<lable style="color: #00C57C;margin-left: 10px;">
|
||
(
|
||
<label>
|
||
<uni-icons custom-prefix="iconfont" type="icon-ebikecheliangguanli" color="#00C57C" />
|
||
</label>
|
||
<label>{{data.distance}}</label>
|
||
)
|
||
|
||
</lable>
|
||
</label>
|
||
<div style="background-color:#E2F8FF;border-radius:15px;padding: 3px 15px;">
|
||
<label>
|
||
<uni-icons custom-prefix="iconfont" type="icon-ebikeyinlianglabashengyin" color="#0084FF"
|
||
size="16" />
|
||
</label>
|
||
<label style="color: #0084FF;" @click="checkecu('findEbike')">寻车铃</label>
|
||
</div>
|
||
</div>
|
||
<div style="margin-top:15px;display:flex;justify-content:space-between;">
|
||
<label class="divBtnBlue" @click="openBikeInfo">车辆详情</label>
|
||
<label class="divBtnBlue" @click="checkecu('openBatteryLock')">电池开仓</label>
|
||
<label class="divBtnBlue" @click="changeBatteries">完成换电</label>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
</template>
|
||
|
||
<script setup>
|
||
import * as api from "@/utils/api.js";
|
||
import {
|
||
ref
|
||
} from 'vue';
|
||
const props = defineProps(["data"]);
|
||
//查看车辆信息
|
||
function openBikeInfo() {
|
||
const {
|
||
bikeId,
|
||
ecuId,
|
||
ecuSn
|
||
} = props.data;
|
||
const url = `/pages/devops/ebikeinfo/ebikeinfo?bikeId=${bikeId}&ecuId=${ecuId}&ecuSn=${ecuSn}`;
|
||
uni.navigateTo({
|
||
url: url
|
||
})
|
||
}
|
||
|
||
function getTagClass(type) {
|
||
let tagclass = "lbTag";
|
||
switch (type) {
|
||
case "red":
|
||
tagclass += " lbTagRed";
|
||
break;
|
||
case "green":
|
||
tagclass += " lbTagGreen";
|
||
break;
|
||
}
|
||
return tagclass;
|
||
}
|
||
|
||
//中控操作
|
||
function checkecu (url) {
|
||
const {
|
||
ecuId,
|
||
bikeId
|
||
} = props.data;
|
||
if (!ecuId) {
|
||
showModelMessage("请先扫码车辆编号！");
|
||
return;
|
||
}
|
||
api.callCoreApi(url, {
|
||
ecuId,
|
||
bikeId
|
||
}, 'get').then(res => {
|
||
const {
|
||
code,
|
||
message
|
||
} = res;
|
||
showModelMessage(message);
|
||
})
|
||
}
|
||
|
||
//完成换电
|
||
function changeBattery() {
|
||
showModelMessage("该功能暂未实现！");
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.divBtnBlue {
|
||
background-color: #0084FF;
|
||
color: white;
|
||
border-radius: 5px;
|
||
padding: 5px 15px;
|
||
font-size: 14px;
|
||
}
|
||
|
||
.divRowQC {
|
||
line-height: 25px;
|
||
}
|
||
|
||
.lbNoQC {
|
||
font-size: 14px;
|
||
color: #000;
|
||
margin-left: 3px;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.lbTag {
|
||
padding: 3px 10px;
|
||
font-size: 12px;
|
||
border-radius: 15px;
|
||
margin-left: 5px;
|
||
|
||
}
|
||
|
||
.lbTagGreen {
|
||
color: #1DD950;
|
||
background-color: #E8F9E6;
|
||
}
|
||
|
||
.lbTagRed {
|
||
color: #F98F93;
|
||
background-color: #FFECED;
|
||
}
|
||
</style> |