feat(web/route): 支持电脑端鼠标平移画布 & 优化动态SVG宽度
1. 修复电脑端画布无法拖拽滑动问题: - 新增 onPanStart/onPanMove/onPanEnd 逻辑 - 绑定鼠标事件到 .visual-line-container,实现按住左键平移 scrollLeft 2. 修复长线路无法完全滚动的问题: - 将固定 100% 的宽度替换为动态宽度计算:Math.max(100, 50 + stations.length * 120 + 50) + px - 确保原生 overflow-x: auto 能正确感知超出容器的内部站点 3. 更新静态资源版本号避免缓存
This commit is contained in:
@@ -223,8 +223,13 @@
|
||||
</div>
|
||||
|
||||
<!-- 可视化线路编辑-->
|
||||
<div class="visual-line-container">
|
||||
<svg width="100%" height="200"
|
||||
<div class="visual-line-container" ref="visualLineContainer"
|
||||
:class="{ 'is-panning': isPanning }"
|
||||
@mousedown="onPanStart"
|
||||
@mousemove="onPanMove"
|
||||
@mouseup="onPanEnd"
|
||||
@mouseleave="onPanEnd">
|
||||
<svg :style="{ minWidth: '100%', width: Math.max(100, 50 + selectedLine.stations.length * 120 + 50) + 'px' }" height="200"
|
||||
v-if="selectedLine.stations && selectedLine.stations.length > 0">
|
||||
<!--站点连接线-->
|
||||
<line x1="50" y1="100" :x2="50 + (selectedLine.stations.length - 1) * 120" y2="100"
|
||||
@@ -602,7 +607,7 @@
|
||||
</div>
|
||||
<script src="/custom-dialog.js?v=11"></script>
|
||||
<script src="/public-status.js?v=14"></script>
|
||||
<script src="ticket-route.js?v=5"></script>
|
||||
<script src="ticket-route.js?v=6"></script>
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const isDomain = location.hostname.includes('fse-media.group');
|
||||
|
||||
Reference in New Issue
Block a user