From e15245c624a20a3b46e428d646f5f2dd863cd1bc Mon Sep 17 00:00:00 2001
From: guonan <guonan201020@163.com>
Date: 星期四, 17 四月 2025 14:22:36 +0800
Subject: [PATCH] 完善
---
src/views/Screen.vue | 272 ++++++++++++++++++++++++++++--------------------------
1 files changed, 141 insertions(+), 131 deletions(-)
diff --git a/src/views/Screen.vue b/src/views/Screen.vue
index b6907aa..0135f5f 100644
--- a/src/views/Screen.vue
+++ b/src/views/Screen.vue
@@ -1,141 +1,151 @@
<template>
- <div class="screen">
- <div class="screen-top" :class="bgVisible ? '' : 'nonebg'">
- <div class="screen-top-logo" @click="initScene()"></div>
- </div>
- <div class="screen-left" :class="bgVisible ? '' : 'nonebg'"></div>
- <div class="screen-right" :class="bgVisible ? '' : 'nonebg'"></div>
- <div class="screen-bottom" :class="bgVisible ? '' : 'nonebg'"></div>
+ <div class="screen">
+ <div class="screen-top" :class="bgVisible ? '' : 'nonebg'">
+ <div class="screen-top-logo" @click="initScene()"></div>
+ </div>
+ <div class="screen-left" :class="bgVisible ? '' : 'nonebg'"></div>
+ <div class="screen-right" :class="bgVisible ? '' : 'nonebg'"></div>
+ <div class="screen-bottom" :class="bgVisible ? '' : 'nonebg'"></div>
- <div class="screen-leftbg"></div>
- <div class="screen-rightbg"></div>
+ <div class="screen-leftbg"></div>
+ <div class="screen-rightbg"></div>
- <div class="screen-widget">
- <div class="screen-widget-weather" @click="openWeather">
- <div class="screen-widget-icon">
- <img style="width: 26px; height: 26px" :src="weatherIcon" alt="" />
- </div>
- <div class="screen-widget-text">
- {{ weather.now.text }} {{ weather.now.temperature + "鈩�" }}
- </div>
- <div class="screen-widget-time screen-widget-text" style="margin-left: 20px">
- {{ $dayjs().format("YYYY/MM/DD HH:mm") }}
- </div>
- </div>
- <div class="screen-widget-home">
- <div class="screen-widget-icon"></div>
- <div class="screen-widget-text" @click="flyToHomeView">杩斿洖涓婚〉</div>
- </div>
- <div class="screen-widget-location">
- <div class="screen-widget-icon"></div>
- <div class="screen-widget-text">{{ defaultCity }}</div>
- </div>
- </div>
- </div>
+ <div class="screen-widget">
+ <div class="screen-widget-weather" @click="openWeather">
+ <div class="screen-widget-icon">
+ <img style="width: 26px; height: 26px" :src="weatherIcon" alt="" />
+ </div>
+ <div class="screen-widget-text">
+ {{ weather.now.text }} {{ weather.now.temperature + "鈩�" }}
+ </div>
+ <div
+ class="screen-widget-time screen-widget-text"
+ style="margin-left: 20px"
+ >
+ {{ $dayjs().format("YYYY/MM/DD HH:mm") }}
+ </div>
+ </div>
+ <div class="screen-widget-home">
+ <div class="screen-widget-icon"></div>
+ <div class="screen-widget-text" @click="flyToHomeView">杩斿洖涓婚〉</div>
+ </div>
+ <div class="screen-widget-location">
+ <div class="screen-widget-icon"></div>
+ <div class="screen-widget-text">{{ defaultCity }}</div>
+ </div>
+ </div>
+ </div>
</template>
<script setup>
- import { ref, onMounted, computed, defineEmits } from "vue"
- import { useRouter } from "vue-router"
- const router = useRouter()
- const bgVisible = ref(true)
- const defaultCity = ref(cityData.name)
- const emits = defineEmits("showWeatherDetail")
- function init(visible) {
- bgVisible.value = visible
- }
- const weatherIcon = computed(() => {
- return `https://cdn.sencdn.com/widget2/assets/img/chameleon/weather/${weather.value.now.code}.svg `
- })
- const weather = ref({
- location: {
- id: "WKNM0GVFCUJJ",
- name: "鍖椾含",
- country: "CN",
- path: "鍖椾含,鍖椾含,涓浗",
- timezone: "Asia/Shanghai",
- timezone_offset: "+08:00",
- },
- now: {
- text: "鏅�",
- code: "9",
- temperature: "20",
- feels_like: "31",
- pressure: "990",
- humidity: "84",
- visibility: "24.13",
- wind_direction: "涓�",
- wind_direction_degree: "79",
- wind_speed: "10.0",
- wind_scale: "2",
- clouds: "62",
- dew_point: "",
- },
- last_update: "2023-04-21T11:02:40+08:00",
- })
- const air = ref({
- city: {
- quality: "浼�",
- },
- })
- const getWeatherData = () => {
- fetch(
- "https://api.seniverse.com/v3/weather/now.json?key=Sn4df5dIxeplgBv3X&location=beijing&language=zh-Hans&unit=c",
- {
- mode: "cors", // no-cors, *cors, same-origin
- cache: "no-cache", // *default, no-cache, reload, force-cache, only-if-cached
- headers: {
- // "Content-Type": "application/json",
- "Content-Type": "application/x-www-form-urlencoded",
- },
- }
- )
- .then(response => response.json())
- .then(data => {
- weather.value = data.results[0]
- // console.log(weather.value)
- })
- }
- function initScene() {
- flyToHomeView()
- let desc = {
- func_name: "FlyTo",
- vectorType: "WGS84",
- x: "102.410951",
- y: "36.838083",
- z: "20611.588439",
- yaw: "-87.464172",
- pitch: "-89.0",
- distance: "4918164.228809",
- PlayRate: "5",
- Name: "鐢樿們椤惰鍥�",
- }
- ps.emitMessage(desc)
- }
+import { ref, onMounted, computed, defineEmits } from "vue";
+import { useRouter } from "vue-router";
+const router = useRouter();
+const bgVisible = ref(true);
+const defaultCity = ref(cityData.name);
+const emits = defineEmits("showWeatherDetail");
+function init(visible) {
+ bgVisible.value = visible;
+}
+const weatherIcon = computed(() => {
+ return `https://cdn.sencdn.com/widget2/assets/img/chameleon/weather/${weather.value.now.code}.svg `;
+});
+const weather = ref({
+ location: {
+ id: "WKNM0GVFCUJJ",
+ name: "鍖椾含",
+ country: "CN",
+ path: "鍖椾含,鍖椾含,涓浗",
+ timezone: "Asia/Shanghai",
+ timezone_offset: "+08:00",
+ },
+ now: {
+ text: "鏅�",
+ code: "9",
+ temperature: "20",
+ feels_like: "31",
+ pressure: "990",
+ humidity: "84",
+ visibility: "24.13",
+ wind_direction: "涓�",
+ wind_direction_degree: "79",
+ wind_speed: "10.0",
+ wind_scale: "2",
+ clouds: "62",
+ dew_point: "",
+ },
+ last_update: "2023-04-21T11:02:40+08:00",
+});
+const air = ref({
+ city: {
+ quality: "浼�",
+ },
+});
+const getWeatherData = () => {
+ fetch(
+ "https://api.seniverse.com/v3/weather/now.json?key=Sn4df5dIxeplgBv3X&location=beijing&language=zh-Hans&unit=c",
+ {
+ mode: "cors", // no-cors, *cors, same-origin
+ cache: "no-cache", // *default, no-cache, reload, force-cache, only-if-cached
+ headers: {
+ // "Content-Type": "application/json",
+ "Content-Type": "application/x-www-form-urlencoded",
+ },
+ }
+ )
+ .then((response) => response.json())
+ .then((data) => {
+ weather.value = data.results[0];
+ // console.log(weather.value)
+ });
+};
+function initScene() {
+ flyToHomeView();
+ let desc = {
+ func_name: "FlyTo",
+ vectorType: "WGS84",
+ x: "102.410951",
+ y: "36.838083",
+ z: "20611.588439",
+ yaw: "-87.464172",
+ pitch: "-89.0",
+ distance: "4918164.228809",
+ PlayRate: "5",
+ Name: "鐢樿們椤惰鍥�",
+ };
+ ps.emitMessage(desc);
+}
- function openWeather() {
- emits("showWeatherDetail")
- }
- function flyToHomeView() {
- router.push("/")
- const view = {
- destination: {
- x: -2355432.569004413,
- y: 4687573.191838412,
- z: 4098726.315265574,
- },
- orientation: {
- pitch: -0.9541030830183503,
- roll: 0.00031421159527500464,
- heading: 6.140424766644804,
- },
- }
- viewer.scene.camera.flyTo(view)
- }
- onMounted(() => {
- // getWeatherData()
- })
+function openWeather() {
+ emits("showWeatherDetail");
+}
+
+import { useSimStore } from "@/store/simulation";
+import { storeToRefs } from "pinia";
+const simStore = useSimStore();
+const { showDangerAssess, rightRiverShow } = storeToRefs(simStore);
+function flyToHomeView() {
+ rightRiverShow.value = false;
+ showDangerAssess.value = false;
+ router.push("/");
+ const view = {
+ destination: {
+ x: -2355432.569004413,
+ y: 4687573.191838412,
+ z: 4098726.315265574,
+ },
+ orientation: {
+ pitch: -0.9541030830183503,
+ roll: 0.00031421159527500464,
+ heading: 6.140424766644804,
+ },
+ };
+ viewer.scene.camera.flyTo(view);
+}
+onMounted(() => {
+ // getWeatherData()
+});
</script>
<style lang="less" scoped>
- @import url("../assets/css/screen.css");
+@import url("../assets/css/screen.css");
</style>
--
Gitblit v1.9.3