Browse Source

fix bug

main
谢亚昕 2 months ago
parent
commit
de1fd42f76
  1. 6
      electron-builder.yml
  2. 3
      electron.vite.config.ts
  3. 8
      src/main/modules/updater/index.ts
  4. 9
      src/main/modules/zephyr/index.ts
  5. 6
      src/main/utils/index.ts
  6. 8
      src/renderer/src/assets/libs/scrollbot.ts
  7. 135
      src/renderer/src/components/AdjustLine.vue
  8. 7
      src/renderer/src/components/NavBar.vue
  9. 7
      src/renderer/src/pages/_ui/App.vue
  10. 5
      src/renderer/src/pages/_ui/Browser.vue
  11. 12
      src/renderer/src/pages/about/index.vue
  12. 75
      src/renderer/src/pages/index.vue
  13. 1
      src/renderer/typed-router.d.ts

6
electron-builder.yml

@ -1,5 +1,5 @@
appId: com.electron.app appId: com.zephyr.app
productName: my-app productName: zephyr
directories: directories:
buildResources: build buildResources: build
files: files:
@ -12,7 +12,7 @@ files:
asarUnpack: asarUnpack:
- resources/** - resources/**
win: win:
executableName: my-app executableName: zephyr
nsis: nsis:
artifactName: ${name}-${version}-setup.${ext} artifactName: ${name}-${version}-setup.${ext}
shortcutName: ${productName} shortcutName: ${productName}

3
electron.vite.config.ts

@ -25,6 +25,7 @@ export default defineConfig({
plugins: [externalizeDepsPlugin()], plugins: [externalizeDepsPlugin()],
}, },
renderer: { renderer: {
root: resolve(__dirname, "./src/renderer"),
resolve: { resolve: {
alias: { alias: {
config: resolve("config"), config: resolve("config"),
@ -43,7 +44,7 @@ export default defineConfig({
rollupOptions: { rollupOptions: {
input: { input: {
main: resolve(__dirname, "./src/renderer/index.html"), main: resolve(__dirname, "./src/renderer/index.html"),
about: resolve(__dirname, "src/renderer/about.html"), about: resolve(__dirname, "./src/renderer/about.html"),
}, },
}, },
}, },

8
src/main/modules/updater/index.ts

@ -1,8 +1,8 @@
import pkg from "electron-updater" import pkg from "electron-updater"
import { app, dialog } from "electron" import { app, dialog } from "electron"
import { injectable, inject } from "inversify" import { injectable } from "inversify"
import BaseClass from "main/base/base" import BaseClass from "main/base/base"
import { Setting } from "../setting" // import { Setting } from "../setting"
import _debug from "debug" import _debug from "debug"
import EventEmitter from "events" import EventEmitter from "events"
@ -13,7 +13,9 @@ const { autoUpdater } = pkg
export class Updater extends BaseClass { export class Updater extends BaseClass {
public events = new EventEmitter() public events = new EventEmitter()
constructor(@inject(Setting) private _Setting: Setting) { constructor(
// @inject(Setting) private _Setting: Setting
) {
super() super()
// 配置自动更新 // 配置自动更新

9
src/main/modules/zephyr/index.ts

@ -1,6 +1,5 @@
import { session, net } from "electron" import { session, net } from "electron"
import { inject, injectable } from "inversify" import { injectable } from "inversify"
import IOC from "main/_ioc"
import BaseClass from "main/base/base" import BaseClass from "main/base/base"
import _debug from "debug" import _debug from "debug"
@ -8,10 +7,12 @@ const debug = _debug("app:zephyr")
@injectable() @injectable()
class Zephyr extends BaseClass { class Zephyr extends BaseClass {
constructor(@inject(IOC) private _IOC: IOC) { constructor(
// @inject(IOC) private _IOC: IOC
) {
super() super()
this.interceptHandlerZephyr = this.interceptHandlerZephyr.bind(this) this.interceptHandlerZephyr = this.interceptHandlerZephyr.bind(this)
debug("aaaaaaaaaaaaaaaaaaaaaa") debug("zephyr init")
} }
destroy() { destroy() {

6
src/main/utils/index.ts

@ -2,12 +2,12 @@ import { is } from "@electron-toolkit/utils"
import { join } from "node:path" import { join } from "node:path"
import { webContents } from "electron" import { webContents } from "electron"
export function getFileUrl(app: string, route: string = "") { export function getFileUrl(app: string) {
let winURL = "" let winURL = ""
if (is.dev && process.env["ELECTRON_RENDERER_URL"]) { if (is.dev && process.env["ELECTRON_RENDERER_URL"]) {
winURL = process.env["ELECTRON_RENDERER_URL"] + `/${app}#/${route}` winURL = process.env["ELECTRON_RENDERER_URL"] + `/${app}#/`
} else { } else {
winURL = join(__dirname, `../renderer/${app}#/${route}`) winURL = join(__dirname, `../renderer/${app}#/`)
} }
return winURL return winURL
} }

8
src/renderer/src/assets/libs/scrollbot.ts

@ -8,14 +8,14 @@ class Scrollbot {
private scrollSpeed: number = 200 private scrollSpeed: number = 200
private parContent!: string private parContent!: string
private newPar!: HTMLDivElement private newPar!: HTMLDivElement
private sbContainer!: HTMLDivElement // private sbContainer!: HTMLDivElement
private scrollBarHolder!: HTMLDivElement private scrollBarHolder!: HTMLDivElement
private scrollBar!: HTMLDivElement private scrollBar!: HTMLDivElement
private inP!: HTMLDivElement private inP!: HTMLDivElement
private sbHeight: number = 0 private sbHeight: number = 0
private mdown: boolean = false private mdown: boolean = false
private customHeight: boolean = false private customHeight: boolean = false
private scrollElement!: HTMLElement // private scrollElement!: HTMLElement
private onScrollF?: () => void private onScrollF?: () => void
private sB: ScrollStyle = {} private sB: ScrollStyle = {}
private sBH: ScrollStyle = {} private sBH: ScrollStyle = {}
@ -55,7 +55,7 @@ class Scrollbot {
private setupElements(): void { private setupElements(): void {
this.newPar = document.createElement("div") this.newPar = document.createElement("div")
this.sbContainer = document.createElement("div") // this.sbContainer = document.createElement("div")
this.scrollBarHolder = document.createElement("div") this.scrollBarHolder = document.createElement("div")
this.scrollBar = document.createElement("div") this.scrollBar = document.createElement("div")
this.inP = document.createElement("div") this.inP = document.createElement("div")
@ -84,7 +84,7 @@ class Scrollbot {
}px;width:100%;box-sizing:content-box;` }px;width:100%;box-sizing:content-box;`
this.sbHeight = (this.inP.clientHeight * 100) / this.inP.scrollHeight this.sbHeight = (this.inP.clientHeight * 100) / this.inP.scrollHeight
this.scrollElement = this.inP // this.scrollElement = this.inP
this.updateScrollbarStyles() this.updateScrollbarStyles()
} }

135
src/renderer/src/components/AdjustLine.vue

@ -63,34 +63,34 @@ const currentSize = ref(props.defaultSize || 0)
// 使computed // 使computed
const isHorizontal = computed(() => props.direction === "left" || props.direction === "right") const isHorizontal = computed(() => props.direction === "left" || props.direction === "right")
// 使computed // // 使computed
const cursorStyle = computed(() => (isHorizontal.value ? "ew-resize" : "ns-resize")) // const cursorStyle = computed(() => (isHorizontal.value ? "ew-resize" : "ns-resize"))
// localStorage // // localStorage
const storageKey = computed(() => `adjust-line-${props.mid}`) // const storageKey = computed(() => `adjust-line-${props.mid}`)
function saveSize(size: number) { // function saveSize(size: number) {
if (props.mid) { // if (props.mid) {
try { // try {
localStorage.setItem(storageKey.value, String(size)) // localStorage.setItem(storageKey.value, String(size))
} catch (error) { // } catch (error) {
console.warn("Failed to save size to localStorage:", error) // console.warn("Failed to save size to localStorage:", error)
} // }
} // }
} // }
function loadSavedSize(): number | null { // function loadSavedSize(): number | null {
if (props.mid) { // if (props.mid) {
try { // try {
const saved = localStorage.getItem(storageKey.value) // const saved = localStorage.getItem(storageKey.value)
return saved ? Number(saved) : null // return saved ? Number(saved) : null
} catch (error) { // } catch (error) {
console.warn("Failed to load size from localStorage:", error) // console.warn("Failed to load size from localStorage:", error)
return null // return null
} // }
} // }
return null // return null
} // }
// 使resize // 使resize
const emitResize = useDebounceFn((size: number) => { const emitResize = useDebounceFn((size: number) => {
@ -318,45 +318,45 @@ function handle(target: HTMLElement) {
} }
} }
function handleDrag(e: MouseEvent, target: HTMLElement) { // function handleDrag(e: MouseEvent, target: HTMLElement) {
const startPos = isHorizontal.value ? e.clientX : e.clientY // const startPos = isHorizontal.value ? e.clientX : e.clientY
const startSize = isHorizontal.value ? target.clientWidth : target.clientHeight // const startSize = isHorizontal.value ? target.clientWidth : target.clientHeight
const handleMouseMove = (e: MouseEvent) => { // const handleMouseMove = (e: MouseEvent) => {
const currentPos = isHorizontal.value ? e.clientX : e.clientY // const currentPos = isHorizontal.value ? e.clientX : e.clientY
const diff = props.direction === "right" || props.direction === "bottom" ? startPos - currentPos : currentPos - startPos // const diff = props.direction === "right" || props.direction === "bottom" ? startPos - currentPos : currentPos - startPos
let newSize = startSize - diff // let newSize = startSize - diff
// // //
newSize = Math.max(props.minSize, Math.min(props.maxSize, newSize)) // newSize = Math.max(props.minSize, Math.min(props.maxSize, newSize))
// // //
if (isHorizontal.value) { // if (isHorizontal.value) {
target.style.width = `${newSize}px` // target.style.width = `${newSize}px`
} else { // } else {
target.style.height = `${newSize}px` // target.style.height = `${newSize}px`
} // }
currentSize.value = newSize // currentSize.value = newSize
emit("resize", newSize) // emit("resize", newSize)
} // }
const handleMouseUp = () => { // const handleMouseUp = () => {
document.removeEventListener("mousemove", handleMouseMove) // document.removeEventListener("mousemove", handleMouseMove)
document.removeEventListener("mouseup", handleMouseUp) // document.removeEventListener("mouseup", handleMouseUp)
document.body.style.userSelect = "" // document.body.style.userSelect = ""
isDragging.value = false // isDragging.value = false
saveSize(currentSize.value) // saveSize(currentSize.value)
emit("resizeEnd", currentSize.value) // emit("resizeEnd", currentSize.value)
} // }
document.addEventListener("mousemove", handleMouseMove) // document.addEventListener("mousemove", handleMouseMove)
document.addEventListener("mouseup", handleMouseUp) // document.addEventListener("mouseup", handleMouseUp)
document.body.style.userSelect = "none" // document.body.style.userSelect = "none"
isDragging.value = true // isDragging.value = true
emit("resizeStart") // emit("resizeStart")
} // }
const debug = { const debug = {
log: (...args: any[]) => { log: (...args: any[]) => {
@ -377,6 +377,7 @@ function handleError(error: Error, context: string) {
// //
onErrorCaptured((err, instance, info) => { onErrorCaptured((err, instance, info) => {
handleError(err as Error, info) handleError(err as Error, info)
console.log(instance);
return false return false
}) })
</script> </script>

7
src/renderer/src/components/NavBar.vue

@ -30,6 +30,7 @@ import icon from "@res/icon.png"
import config from "config" import config from "config"
import { PopupMenu } from "@/bridge/PopupMenu" import { PopupMenu } from "@/bridge/PopupMenu"
const router = useRouter()
const isFullScreen = ref(false) const isFullScreen = ref(false)
onBeforeMount(async () => { onBeforeMount(async () => {
isFullScreen.value = await api.call("BasicCommand.isFullscreen") isFullScreen.value = await api.call("BasicCommand.isFullscreen")
@ -37,6 +38,12 @@ onBeforeMount(async () => {
const onClickMenu = () => { const onClickMenu = () => {
const menu = new PopupMenu([ const menu = new PopupMenu([
{ {
label: "返回",
async click() {
router.back()
},
},
{
label: isFullScreen.value ? "取消全屏" : "全屏", label: isFullScreen.value ? "取消全屏" : "全屏",
async click() { async click() {
isFullScreen.value = await api.call("BasicCommand.fullscreen") isFullScreen.value = await api.call("BasicCommand.fullscreen")

7
src/renderer/src/pages/_ui/App.vue

@ -1,3 +1,10 @@
<script setup lang="ts">
defineOptions({
title: "观山",
bg: "ty",
})
</script>
<template> <template>
<div> <div>
<input type="text" /> <input type="text" />

5
src/renderer/src/pages/_ui/Browser.vue

@ -2,6 +2,11 @@
import { onBeforeMount, onBeforeUnmount, onMounted, ref, useTemplateRef, nextTick } from "vue" import { onBeforeMount, onBeforeUnmount, onMounted, ref, useTemplateRef, nextTick } from "vue"
import { PopupMenu } from "@/bridge/PopupMenu" import { PopupMenu } from "@/bridge/PopupMenu"
defineOptions({
title: "替你关于",
bg: "bg"
})
// const PlaceHolderRef = useTemplateRef("PlaceHolder") // const PlaceHolderRef = useTemplateRef("PlaceHolder")
// function OnResize() { // function OnResize() {
// const el = PlaceHolderRef.value // const el = PlaceHolderRef.value

12
src/renderer/src/pages/about/index.vue

@ -0,0 +1,12 @@
<script setup lang="ts">
definePage({
name: "about",
meta: {
title: "听雨",
bg: "gs",
},
})
</script>
<template>
<div>sad</div>
</template>

75
src/renderer/src/pages/index.vue

@ -1,40 +1,52 @@
<script setup lang="ts"> <script setup lang="ts">
import { defineAsyncComponent } from "vue"
import Simplebar from "simplebar-vue" import Simplebar from "simplebar-vue"
import { getAssetsFile } from "@/utils" import { getAssetsFile } from "@/utils"
const active = ref() const allModules: Record<string, any> = import.meta.glob("./_ui/**/*.vue", { eager: true })
const allApp = [ const allApp: any[] = []
{ label: "浏览器", comp: defineAsyncComponent(() => import("./_ui/Browser.vue")) }, Object.keys(allModules).forEach(key => {
{ label: "观山", bg: "gs", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, let [_1, p] = key.match("\.\/_ui\/(.*?)\.vue")!
{ label: "听雨", bg: "ty", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, p = p.replace(/\.vue$/, "")
{ label: "赏月", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, const m = allModules[key]?.default || allModules[key]
{ label: "抚琴", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, allApp.push({
{ label: "望云", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, label: m.title,
{ label: "踏雪", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, bg: m.bg,
{ label: "卧松", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, comp: m,
{ label: "泛舟", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, })
{ label: "弈星", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, })
{ label: "垂钓", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
{ label: "采菊", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, const active = ref(0)
{ label: "倚栏", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // const allApp = [
{ label: "望霞", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", comp: defineAsyncComponent(() => import("./_ui/Browser.vue")) },
{ label: "枕风", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", bg: "gs", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
{ label: "沐泉", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", bg: "ty", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
{ label: "汲露", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
{ label: "步竹", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
{ label: "剪烛", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
{ label: "拾阶", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
{ label: "撷兰", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
{ label: "访柳", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
{ label: "谒梅", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
{ label: "拨荷", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
{ label: "望鹤", comp: defineAsyncComponent(() => import("./_ui/App.vue")) }, // { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
] // { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "访", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// { label: "", comp: defineAsyncComponent(() => import("./_ui/App.vue")) },
// ]
const activeBg = computed(() => { const activeBg = computed(() => {
if (!active.value) return "" if (active.value === undefined) return ""
const value = allApp[active.value].bg const value = allApp[active.value]?.bg
return value ? getAssetsFile(`@/assets/images/home/${value}.png`) : "" return value ? getAssetsFile(`@/assets/images/home/${value}.png`) : ""
}) })
@ -69,6 +81,7 @@ function onClick(index: number) {
</div> </div>
<div class="content" relative b-l="1px solid #E5E5E5" flex-1 w-0 overflow-auto flex flex-col> <div class="content" relative b-l="1px solid #E5E5E5" flex-1 w-0 overflow-auto flex flex-col>
<div v-if="activeBg" class="bg" :style="{ backgroundImage: activeBg ? `url(${activeBg})` : '' }"></div> <div v-if="activeBg" class="bg" :style="{ backgroundImage: activeBg ? `url(${activeBg})` : '' }"></div>
<div @click="$router.push('/about')">关于</div>
<component :is="allApp[active].comp" v-if="allApp[active]"></component> <component :is="allApp[active].comp" v-if="allApp[active]"></component>
</div> </div>
</div> </div>

1
src/renderer/typed-router.d.ts

@ -20,5 +20,6 @@ declare module 'vue-router/auto-routes' {
export interface RouteNamedMap { export interface RouteNamedMap {
'/': RouteRecordInfo<'/', '/', Record<never, never>, Record<never, never>>, '/': RouteRecordInfo<'/', '/', Record<never, never>, Record<never, never>>,
'/[...all]': RouteRecordInfo<'/[...all]', '/:all(.*)', { all: ParamValue<true> }, { all: ParamValue<false> }>, '/[...all]': RouteRecordInfo<'/[...all]', '/:all(.*)', { all: ParamValue<true> }, { all: ParamValue<false> }>,
'about': RouteRecordInfo<'about', '/about', Record<never, never>, Record<never, never>>,
} }
} }

Loading…
Cancel
Save