diff --git a/README.md b/README.md index 0238fbd79168a69538bfda163e355c193ec4045f..336154d811e6f562a093ac5f555564367254fba1 100644 --- a/README.md +++ b/README.md @@ -35,8 +35,8 @@ ## 预览 **主题** -- [sim 在线预览](https://nav3.cn/#/sim) -- [light 在线预览](https://nav3.cn/#/light) +- [Sim 在线预览](https://nav3.cn/#/sim) +- [Light 在线预览](https://nav3.cn/#/light) ![Preview](media/1.png) ![Preview](media/2.png) diff --git a/build.mjs b/build.mjs index b332e6d8b406a85cdb7808046e09b251df0ed3cd..27d1a351ed14f9e8c997f285231452755bde25f2 100644 --- a/build.mjs +++ b/build.mjs @@ -4,6 +4,9 @@ import fs from 'fs' import config from './nav.config.js' import path from 'path' +const now = new Date() +const date = `${now.getMonth() + 1}-${now.getDate()}-${now.getDay()} ${now.getHours()}:${now.getMinutes()}` + const { description, title, keywords, baiduStatisticsUrl } = config.default const htmlTemplate = ` ${title} @@ -20,6 +23,7 @@ hm.src = '${baiduStatisticsUrl}'; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); + `.trim() try { diff --git a/nav.config.ts b/nav.config.ts index 94a987abf81efd8155b588791217cc98a76aa7be..66119bdee3d2e267aa2f52dce5d4054e58da9e77 100644 --- a/nav.config.ts +++ b/nav.config.ts @@ -71,7 +71,7 @@ const c: IConfig = { baiduStatisticsUrl: 'https://hm.baidu.com/hm.js?4582be7af7e7c95ef75351e07c6c32ba', // 只支持 Light 主题 - // https://www.nav3.cn/#/index?q=grabient + // https://www.nav3.cn/#/light?q=grabient backgroundLinear: [ 'linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%)', 'linear-gradient(90deg, #FEE140 0%, #FA709A 100%)', diff --git a/src/assets/img/view.svg b/src/assets/img/view.svg new file mode 100644 index 0000000000000000000000000000000000000000..c4b3e4da36ff6dcc23f0ece49f0a0f8a984a175b --- /dev/null +++ b/src/assets/img/view.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/create/create.component.html b/src/components/create/create.component.html index 4562f1edbb926f05b799ac70a2da15b95d905d98..21bbd6abb4df8be2d7c4f5054a2a00861258f649 100644 --- a/src/components/create/create.component.html +++ b/src/components/create/create.component.html @@ -83,14 +83,20 @@ 网站链接 - + 图标地址 - + + + + + + + diff --git a/src/components/create/create.component.scss b/src/components/create/create.component.scss index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..3d2a49a9edf4f7733390851e8d0465e647ef381a 100644 --- a/src/components/create/create.component.scss +++ b/src/components/create/create.component.scss @@ -0,0 +1,5 @@ +.prefix-icon { + width: 20px; + height: 20px; + pointer-events: none; +} diff --git a/src/components/create/create.component.ts b/src/components/create/create.component.ts index cfe097469bdf8adb10e1268805a384cfc2a066f8..12e97c07fb60cff6ddb8a30b527c0982aae0cd8d 100644 --- a/src/components/create/create.component.ts +++ b/src/components/create/create.component.ts @@ -1,7 +1,7 @@ // Copyright @ 2018-2021 xiejiahe. All rights reserved. MIT license. import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core' -import { setWebsiteList } from '../../utils' +import { setWebsiteList, getLogoUrl } from '../../utils' import { NzMessageService } from 'ng-zorro-antd/message' import { NzNotificationService } from 'ng-zorro-antd/notification' import { updateFileContent } from '../../services' @@ -27,6 +27,7 @@ export class CreateComponent implements OnInit { isLogin = !!getToken() radioType: '1'|'2'|'3'|'6' = '6' submiting = false + iconUrl = '' constructor( private fb: FormBuilder, @@ -34,7 +35,7 @@ export class CreateComponent implements OnInit { private notification: NzNotificationService, ) {} - ngOnInit(): void { + ngOnInit() { this.validateForm = this.fb.group({ title: [null, [Validators.required]], oneSelect: [null, [Validators.required]], @@ -62,6 +63,12 @@ export class CreateComponent implements OnInit { } } + async onUrlBlur(e) { + const res = await getLogoUrl(e.target?.value) + this.iconUrl = (res || '') as string + this.validateForm.get('icon')!.setValue(res || '') + } + hanldeOneSelect(value) { if (!value) return diff --git a/src/components/fixbar/index.component.html b/src/components/fixbar/index.component.html index 4fb75ca734735c8b6211431b2568b69359ea53c7..898b62d46ae98a9a56178b491261a7dd56783005 100644 --- a/src/components/fixbar/index.component.html +++ b/src/components/fixbar/index.component.html @@ -1,4 +1,13 @@
+ +
+ +
+ +
Token: ${getToken()}

+

上次构建时间: ${date || '未知'}

+ `, + }); + } + toggleZorroDark(dark: boolean) { if (dark) { const link = document.createElement('link') diff --git a/src/components/logo/logo.component.html b/src/components/logo/logo.component.html index ad59dbe3e9a0d8b5aea347758e494911c9e0f340..fe33f907619ce71778dabcdfa23dee604013349c 100644 --- a/src/components/logo/logo.component.html +++ b/src/components/logo/logo.component.html @@ -3,14 +3,15 @@ [src]="src" class="icon dark-border-color" (error)="onImgError($event)" + [ngStyle]="{ width: (size || 35) + 'px', height: (size || 35) + 'px' }" > diff --git a/src/components/logo/logo.component.scss b/src/components/logo/logo.component.scss index 351157ca1f6d54d7c39a5369ce1abeaf2d898350..6976479a514a37309a84455cfacf1f4d546deca7 100644 --- a/src/components/logo/logo.component.scss +++ b/src/components/logo/logo.component.scss @@ -1,7 +1,5 @@ .icon { display: inline-block; - width: 35px; - height: 35px; vertical-align: middle; border-radius: 50%; pointer-events: none; diff --git a/src/components/logo/logo.component.ts b/src/components/logo/logo.component.ts index 903669eea6135f617fc01013247a6465871547be..a67d0d696f3dc14023e8b19ae262db64b0e1783b 100644 --- a/src/components/logo/logo.component.ts +++ b/src/components/logo/logo.component.ts @@ -9,6 +9,7 @@ export class LogoComponent implements OnInit { @Input() src: string @Input() name: string @Input() colour: string + @Input() size: number hasError = false color = '#1890ff' diff --git a/src/utils/index.ts b/src/utils/index.ts index a83c3ec053e9f1f30c1e6fe07c92ec8f062edb32..1eca2c6e89e440632d71da42e79db23f6b13a858 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -169,7 +169,7 @@ export function getWebsiteList() { // 检测到网站更新，清除缓存 if (storageScriptUrl !== scriptUrl) { - const whiteList = ['token'] + const whiteList = ['token', 'IS_DARK'] const len = window.localStorage.length for (let i = 0; i < len; i++) { const key = window.localStorage.key(i) @@ -256,3 +256,32 @@ export function isDark(): boolean { return Boolean(Number(storageVal)) } + +export async function getLogoUrl(url: string): Promise { + try { + // const c = ['/favicon.ico', '/favicon.png', '/logo.png', '/favicon.svg', '/favicon.jpg'] + const { origin } = new URL(url) + const iconUrl = origin + '/favicon.ico' + + return new Promise(resolve => { + try { + const img = document.createElement('img') + img.src = iconUrl + img.style.display = 'none' + img.onload = () => { + img.parentNode.removeChild(img) + resolve(iconUrl) + } + img.onerror = () => { + img.parentNode.removeChild(img) + resolve(false) + } + document.body.append(img) + } catch (error) { + resolve(false) + } + }) + } catch { + return false + } +}