From db07d86f01f19683d7adb263139159ffe1e0c9bf Mon Sep 17 00:00:00 2001
From: wangjuncheng <1>
Date: 星期四, 08 五月 2025 14:49:59 +0800
Subject: [PATCH] change
---
src/components/tools/LayerTree.vue | 2
public/images/poi/泥位计.png | 0
src/components/tools/Legend_zhjc.vue | 83 +++++++++++
src/components/monifangzhen/schemeInfo.vue | 9 +
src/views/zhjc.vue | 17 ++
public/images/poi/含水率.png | 0
src/components/tools/Legend_yhgl.vue | 78 +++++++++++
src/views/GisView.vue | 8
src/views/yhgl.vue | 17 ++
public/images/poi/流速仪.png | 0
src/views/Home.vue | 1
src/components/menu/TimeLine.vue | 191 ++++++++++++++++----------
src/components/tools/DebuffDetail.vue | 2
public/images/poi/摄像头.png | 0
src/components/tools/Message.vue | 5
15 files changed, 327 insertions(+), 86 deletions(-)
diff --git "a/public/images/poi/\345\220\253\346\260\264\347\216\207.png" "b/public/images/poi/\345\220\253\346\260\264\347\216\207.png"
new file mode 100644
index 0000000..e0d4a40
--- /dev/null
+++ "b/public/images/poi/\345\220\253\346\260\264\347\216\207.png"
Binary files differ
diff --git "a/public/images/poi/\346\221\204\345\203\217\345\244\264.png" "b/public/images/poi/\346\221\204\345\203\217\345\244\264.png"
new file mode 100644
index 0000000..6313428
--- /dev/null
+++ "b/public/images/poi/\346\221\204\345\203\217\345\244\264.png"
Binary files differ
diff --git "a/public/images/poi/\346\263\245\344\275\215\350\256\241.png" "b/public/images/poi/\346\263\245\344\275\215\350\256\241.png"
new file mode 100644
index 0000000..f3e871b
--- /dev/null
+++ "b/public/images/poi/\346\263\245\344\275\215\350\256\241.png"
Binary files differ
diff --git "a/public/images/poi/\346\265\201\351\200\237\344\273\252.png" "b/public/images/poi/\346\265\201\351\200\237\344\273\252.png"
new file mode 100644
index 0000000..c1d2bdf
--- /dev/null
+++ "b/public/images/poi/\346\265\201\351\200\237\344\273\252.png"
Binary files differ
diff --git a/src/components/menu/TimeLine.vue b/src/components/menu/TimeLine.vue
index 84ee093..412c582 100644
--- a/src/components/menu/TimeLine.vue
+++ b/src/components/menu/TimeLine.vue
@@ -2,30 +2,20 @@
<div class="timeline-container">
<div class="controls">
<div class="control-btn" @click="skipBackward">
- <img
- src="@/assets/img/timeline/left.png"
- class="fas fa-step-backward"
- />
+ <img src="@/assets/img/timeline/left.png" class="fas fa-step-backward" />
</div>
<div class="control-btn play-btn" @click="togglePlay">
<img v-show="isPlaying" src="@/assets/img/timeline/stop.png" />
<img v-show="!isPlaying" src="@/assets/img/timeline/start.png" />
</div>
<div class="control-btn" @click="skipForward">
- <img
- src="@/assets/img/timeline/right.png"
- class="fas fa-step-forward"
- />
+ <img src="@/assets/img/timeline/right.png" class="fas fa-step-forward" />
</div>
<div class="speed-control">
<div @click="toggleSpeedMenu">{{ playbackRate }}X</div>
<div class="speed-menu" v-show="showSpeedMenu">
- <div
- v-for="rate in playbackRates"
- :key="rate"
- @click.capture="setPlaybackRate(rate)"
- :class="{ active: playbackRate === rate }"
- >
+ <div v-for="rate in playbackRates" :key="rate" @click.capture="setPlaybackRate(rate)"
+ :class="{ active: playbackRate === rate }">
{{ rate }}X
</div>
</div>
@@ -35,39 +25,21 @@
<div class="timeline">
<div class="dates">
<div class="current-date">褰撳墠鎾斁鏃堕棿锛歿{ currentPlayingTime }}</div>
- <div
- v-for="(date, index) in visibleDates"
- :key="index"
- class="date-label"
- >
+ <div v-for="(date, index) in visibleDates" :key="index" class="date-label">
<!-- {{ formatDate(date) }} -->
</div>
</div>
<div class="timeline-track" ref="timelineTrack" @click="seekToPosition">
- <div
- class="timeline-progress"
- :style="{ width: progressPercentage + '%' }"
- ></div>
- <div
- class="timeline-cursor"
- :style="{ left: progressPercentage + '%' }"
- ></div>
+ <div class="timeline-progress" :style="{ width: progressPercentage + '%' }"></div>
+ <div class="timeline-cursor" :style="{ left: progressPercentage + '%' }"></div>
<div class="time-markers">
- <div
- v-for="(time, index) in timeMarkers"
- :key="index"
- class="time-marker"
- >
+ <div v-for="(time, index) in timeMarkers" :key="index" class="time-marker">
{{ time }}
</div>
</div>
</div>
</div>
- <el-button
- @click="handleBack"
- style="margin-top: 26px; margin-left: 30px; margin-right: 10px"
- >缁撴潫妯℃嫙</el-button
- >
+ <el-button @click="handleBack" style="margin-top: 26px; margin-left: 30px; margin-right: 10px">缁撴潫妯℃嫙</el-button>
</div>
</template>
@@ -215,54 +187,127 @@
emit("timeUpdate", progress * 100); // 鐧惧垎姣斾笂鎶�
}, 1000); // 娉ㄦ剰浣跨敤interval鑰岄潪鍥哄畾1000ms
};
-let rainFallValues = ref([]); // 鐢ㄤ簬瀛樺偍鎻愬彇鐨剉alue鏁扮粍
+// 闄嶉洦鍙樺寲閮ㄥ垎
+// 闄嶉洦鏁版嵁鐩稿叧鍙橀噺
+// 闄嶉洦鏁版嵁鐩稿叧鍙橀噺
+let rainFallValues = ref([]); // 瀛樺偍鍘熷闄嶉洦閲忔暟鎹�
let minRainValue = ref(Infinity);
let maxRainValue = ref(-Infinity);
+
+// 鑾峰彇闄嶉洦鏁版嵁
function getRainfallData() {
getRainfall().then((res) => {
- rainFallValues.value = res;
- // 鎻愬彇value鍊�
- rainFallValues.value = rainFallValues.value.data.map(item => item.value);
- // 璁＄畻min鍜宮ax闆ㄩ噺鍊�
+ rainFallValues.value = res.data.map(item => item.value); // 鎻愬彇闄嶉洦閲忓��
minRainValue.value = Math.min(...rainFallValues.value);
maxRainValue.value = Math.max(...rainFallValues.value);
console.log(minRainValue.value, maxRainValue.value, 'min and max rain values');
});
}
-// 绾挎�ф槧灏勫嚱鏁�
-function mapValue(value, fromLow, fromHigh, toLow, toHigh) {
- return (value - fromLow) * (toHigh - toLow) / (fromHigh - fromLow) + toLow;
-}
-// 鏍规嵁褰撳墠鎾斁杩涘害鏇存柊澶╂皵
-// 鎴戣繖閲岃鏄帴鍏ョ湡瀹炴暟鎹悗锛屾瘡涓暟鎹�
-function updateWeatherByProgress() {
- const progress = currentTime.value / duration.value;
- // 璁＄畻褰撳墠杩涘害瀵瑰簲浜� rainFallValues 鏁扮粍涓殑浣嶇疆
- const index = Math.floor(progress * (rainFallValues.value.length - 1));
- const rainValue = rainFallValues.value[index]; // 鑾峰彇瀵瑰簲鐨勯檷闆ㄩ噺 value
- // 鏍规嵁褰撳墠闆ㄩ噺鍔ㄦ�佽皟鏁撮洦鐨勫弬鏁�
- // const rainParams = {
- // rainSize: mapValue(rainValue, minRainValue.value, maxRainValue.value, 0.5, 1.5), // 闆ㄦ淮澶у皬锛氫粠灏忓埌澶�
- // rainSpeed: mapValue(rainValue, minRainValue.value, maxRainValue.value, 30, 120), // 闆ㄩ�燂細浠庢參鍒板揩
- // rainDensity: mapValue(rainValue, minRainValue.value, maxRainValue.value, 20, 120), // 瀵嗗害锛氫粠绋�鐤忓埌瀵嗛泦
- // rainColor: "#99B3CC" // 鍙互鍦ㄦ鍩虹涓婂鍔犻鑹插彉鍖栭�昏緫锛屼緥濡傛毚闆ㄤ负娣辫摑绛�
- // };
- // 璋冪敤宸ュ叿鏂规硶鏇存柊涓嬮洦鏁堟灉
- mapUtils.toggleRain(rainParams, true);
+
+// // 绾挎�ф槧灏勫嚱鏁�
+// function mapValue(value, fromLow, fromHigh, toLow, toHigh) {
+// return (value - fromLow) * (toHigh - toLow) / (fromHigh - fromLow) + toLow;
+// }
+
+// 瀹氫箟闄嶉洦绛夌骇鍙婂叾瀵瑰簲鐨勮瑙夊弬鏁�
+const rainLevels = [
+ {
+ name: '灏忛洦',
+ min: 0.1,
+ max: 9.9,
+ size: 0.5, // 闆ㄦ淮澶у皬锛氭洿灏�
+ speed: 20, // 涓嬭惤閫熷害锛氭洿鎱�
+ density: 15, // 闆ㄦ淮瀵嗗害锛氭洿绋�鐤�
+ color: '#ADD8E6' // 娴呰摑鑹诧紝璞″緛杞绘煍鐨勫皬闆�
+ },
+ {
+ name: '涓洦',
+ min: 10,
+ max: 24.9,
+ size: 0.7,
+ speed: 40,
+ density: 35,
+ color: '#ADD8E6' // 澶╄摑鑹诧紝璞″緛鎸佺画鐨勪腑闆�
+ },
+ {
+ name: '澶ч洦',
+ min: 25,
+ max: 49.9,
+ size: 1.0,
+ speed: 70,
+ density: 60,
+ color: '#ADD8E6' // 娣辫摑鑹诧紝璞″緛瀵嗛泦鐨勫ぇ闆�
+ },
+ {
+ name: '鏆撮洦',
+ min: 50,
+ max: 99.9,
+ size: 1.3,
+ speed: 90,
+ density: 80,
+ color: '#ADD8E6' // 娣辫摑榛戣壊锛岃薄寰佸己闄嶉洦
+ },
+ {
+ name: '澶ф毚闆�',
+ min: 100,
+ size: 1.6,
+ speed: 110,
+ density: 100,
+ color: '#ADD8E6' // 榛戣壊锛岃薄寰佹瀬绔毚闆�
+ }
+];
+
+// 鏍规嵁闄嶉洦閲忚繑鍥炲搴旂殑闆ㄥ舰閰嶇疆
+function getRainLevel(rainValue) {
+ for (let level of rainLevels) {
+ if (level.min <= rainValue && (level.max === undefined || rainValue <= level.max)) {
+ return level;
+ }
+ }
+ // 榛樿鏃犻洦鐘舵��
+ return { name: '鏃犻洦', size: 0.5, speed: 30, density: 20, color: '#F0F8FF' };
}
+// 鏍规嵁鎾斁杩涘害鏇存柊澶╂皵鏁堟灉
+function updateWeatherByProgress() {
+ const progress = currentTime.value / duration.value;
+ const floatIndex = progress * (rainFallValues.value.length - 1);
+ const index = Math.floor(floatIndex);
+ const nextIndex = Math.min(index + 1, rainFallValues.value.length - 1);
+ const currentRain = rainFallValues.value[index];
+ const nextRain = rainFallValues.value[nextIndex];
+ // 鎻掑�煎洜瀛� [0, 1]
+ // const alpha = floatIndex - index;
+
+ // 鎻掑�煎緱鍒板綋鍓嶉檷闆ㄩ噺
+ // const rainValue = currentRain + (nextRain - currentRain) * alpha;
+ const rainValue = currentRain + (nextRain - currentRain);
+ // 鑾峰彇瀵瑰簲鐨勯洦褰㈤厤缃�
+ const rainLevel = getRainLevel(rainValue);
+ if (rainLevel.name === '鏃犻洦') {
+ mapUtils.delRain();
+ return;
+ }
+ // 闈炴棤闆ㄧ姸鎬侊細鏋勫缓闆ㄦ淮鍙傛暟骞舵洿鏂伴洦鏁�
+ const rainParams = {
+ rainSize: rainLevel.size,
+ rainSpeed: rainLevel.speed,
+ rainDensity: rainLevel.density,
+ rainColor: rainLevel.color
+ };
+ console.log('褰撳墠闆ㄩ噺鏁版嵁锛�', rainValue);
+ console.log('褰撳墠闆ㄥ舰锛�', rainLevel);
+ // 璋冪敤宸ュ叿鏂规硶鏇存柊闆ㄦ晥
+ mapUtils.toggleRain(rainParams, true);
+}
const stopPlayback = () => {
clearInterval(playInterval);
};
-
const skipForward = () =>
(currentTime.value = Math.min(currentTime.value + 1, duration.value)); // 鍚戝墠璺宠浆1绉�
-
const skipBackward = () =>
(currentTime.value = Math.max(currentTime.value - 1, 0)); // 鍚戝悗璺宠浆1绉�
-
const toggleSpeedMenu = () => (showSpeedMenu.value = !showSpeedMenu.value);
-
// 璁剧疆鎾斁閫熺巼
const setPlaybackRate = (rate) => {
playbackRate.value = rate;
@@ -270,14 +315,13 @@
// 鍋滄褰撳墠鎾斁
stopPlayback();
setTimeout(() => {
- mapUtils.delRain();
- }, 3000);
+ mapUtils.delRain();
+ }, 3000);
// 閲嶇疆鏃堕棿杞村埌鍒濆鐘舵��
currentTime.value = 0; // 鏃堕棿褰掗浂
emit("timeUpdate", progressPercentage.value);
isPlaying.value = false;
emit("isPlaying", false);
-
// 閿�姣佺幇鏈夌殑姘翠綋妯℃嫙灞�
if (isWaterPrimitiveCreated.value) {
destoryWaterPrimitive();
@@ -298,7 +342,7 @@
message: "璇峰厛鍚姩姘翠綋妯℃嫙鍚庡啀杩涜鏃堕棿杞磋烦杞��",
type: "warning",
});
- return; // 闃绘鍚庣画閫昏緫鎵ц
+ return;
}
const rect = timelineTrack.value.getBoundingClientRect();
const percentage = (event.clientX - rect.left) / rect.width;
@@ -314,10 +358,7 @@
"Time:",
dayjs(waterTimestamps.value[closestIndex]).format("YYYY-MM-DD HH:mm:ss")
);
- // 璋冪敤璺宠浆鎺ュ彛锛屼紶閫掔储寮曞��
setTimeForWaterSimulation(closestIndex);
-
- // 濡傛灉褰撳墠鏄殏鍋滅姸鎬侊紝璋冪敤 pauseWaterSimulation
if (!isPlaying.value) {
pauseWaterSimulation();
}
@@ -331,7 +372,7 @@
waterTimestamps.value.forEach((timestamp, index) => {
const diff = Math.abs(
dayjs(timestamp).diff(dayjs(waterTimestamps.value[0]), "second") -
- currentTimeValue
+ currentTimeValue
);
if (diff < minDiff) {
minDiff = diff;
@@ -446,7 +487,7 @@
left: 50%;
transform: translateX(-50%);
z-index: 99;
- width: 878px;
+ width: 678px;
height: 108px;
/* background-color: #1a2634; */
background: url("@/assets/img/menubar/bar.png");
diff --git a/src/components/monifangzhen/schemeInfo.vue b/src/components/monifangzhen/schemeInfo.vue
index 5d26cd7..f115a67 100644
--- a/src/components/monifangzhen/schemeInfo.vue
+++ b/src/components/monifangzhen/schemeInfo.vue
@@ -133,6 +133,15 @@
}
continue;
}
+
+ // 澶勭悊 areaName 瀛楁
+ if (key === "areaName") {
+ data.push({
+ name: "鍖哄煙鍚嶇О锛�",
+ value: value || "鏃�",
+ });
+ continue;
+ }
// 澶勭悊 result 瀛楁
if (key === "result") {
diff --git a/src/components/tools/DebuffDetail.vue b/src/components/tools/DebuffDetail.vue
index 4bc9239..b973957 100644
--- a/src/components/tools/DebuffDetail.vue
+++ b/src/components/tools/DebuffDetail.vue
@@ -1,7 +1,7 @@
<template>
<div class="detail">
<div class="detail-top">缁熻鍒嗘瀽缁撴灉</div>
- <div class="detail-btn" @click="showMsg">鏌ョ湅璇︽儏</div>
+ <!-- <div class="detail-btn" @click="showMsg">鏌ョ湅璇︽儏</div> -->
<div class="detail-close" @click="closeMsg"></div>
<div class="detail-context">
<div v-for="(item, key) in detailList" :key="key" class="detail-item">
diff --git a/src/components/tools/LayerTree.vue b/src/components/tools/LayerTree.vue
index 6204585..0ced3a5 100644
--- a/src/components/tools/LayerTree.vue
+++ b/src/components/tools/LayerTree.vue
@@ -263,7 +263,7 @@
districtList.value.forEach((item) => {
item.showBillboard = true;
item.className = "district";
- item.type = "娉ョ煶娴�";
+ // item.type = "娉ョ煶娴�"; //鏁版嵁icon璁剧疆
const entity = createPoint(item);
entity.show = false;
list.push(entity);
diff --git a/src/components/tools/Legend_yhgl.vue b/src/components/tools/Legend_yhgl.vue
new file mode 100644
index 0000000..ca1413f
--- /dev/null
+++ b/src/components/tools/Legend_yhgl.vue
@@ -0,0 +1,78 @@
+<template>
+ <div class="legend-container">
+ <div class="legend-title">鍥句緥璇存槑</div>
+ <ul class="legend-list">
+ <li v-for="(item, index) in legendItems" :key="index" class="legend-item">
+ <img :src="getImageUrl(item.icon)" :alt="item.label" class="legend-icon" />
+ <span class="legend-label">{{ item.label }}</span>
+ </li>
+ </ul>
+ </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from "vue";
+
+// 瀹氫箟鍥句緥鏁版嵁
+const legendItems = ref([
+ { icon: "宕╁.png", label: "宕╁" },
+ { icon: "娉ョ煶娴�.png", label: "娉ョ煶娴�" },
+ { icon: "婊戝潯.png", label: "婊戝潯" },
+]);
+
+// 鑾峰彇 public 涓嬬殑鍥剧墖璺緞
+const getImageUrl = (iconName) => {
+ return `/images/poi/${iconName}`;
+};
+
+onMounted(() => {
+ console.log("杩欓噷鏄浘渚嬮泦鍚堬紒");
+});
+</script>
+
+<style lang="less" scoped>
+.legend-container {
+ padding: 0.5rem; // 鍑忓皯鍐呰竟璺�
+ // background-color: #f9f9f9;
+ border: 1px solid #ddd;
+ border-radius: 8px;
+ max-width: 100%;
+ width: auto;
+ font-size: clamp(10px, 1vw, 14px); // 鏇村皬鐨勫熀纭�瀛楀彿
+}
+
+.legend-title {
+ width: 100%;
+ // border: 1px solid #ddd;
+ margin-bottom: 10%;
+ text-align: center;
+ letter-spacing: 2px;
+ font-weight: 600;
+ font-size: clamp(16px, 1vw, 20px); // 鏇村皬鐨勫熀纭�瀛楀彿
+
+}
+
+.legend-list {
+ list-style: none;
+ padding: 0;
+ // margin: 0;
+ display: flex;
+ flex-direction: column; // 鏀逛负鍨傜洿鏂瑰悜甯冨眬
+ gap: 0.5rem; // 鍑忓皯闂磋窛
+}
+
+.legend-item {
+ display: flex;
+ align-items: center;
+}
+
+.legend-icon {
+ width: 23px; // 鍑忓皯鍥炬爣澶у皬
+ height: 25px; // 鍑忓皯鍥炬爣澶у皬
+ margin-right: 0.5rem; // 鍑忓皯鍙宠竟璺�
+}
+
+.legend-label {
+ font-size: inherit; // 缁ф壙鐖剁骇瀛椾綋澶у皬
+}
+</style>
\ No newline at end of file
diff --git a/src/components/tools/Legend_zhjc.vue b/src/components/tools/Legend_zhjc.vue
new file mode 100644
index 0000000..eab51ce
--- /dev/null
+++ b/src/components/tools/Legend_zhjc.vue
@@ -0,0 +1,83 @@
+<template>
+ <div class="legend-container">
+ <div class="legend-title">鍥句緥璇存槑</div>
+ <ul class="legend-list">
+ <li v-for="(item, index) in legendItems" :key="index" class="legend-item">
+ <img :src="getImageUrl(item.icon)" :alt="item.label" class="legend-icon" />
+ <span class="legend-label">{{ item.label }}</span>
+ </li>
+ </ul>
+ </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from "vue";
+
+// 瀹氫箟鍥句緥鏁版嵁
+const legendItems = ref([
+ { icon: "缂栫爜鍣�.png", label: "缂栫爜鍣�" },
+ { icon: "鎽勫儚澶�.png", label: "鎽勫儚澶�" },
+ { icon: "娉ヤ綅璁�.png", label: "娉ヤ綅璁�" },
+ { icon: "娴侀�熶华.png", label: "娴侀�熶华" },
+ { icon: "鍚按鐜�.png", label: "鍚按鐜�" },
+ { icon: "娆＄敓浠�.png", label: "娆＄敓浠�" },
+ { icon: "闆ㄩ噺璁�.png", label: "闆ㄩ噺璁�" },
+ { icon: "澧掓儏.png", label: "澧掓儏" },
+]);
+
+// 鑾峰彇 public 涓嬬殑鍥剧墖璺緞
+const getImageUrl = (iconName) => {
+ return `/images/poi/${iconName}`;
+};
+
+onMounted(() => {
+ console.log("杩欓噷鏄浘渚嬮泦鍚堬紒");
+});
+</script>
+
+<style lang="less" scoped>
+.legend-container {
+ padding: 0.5rem; // 鍑忓皯鍐呰竟璺�
+ // background-color: #f9f9f9;
+ border: 1px solid #ddd;
+ border-radius: 8px;
+ max-width: 100%;
+ width: auto;
+ font-size: clamp(10px, 1vw, 14px); // 鏇村皬鐨勫熀纭�瀛楀彿
+}
+
+.legend-title {
+ width: 100%;
+ // border: 1px solid #ddd;
+ margin-bottom: 10%;
+ text-align: center;
+ letter-spacing: 2px;
+ font-weight: 600;
+ font-size: clamp(16px, 1vw, 20px); // 鏇村皬鐨勫熀纭�瀛楀彿
+
+}
+
+.legend-list {
+ list-style: none;
+ padding: 0;
+ // margin: 0;
+ display: flex;
+ flex-direction: column; // 鏀逛负鍨傜洿鏂瑰悜甯冨眬
+ gap: 0.5rem; // 鍑忓皯闂磋窛
+}
+
+.legend-item {
+ display: flex;
+ align-items: center;
+}
+
+.legend-icon {
+ width: 23px; // 鍑忓皯鍥炬爣澶у皬
+ height: 25px; // 鍑忓皯鍥炬爣澶у皬
+ margin-right: 0.5rem; // 鍑忓皯鍙宠竟璺�
+}
+
+.legend-label {
+ font-size: inherit; // 缁ф壙鐖剁骇瀛椾綋澶у皬
+}
+</style>
\ No newline at end of file
diff --git a/src/components/tools/Message.vue b/src/components/tools/Message.vue
index fa58e21..ff570f3 100644
--- a/src/components/tools/Message.vue
+++ b/src/components/tools/Message.vue
@@ -118,6 +118,11 @@
continue;
}
+ if (key === "areaName") {
+ formattedData.push({ name: "鍖哄煙鍚嶇О锛�", value: value || "鏃�" });
+ continue;
+ }
+
if (key === "name") {
formattedData.push({ name: "浠跨湡鏂规锛�", value: value || "鏃�" });
continue;
diff --git a/src/views/GisView.vue b/src/views/GisView.vue
index 74544da..3e08d52 100644
--- a/src/views/GisView.vue
+++ b/src/views/GisView.vue
@@ -468,8 +468,8 @@
position: absolute;
}
// // 淇敼鎸囧崡閽堜綅缃�
-// /deep/ .compass {
-// right: 128px !important;
-// top: 112px;
-// }
+/deep/ .compass {
+ right: 128px !important;
+ top: 112px;
+}
</style>
diff --git a/src/views/Home.vue b/src/views/Home.vue
index 81967cc..b50c1c7 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -22,7 +22,6 @@
<ImagePreview v-if="showPreview" />
<!-- <Weather v-if="weatherShow" @close="weatherShow = false" /> -->
<Bar v-if="barShow" @close="barShow = false" />
-
<Detail v-if="showDetail" />
</template>
diff --git a/src/views/yhgl.vue b/src/views/yhgl.vue
index c24a40c..087e943 100644
--- a/src/views/yhgl.vue
+++ b/src/views/yhgl.vue
@@ -1,10 +1,23 @@
<template>
<Location />
+ <Legend class="legend" />
+
</template>
<script setup>
- import Location from "@/components/menu/Location.vue"
+import Location from "@/components/menu/Location.vue"
+import Legend from "@/components/tools/Legend_yhgl.vue";
+
</script>
<style lang="less" scoped>
- @import url("../assets/css/home.css");
+.legend {
+ // background: url("@/assets/img/right/rightbg.png");
+ color: white;
+ position: fixed;
+ bottom: 6%;
+ right: 1%;
+ z-index: 3333;
+}
+
+@import url("../assets/css/home.css");
</style>
diff --git a/src/views/zhjc.vue b/src/views/zhjc.vue
index 8270d42..26d4f7a 100644
--- a/src/views/zhjc.vue
+++ b/src/views/zhjc.vue
@@ -1,10 +1,23 @@
<template>
- <Device />
+ <div>
+ <Device />
+ <Legend class="legend"/>
+ </div>
+
</template>
<script setup>
- import Device from "@/components/menu/Device.vue"
+import Legend from "@/components/tools/Legend_zhjc.vue";
+import Device from "@/components/menu/Device.vue"
</script>
<style lang="less" scoped>
+ .legend{
+ // background: url("@/assets/img/right/rightbg.png");
+ color: white;
+ position: fixed;
+ bottom: 6%;
+ right: 1%;
+ z-index: 3333;
+ }
@import url("../assets/css/home.css");
</style>
--
Gitblit v1.9.3