update
parent
e8a3653499
commit
3aae49057c
|
|
@ -32,6 +32,7 @@
|
|||
"prettier": "^3.2.5",
|
||||
"typescript": "~5.4.0",
|
||||
"vite": "^5.3.1",
|
||||
"vite-plugin-svg-icons": "^2.0.1",
|
||||
"vite-plugin-vue-devtools": "^7.3.1",
|
||||
"vue-tsc": "^2.0.21"
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -76,6 +76,7 @@ dependencies = [
|
|||
"serde_json",
|
||||
"tauri",
|
||||
"tauri-build",
|
||||
"window-shadows",
|
||||
"window-vibrancy",
|
||||
]
|
||||
|
||||
|
|
@ -3413,6 +3414,18 @@ version = "0.4.0"
|
|||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "712e227841d057c1ee1cd2fb22fa7e5a5461ae8e48fa2ca79ec42cfc1931183f"
|
||||
|
||||
[[package]]
|
||||
name = "window-shadows"
|
||||
version = "0.2.2"
|
||||
source = "registry+https://github.com/rust-lang/crates.io-index"
|
||||
checksum = "67ff424735b1ac21293b0492b069394b0a189c8a463fb015a16dea7c2e221c08"
|
||||
dependencies = [
|
||||
"cocoa 0.25.0",
|
||||
"objc",
|
||||
"raw-window-handle",
|
||||
"windows-sys 0.48.0",
|
||||
]
|
||||
|
||||
[[package]]
|
||||
name = "window-vibrancy"
|
||||
version = "0.4.3"
|
||||
|
|
|
|||
|
|
@ -17,8 +17,9 @@ tauri-build = { version = "1.5.5", features = [] }
|
|||
[dependencies]
|
||||
serde_json = "1.0"
|
||||
serde = { version = "1.0", features = ["derive"] }
|
||||
tauri = { version = "1.8.0", features = [] }
|
||||
tauri = { version = "1.8.0", features = [ "window-minimize", "window-maximize", "window-close", "window-show", "window-hide", "window-start-dragging", "window-unminimize", "window-unmaximize"] }
|
||||
window-vibrancy = "0.4"
|
||||
window-shadows = "0.2.2"
|
||||
|
||||
[features]
|
||||
# this feature is used for production builds or when `devPath` points to the filesystem and the built-in dev server is disabled.
|
||||
|
|
|
|||
|
|
@ -4,7 +4,8 @@
|
|||
mod setup;
|
||||
|
||||
fn main() {
|
||||
tauri::Builder::default().setup(setup::init)
|
||||
tauri::Builder::default()
|
||||
.setup(setup::init)
|
||||
.invoke_handler(tauri::generate_handler![test_command])
|
||||
.run(tauri::generate_context!())
|
||||
.expect("error while running tauri application");
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
use tauri::{App, Manager};
|
||||
use window_vibrancy::{self, NSVisualEffectMaterial};
|
||||
use window_shadows::set_shadow;
|
||||
|
||||
|
||||
/// setup
|
||||
pub fn init(app: &mut App) -> std::result::Result<(), Box<dyn std::error::Error>> {
|
||||
let win = app.get_window("main").unwrap();
|
||||
|
||||
// 仅在 macOS 下执行
|
||||
#[cfg(target_os = "macos")]
|
||||
window_vibrancy::apply_vibrancy(&win, NSVisualEffectMaterial::FullScreenUI)
|
||||
|
|
@ -12,7 +13,9 @@ pub fn init(app: &mut App) -> std::result::Result<(), Box<dyn std::error::Error>
|
|||
|
||||
// 仅在 windows 下执行
|
||||
#[cfg(target_os = "windows")]
|
||||
window_vibrancy::apply_acrylic(&win, Some((18, 18, 18, 125)))
|
||||
.expect("Unsupported platform! 'apply_blur' is only supported on Windows");
|
||||
if let Err(_) = window_vibrancy::apply_mica(&win, None){
|
||||
window_vibrancy::apply_acrylic(&win, Some((10,10,10,180))).expect("Unsupport Blur Effect!")
|
||||
}
|
||||
set_shadow(&win, true).unwrap();
|
||||
Ok(())
|
||||
}
|
||||
|
|
@ -12,7 +12,18 @@
|
|||
},
|
||||
"tauri": {
|
||||
"allowlist": {
|
||||
"all": false
|
||||
"all": false,
|
||||
"window": {
|
||||
"all": false,
|
||||
"close": true,
|
||||
"hide": true,
|
||||
"show": true,
|
||||
"maximize": true,
|
||||
"minimize": true,
|
||||
"unmaximize": true,
|
||||
"unminimize": true,
|
||||
"startDragging": true
|
||||
}
|
||||
},
|
||||
"bundle": {
|
||||
"active": true,
|
||||
|
|
@ -59,8 +70,9 @@
|
|||
"height": 600,
|
||||
"resizable": true,
|
||||
"title": "wallitor-gui",
|
||||
"transparent": true,
|
||||
"width": 800,
|
||||
"transparent": true
|
||||
"decorations": false
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,19 +1,88 @@
|
|||
<script setup lang="ts">
|
||||
import { RouterLink, RouterView } from 'vue-router'
|
||||
import {invoke} from "@tauri-apps/api"
|
||||
import { appWindow } from '@tauri-apps/api/window'
|
||||
import SvgIcon from './components/SvgIcon.vue';
|
||||
import {ref} from 'vue'
|
||||
|
||||
const maximized = ref(false);
|
||||
|
||||
function minimize(){
|
||||
appWindow.minimize()
|
||||
}
|
||||
|
||||
function toggleMaximize(){
|
||||
appWindow.toggleMaximize();
|
||||
maximized.value = !maximized.value;
|
||||
}
|
||||
|
||||
function close(){
|
||||
appWindow.close()
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div data-tauri-drag-region class="titlebar">
|
||||
<div class="titlebar-button" id="titlebar-minimize" @click="minimize">
|
||||
<svg-icon name="window-minimize" color="red"></svg-icon>
|
||||
</div>
|
||||
<div class="titlebar-button" id="titlebar-maximize" @click="toggleMaximize">
|
||||
<template v-if="maximized">
|
||||
<svg-icon name="window-maximized"></svg-icon>
|
||||
</template>
|
||||
<template v-else>
|
||||
<svg-icon name="window-maximize" width="13px"></svg-icon>
|
||||
</template>
|
||||
</div>
|
||||
<div class="titlebar-button" id="titlebar-close" @click="close">
|
||||
<svg-icon name="window-close"></svg-icon>
|
||||
</div>
|
||||
</div>
|
||||
<router-view></router-view>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
html{
|
||||
background: transparent;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
body{
|
||||
background: transparent;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
#app{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<style scoped>
|
||||
.titlebar {
|
||||
height: 30px;
|
||||
background: #141414;
|
||||
user-select: none;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
.titlebar-button {
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
.titlebar-button:hover {
|
||||
background: #5bbec3;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1727275506845" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8495" data-darkreader-inline-fill="" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M563.8 512l262.5-312.9c4.4-5.2 0.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9c-4.4 5.2-0.7 13.1 6.1 13.1h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z" p-id="8496"></path></svg>
|
||||
|
After Width: | Height: | Size: 710 B |
|
|
@ -0,0 +1 @@
|
|||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1727275608799" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15290" data-darkreader-inline-fill="" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M880 112H144c-17.7 0-32 14.3-32 32v736c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V144c0-17.7-14.3-32-32-32z m-40 728H184V184h656v656z" p-id="15291"></path></svg>
|
||||
|
After Width: | Height: | Size: 529 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M16 20v-9H4v9zm2-5v-2h2V4H8v5H6V4q0-.825.588-1.412T8 2h12q.825 0 1.413.588T22 4v9q0 .825-.587 1.413T20 15zM4 22q-.825 0-1.412-.587T2 20v-9q0-.825.588-1.412T4 9h12q.825 0 1.413.588T18 11v9q0 .825-.587 1.413T16 22zm6-6.5"/></svg>
|
||||
|
After Width: | Height: | Size: 341 B |
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M20 14H4v-4h16"/></svg>
|
||||
|
After Width: | Height: | Size: 137 B |
|
|
@ -0,0 +1,30 @@
|
|||
<template>
|
||||
<svg :style="{ width, height}">
|
||||
<use :href="prefix + name" :fill="color"></use>
|
||||
</svg>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
defineProps({
|
||||
prefix: {
|
||||
type: String,
|
||||
default: "#icon-"
|
||||
},
|
||||
name: {
|
||||
type:String,
|
||||
required:true
|
||||
},
|
||||
color: {
|
||||
type: String,
|
||||
default: "#ffffff"
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
default: "16px"
|
||||
},
|
||||
height: {
|
||||
type: String,
|
||||
default: "16px"
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import SvgIcon from "./SvgIcon.vue";
|
||||
import type {App,Component} from 'vue'
|
||||
|
||||
const global_components:{[key:string]:Component} = {
|
||||
SvgIcon
|
||||
}
|
||||
|
||||
export default {
|
||||
install(app:App){
|
||||
Object.keys(global_components).forEach((key)=>{
|
||||
app.component(key,global_components[key]);
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -1,11 +1,12 @@
|
|||
import './assets/main.css'
|
||||
|
||||
import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
import "virtual:svg-icons-register";
|
||||
import globalComponents from '@/components/install'
|
||||
|
||||
const app = createApp(App)
|
||||
|
||||
app.use(router)
|
||||
app.use(router);
|
||||
app.use(globalComponents);
|
||||
|
||||
app.mount('#app')
|
||||
|
|
|
|||
|
|
@ -1,15 +1,7 @@
|
|||
<template>
|
||||
<div class="about">
|
||||
<h1>This is an about page</h1>
|
||||
</div>
|
||||
1
|
||||
</template>
|
||||
|
||||
<style>
|
||||
@media (min-width: 1024px) {
|
||||
.about {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -3,6 +3,8 @@ import { fileURLToPath, URL } from 'node:url'
|
|||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import vueDevTools from 'vite-plugin-vue-devtools'
|
||||
import path from "path";
|
||||
import { createSvgIconsPlugin } from "vite-plugin-svg-icons";
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
|
|
@ -15,6 +17,12 @@ export default defineConfig({
|
|||
plugins: [
|
||||
vue(),
|
||||
vueDevTools(),
|
||||
createSvgIconsPlugin({
|
||||
iconDirs: [
|
||||
path.resolve(__dirname, "src/assets/svgs"),
|
||||
],
|
||||
symbolId: "icon-[name]"
|
||||
})
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
|
|
|
|||
Loading…
Reference in New Issue