ca680ab41b
- Add new HeritageDiscoverySection and HeritageQuickPrompts components for dedicated heritage discovery view - Implement reusable AigcConsentDialog component for AI service user agreement prompts - Update Discovery page to toggle between explore and heritage tab layouts - Refactor legacy CardSwiper component into generic ExploreCards - Adjust ChatMainList layout to include home hero sprite animation and restructure welcome section - Refine NoticeMessage component styling and layout for better consistency - Add build best practices guidance to AGENTS.md documentation - Clean up minor config whitespace and formatting issues across files
168 lines
3.8 KiB
Vue
168 lines
3.8 KiB
Vue
<template>
|
|
<view class="home-welcome-panel">
|
|
<view class="home-welcome-header">
|
|
<text class="home-welcome-title ellipsis-1">
|
|
{{ props.mainPageDataModel.welcomeContent || "小七欢迎你～" }}
|
|
</text>
|
|
<text v-if="weatherText" class="home-welcome-weather">
|
|
{{ weatherText }}
|
|
</text>
|
|
</view>
|
|
|
|
<NoticeMessage :tipsMessage="props.mainPageDataModel.tipsMessage" />
|
|
</view>
|
|
</template>
|
|
<script setup>
|
|
import { onMounted, ref } from "vue";
|
|
import NoticeMessage from "../NoticeMessage/index.vue";
|
|
import { getLocalWeather } from "@/request/api/MainPageDataApi";
|
|
|
|
const weatherText = ref("");
|
|
|
|
const props = defineProps({
|
|
mainPageDataModel: {
|
|
type: Object,
|
|
default: () => {
|
|
return {
|
|
initPageImages: {
|
|
backgroundImageUrl: "",
|
|
logoImageUrl: "",
|
|
welcomeImageUrl: "",
|
|
}
|
|
};
|
|
},
|
|
},
|
|
});
|
|
|
|
const getLocalWeatherData = async () => {
|
|
const res = await getLocalWeather();
|
|
if (res && res.code === 0) {
|
|
const { temperature, weather } = res.data;
|
|
weatherText.value = `${temperature}°C ${getWeatherEmoji(weather)}`;
|
|
}
|
|
}
|
|
|
|
onMounted(() => {
|
|
getLocalWeatherData();
|
|
});
|
|
|
|
const getWeatherEmoji = (text) => {
|
|
const weather = String(text || "");
|
|
if (weatherTextMap[weather]) return weatherTextMap[weather];
|
|
if (weather.includes("晴")) return "☀️";
|
|
if (weather.includes("云")) return "☁️";
|
|
if (weather.includes("雨")) return "🌧️";
|
|
if (weather.includes("雷")) return "⛈️";
|
|
if (weather.includes("雪")) return "🌨️";
|
|
if (weather.includes("雾") || weather.includes("霾")) return "😷";
|
|
if (weather.includes("风")) return "🌬️";
|
|
if (weather.includes("沙")) return "🌪️";
|
|
return "❓";
|
|
}
|
|
|
|
const weatherTextMap = {
|
|
// 晴 / 云
|
|
"晴": "☀️",
|
|
"少云": "🌤️",
|
|
"晴间多云": "⛅",
|
|
"多云": "☁️",
|
|
"阴": "☁️",
|
|
|
|
// 风
|
|
"有风": "🌬️",
|
|
"平静": "🍃",
|
|
"微风": "🌬️",
|
|
"和风": "🌬️",
|
|
"清风": "🌬️",
|
|
"强风/劲风": "💨",
|
|
"疾风": "💨",
|
|
"大风": "💨",
|
|
"烈风": "💨",
|
|
"风暴": "🌪️",
|
|
"狂爆风": "🌪️",
|
|
"飓风": "🌀",
|
|
"龙卷风": "🌪️",
|
|
|
|
// 雨
|
|
"阵雨": "🌦️",
|
|
"雷阵雨": "⛈️",
|
|
"雷阵雨并伴有冰雹": "⛈️",
|
|
"小雨": "🌧️",
|
|
"中雨": "🌧️",
|
|
"大雨": "🌧️",
|
|
"暴雨": "🌧️",
|
|
"大暴雨": "🌧️",
|
|
"特大暴雨": "🌧️",
|
|
"强阵雨": "🌦️",
|
|
"毛毛雨/细雨": "🌦️",
|
|
|
|
// 雪
|
|
"小雪": "🌨️",
|
|
"中雪": "🌨️",
|
|
"大雪": "❄️",
|
|
"暴雪": "❄️",
|
|
"雨夹雪": "🌨️",
|
|
"阵雪": "🌨️",
|
|
|
|
// 雾霾 / 沙尘
|
|
"雾": "🌁", // 有能见度的雾（城市感）
|
|
"轻雾": "🌫️", // 轻微雾气
|
|
"浓雾": "🌁", // 更厚的雾（用城市雾更直观）
|
|
"大雾": "🌁",
|
|
"强浓雾": "🌁",
|
|
"特强浓雾": "🌁",
|
|
|
|
// 😷 霾（偏污染）
|
|
"霾": "😷", // 直接表达空气差（用户感知最强）
|
|
"中度霾": "😷",
|
|
"重度霾": "🤢", // 更严重一点
|
|
"严重霾": "☠️", // 极端情况（视觉冲击强）
|
|
|
|
"扬沙": "🌪️",
|
|
"浮尘": "🌪️",
|
|
"沙尘暴": "🌪️",
|
|
"强沙尘暴": "🌪️",
|
|
|
|
// 特殊
|
|
"热": "🔥",
|
|
"冷": "🥶"
|
|
};
|
|
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.home-welcome-panel {
|
|
width: 100%;
|
|
height: 92px;
|
|
padding: 12px 12px 0;
|
|
box-sizing: border-box;
|
|
background: $theme-color-50;
|
|
}
|
|
|
|
.home-welcome-header {
|
|
height: 24px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
min-width: 0;
|
|
}
|
|
|
|
.home-welcome-title {
|
|
flex: 1;
|
|
min-width: 0;
|
|
color: $text-color-900;
|
|
font-size: 21px;
|
|
line-height: 28px;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.home-welcome-weather {
|
|
flex-shrink: 0;
|
|
margin-left: 12px;
|
|
color: $text-color-900;
|
|
font-size: 22px;
|
|
line-height: 26px;
|
|
font-weight: 900;
|
|
}
|
|
</style>
|