84 lines
2.1 KiB
Vue
Raw Normal View History

2025-04-28 15:37:57 +08:00
<template>
<div style="padding: 20px 10px 10px 10px;background-color: white;">
<div style="position:absolute;right:0px;top: -7px;" @click="$emit('close')">
<uni-icons custom-prefix="iconfont" type="icon-ebikeguanbi" size="20" color="#777777" />
</div>
<div class="divRow" style="justify-content: space-between !important;">
<div style="font-size:14px;font-weight: bolder;">
{{data.bikeCode}}
</div>
<div>
<label>状态</label>
<label class="lbImg"><uni-icons custom-prefix="iconfont" type="icon-ebikexuanzhong" :color="color"
size="16" /></label>
<label>正常</label>
</div>
</div>
<div class="divRow">
<div class="lbTitle">剩余电量</div>
<div>
<label class="lbImg"><uni-icons custom-prefix="iconfont" type="icon-ebikeelectricity-full"
:color="color" size="16" /></label>
<label>{{data.dl}}</label>
</div>
</div>
<div class="divRow">
<div class="lbTitle">可骑行距离</div>
<div>
<label class="lbImg"><uni-icons custom-prefix="iconfont" type="icon-ebikeditu2" :color="color"
size="16" /></label>
<label>{{data.jl}}</label>
</div>
</div>
<div style="margin-top: 30px;margin-bottom: 30px;">
<label style="margin-right: 15px;"><uni-icons custom-prefix="iconfont" type="icon-ebikejinggao"
color="#FF7200" size="12" /></label>
<label style="font-size: 12px;">安全骑行遵守交通规则</label>
</div>
<!-- <div>
<div class="divBtn" @click="$emit('close')">关闭</div>
</div> -->
</div>
</template>
<script setup>
import {
ref,onMounted
} from 'vue';
import {
showModelMessage
} from "@/utils/tools.js";
const props = defineProps(["bikecode"]);
const methods = defineEmits(["close"])
const color = ref("#61D145");
const data = ref({
bikeCode: props.bikecode,
zt: 1,
dl: "86%",
jl: "50km"
})
onMounted(()=>{
showModelMessage("该功能暂未实现!")
})
</script>
<style scoped>
.divRow {
font-size: 12px;
color: #000;
line-height: 25px;
display: flex;
}
.lbTitle {
text-align: right;
width: 80px;
}
.lbImg {
margin-right: 5px;
}
</style>