🏗️ refactor file selection handling to improve response structure and utilize path data in SystemController

This commit is contained in:
刘嘉伟 2025-02-26 12:21:40 +08:00
parent 7515726a71
commit ce709fe5e7
7 changed files with 87 additions and 90 deletions

View File

@ -5,14 +5,14 @@ import { RouteRecordRaw } from "vue-router";
import Intro from "@/intro";
import "intro.js/introjs.css";
import confetti from "canvas-confetti/src/confetti.js";
import { useFrpcProcessStore } from "@/store/frpcProcess";
import { useFrpcDesktopStore } from "@/store/frpcDesktop";
import pkg from "../../../package.json";
defineComponent({
name: "AppMain"
});
const frpcProcessStore = useFrpcProcessStore();
const frpcDesktopStore = useFrpcDesktopStore();
const routes = ref<Array<RouteRecordRaw>>([]);
const guideSteps = ref({
Home: {

View File

@ -9,9 +9,7 @@ import {
IconifyIconOnline
} from "./components/IconifyIcon";
import { createPinia } from "pinia";
import { on, onListener } from "@/utils/ipcUtils";
import { ipcRouters, listeners } from "../electron/core/IpcRouter";
import { useFrpcProcessStore } from "@/store/frpcProcess";
import { useFrpcDesktopStore } from "@/store/frpcDesktop";
const pinia = createPinia();
@ -26,17 +24,10 @@ app
.mount("#app")
.$nextTick(() => {
postMessage({ payload: "removeLoading" }, "*");
const frpcProcessStore = useFrpcProcessStore();
onListener(listeners.watchFrpcProcess, data => {
console.log("watchFrpcProcess", data);
frpcProcessStore.setRunning(data);
});
on(ipcRouters.LAUNCH.getStatus, data => {
console.log("getStatus", data);
frpcProcessStore.setRunning(data);
});
});
const frpcDesktopStore = useFrpcDesktopStore();
frpcDesktopStore.onListenerFrpcProcessRunning();
frpcDesktopStore.onListenerDownloadedVersion();
frpcDesktopStore.refreshDownloadedVersion();
})
.then(r => {});

36
src/store/frpcDesktop.ts Normal file
View File

@ -0,0 +1,36 @@
import { defineStore } from "pinia";
import { on, onListener, send } from "@/utils/ipcUtils";
import { ipcRouters, listeners } from "../../electron/core/IpcRouter";
export const useFrpcDesktopStore = defineStore("frpcDesktop", {
state: () => ({ isRunning: false, versions: [] }),
getters: {
running: state => state.isRunning,
downloadedVersions: state => state.versions
},
actions: {
onListenerFrpcProcessRunning() {
onListener(listeners.watchFrpcProcess, data => {
console.log("watchFrpcProcess", data);
this.isRunning = data;
});
on(ipcRouters.LAUNCH.getStatus, data => {
console.log("getStatus", data);
this.isRunning = data;
});
},
onListenerDownloadedVersion() {
on(ipcRouters.VERSION.getDownloadedVersions, data => {
this.versions = data;
});
},
refreshRunning() {
send(ipcRouters.LAUNCH.getStatus);
},
refreshDownloadedVersion() {
send(ipcRouters.VERSION.getDownloadedVersions);
}
}
});

View File

@ -1,18 +0,0 @@
import { defineStore } from "pinia";
import { send } from "@/utils/ipcUtils";
import { ipcRouters } from "../../electron/core/IpcRouter";
export const useFrpcProcessStore = defineStore("frpcProcess", {
state: () => ({ isRunning: false }),
getters: {
running: state => state.isRunning
},
actions: {
setRunning(running: boolean) {
this.isRunning = running;
},
refreshRunning() {
send(ipcRouters.LAUNCH.getStatus);
}
}
});

View File

@ -9,6 +9,7 @@ import { on, removeRouterListeners, send } from "@/utils/ipcUtils";
import { ipcRouters } from "../../../electron/core/IpcRouter";
import _ from "lodash";
import confetti from "canvas-confetti/src/confetti.js";
import { useFrpcDesktopStore } from "@/store/frpcDesktop";
defineComponent({
name: "Config"
@ -195,6 +196,7 @@ const visibles = reactive({
});
const exportConfigType = ref("toml");
const frpcDesktopStore = useFrpcDesktopStore();
const handleSubmit = useDebounceFn(() => {
if (!formRef.value) return;
@ -232,16 +234,16 @@ const checkAndResetVersion = () => {
}
};
const handleLoadDownloadedVersion = () => {
send(ipcRouters.VERSION.getDownloadedVersions);
};
// const handleLoadDownloadedVersion = () => {
// send(ipcRouters.VERSION.getDownloadedVersions);
// };
const handleLoadSavedConfig = () => {
send(ipcRouters.SERVER.getServerConfig);
};
onMounted(() => {
handleLoadDownloadedVersion();
// handleLoadDownloadedVersion();
handleLoadSavedConfig();
on(ipcRouters.SERVER.getServerConfig, data => {
@ -267,7 +269,7 @@ onMounted(() => {
});
on(ipcRouters.SYSTEM.selectLocalFile, data => {
console.log('data', data);
console.log("data", data);
if (!data.canceled) {
switch (currSelectLocalFileType.value) {
case 1:
@ -577,14 +579,17 @@ onUnmounted(() => {
clearable
>
<el-option
v-for="v in versions"
v-for="v in frpcDesktopStore.downloadedVersions"
:key="v.githubReleaseId"
:label="v.name"
:value="v.githubReleaseId"
/>
</el-select>
<div class="w-full flex justify-end">
<el-link type="primary" @click="handleLoadDownloadedVersion">
<el-link
type="primary"
@click="frpcDesktopStore.refreshDownloadedVersion()"
>
<iconify-icon-offline class="mr-1" icon="refresh-rounded" />
手动刷新
</el-link>

View File

@ -7,6 +7,7 @@ import { useDebounceFn } from "@vueuse/core";
import IconifyIconOffline from "@/components/IconifyIcon/src/iconifyIconOffline";
import { on, removeRouterListeners, send } from "@/utils/ipcUtils";
import { ipcRouters } from "../../../electron/core/IpcRouter";
import { useFrpcDesktopStore } from "@/store/frpcDesktop";
defineComponent({
name: "Download"
@ -23,6 +24,7 @@ const mirrors = ref<Array<GitHubMirror>>([
name: "github"
}
]);
const frpcDesktopStore = useFrpcDesktopStore();
/**
* 获取版本
@ -60,35 +62,9 @@ const handleDeleteVersion = useDebounceFn((version: FrpcVersion) => {
send(ipcRouters.VERSION.deleteDownloadedVersion, {
githubReleaseId: version.githubReleaseId
});
// ipcRenderer.send("github.deleteVersion", {
// id: version.id,
// absPath: version.absPath
// });
});
}, 300);
// const handleInitDownloadHook = () => {
// ipcRenderer.on("Download.deleteVersion.hook", (event, args) => {
// const { err, data } = args;
// if (!err) {
// loading.value++;
// ElMessage({
// type: "success",
// message: ""
// });
// handleLoadVersions();
// }
// });
// ipcRenderer.on("Download.importFrpFile.hook", (event, args) => {
// const { success, data } = args;
// console.log(args);
//
// // if (err) {
// // }
// });
// };
const handleMirrorChange = () => {
handleLoadAllVersions();
};
@ -97,7 +73,6 @@ onMounted(() => {
handleLoadAllVersions();
on(ipcRouters.VERSION.getVersions, data => {
console.log("versionData", data);
versions.value = data.map(m => {
m.githubCreatedAt = moment(m.githubCreatedAt).format("YYYY-MM-DD");
return m as FrpcVersion;
@ -106,7 +81,6 @@ onMounted(() => {
});
on(ipcRouters.VERSION.downloadVersion, data => {
console.log("downloadData", data);
const { githubReleaseId, completed, percent } = data;
if (completed) {
downloading.value.delete(githubReleaseId);
@ -122,6 +96,7 @@ onMounted(() => {
Number(Number(percent * 100).toFixed(2))
);
}
frpcDesktopStore.refreshDownloadedVersion();
});
on(ipcRouters.VERSION.deleteDownloadedVersion, () => {
@ -131,6 +106,7 @@ onMounted(() => {
message: "删除成功"
});
handleLoadAllVersions();
frpcDesktopStore.refreshDownloadedVersion();
});
on(
@ -144,6 +120,7 @@ onMounted(() => {
message: "导入成功"
});
handleLoadAllVersions();
frpcDesktopStore.refreshDownloadedVersion();
}
},
(bizCode: string, message: string) => {
@ -176,7 +153,6 @@ onUnmounted(() => {
</script>
<template>
<div class="main">
<!-- <breadcrumb> -->
<breadcrumb>
<div class="flex">
<div class="h-full flex items-center justify-center mr-3">
@ -198,7 +174,6 @@ onUnmounted(() => {
<IconifyIconOffline icon="unarchive" />
</el-button>
</div>
<!-- <div-->
<!-- class="cursor-pointer h-[36px] w-[36px] bg-[#5f3bb0] rounded text-white flex justify-center items-center"-->
<!-- @click="handleOpenInsert"-->
@ -292,8 +267,6 @@ onUnmounted(() => {
</el-button>
</div>
<!-- <el-button type="text"></el-button>-->
</div>
<template v-else>
@ -337,7 +310,17 @@ onUnmounted(() => {
border-left: 5px solid #5a3daa;
}
.download-card:hover {
//animation: pulse 0.5s;
}
//@keyframes download-card-animation {
// //0% {
// // border-left-width: 5px;
// //}
// 100% {
// border-left-width: 10px;
// }
//}
//
//
//.download-card:hover {
// animation: download-card-animation 0.5s;
//}
</style>

View File

@ -4,7 +4,7 @@ import Breadcrumb from "@/layout/compoenets/Breadcrumb.vue";
import { useDebounceFn } from "@vueuse/core";
import { on, removeRouterListeners, send } from "@/utils/ipcUtils";
import { ipcRouters } from "../../../electron/core/IpcRouter";
import { useFrpcProcessStore } from "@/store/frpcProcess";
import { useFrpcDesktopStore } from "@/store/frpcDesktop";
import { ElMessageBox } from "element-plus";
import router from "@/router";
@ -12,7 +12,7 @@ defineComponent({
name: "Home"
});
const frpcProcessStore = useFrpcProcessStore();
const frpcDesktopStore = useFrpcDesktopStore();
// const running = ref(false);
const loading = ref(false);
@ -27,7 +27,7 @@ const handleStopFrpc = () => {
const handleButtonClick = useDebounceFn(() => {
loading.value = true;
if (frpcProcessStore.running) {
if (frpcDesktopStore.running) {
handleStopFrpc();
} else {
handleStartFrpc();
@ -39,7 +39,7 @@ onMounted(() => {
ipcRouters.LAUNCH.launch,
() => {
// send(ipcRouters.LAUNCH.getStatus);
frpcProcessStore.refreshRunning();
frpcDesktopStore.refreshRunning();
loading.value = false;
},
(bizCode: string, message: string) => {
@ -60,7 +60,7 @@ onMounted(() => {
on(ipcRouters.LAUNCH.terminate, () => {
// send(ipcRouters.LAUNCH.getStatus);
frpcProcessStore.refreshRunning();
frpcDesktopStore.refreshRunning();
loading.value = false;
});
// ipcRenderer.on("Home.frpc.start.error.hook", (event, args) => {
@ -99,19 +99,19 @@ onUnmounted(() => {
>
<transition name="fade">
<div
v-show="frpcProcessStore.running"
v-show="frpcDesktopStore.running"
class="z-0 rounded-full opacity-20 left-circle bg-[#5A3DAA] w-full h-full animation-rotate-1"
/>
</transition>
<transition name="fade">
<div
v-show="frpcProcessStore.running"
v-show="frpcDesktopStore.running"
class="z-0 rounded-full opacity-20 right-circle top-[10px] bg-[#5A3DAA] w-full h-full animation-rotate-2"
/>
</transition>
<transition name="fade">
<div
v-show="frpcProcessStore.running"
v-show="frpcDesktopStore.running"
class="z-0 rounded-full opacity-20 top-circle bg-[#5A3DAA] w-full h-full animation-rotate-3"
/>
</transition>
@ -126,7 +126,7 @@ onUnmounted(() => {
<transition name="fade">
<div class="font-bold text-2xl text-center">
<IconifyIconOffline
v-if="frpcProcessStore.running"
v-if="frpcDesktopStore.running"
class="text-[#7EC050] inline-block relative top-1"
icon="check-circle-rounded"
/>
@ -135,7 +135,7 @@ onUnmounted(() => {
class="text-[#E47470] inline-block relative top-1"
icon="error"
/>
Frpc {{ frpcProcessStore.running ? "已启动" : "已断开" }}
Frpc {{ frpcDesktopStore.running ? "已启动" : "已断开" }}
</div>
</transition>
<!-- <el-button-->
@ -147,7 +147,7 @@ onUnmounted(() => {
<!-- </el-button>-->
<div class="w-full justify-center text-center">
<el-link
v-if="frpcProcessStore.running"
v-if="frpcDesktopStore.running"
type="primary"
@click="$router.replace({ name: 'Logger' })"
>查看日志</el-link
@ -158,7 +158,7 @@ onUnmounted(() => {
@click="handleButtonClick"
size="large"
:disabled="loading"
>{{ frpcProcessStore.running ? "断 开" : "启 动" }}
>{{ frpcDesktopStore.running ? "断 开" : "启 动" }}
</el-button>
<!-- <div-->
<!-- class="w-full h-8 bg-[#563EA4] rounded flex justify-center items-center text-white font-bold cursor-pointer"-->