root/apt15e
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

国际化

Browse Source
This commit is contained in:
caill
2025-08-27 11:16:49 +08:00
parent 6a1cac2d13
commit 497ba36cc1
25 changed files with 1487 additions and 724 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
src/pages/modules/map.vue
View File

@@ -1,6 +1,6 @@
<template>
<div class="page_container">
<div class="page_container" :class="{'enClass': $i18n.locale === 'en-us'}">
<div class="canvas-container">
<canvas
id="mapCanvas"
@@ -14,19 +14,12 @@
@mouseup="handleMouseUp"
@mouseleave="handleMouseUp"
></canvas>
<el-row type="flex" justify="end" class="map_tools">
<el-button
type="primary"
:disabled="!carPosition?.x || !carPosition?.y"
icon="el-icon-location"
size="mini"
style="border-left: 0;border-top: 0;border-bottom: 0;border-radius: 0;"
@click="centerToCar"
></el-button>
<el-button type="primary" :disabled="zoomPercentage === 2" icon="el-icon-minus" size="mini" style="border: 0;border-radius: 0;margin-left: 0" @click="zoomOut"></el-button>
<div class="map_tools">
<el-button class="zoom_btn" type="primary" :disabled="zoomPercentage === 2" icon="el-icon-minus" size="mini" @click="zoomOut"></el-button>
<div class="zoom_data">{{ zoomPercentage }}%</div>
<el-button type="primary" :disabled="zoomPercentage === 200" icon="el-icon-plus" size="mini" style="border: 0;border-radius: 0;" @click="zoomIn"></el-button>
</el-row>
<el-button class="zoom_btn" type="primary" :disabled="zoomPercentage === 200" icon="el-icon-plus" size="mini" @click="zoomIn"></el-button>
<el-button class="zoom_btn" style="margin-top: .2rem !important" type="primary" :disabled="!carPosition?.x || !carPosition?.y" icon="el-icon-location" size="mini" @click="centerToCar"></el-button>
</div>
</div>
<div
v-if="showPopup"
@@ -35,23 +28,23 @@
@click.stop
>
<el-row type="flex" justify="space-between" class="popup-content" style="border-bottom: 1px solid #fff;">
<el-col :span="10"><h3>编号</h3></el-col>
<el-col :span="10"><h3>{{$t('Number')}}</h3></el-col>
<el-col :span="14"><p>{{selectedPoint.station_code}}</p></el-col>
</el-row>
<el-row type="flex" justify="space-between" class="popup-content">
<el-col :span="10"><h3>别名</h3></el-col>
<el-col :span="10"><h3>{{$t('Alias')}}</h3></el-col>
<el-col :span="14"><p>{{selectedPoint.station_name}}</p></el-col>
</el-row>
<el-row type="flex" justify="space-between" class="popup-content">
<el-col :span="10"><h3>X坐标</h3></el-col>
<el-col :span="10"><h3>{{$t('XCoordinate')}}</h3></el-col>
<el-col :span="14"><p>{{ selectedPoint.x }}</p></el-col>
</el-row>
<el-row type="flex" justify="space-between" class="popup-content">
<el-col :span="10"><h3>Y坐标</h3></el-col>
<el-col :span="10"><h3>{{ $t('YCoordinate') }}</h3></el-col>
<el-col :span="14"><p>{{ selectedPoint.y }}</p></el-col>
</el-row>
<el-row type="flex" justify="space-between" class="popup-content">
<el-col :span="10"><h3>角度值</h3></el-col>
<el-col :span="10"><h3>{{$t('AngleValue')}}</h3></el-col>
<el-col :span="14"><p>{{ selectedPoint.angle }}</p></el-col>
</el-row>
</div>
@@ -62,15 +55,15 @@
@click.stop
>
<el-row type="flex" justify="space-between" class="popup-content" style="border-bottom: 1px solid #fff;">
<el-col :span="10"><h3>路径ID</h3></el-col>
<el-col :span="10"><h3>{{ $t('PathID') }}</h3></el-col>
<el-col :span="14"><p>{{selectedPath.route_id}}</p></el-col>
</el-row>
<el-row type="flex" justify="space-between" class="popup-content">
<el-col :span="10"><h3>起点编码</h3></el-col>
<el-col :span="10"><h3>{{$t('StartCode')}}</h3></el-col>
<el-col :span="14"><p>{{getStationNameById(selectedPath.start_id)}}</p></el-col>
</el-row>
<el-row type="flex" justify="space-between" class="popup-content">
<el-col :span="10"><h3>终点编码</h3></el-col>
<el-col :span="10"><h3>{{$t('EndCode')}}</h3></el-col>
<el-col :span="14"><p>{{getStationNameById(selectedPath.end_id)}}</p></el-col>
</el-row>
</div>
@@ -238,7 +231,7 @@ export default {
this.loading.close()
return true
} catch (e) {
this.$message.error(`数据加载失败: ${e.message || '未知错误'}`)
this.$message.error(e.message)
this.loading.close()
return false
}
@@ -311,7 +304,7 @@ export default {
)
} else {
this.ctx.fillStyle = '#ccc'
this.ctx.fillText('地图加载中...', 50, 50)
this.ctx.fillText(this.$t('Mapisload'), 50, 50)
}
this.drawPath()
this.drawMarkers()
@@ -358,7 +351,7 @@ export default {
},
drawMarkers () {
if (!this.pointData.length) return
const markerSize = 10 // 标记大小随缩放变化
const markerSize = 16 // 标记大小随缩放变化
this.pointData.forEach(point => {
const x = (point.x - this.mapData.x) / this.mapData.resolution
const y = this.mapData.height - (point.y - this.mapData.y) / this.mapData.resolution
@@ -380,9 +373,9 @@ export default {
// 绘制点位名称（文字大小随缩放变化）
if (point.station_type === 'Station') {
this.ctx.font = '12px Arial'
this.ctx.fillStyle = 'white'
this.ctx.fillStyle = '#62fa0a'
this.ctx.textAlign = 'center'
this.ctx.fillText(point.station_name, x, y + 18)
this.ctx.fillText(point.station_name, x, y + 22)
}
})
},
@@ -395,10 +388,10 @@ export default {
this.ctx.rotate(-this.carPosition.angle)
this.ctx.drawImage(
this.cachedImages.car,
-10,
-10,
20,
20
-15,
-15,
30,
30
)
this.ctx.restore()
},
@@ -585,4 +578,7 @@ export default {
from { opacity: 0; transform: translateY(5px); }
to { opacity: 1; transform: translateY(0); }
}
.enClass
.point-popup
min-width 240px
</style>