zhaoyang/smarthome
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

9/28

Browse Source 
1. 修改登录页面中：星期展示方法
2. 登录页面
3.
This commit is contained in:
Zy
2026-09-28 08:31:29 +08:00
parent 368e80f6bf
commit 4f7cb2d085
13 changed files with 182 additions and 666 deletions
Download Patch File Download Diff File Expand all files Collapse all files

193
src/store/modules/tagsView.ts
View File

@@ -1,9 +1,13 @@
import type { LocationQuery, RouteLocationNormalized, RouteMeta } from 'vue-router';
import { defineStore } from 'pinia';
import { ref } from 'vue';
import { useSettingsStore } from './settings';
import type {
LocationQuery,
RouteLocationNormalized,
RouteMeta,
} from "vue-router";
import { defineStore } from "pinia";
import { ref } from "vue";
import { useSettingsStore } from "./settings";
const PERSIST_KEY = 'tags-view-visited';
const PERSIST_KEY = "tags-view-visited";
type PersistedTagView = {
path: string;
@@ -24,7 +28,7 @@ const isPersistEnabled = () => {
const normalizeVisitedView = (view: RouteLocationNormalized): TagView => {
return Object.assign({}, view, {
title: view.meta?.title || 'no-name'
title: view.meta?.title || "no-name",
});
};
@@ -34,14 +38,14 @@ const saveVisitedViews = (views: any[]) => {
}
const payload: PersistedTagView[] = (views as TagView[])
.filter(view => !view.meta?.affix)
.map(view => ({
.filter((view) => !view.meta?.affix)
.map((view) => ({
path: view.path,
fullPath: view.fullPath,
name: view.name,
title: (view as any).title || view.meta?.title || 'no-name',
title: (view as any).title || view.meta?.title || "no-name",
query: view.query,
meta: view.meta
meta: view.meta,
}));
localStorage.setItem(PERSIST_KEY, JSON.stringify(payload));
@@ -65,7 +69,7 @@ const clearVisitedViews = () => {
localStorage.removeItem(PERSIST_KEY);
};
export const useTagsViewStore = defineStore('tagsView', () => {
export const useTagsViewStore = defineStore("tagsView", () => {
const visitedViews = ref<TagView[]>([]);
const cachedViews = ref<string[]>([]);
const iframeViews = ref<TagView[]>([]);
@@ -86,26 +90,49 @@ export const useTagsViewStore = defineStore('tagsView', () => {
};
const addIframeView = (view: RouteLocationNormalized): void => {
if (iframeViews.value.some((v: RouteLocationNormalized) => v.path === view.path)) return;
iframeViews.value.push(normalizeVisitedView(view) as RouteLocationNormalized);
if (
iframeViews.value.some(
(v: RouteLocationNormalized) => v.path === view.path,
)
)
return;
iframeViews.value.push(
normalizeVisitedView(view) as RouteLocationNormalized,
);
};
const delIframeView = (view: RouteLocationNormalized): Promise<RouteLocationNormalized[]> => {
return new Promise(resolve => {
iframeViews.value = iframeViews.value.filter((item: RouteLocationNormalized) => item.path !== view.path);
const delIframeView = (
view: RouteLocationNormalized,
): Promise<RouteLocationNormalized[]> => {
return new Promise((resolve) => {
iframeViews.value = iframeViews.value.filter(
(item: RouteLocationNormalized) => item.path !== view.path,
);
resolve(iframeViews.value.slice() as RouteLocationNormalized[]);
});
};
const addVisitedView = (view: RouteLocationNormalized): void => {
if (visitedViews.value.some((v: RouteLocationNormalized) => v.path === view.path)) return;
if (
visitedViews.value.some(
(v: RouteLocationNormalized) => v.path === view.path,
)
)
return;
visitedViews.value.push(normalizeVisitedView(view));
saveVisitedViews(visitedViews.value);
};
const addAffixView = (view: RouteLocationNormalized): void => {
if (visitedViews.value.some((v: RouteLocationNormalized) => v.path === view.path)) return;
const insertIndex = visitedViews.value.findIndex(item => !item.meta?.affix);
if (
visitedViews.value.some(
(v: RouteLocationNormalized) => v.path === view.path,
)
)
return;
const insertIndex = visitedViews.value.findIndex(
(item) => !item.meta?.affix,
);
const normalizedView = normalizeVisitedView(view);
if (insertIndex === -1) {
visitedViews.value.push(normalizedView);
@@ -115,13 +142,13 @@ export const useTagsViewStore = defineStore('tagsView', () => {
};
const loadPersistedViews = (): void => {
loadVisitedViews().forEach(view => {
if (visitedViews.value.some(item => item.path === view.path)) {
loadVisitedViews().forEach((view) => {
if (visitedViews.value.some((item) => item.path === view.path)) {
return;
}
visitedViews.value.push({
hash: '',
hash: "",
matched: [],
params: {},
redirectedFrom: undefined,
@@ -130,29 +157,31 @@ export const useTagsViewStore = defineStore('tagsView', () => {
query: view.query || {},
name: view.name || undefined,
meta: view.meta || {},
title: view.title || view.meta?.title || 'no-name'
title: view.title || view.meta?.title || "no-name",
} as TagView);
});
};
const delView = (
view: RouteLocationNormalized
view: RouteLocationNormalized,
): Promise<{
visitedViews: RouteLocationNormalized[];
cachedViews: string[];
}> => {
return new Promise(resolve => {
return new Promise((resolve) => {
delVisitedView(view);
delCachedView(view);
resolve({
visitedViews: visitedViews.value.slice() as RouteLocationNormalized[],
cachedViews: [...cachedViews.value]
cachedViews: [...cachedViews.value],
});
});
};
const delVisitedView = (view: RouteLocationNormalized): Promise<RouteLocationNormalized[]> => {
return new Promise(resolve => {
const delVisitedView = (
view: RouteLocationNormalized,
): Promise<RouteLocationNormalized[]> => {
return new Promise((resolve) => {
for (const [i, v] of visitedViews.value.entries()) {
if (v.path === view.path) {
visitedViews.value.splice(i, 1);
@@ -165,11 +194,11 @@ export const useTagsViewStore = defineStore('tagsView', () => {
};
const delCachedView = (view?: RouteLocationNormalized): Promise<string[]> => {
let viewName = '';
let viewName = "";
if (view) {
viewName = view.name as string;
}
return new Promise(resolve => {
return new Promise((resolve) => {
const index = cachedViews.value.indexOf(viewName);
index > -1 && cachedViews.value.splice(index, 1);
resolve([...cachedViews.value]);
@@ -177,34 +206,40 @@ export const useTagsViewStore = defineStore('tagsView', () => {
};
const delOthersViews = (
view: RouteLocationNormalized
view: RouteLocationNormalized,
): Promise<{
visitedViews: RouteLocationNormalized[];
cachedViews: string[];
}> => {
return new Promise(resolve => {
return new Promise((resolve) => {
delOthersVisitedViews(view);
delOthersCachedViews(view);
resolve({
visitedViews: visitedViews.value.slice() as RouteLocationNormalized[],
cachedViews: [...cachedViews.value]
cachedViews: [...cachedViews.value],
});
});
};
const delOthersVisitedViews = (view: RouteLocationNormalized): Promise<RouteLocationNormalized[]> => {
return new Promise(resolve => {
visitedViews.value = visitedViews.value.filter((v: RouteLocationNormalized) => {
return v.meta?.affix || v.path === view.path;
});
const delOthersVisitedViews = (
view: RouteLocationNormalized,
): Promise<RouteLocationNormalized[]> => {
return new Promise((resolve) => {
visitedViews.value = visitedViews.value.filter(
(v: RouteLocationNormalized) => {
return v.meta?.affix || v.path === view.path;
},
);
saveVisitedViews(visitedViews.value);
resolve(visitedViews.value.slice() as RouteLocationNormalized[]);
});
};
const delOthersCachedViews = (view: RouteLocationNormalized): Promise<string[]> => {
const delOthersCachedViews = (
view: RouteLocationNormalized,
): Promise<string[]> => {
const viewName = view.name as string;
return new Promise(resolve => {
return new Promise((resolve) => {
const index = cachedViews.value.indexOf(viewName);
if (index > -1) {
cachedViews.value = cachedViews.value.slice(index, index + 1);
@@ -219,26 +254,28 @@ export const useTagsViewStore = defineStore('tagsView', () => {
visitedViews: RouteLocationNormalized[];
cachedViews: string[];
}> => {
return new Promise(resolve => {
return new Promise((resolve) => {
delAllVisitedViews();
delAllCachedViews();
resolve({
visitedViews: visitedViews.value.slice() as RouteLocationNormalized[],
cachedViews: [...cachedViews.value]
cachedViews: [...cachedViews.value],
});
});
};
const delAllVisitedViews = (): Promise<RouteLocationNormalized[]> => {
return new Promise(resolve => {
visitedViews.value = visitedViews.value.filter((tag: RouteLocationNormalized) => tag.meta?.affix);
return new Promise((resolve) => {
visitedViews.value = visitedViews.value.filter(
(tag: RouteLocationNormalized) => tag.meta?.affix,
);
clearVisitedViews();
resolve(visitedViews.value.slice() as RouteLocationNormalized[]);
});
};
const delAllCachedViews = (): Promise<string[]> => {
return new Promise(resolve => {
return new Promise((resolve) => {
cachedViews.value = [];
resolve([...cachedViews.value]);
});
@@ -254,45 +291,57 @@ export const useTagsViewStore = defineStore('tagsView', () => {
saveVisitedViews(visitedViews.value);
};
const delRightTags = (view: RouteLocationNormalized): Promise<RouteLocationNormalized[]> => {
return new Promise(resolve => {
const index = visitedViews.value.findIndex((v: RouteLocationNormalized) => v.path === view.path);
const delRightTags = (
view: RouteLocationNormalized,
): Promise<RouteLocationNormalized[]> => {
return new Promise((resolve) => {
const index = visitedViews.value.findIndex(
(v: RouteLocationNormalized) => v.path === view.path,
);
if (index === -1) {
resolve(visitedViews.value.slice() as RouteLocationNormalized[]);
return;
}
visitedViews.value = visitedViews.value.filter((item: RouteLocationNormalized, idx: number) => {
if (idx <= index || (item.meta && item.meta.affix)) {
return true;
}
const i = cachedViews.value.indexOf(item.name as string);
if (i > -1) {
cachedViews.value.splice(i, 1);
}
return false;
});
visitedViews.value = visitedViews.value.filter(
(item: RouteLocationNormalized, idx: number) => {
if (idx <= index || (item.meta && item.meta.affix)) {
return true;
}
const i = cachedViews.value.indexOf(item.name as string);
if (i > -1) {
cachedViews.value.splice(i, 1);
}
return false;
},
);
saveVisitedViews(visitedViews.value);
resolve(visitedViews.value.slice() as RouteLocationNormalized[]);
});
};
const delLeftTags = (view: RouteLocationNormalized): Promise<RouteLocationNormalized[]> => {
return new Promise(resolve => {
const index = visitedViews.value.findIndex((v: RouteLocationNormalized) => v.path === view.path);
const delLeftTags = (
view: RouteLocationNormalized,
): Promise<RouteLocationNormalized[]> => {
return new Promise((resolve) => {
const index = visitedViews.value.findIndex(
(v: RouteLocationNormalized) => v.path === view.path,
);
if (index === -1) {
resolve(visitedViews.value.slice() as RouteLocationNormalized[]);
return;
}
visitedViews.value = visitedViews.value.filter((item: RouteLocationNormalized, idx: number) => {
if (idx >= index || (item.meta && item.meta.affix)) {
return true;
}
const i = cachedViews.value.indexOf(item.name as string);
if (i > -1) {
cachedViews.value.splice(i, 1);
}
return false;
});
visitedViews.value = visitedViews.value.filter(
(item: RouteLocationNormalized, idx: number) => {
if (idx >= index || (item.meta && item.meta.affix)) {
return true;
}
const i = cachedViews.value.indexOf(item.name as string);
if (i > -1) {
cachedViews.value.splice(i, 1);
}
return false;
},
);
saveVisitedViews(visitedViews.value);
resolve(visitedViews.value.slice() as RouteLocationNormalized[]);
});
@@ -332,6 +381,6 @@ export const useTagsViewStore = defineStore('tagsView', () => {
delLeftTags,
addIframeView,
delIframeView,
loadPersistedViews
loadPersistedViews,
};
});

13
src/utils/time.ts Normal file
View File

@@ -0,0 +1,13 @@
/**
* 根据数字 1-7 生成对应星期
* @param num 1=周一，2=周二...7=周日
* @param options 选项对象
* @param options.prefix 选项，可自定义前缀，默认 '周'
* @returns 周一 / 周二 ... / 周日
*/
export function numToWeek(num: number,options = {
prefix: '周',
}): string {
const weekMap = ['一', '二', '三', '四', '五', '六', '日'];
return options.prefix + weekMap[num - 1] || '';
}

47
src/views/login.vue
View File

@@ -47,18 +47,12 @@
<div
class="metric-card"
:class="{
active: item.isActivcty,
active: item.isAction,
}"
></div>
<div>
周{{
new Intl.NumberFormat("zh-Hans-CN-u-nu-hanidec").format(
item.formatlday + 1,
)
}}
<span style="font-size: 12px"
>({{ item.month }}.{{ item.date }})</span
>
<span>{{ numToWeek(item.formateDay + 1)}}</span>
<span style="font-size: 12px">({{ item.month }}.{{ item.date }})</span>
</div>
</article>
</div>
@@ -162,12 +156,13 @@
</template>
<script setup lang="ts">
import { to } from "await-to-js";
import { GeoResult, getCurrentPosition } from "@/utils/geolocation";
import { useI18n } from "vue-i18n";
import { getCodeImg } from "@/api/login";
import { LoginData } from "@/api/types";
import { useUserStore } from "@/store/modules/user";
import {to} from "await-to-js";
import {GeoResult, getCurrentPosition} from "@/utils/geolocation";
import {useI18n} from "vue-i18n";
import {getCodeImg} from "@/api/login";
import {LoginData} from "@/api/types";
import {useUserStore} from "@/store/modules/user";
import {numToWeek} from "@/utils/time";
const title = import.meta.env.VITE_APP_TITLE;
const quickStats = ref([]);
@@ -292,17 +287,14 @@ const handleGetLoc = async () => {
.then((res) => res.json())
.then((res) => {
const arr = res.data.forecast.daily.pm10 ?? [];
console.log(arr.slice(0, 7));
const list = handleMaxWaqi(arr.slice(0, 7));
quickStats.value = list;
console.log(list);
quickStats.value = handleMax(arr.slice(0, 7));
});
} catch (e) {
console.error((e as Error).message);
}
};
function handleMaxWaqi(arr: { avg: number; day: string }[]) {
function handleMax(arr: { avg: number; day: string }[]) {
const maxVal = Math.max(...arr.map((item) => item.avg));
const nowDate = new Date();
return arr.map((item) => {
@@ -312,9 +304,9 @@ function handleMaxWaqi(arr: { avg: number; day: string }[]) {
...item,
rate,
month: newDate.getMonth() + 1,
formatlday: newDate.getDay(),
formateDay: newDate.getDay(),
date: newDate.getDate(),
isActivcty: newDate.getDate() === nowDate.getDate(),
isAction: newDate.getDate() === nowDate.getDate(),
};
});
}
@@ -369,7 +361,7 @@ onMounted(() => {
.title {
height: 28px;
line-height: 28px;
border-radius: 0px 0px 0px 0px;
border-radius: 0 0 0 0;
background-color: rgba(0, 0, 0, 0);
color: rgba(255, 255, 255, 1);
font-size: 20px;
@@ -377,7 +369,7 @@ onMounted(() => {
.subTitle {
height: 18px;
line-height: 18px;
border-radius: 0px 0px 0px 0px;
border-radius: 0 0 0 0;
background-color: rgba(0, 0, 0, 0);
color: rgba(255, 255, 255, 0.722);
font-size: 13px;
@@ -451,7 +443,7 @@ onMounted(() => {
gap: 16px;
height: 105px;
.metric-card {
border-radius: 8px 8px 0px 0px;
border-radius: 8px 8px 0 0;
background-color: rgba(255, 255, 255, 0.3);
border: 1px solid rgba(255, 255, 255, 0.08);
display: flex;
@@ -475,7 +467,7 @@ onMounted(() => {
.brand-footer {
margin-top: 157px;
line-height: 16px;
border-radius: 0px 0px 0px 0px;
border-radius: 0 0 0 0;
background-color: rgba(0, 0, 0, 0);
color: rgba(255, 255, 255, 0.502);
font-size: 13px;
@@ -540,7 +532,7 @@ onMounted(() => {
.loginModel {
height: 22px;
line-height: 22px;
border-radius: 0px 0px 0px 0px;
border-radius: 0 0 0 0;
background-color: rgba(0, 0, 0, 0);
color: rgba(37, 99, 235, 1);
font-size: 15px;
@@ -636,7 +628,6 @@ onMounted(() => {
.login-form :deep(.el-input__wrapper) {
min-height: 48px;
background-color: var(--el-bg-color);
background-color: rgba(247, 248, 250, 1);
box-shadow: 0 0 0 1px var(--app-surface-border) inset;
}