This commit is contained in:
sundongyu 2024-06-26 18:04:38 +08:00
commit 67a6640500

View File

@ -1,4 +1,5 @@
<template>
<view class="">
<view class="van-nav-bar">
<view class="van-nav-bar__content">
<view class="page-icon" @click="gotoBack">
@ -12,19 +13,19 @@
<view class="business">
<view class="business-top">
<view style="display: flex; align-items: center">
<image src="../../../static/renling.png" class="image"></image>
<image src="../../../static/认领.png" class="image"></image>
<text style="margin-left: 30rpx; font-weight: 500; font-size: 32rpx">代办驾驶证业务</text>
</view>
<view style="font-size: 24rpx; color: #858585">
{{ '共一项代办业务' }}
{{ "共一项代办业务" }}
</view>
</view>
<view class="business-bottom">
<view class="tag">
<text style="margin-left: 10rpx">待办</text>
</view>
<view class="">期满换证</view>
<view style="font-size: 28rpx; color: #666666; margin-left: 20rpx">请尽快更换驾驶证</view>
<view class=""> 期满换证 </view>
<view style="font-size: 28rpx; color: #666666; margin-left: 20rpx"> 请尽快更换驾驶证 </view>
<view style="width: 15%">
<uni-tag text="详情" type="primary" size="small" inverted></uni-tag>
</view>
@ -39,16 +40,12 @@
</view>
</view>
</view>
<view class="driving-print">
<view>
<view id="lineChartRef" :style="{ width: '200px', height: '200px' }" />
</view>
</view>
<view class="driving-print"> </view>
</view>
<view class="drivingList">
<view class="item">
<text style="margin-left: 40rpx; font-weight: 550">登录手机号码</text>
<text style="margin-right: 20rpx">{{ '151****9198' }}</text>
<text style="margin-right: 20rpx">{{ "151****9198" }}</text>
</view>
<view class="item">
<text style="margin-left: 40rpx; font-weight: 550">驾驶证电子版</text>
@ -77,18 +74,21 @@
<text class="warning">当前您的驾驶证积分清除截止时间为2024年08月30日零点</text>
</view>
</view>
</view>
</template>
<script setup>
import { ref, onMounted } from 'vue';
import * as echarts from 'echarts';
const gotoBack = () => {
import {
ref,
onMounted
} from 'vue'
import * as echarts from 'echarts';
const gotoBack = () => {
uni.navigateBack({
delta: 1
});
};
const drivingData = [
{
})
}
const drivingData = [{
title: '驾驶证号',
content: '2302**********1229'
},
@ -115,12 +115,11 @@ const drivingData = [
{
title: '数据更新时间',
content: '2023-08-30'
}
];
},
]
const option = {
series: [
{
const option = {
series: [{
type: 'gauge',
min: 0, //
max: 12,
@ -130,8 +129,7 @@ const option = {
width: 18,
roundCap: true,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: '#A65FFB'
},
@ -172,25 +170,22 @@ const option = {
formatter: '{value} 分',
color: 'inherit'
},
data: [
{
data: [{
value: 1,
name: '累计积分\n\n\n\n\n\n正常'
}
]
}
]
};
name: '累计积分\n\n\n\n\n\n正常',
}]
}]
};
// ECharts
onMounted(() => {
// ECharts
onMounted(() => {
// const lineChartContainer = lineChartRef.value;
const lineChartContainer = document.getElementById('lineChartRef');
if (lineChartContainer) {
const myChart = echarts.init(lineChartContainer);
myChart.setOption(option);
}
});
});
</script>
<style lang="scss">
@ -294,18 +289,18 @@ onMounted(() => {
justify-content: space-between;
}
}
}
}
.image {
.image {
width: 50rpx;
height: 50rpx;
}
.warning {
}
.warning{
display: inline-block;
margin-top: 20rpx;
font-size: 25rpx;
color: #929196;
width: 100%;
text-align: center;
}
}
</style>