zy-wcs.git - Gitblit

			@@ -35,6 +35,7 @@
			height: 100%;
			z-index: -1;
			pointer-events: none;
			opacity: 0.6;
			}

			.grid-overlay {
			@@ -44,9 +45,9 @@
			width: 100%;
			height: 100%;
			background-image:
			linear-gradient(rgba(66, 134, 244, 0.1) 1px, transparent 1px),
			linear-gradient(90deg, rgba(66, 134, 244, 0.1) 1px, transparent 1px);
			background-size: 30px 30px;
			linear-gradient(rgba(66, 134, 244, 0.08) 1px, transparent 1px),
			linear-gradient(90deg, rgba(66, 134, 244, 0.08) 1px, transparent 1px);
			background-size: 40px 40px;
			perspective: 1000px;
			transform-style: preserve-3d;
			transform: perspective(500px) rotateX(60deg);
			@@ -59,8 +60,8 @@
			top: 0;
			left: 0;
			background:
			radial-gradient(circle at 20% 30%, rgba(41, 128, 185, 0.2) 0%, transparent 40%),
			radial-gradient(circle at 80% 70%, rgba(46, 204, 113, 0.2) 0%, transparent 40%);
			radial-gradient(circle at 20% 30%, rgba(41, 128, 185, 0.3) 0%, transparent 40%),
			radial-gradient(circle at 80% 70%, rgba(46, 204, 113, 0.3) 0%, transparent 40%);
			filter: blur(10px);
			}

			@@ -278,6 +279,89 @@
			left: 1000px;
			text-align: center;
			}

			/* 新设计的站点样式 - 基于第二张图片 */
			.station {
			position: absolute;
			width: 24px;
			height: 24px;
			text-align: center;
			line-height: 24px;
			font-size: 10px;
			font-weight: bold;
			transition: all 0.3s ease;
			background-color: #ab1839;
			border-radius: 4px;
			color: white;
			box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
			transform: scale(1);
			z-index: 10;
			/* 嵌套效果 */
			border: 2px solid white;
			}

			.station::before {
			content: '';
			position: absolute;
			top: 3px;
			left: 3px;
			right: 3px;
			bottom: 3px;
			border: 1px solid rgba(255, 255, 255, 0.8);
			border-radius: 2px;
			pointer-events: none;
			}

			/* 四个角的三角形指示器 */
			.station::after {
			content: '';
			position: absolute;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			pointer-events: none;
			}

			.station .corner {
			position: absolute;
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 0 4px 4px 0;
			border-color: transparent #ffffff transparent transparent;
			}

			.station .corner-tl {
			top: -2px;
			left: -2px;
			transform: rotate(0deg);
			}

			.station .corner-tr {
			top: -2px;
			right: -2px;
			transform: rotate(90deg);
			}

			.station .corner-bl {
			bottom: -2px;
			left: -2px;
			transform: rotate(270deg);
			}

			.station .corner-br {
			bottom: -2px;
			right: -2px;
			transform: rotate(180deg);
			}

			/* 站点悬停效果 */
			.station:hover {
			transform: scale(1.6);
			z-index: 999;
			box-shadow: 0 0 15px rgba(171, 24, 57, 0.8);
			}
			</style>
			</head>
			<body >
			@@ -320,7 +404,12 @@
			<div v-for="station in tableDataDev" class="station" :style="{
			top: convertToCSSPosition(station.valueX, station.valueY).y + 'px',
			left: convertToCSSPosition(station.valueX, station.valueY).x + 'px',
			backgroundColor: station.modeColor}">{{ station.index }}
			backgroundColor: station.modeColor}">
			<div class="corner corner-tl"></div>
			<div class="corner corner-tr"></div>
			<div class="corner corner-bl"></div>
			<div class="corner corner-br"></div>
			{{ station.index }}
			</div>

			<div>