feat: completely refactored and redesigned UI using typescript (#37)
* chore: update LICENSE * refactor: refactor templates entirely using TypeScript reslove: https://github.com/misitebao/wails-template-vue/issues/35 * feat: update template
2
LICENSE
@ -1,6 +1,6 @@
|
||||
MIT License
|
||||
|
||||
Copyright (c) 2021 misitebao
|
||||
Copyright (c) 2021-Present Misite Bao
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
|
15
frontend/.eslintrc.cjs
Normal file
@ -0,0 +1,15 @@
|
||||
/* eslint-env node */
|
||||
require('@rushstack/eslint-patch/modern-module-resolution')
|
||||
|
||||
module.exports = {
|
||||
root: true,
|
||||
'extends': [
|
||||
'plugin:vue/vue3-essential',
|
||||
'eslint:recommended',
|
||||
'@vue/eslint-config-typescript',
|
||||
'@vue/eslint-config-prettier'
|
||||
],
|
||||
parserOptions: {
|
||||
ecmaVersion: 'latest'
|
||||
}
|
||||
}
|
29
frontend/.gitignore
vendored
@ -1 +1,28 @@
|
||||
node_modules
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
coverage
|
||||
*.local
|
||||
|
||||
/cypress/videos/
|
||||
/cypress/screenshots/
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
|
1
frontend/.prettierrc.json
Normal file
@ -0,0 +1 @@
|
||||
{}
|
3
frontend/.vscode/extensions.json
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
{
|
||||
"recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
|
||||
}
|
46
frontend/README.md
Normal file
@ -0,0 +1,46 @@
|
||||
# frontend
|
||||
|
||||
This template should help get you started developing with Vue 3 in Vite.
|
||||
|
||||
## Recommended IDE Setup
|
||||
|
||||
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
|
||||
|
||||
## Type Support for `.vue` Imports in TS
|
||||
|
||||
TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
|
||||
|
||||
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
|
||||
|
||||
1. Disable the built-in TypeScript Extension
|
||||
1) Run `Extensions: Show Built-in Extensions` from VSCode's command palette
|
||||
2) Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
|
||||
2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
|
||||
|
||||
## Customize configuration
|
||||
|
||||
See [Vite Configuration Reference](https://vitejs.dev/config/).
|
||||
|
||||
## Project Setup
|
||||
|
||||
```sh
|
||||
npm install
|
||||
```
|
||||
|
||||
### Compile and Hot-Reload for Development
|
||||
|
||||
```sh
|
||||
npm run dev
|
||||
```
|
||||
|
||||
### Type-Check, Compile and Minify for Production
|
||||
|
||||
```sh
|
||||
npm run build
|
||||
```
|
||||
|
||||
### Lint with [ESLint](https://eslint.org/)
|
||||
|
||||
```sh
|
||||
npm run lint
|
||||
```
|
1
frontend/env.d.ts
vendored
Normal file
@ -0,0 +1 @@
|
||||
/// <reference types="vite/client" />
|
@ -4,7 +4,7 @@
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title><%- title %></title>
|
||||
<title>{{.ProjectName}}</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
7500
frontend/package-lock.tmpl.json
Normal file
@ -1,17 +1,35 @@
|
||||
{
|
||||
"name": "{{.ProjectName}}",
|
||||
"private": true,
|
||||
"version": "0.1.0",
|
||||
"description": "A Wails Template",
|
||||
"main": "",
|
||||
"version": "0.0.0",
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1"
|
||||
"dev": "vite",
|
||||
"build": "run-p type-check build-only",
|
||||
"preview": "vite preview --port 4173",
|
||||
"build-only": "vite build",
|
||||
"type-check": "vue-tsc --noEmit",
|
||||
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
|
||||
},
|
||||
"author": "{{.AuthorName}}",
|
||||
"license": "MIT",
|
||||
"workspaces": ["packages/*"],
|
||||
"engines": {
|
||||
"node": ">=15.0.0",
|
||||
"npm": ">=7.0.0"
|
||||
"dependencies": {
|
||||
"pinia": "^2.0.21",
|
||||
"vue": "^3.2.38",
|
||||
"vue-i18n": "^9.2.2",
|
||||
"vue-router": "^4.1.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rushstack/eslint-patch": "^1.1.4",
|
||||
"@types/node": "^16.11.56",
|
||||
"@vitejs/plugin-vue": "^3.0.3",
|
||||
"@vitejs/plugin-vue-jsx": "^2.0.1",
|
||||
"@vue/eslint-config-prettier": "^7.0.0",
|
||||
"@vue/eslint-config-typescript": "^11.0.0",
|
||||
"@vue/tsconfig": "^0.1.3",
|
||||
"eslint": "^8.22.0",
|
||||
"eslint-plugin-vue": "^9.3.0",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"prettier": "^2.7.1",
|
||||
"sass": "^1.55.0",
|
||||
"typescript": "~4.7.4",
|
||||
"vite": "^3.0.9",
|
||||
"vue-tsc": "^0.40.7"
|
||||
}
|
||||
}
|
||||
|
5
frontend/packages/javascript/.gitignore
vendored
@ -1,5 +0,0 @@
|
||||
node_modules
|
||||
.DS_Store
|
||||
# dist
|
||||
dist-ssr
|
||||
*.local
|
@ -1,3 +0,0 @@
|
||||
{
|
||||
"recommendations": ["johnsoncodehk.volar"]
|
||||
}
|
@ -1,7 +0,0 @@
|
||||
# Vue 3 + Vite
|
||||
|
||||
This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
|
||||
|
||||
## Recommended IDE Setup
|
||||
|
||||
- [VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)
|
@ -1,13 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title><%- title %></title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/main.js"></script>
|
||||
</body>
|
||||
</html>
|
@ -1,22 +0,0 @@
|
||||
{
|
||||
"name": "js",
|
||||
"version": "0.1.0",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build --emptyOutDir",
|
||||
"build:dev": "vite build --mode development --emptyOutDir",
|
||||
"build:dev:watch": "vite build --mode development --watch --emptyOutDir",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"vue": "^3.2.31",
|
||||
"vue-i18n": "^9.1.9",
|
||||
"vue-router": "^4.0.12"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-vue": "^2.3.1",
|
||||
"sass": "^1.49.9",
|
||||
"vite": "^2.9.2",
|
||||
"vite-plugin-html": "^3.2.0"
|
||||
}
|
||||
}
|
@ -1,33 +0,0 @@
|
||||
<template>
|
||||
<span class="openlink" @click="onClickhandle">
|
||||
<slot></slot>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "OpenLink",
|
||||
props: {
|
||||
href: String,
|
||||
},
|
||||
setup(props) {
|
||||
const onClickhandle = () => {
|
||||
// You cannot use the a tag directly, you need to call the Go method here to open the link using the default browser.
|
||||
// 不能直接使用a标签,需要在这里调用Go方法以使用默认浏览器打开链接。
|
||||
|
||||
window.runtime.BrowserOpenURL(props.href);
|
||||
};
|
||||
|
||||
return {
|
||||
onClickhandle,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.openlink {
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
}
|
||||
</style>
|
@ -1,10 +0,0 @@
|
||||
import OpenLink from "@/components/public/OpenLink.vue";
|
||||
|
||||
// Encapsulate global components as plug-ins
|
||||
// 将全局组件封装为插件
|
||||
|
||||
export default {
|
||||
install(app) {
|
||||
app.component(OpenLink.name, OpenLink);
|
||||
},
|
||||
};
|
@ -1,18 +0,0 @@
|
||||
import { createI18n } from "vue-i18n";
|
||||
|
||||
import zhHans from "./locales/zh-Hans.json";
|
||||
import en from "./locales/en.json";
|
||||
import fr from "./locales/fr.json";
|
||||
|
||||
const i18n = createI18n({
|
||||
locale: "en",
|
||||
fallbackLocale: "en",
|
||||
legacy:false,
|
||||
messages: {
|
||||
"zh-Hans": zhHans,
|
||||
en: en,
|
||||
fr: fr,
|
||||
},
|
||||
});
|
||||
|
||||
export default i18n;
|
@ -1,32 +0,0 @@
|
||||
{
|
||||
"nav": {
|
||||
"home": "Page d'accueil",
|
||||
"about": "À propos"
|
||||
},
|
||||
"languages": {
|
||||
"en": "English",
|
||||
"zh-Hans": "简体中文",
|
||||
"fr": "Français"
|
||||
},
|
||||
"topbar": {
|
||||
"minimise": "Minimiser",
|
||||
"quit": "Quitter"
|
||||
},
|
||||
"homepage": {
|
||||
"welcome": "Bienvenue à utiliser le programme Wails développé sur la base de Vue",
|
||||
"getting-started": "Commencer",
|
||||
"star-me": "Github"
|
||||
},
|
||||
"aboutpage": {
|
||||
"title": "Wails Template Vue",
|
||||
"project-repository": "Référentiel de projets",
|
||||
"author": "Auteur",
|
||||
"misitebao": "Misitebao",
|
||||
"wails-repository": "Wails Dépôt",
|
||||
"thanks": "Merci à tous pour votre soutien🙏!"
|
||||
},
|
||||
"global": {
|
||||
"not-supported": "Parce qu'il s'agit d'une version bêta, cela ne peut pas être fait pour le moment, il sera complété plus tard.",
|
||||
"click-link": "Le lien actuellement cliqué est: "
|
||||
}
|
||||
}
|
@ -1,14 +0,0 @@
|
||||
import { createApp } from "vue";
|
||||
import App from "./App.vue";
|
||||
import router from "@/router";
|
||||
import i18n from "@/i18n";
|
||||
|
||||
// Register global common components
|
||||
// 注册全局通用组件
|
||||
import publicComponents from "@/components/public";
|
||||
|
||||
const app = createApp(App);
|
||||
|
||||
app.use(publicComponents);
|
||||
|
||||
app.use(router).use(i18n).mount("#app");
|
@ -1,27 +0,0 @@
|
||||
import { createRouter, createWebHashHistory } from "vue-router";
|
||||
import Home from "@/views/Home.vue";
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: "/",
|
||||
name: "Home",
|
||||
component: Home,
|
||||
},
|
||||
{
|
||||
path: "/about",
|
||||
name: "About",
|
||||
// route level code-splitting
|
||||
// this generates a separate chunk (about.[hash].js) for this route
|
||||
// which is lazy-loaded when the route is visited.
|
||||
component: function () {
|
||||
return import(/* webpackChunkName: "about" */ "../views/About.vue");
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHashHistory(),
|
||||
routes,
|
||||
});
|
||||
|
||||
export default router;
|
@ -1,37 +0,0 @@
|
||||
import { defineConfig } from "vite";
|
||||
import vue from "@vitejs/plugin-vue";
|
||||
import path from "path";
|
||||
|
||||
import pkg from "../../package.json";
|
||||
import { createHtmlPlugin } from "vite-plugin-html";
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
vue(),
|
||||
createHtmlPlugin({
|
||||
minify: false,
|
||||
// entry: "src/main.js",
|
||||
template: "index.html",
|
||||
inject: {
|
||||
data: {
|
||||
title: `${pkg.name}`,
|
||||
},
|
||||
},
|
||||
}),
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
"@": path.resolve(__dirname, "src"),
|
||||
},
|
||||
},
|
||||
build: {
|
||||
outDir: "../../dist",
|
||||
rollupOptions: {
|
||||
output: {
|
||||
entryFileNames: `assets/[name].js`,
|
||||
chunkFileNames: `assets/[name].js`,
|
||||
assetFileNames: `assets/[name].[ext]`,
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
5
frontend/packages/typescript/.gitignore
vendored
@ -1,5 +0,0 @@
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
@ -1,3 +0,0 @@
|
||||
{
|
||||
"recommendations": ["johnsoncodehk.volar"]
|
||||
}
|
@ -1,11 +0,0 @@
|
||||
# Vue 3 + Typescript + Vite
|
||||
|
||||
This template should help get you started developing with Vue 3 and Typescript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
|
||||
|
||||
## Recommended IDE Setup
|
||||
|
||||
- [VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)
|
||||
|
||||
## Type Support For `.vue` Imports in TS
|
||||
|
||||
Since TypeScript cannot handle type information for `.vue` imports, they are shimmed to be a generic Vue component type by default. In most cases this is fine if you don't really care about component prop types outside of templates. However, if you wish to get actual prop types in `.vue` imports (for example to get props validation when using manual `h(...)` calls), you can enable Volar's `.vue` type support plugin by running `Volar: Switch TS Plugin on/off` from VSCode command palette.
|
@ -1,22 +0,0 @@
|
||||
{
|
||||
"name": "ts",
|
||||
"private": true,
|
||||
"version": "0.1.0",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build":"vite build --emptyOutDir",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"vue": "^3.2.31",
|
||||
"vue-router": "^4.0.12"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vitejs/plugin-vue": "^2.3.1",
|
||||
"sass": "^1.49.9",
|
||||
"typescript": "^4.5.4",
|
||||
"vite": "^2.9.2",
|
||||
"vue-tsc": "^0.28.10",
|
||||
"vite-plugin-html": "^3.2.0"
|
||||
}
|
||||
}
|
Before Width: | Height: | Size: 4.2 KiB |
@ -1,211 +0,0 @@
|
||||
<template>
|
||||
<!-- Header -->
|
||||
<!-- 头部 -->
|
||||
<div class="header" data-wails-drag>
|
||||
<!-- navigation -->
|
||||
<!-- 导航 -->
|
||||
<div class="nav" data-wails-no-drag>
|
||||
<router-link to="/">{{ t("nav.home") }}</router-link>
|
||||
<router-link to="/about">{{ t("nav.about") }}</router-link>
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<!-- 菜单 -->
|
||||
<div class="menu" data-wails-no-drag>
|
||||
<div class="language">
|
||||
<div v-for="item in languages" :key="item" :class="{ active: item === locale }"
|
||||
@click="onclickLanguageHandle(item)" class="lang-item">
|
||||
{{ t("languages." + item) }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="bar">
|
||||
<div class="bar-btn" @click="onclickMinimise">
|
||||
{{ t("topbar.minimise") }}
|
||||
</div>
|
||||
<div class="bar-btn" @click="onclickQuit">{{ t("topbar.quit") }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Page -->
|
||||
<!-- 页面 -->
|
||||
<div class="view">
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { WindowMinimise, Quit } from "../../../wailsjs/runtime";
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const { t, availableLocales, locale } = useI18n({ useScope: "global" });
|
||||
// List of supported languages
|
||||
// 支持的语言列表
|
||||
const languages = availableLocales;
|
||||
|
||||
// Click to switch language
|
||||
// 点击切换语言
|
||||
const onclickLanguageHandle = (item: string) => {
|
||||
item !== locale.value ? (locale.value = item) : false;
|
||||
};
|
||||
|
||||
const onclickMinimise = () => {
|
||||
WindowMinimise();
|
||||
};
|
||||
const onclickQuit = () => {
|
||||
Quit();
|
||||
};
|
||||
|
||||
return {
|
||||
t,
|
||||
languages,
|
||||
locale,
|
||||
onclickLanguageHandle,
|
||||
onclickMinimise,
|
||||
onclickQuit,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import url("./assets/css/reset.css");
|
||||
@import url("./assets/css/font.css");
|
||||
|
||||
html {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: "JetBrainsMono";
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
#app {
|
||||
position: relative;
|
||||
// width: 900px;
|
||||
// height: 520px;
|
||||
height: 100%;
|
||||
background-color: rgba(219, 188, 239, 0.9);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 50px;
|
||||
padding: 0 10px;
|
||||
background-color: rgba(171, 126, 220, 0.9);
|
||||
|
||||
.nav {
|
||||
a {
|
||||
display: inline-block;
|
||||
min-width: 50px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
padding: 0 5px;
|
||||
margin-right: 8px;
|
||||
background-color: #ab7edc;
|
||||
border-radius: 2px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: #000000;
|
||||
font-size: 14px;
|
||||
white-space: nowrap;
|
||||
|
||||
&:hover,
|
||||
&.router-link-exact-active {
|
||||
background-color: #d7a8d8;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.menu {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.language {
|
||||
margin-right: 20px;
|
||||
border-radius: 2px;
|
||||
background-color: #c3c3c3;
|
||||
overflow: hidden;
|
||||
|
||||
.lang-item {
|
||||
display: inline-block;
|
||||
min-width: 50px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
padding: 0 5px;
|
||||
background-color: transparent;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: #000000;
|
||||
font-size: 14px;
|
||||
|
||||
&:hover {
|
||||
background-color: #ff050542;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background-color: #ff050542;
|
||||
color: #ffffff;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bar {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
min-width: 150px;
|
||||
|
||||
.bar-btn {
|
||||
display: inline-block;
|
||||
min-width: 80px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
padding: 0 5px;
|
||||
margin-left: 8px;
|
||||
background-color: #ab7edc;
|
||||
border-radius: 2px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
color: #000000;
|
||||
font-size: 14px;
|
||||
|
||||
&:hover {
|
||||
background-color: #d7a8d8;
|
||||
color: #ffffff;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.view {
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
@ -1,4 +0,0 @@
|
||||
@font-face {
|
||||
font-family: "JetBrainsMono";
|
||||
src: url("../fonts/JetBrainsMono-Medium.woff2");
|
||||
}
|
@ -1,124 +0,0 @@
|
||||
html,
|
||||
body,
|
||||
div,
|
||||
span,
|
||||
applet,
|
||||
object,
|
||||
iframe,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
blockquote,
|
||||
pre,
|
||||
a,
|
||||
abbr,
|
||||
acronym,
|
||||
address,
|
||||
big,
|
||||
cite,
|
||||
code,
|
||||
del,
|
||||
dfn,
|
||||
em,
|
||||
img,
|
||||
ins,
|
||||
kbd,
|
||||
q,
|
||||
s,
|
||||
samp,
|
||||
small,
|
||||
strike,
|
||||
strong,
|
||||
sub,
|
||||
sup,
|
||||
tt,
|
||||
var,
|
||||
b,
|
||||
u,
|
||||
i,
|
||||
center,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
ol,
|
||||
ul,
|
||||
li,
|
||||
fieldset,
|
||||
form,
|
||||
label,
|
||||
legend,
|
||||
table,
|
||||
caption,
|
||||
tbody,
|
||||
tfoot,
|
||||
thead,
|
||||
tr,
|
||||
th,
|
||||
td,
|
||||
article,
|
||||
aside,
|
||||
canvas,
|
||||
details,
|
||||
embed,
|
||||
figure,
|
||||
figcaption,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
output,
|
||||
ruby,
|
||||
section,
|
||||
summary,
|
||||
time,
|
||||
mark,
|
||||
audio,
|
||||
video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
ol,
|
||||
ul {
|
||||
list-style: none;
|
||||
}
|
||||
blockquote,
|
||||
q {
|
||||
quotes: none;
|
||||
}
|
||||
blockquote:before,
|
||||
blockquote:after,
|
||||
q:before,
|
||||
q:after {
|
||||
content: "";
|
||||
content: none;
|
||||
}
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
Before Width: | Height: | Size: 94 KiB |
Before Width: | Height: | Size: 22 KiB |
@ -1,25 +0,0 @@
|
||||
<template>
|
||||
<div class="hello-world" v-text="msg"></div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from "vue";
|
||||
|
||||
export default defineComponent({
|
||||
name: "HelloWorld",
|
||||
props: {
|
||||
msg: String,
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style scoped>
|
||||
.hello-world {
|
||||
height: 76px;
|
||||
line-height: 38px;
|
||||
margin: 16px 150px;
|
||||
text-align: center;
|
||||
font-size: 26px;
|
||||
}
|
||||
</style>
|
@ -1,35 +0,0 @@
|
||||
<template>
|
||||
<span class="openlink" @click="onClickhandle">
|
||||
<slot></slot>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from "vue";
|
||||
import { BrowserOpenURL } from "../../../../../wailsjs/runtime";
|
||||
export default defineComponent({
|
||||
name: "OpenLink",
|
||||
props: {
|
||||
href: String,
|
||||
},
|
||||
setup(props) {
|
||||
const onClickhandle = () => {
|
||||
// You cannot use the a tag directly, you need to call the Go method here to open the link using the default browser.
|
||||
// 不能直接使用a标签,需要在这里调用Go方法以使用默认浏览器打开链接。
|
||||
|
||||
BrowserOpenURL(props.href);
|
||||
};
|
||||
|
||||
return {
|
||||
onClickhandle,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.openlink {
|
||||
cursor: pointer;
|
||||
text-decoration: underline;
|
||||
}
|
||||
</style>
|
@ -1,11 +0,0 @@
|
||||
import { App } from "vue";
|
||||
import OpenLink from "@/components/public/OpenLink.vue";
|
||||
|
||||
// Encapsulate global components as plug-ins
|
||||
// 将全局组件封装为插件
|
||||
|
||||
export default {
|
||||
install(app: App) {
|
||||
app.component(OpenLink.name, OpenLink);
|
||||
},
|
||||
};
|
8
frontend/packages/typescript/src/env.d.ts
vendored
@ -1,8 +0,0 @@
|
||||
/// <reference types="vite/client" />
|
||||
|
||||
declare module '*.vue' {
|
||||
import { DefineComponent } from 'vue'
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
|
||||
const component: DefineComponent<{}, {}, any>
|
||||
export default component
|
||||
}
|
@ -1,32 +0,0 @@
|
||||
{
|
||||
"nav": {
|
||||
"home": "Home",
|
||||
"about": "About"
|
||||
},
|
||||
"languages": {
|
||||
"en": "English",
|
||||
"zh-Hans": "简体中文",
|
||||
"fr": "Français"
|
||||
},
|
||||
"topbar": {
|
||||
"minimise": "Minimise",
|
||||
"quit": "Quit"
|
||||
},
|
||||
"homepage": {
|
||||
"welcome": "Welcome to use Wails program developed based on Vue",
|
||||
"getting-started": "Getting Started",
|
||||
"star-me": "Github"
|
||||
},
|
||||
"aboutpage": {
|
||||
"title": "Wails Template Vue",
|
||||
"project-repository": "Project Repository",
|
||||
"author": "Author",
|
||||
"misitebao": "Misitebao",
|
||||
"wails-repository": "Wails Repository",
|
||||
"thanks": "Thank you all for your support🙏!"
|
||||
},
|
||||
"global": {
|
||||
"not-supported": "Because it is a beta version, it can't be done for the time being, it will be completed later.",
|
||||
"click-link": "The currently clicked link is: "
|
||||
}
|
||||
}
|
@ -1,32 +0,0 @@
|
||||
{
|
||||
"nav": {
|
||||
"home": "Page d'accueil",
|
||||
"about": "À propos"
|
||||
},
|
||||
"languages": {
|
||||
"en": "English",
|
||||
"zh-Hans": "简体中文",
|
||||
"fr": "Français"
|
||||
},
|
||||
"topbar": {
|
||||
"minimise": "Minimiser",
|
||||
"quit": "Quitter"
|
||||
},
|
||||
"homepage": {
|
||||
"welcome": "Bienvenue à utiliser le programme Wails développé sur la base de Vue",
|
||||
"getting-started": "Commencer",
|
||||
"star-me": "Github"
|
||||
},
|
||||
"aboutpage": {
|
||||
"title": "Wails Template Vue",
|
||||
"project-repository": "Référentiel de projets",
|
||||
"author": "Auteur",
|
||||
"misitebao": "Misitebao",
|
||||
"wails-repository": "Wails Dépôt",
|
||||
"thanks": "Merci à tous pour votre soutien🙏!"
|
||||
},
|
||||
"global": {
|
||||
"not-supported": "Parce qu'il s'agit d'une version bêta, cela ne peut pas être fait pour le moment, il sera complété plus tard.",
|
||||
"click-link": "Le lien actuellement cliqué est: "
|
||||
}
|
||||
}
|
@ -1,32 +0,0 @@
|
||||
{
|
||||
"nav": {
|
||||
"home": "主页",
|
||||
"about": "关于"
|
||||
},
|
||||
"languages": {
|
||||
"en": "English",
|
||||
"zh-Hans": "简体中文",
|
||||
"fr": "Français"
|
||||
},
|
||||
"topbar": {
|
||||
"minimise": "最小化",
|
||||
"quit": "退出"
|
||||
},
|
||||
"homepage": {
|
||||
"welcome": "欢迎使用基于Vue开发的Wails程序",
|
||||
"getting-started": "快速入门",
|
||||
"star-me": "Github"
|
||||
},
|
||||
"aboutpage": {
|
||||
"title": "Wails Template Vue",
|
||||
"project-repository": "项目仓库",
|
||||
"author": "作者",
|
||||
"misitebao": "米司特包",
|
||||
"wails-repository": "Wails 仓库",
|
||||
"thanks": "感谢各位大佬的支持🙏!"
|
||||
},
|
||||
"global": {
|
||||
"not-supported": "由于是测试版,所以暂时做不了,后续会完成它。",
|
||||
"click-link": "当前点击的链接是: "
|
||||
}
|
||||
}
|
@ -1,14 +0,0 @@
|
||||
import { createApp } from "vue";
|
||||
import App from "./App.vue";
|
||||
import router from "./router";
|
||||
import i18n from "./i18n";
|
||||
|
||||
// Register global common components
|
||||
// 注册全局通用组件
|
||||
import publicComponents from "./components/public/";
|
||||
|
||||
const app = createApp(App);
|
||||
|
||||
app.use(publicComponents);
|
||||
|
||||
app.use(router).use(i18n).mount("#app");
|
@ -1,27 +0,0 @@
|
||||
import { createRouter, createWebHashHistory, RouteRecordRaw} from "vue-router";
|
||||
import Home from "@/views/Home.vue";
|
||||
|
||||
const routes:Array<RouteRecordRaw> = [
|
||||
{
|
||||
path: "/",
|
||||
name: "Home",
|
||||
component: Home,
|
||||
},
|
||||
{
|
||||
path: "/about",
|
||||
name: "About",
|
||||
// route level code-splitting
|
||||
// this generates a separate chunk (about.[hash].js) for this route
|
||||
// which is lazy-loaded when the route is visited.
|
||||
component: function () {
|
||||
return import(/* webpackChunkName: "about" */ "../views/About.vue");
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHashHistory(),
|
||||
routes,
|
||||
});
|
||||
|
||||
export default router;
|
@ -1,104 +0,0 @@
|
||||
<template>
|
||||
<div class="about">
|
||||
<!-- Title -->
|
||||
<div class="title">{{ t("aboutpage.title") }}</div>
|
||||
<!-- Information -->
|
||||
<!-- 信息 -->
|
||||
<div class="content">
|
||||
<div class="comeon">
|
||||
<img :src="comeonGif" alt="Gif" />
|
||||
</div>
|
||||
<ul class="info">
|
||||
<li class="info-item">
|
||||
<div class="name">{{ t("aboutpage.project-repository") }}</div>
|
||||
<OpenLink
|
||||
class="link"
|
||||
href="https://github.com/misitebao/wails-template-vue"
|
||||
>https://github.com/misitebao/wails-template-vue</OpenLink
|
||||
>
|
||||
</li>
|
||||
<li class="info-item">
|
||||
<div class="name">{{ t("aboutpage.wails-repository") }}</div>
|
||||
<OpenLink class="link" href="https://github.com/wailsapp/wails"
|
||||
>https://github.com/wailsapp/wails</OpenLink
|
||||
>
|
||||
</li>
|
||||
<li class="info-item">
|
||||
<div class="name">{{ t("aboutpage.author") }}</div>
|
||||
<OpenLink class="link" href="https://github.com/misitebao">{{
|
||||
t("aboutpage.misitebao")
|
||||
}}</OpenLink>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Thanks -->
|
||||
<!-- 谢语 -->
|
||||
<div class="thank">{{ t("aboutpage.thanks") }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { defineComponent } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import comeonGif from "@/assets/images/comeon.gif";
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const { t } = useI18n({ useScope: "global" });
|
||||
return {
|
||||
t,
|
||||
comeonGif,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.about {
|
||||
.title {
|
||||
margin: 30px auto 10px;
|
||||
font-size: 38px;
|
||||
color: #a150b5;
|
||||
text-align: center;
|
||||
}
|
||||
.content {
|
||||
position: relative;
|
||||
margin: 36px 20px;
|
||||
.comeon {
|
||||
position: absolute;
|
||||
left: 26px;
|
||||
top: 38px;
|
||||
max-width: 66%;
|
||||
img {
|
||||
width: 220px;
|
||||
height: 180px;
|
||||
}
|
||||
}
|
||||
.info {
|
||||
margin: 0 0 0 33%;
|
||||
font-size: 24px;
|
||||
text-align: left;
|
||||
.info-item {
|
||||
margin-bottom: 10px;
|
||||
.name {
|
||||
line-height: 40px;
|
||||
font-size: 28px;
|
||||
color: #6d6363;
|
||||
}
|
||||
.link {
|
||||
line-height: 30px;
|
||||
font-size: 20px;
|
||||
color: #5f6c86;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.thank {
|
||||
height: 68px;
|
||||
line-height: 68px;
|
||||
margin: 36px auto;
|
||||
text-align: center;
|
||||
font-size: 40px;
|
||||
}
|
||||
}
|
||||
</style>
|
@ -1,87 +0,0 @@
|
||||
<template>
|
||||
<div class="home">
|
||||
<!-- Logo -->
|
||||
<img class="logo" alt="Vue logo" src="../assets/logo.png" />
|
||||
<HelloWorld :msg="t('homepage.welcome')" />
|
||||
<!-- Bottom button -->
|
||||
<!-- 底部按钮 -->
|
||||
<div class="link">
|
||||
<OpenLink
|
||||
href="https://wails.io/docs/gettingstarted/installation"
|
||||
class="btn start"
|
||||
>{{ "Getting Started" }}</OpenLink
|
||||
>
|
||||
<OpenLink
|
||||
href="https://github.com/misitebao/wails-template-vue"
|
||||
class="btn star"
|
||||
>{{ "Star Me" }}</OpenLink
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import HelloWorld from "@/components/HelloWorld.vue";
|
||||
|
||||
export default defineComponent({
|
||||
name: "Home",
|
||||
components: {
|
||||
HelloWorld,
|
||||
},
|
||||
setup() {
|
||||
const { t } = useI18n({ useScope: "global" });
|
||||
return {
|
||||
t,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.home {
|
||||
.logo {
|
||||
display: block;
|
||||
width: 620px;
|
||||
height: 280px;
|
||||
margin: 10px auto 10px;
|
||||
}
|
||||
.link {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 18px auto;
|
||||
.btn {
|
||||
display: block;
|
||||
width: 150px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
padding: 0 5px;
|
||||
margin: 0 30px;
|
||||
border-radius: 8px;
|
||||
text-align: center;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
white-space: nowrap;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
&.start {
|
||||
background-color: #fd0404;
|
||||
color: #ffffff;
|
||||
&:hover {
|
||||
background-color: #ec2e2e;
|
||||
}
|
||||
}
|
||||
&.star {
|
||||
background-color: #ffffff;
|
||||
color: #fd0404;
|
||||
&:hover {
|
||||
background-color: #f3f3f3;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
@ -1,15 +0,0 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "esnext",
|
||||
"useDefineForClassFields": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "node",
|
||||
"strict": true,
|
||||
"jsx": "preserve",
|
||||
"sourceMap": true,
|
||||
"resolveJsonModule": true,
|
||||
"esModuleInterop": true,
|
||||
"lib": ["esnext", "dom"]
|
||||
},
|
||||
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]
|
||||
}
|
@ -1,37 +0,0 @@
|
||||
import { defineConfig } from "vite";
|
||||
import vue from "@vitejs/plugin-vue";
|
||||
import path from "path";
|
||||
|
||||
import pkg from "../../package.json";
|
||||
import { createHtmlPlugin } from "vite-plugin-html";
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
vue(),
|
||||
createHtmlPlugin({
|
||||
minify: false,
|
||||
// entry: "src/main.js",
|
||||
template: "index.html",
|
||||
inject: {
|
||||
data: {
|
||||
title: `${pkg.name}`,
|
||||
},
|
||||
},
|
||||
}),
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
"@": path.resolve(__dirname, "src"),
|
||||
},
|
||||
},
|
||||
build: {
|
||||
outDir: "../../dist",
|
||||
rollupOptions: {
|
||||
output: {
|
||||
entryFileNames: `assets/[name].js`,
|
||||
chunkFileNames: `assets/[name].js`,
|
||||
assetFileNames: `assets/[name].[ext]`,
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 4.2 KiB |
@ -1,16 +1,31 @@
|
||||
<script setup lang="ts">
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
const { t, availableLocales: languages, locale } = useI18n();
|
||||
|
||||
const onclickLanguageHandle = (item: string) => {
|
||||
item !== locale.value ? (locale.value = item) : false;
|
||||
};
|
||||
|
||||
const onclickMinimise = () => {};
|
||||
|
||||
const onclickQuit = () => {};
|
||||
|
||||
document.body.addEventListener("click", function (event) {
|
||||
event.preventDefault();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<!-- Header -->
|
||||
<!-- 头部 -->
|
||||
<div class="header" data-wails-drag>
|
||||
<div class="header">
|
||||
<!-- navigation -->
|
||||
<!-- 导航 -->
|
||||
<div class="nav" data-wails-no-drag>
|
||||
<div class="nav">
|
||||
<router-link to="/">{{ t("nav.home") }}</router-link>
|
||||
<router-link to="/about">{{ t("nav.about") }}</router-link>
|
||||
</div>
|
||||
<!-- Menu -->
|
||||
<!-- 菜单 -->
|
||||
<div class="menu" data-wails-no-drag>
|
||||
<div class="menu">
|
||||
<div class="language">
|
||||
<div
|
||||
v-for="item in languages"
|
||||
@ -31,48 +46,11 @@
|
||||
</div>
|
||||
</div>
|
||||
<!-- Page -->
|
||||
<!-- 页面 -->
|
||||
<div class="view">
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
const { t, availableLocales, locale } = useI18n();
|
||||
|
||||
// List of supported languages
|
||||
// 支持的语言列表
|
||||
const languages = availableLocales;
|
||||
|
||||
// Click to switch language
|
||||
// 点击切换语言
|
||||
const onclickLanguageHandle = (item) => {
|
||||
item !== locale.value ? (locale.value = item) : false;
|
||||
};
|
||||
|
||||
const onclickMinimise = () => {
|
||||
window.runtime.WindowMinimise();
|
||||
};
|
||||
const onclickQuit = () => {
|
||||
window.runtime.Quit();
|
||||
};
|
||||
|
||||
return {
|
||||
t,
|
||||
languages,
|
||||
locale,
|
||||
onclickLanguageHandle,
|
||||
onclickMinimise,
|
||||
onclickQuit,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import url("./assets/css/reset.css");
|
||||
@import url("./assets/css/font.css");
|
Before Width: | Height: | Size: 94 KiB After Width: | Height: | Size: 94 KiB |
Before Width: | Height: | Size: 22 KiB After Width: | Height: | Size: 22 KiB |
@ -1,17 +1,13 @@
|
||||
<script setup lang="ts">
|
||||
defineProps<{
|
||||
msg: string;
|
||||
}>();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="hello-world" v-text="msg"></div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "HelloWorld",
|
||||
props: {
|
||||
msg: String,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||
<style scoped>
|
||||
.hello-world {
|
||||
height: 76px;
|
@ -2,16 +2,14 @@ import { createI18n } from "vue-i18n";
|
||||
|
||||
import zhHans from "./locales/zh-Hans.json";
|
||||
import en from "./locales/en.json";
|
||||
import fr from "./locales/fr.json";
|
||||
|
||||
const i18n = createI18n({
|
||||
locale: "en",
|
||||
fallbackLocale: "en",
|
||||
legacy:false,
|
||||
legacy: false,
|
||||
messages: {
|
||||
"zh-Hans": zhHans,
|
||||
en: en,
|
||||
fr: fr,
|
||||
},
|
||||
});
|
||||
|
16
frontend/src/main.ts
Normal file
@ -0,0 +1,16 @@
|
||||
import { createApp } from "vue";
|
||||
import { createPinia } from "pinia";
|
||||
|
||||
import App from "./App.vue";
|
||||
import router from "./router";
|
||||
import i18n from "./i18n";
|
||||
|
||||
// import "./assets/main.css";
|
||||
|
||||
const app = createApp(App);
|
||||
|
||||
app.use(createPinia());
|
||||
app.use(router);
|
||||
app.use(i18n);
|
||||
|
||||
app.mount("#app");
|
23
frontend/src/router/index.ts
Normal file
@ -0,0 +1,23 @@
|
||||
import { createRouter, createWebHashHistory } from "vue-router";
|
||||
import HomeView from "../views/HomeView.vue";
|
||||
|
||||
const router = createRouter({
|
||||
history: createWebHashHistory(),
|
||||
routes: [
|
||||
{
|
||||
path: "/",
|
||||
name: "home",
|
||||
component: HomeView,
|
||||
},
|
||||
{
|
||||
path: "/about",
|
||||
name: "about",
|
||||
// route level code-splitting
|
||||
// this generates a separate chunk (About.[hash].js) for this route
|
||||
// which is lazy-loaded when the route is visited.
|
||||
component: () => import("../views/AboutView.vue"),
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
export default router;
|
12
frontend/src/stores/counter.ts
Normal file
@ -0,0 +1,12 @@
|
||||
import { ref, computed } from "vue";
|
||||
import { defineStore } from "pinia";
|
||||
|
||||
export const useCounterStore = defineStore("counter", () => {
|
||||
const count = ref(0);
|
||||
const doubleCount = computed(() => count.value * 2);
|
||||
function increment() {
|
||||
count.value++;
|
||||
}
|
||||
|
||||
return { count, doubleCount, increment };
|
||||
});
|
@ -1,9 +1,16 @@
|
||||
<script setup lang="ts">
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
import comeonGif from "@/assets/images/comeon.gif";
|
||||
|
||||
const { t } = useI18n();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="about">
|
||||
<!-- Title -->
|
||||
<div class="title">{{ t("aboutpage.title") }}</div>
|
||||
<!-- Information -->
|
||||
<!-- 信息 -->
|
||||
<div class="content">
|
||||
<div class="comeon">
|
||||
<img :src="comeonGif" alt="Gif" />
|
||||
@ -11,46 +18,30 @@
|
||||
<ul class="info">
|
||||
<li class="info-item">
|
||||
<div class="name">{{ t("aboutpage.project-repository") }}</div>
|
||||
<OpenLink
|
||||
class="link"
|
||||
href="https://github.com/misitebao/wails-template-vue"
|
||||
>https://github.com/misitebao/wails-template-vue</OpenLink
|
||||
<a class="link" href="https://github.com/misitebao/wails-template-vue"
|
||||
>https://github.com/misitebao/wails-template-vue</a
|
||||
>
|
||||
</li>
|
||||
<li class="info-item">
|
||||
<div class="name">{{ t("aboutpage.wails-repository") }}</div>
|
||||
<OpenLink class="link" href="https://github.com/wailsapp/wails"
|
||||
>https://github.com/wailsapp/wails</OpenLink
|
||||
<a class="link" href="https://github.com/wailsapp/wails"
|
||||
>https://github.com/wailsapp/wails</a
|
||||
>
|
||||
</li>
|
||||
<li class="info-item">
|
||||
<div class="name">{{ t("aboutpage.author") }}</div>
|
||||
<OpenLink class="link" href="https://github.com/misitebao">{{
|
||||
<a class="link" href="https://github.com/misitebao">{{
|
||||
t("aboutpage.misitebao")
|
||||
}}</OpenLink>
|
||||
}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Thanks -->
|
||||
<!-- 谢语 -->
|
||||
<div class="thank">{{ t("aboutpage.thanks") }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { useI18n } from "vue-i18n";
|
||||
import comeonGif from "@/assets/images/comeon.gif";
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
const { t } = useI18n();
|
||||
return {
|
||||
t,
|
||||
comeonGif,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.about {
|
||||
.title {
|
@ -1,42 +1,32 @@
|
||||
<script setup lang="ts">
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
import HelloWorld from "@/components/HelloWorld.vue";
|
||||
|
||||
const { t } = useI18n();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="home">
|
||||
<!-- Logo -->
|
||||
<img class="logo" alt="Vue logo" src="../assets/logo.png" />
|
||||
<HelloWorld :msg="t('homepage.welcome')" />
|
||||
<!-- Bottom button -->
|
||||
<!-- 底部按钮 -->
|
||||
<div class="link">
|
||||
<OpenLink
|
||||
<a
|
||||
href="https://wails.io/docs/gettingstarted/installation"
|
||||
class="btn start"
|
||||
>{{ t("homepage.getting-started") }}</OpenLink
|
||||
>{{ t("homepage.getting-started") }}</a
|
||||
>
|
||||
<OpenLink
|
||||
<a
|
||||
href="https://github.com/misitebao/wails-template-vue"
|
||||
class="btn star"
|
||||
>{{ t("homepage.star-me") }}</OpenLink
|
||||
>{{ t("homepage.star-me") }}</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { useI18n } from "vue-i18n";
|
||||
import HelloWorld from "@/components/HelloWorld.vue";
|
||||
|
||||
export default {
|
||||
name: "Home",
|
||||
components: {
|
||||
HelloWorld,
|
||||
},
|
||||
setup() {
|
||||
const { t } = useI18n();
|
||||
return {
|
||||
t,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.home {
|
||||
.logo {
|
8
frontend/tsconfig.config.json
Normal file
@ -0,0 +1,8 @@
|
||||
{
|
||||
"extends": "@vue/tsconfig/tsconfig.node.json",
|
||||
"include": ["vite.config.*", "vitest.config.*", "cypress.config.*"],
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"types": ["node"]
|
||||
}
|
||||
}
|
16
frontend/tsconfig.json
Normal file
@ -0,0 +1,16 @@
|
||||
{
|
||||
"extends": "@vue/tsconfig/tsconfig.web.json",
|
||||
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
},
|
||||
|
||||
"references": [
|
||||
{
|
||||
"path": "./tsconfig.config.json"
|
||||
}
|
||||
]
|
||||
}
|
24
frontend/vite.config.ts
Normal file
@ -0,0 +1,24 @@
|
||||
import { fileURLToPath, URL } from "node:url";
|
||||
|
||||
import { defineConfig } from "vite";
|
||||
import vue from "@vitejs/plugin-vue";
|
||||
import vueJsx from "@vitejs/plugin-vue-jsx";
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [vue(), vueJsx()],
|
||||
resolve: {
|
||||
alias: {
|
||||
"@": fileURLToPath(new URL("./src", import.meta.url)),
|
||||
},
|
||||
},
|
||||
build: {
|
||||
rollupOptions: {
|
||||
output: {
|
||||
entryFileNames: `assets/[name].js`,
|
||||
chunkFileNames: `assets/[name].js`,
|
||||
assetFileNames: `assets/[name].[ext]`,
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
4
frontend/wailsjs/go/main/App.d.ts
vendored
Normal file
@ -0,0 +1,4 @@
|
||||
// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
|
||||
// This file is automatically generated. DO NOT EDIT
|
||||
|
||||
export function Hello():Promise<boolean>;
|
7
frontend/wailsjs/go/main/App.js
Normal file
@ -0,0 +1,7 @@
|
||||
// @ts-check
|
||||
// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
|
||||
// This file is automatically generated. DO NOT EDIT
|
||||
|
||||
export function Hello() {
|
||||
return window['go']['main']['App']['Hello']();
|
||||
}
|
24
frontend/wailsjs/runtime/package.json
Normal file
@ -0,0 +1,24 @@
|
||||
{
|
||||
"name": "@wailsapp/runtime",
|
||||
"version": "2.0.0",
|
||||
"description": "Wails Javascript runtime library",
|
||||
"main": "runtime.js",
|
||||
"types": "runtime.d.ts",
|
||||
"scripts": {
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/wailsapp/wails.git"
|
||||
},
|
||||
"keywords": [
|
||||
"Wails",
|
||||
"Javascript",
|
||||
"Go"
|
||||
],
|
||||
"author": "Lea Anthony <lea.anthony@gmail.com>",
|
||||
"license": "MIT",
|
||||
"bugs": {
|
||||
"url": "https://github.com/wailsapp/wails/issues"
|
||||
},
|
||||
"homepage": "https://github.com/wailsapp/wails#readme"
|
||||
}
|
203
frontend/wailsjs/runtime/runtime.d.ts
vendored
Normal file
@ -0,0 +1,203 @@
|
||||
/*
|
||||
_ __ _ __
|
||||
| | / /___ _(_) /____
|
||||
| | /| / / __ `/ / / ___/
|
||||
| |/ |/ / /_/ / / (__ )
|
||||
|__/|__/\__,_/_/_/____/
|
||||
The electron alternative for Go
|
||||
(c) Lea Anthony 2019-present
|
||||
*/
|
||||
|
||||
export interface Position {
|
||||
x: number;
|
||||
y: number;
|
||||
}
|
||||
|
||||
export interface Size {
|
||||
w: number;
|
||||
h: number;
|
||||
}
|
||||
|
||||
export interface Screen {
|
||||
isCurrent: boolean;
|
||||
isPrimary: boolean;
|
||||
width : number
|
||||
height : number
|
||||
}
|
||||
|
||||
// Environment information such as platform, buildtype, ...
|
||||
export interface EnvironmentInfo {
|
||||
buildType: string;
|
||||
platform: string;
|
||||
arch: string;
|
||||
}
|
||||
|
||||
// [EventsEmit](https://wails.io/docs/reference/runtime/events#eventsemit)
|
||||
// emits the given event. Optional data may be passed with the event.
|
||||
// This will trigger any event listeners.
|
||||
export function EventsEmit(eventName: string, ...data: any): void;
|
||||
|
||||
// [EventsOn](https://wails.io/docs/reference/runtime/events#eventson) sets up a listener for the given event name.
|
||||
export function EventsOn(eventName: string, callback: (...data: any) => void): void;
|
||||
|
||||
// [EventsOnMultiple](https://wails.io/docs/reference/runtime/events#eventsonmultiple)
|
||||
// sets up a listener for the given event name, but will only trigger a given number times.
|
||||
export function EventsOnMultiple(eventName: string, callback: (...data: any) => void, maxCallbacks: number): void;
|
||||
|
||||
// [EventsOnce](https://wails.io/docs/reference/runtime/events#eventsonce)
|
||||
// sets up a listener for the given event name, but will only trigger once.
|
||||
export function EventsOnce(eventName: string, callback: (...data: any) => void): void;
|
||||
|
||||
// [EventsOff](https://wails.io/docs/reference/runtime/events#eventsff)
|
||||
// unregisters the listener for the given event name.
|
||||
export function EventsOff(eventName: string): void;
|
||||
|
||||
// [LogPrint](https://wails.io/docs/reference/runtime/log#logprint)
|
||||
// logs the given message as a raw message
|
||||
export function LogPrint(message: string): void;
|
||||
|
||||
// [LogTrace](https://wails.io/docs/reference/runtime/log#logtrace)
|
||||
// logs the given message at the `trace` log level.
|
||||
export function LogTrace(message: string): void;
|
||||
|
||||
// [LogDebug](https://wails.io/docs/reference/runtime/log#logdebug)
|
||||
// logs the given message at the `debug` log level.
|
||||
export function LogDebug(message: string): void;
|
||||
|
||||
// [LogError](https://wails.io/docs/reference/runtime/log#logerror)
|
||||
// logs the given message at the `error` log level.
|
||||
export function LogError(message: string): void;
|
||||
|
||||
// [LogFatal](https://wails.io/docs/reference/runtime/log#logfatal)
|
||||
// logs the given message at the `fatal` log level.
|
||||
// The application will quit after calling this method.
|
||||
export function LogFatal(message: string): void;
|
||||
|
||||
// [LogInfo](https://wails.io/docs/reference/runtime/log#loginfo)
|
||||
// logs the given message at the `info` log level.
|
||||
export function LogInfo(message: string): void;
|
||||
|
||||
// [LogWarning](https://wails.io/docs/reference/runtime/log#logwarning)
|
||||
// logs the given message at the `warning` log level.
|
||||
export function LogWarning(message: string): void;
|
||||
|
||||
// [WindowReload](https://wails.io/docs/reference/runtime/window#windowreload)
|
||||
// Forces a reload by the main application as well as connected browsers.
|
||||
export function WindowReload(): void;
|
||||
|
||||
// [WindowReloadApp](https://wails.io/docs/reference/runtime/window#windowreloadapp)
|
||||
// Reloads the application frontend.
|
||||
export function WindowReloadApp(): void;
|
||||
|
||||
// [WindowSetSystemDefaultTheme](https://wails.io/docs/next/reference/runtime/window#windowsetsystemdefaulttheme)
|
||||
// *Windows only*
|
||||
// Sets window theme to system default (dark/light).
|
||||
export function WindowSetSystemDefaultTheme(): void;
|
||||
|
||||
// [WindowSetLightTheme](https://wails.io/docs/next/reference/runtime/window#windowsetlighttheme)
|
||||
// *Windows only*
|
||||
// Sets window to light theme.
|
||||
export function WindowSetLightTheme(): void;
|
||||
|
||||
// [WindowSetDarkTheme](https://wails.io/docs/next/reference/runtime/window#windowsetdarktheme)
|
||||
// *Windows only*
|
||||
// Sets window to dark theme.
|
||||
export function WindowSetDarkTheme(): void;
|
||||
|
||||
// [WindowCenter](https://wails.io/docs/reference/runtime/window#windowcenter)
|
||||
// Centers the window on the monitor the window is currently on.
|
||||
export function WindowCenter(): void;
|
||||
|
||||
// [WindowSetTitle](https://wails.io/docs/reference/runtime/window#windowsettitle)
|
||||
// Sets the text in the window title bar.
|
||||
export function WindowSetTitle(title: string): void;
|
||||
|
||||
// [WindowFullscreen](https://wails.io/docs/reference/runtime/window#windowfullscreen)
|
||||
// Makes the window full screen.
|
||||
export function WindowFullscreen(): void;
|
||||
|
||||
// [WindowUnfullscreen](https://wails.io/docs/reference/runtime/window#windowunfullscreen)
|
||||
// Restores the previous window dimensions and position prior to full screen.
|
||||
export function WindowUnfullscreen(): void;
|
||||
|
||||
// [WindowSetSize](https://wails.io/docs/reference/runtime/window#windowsetsize)
|
||||
// Sets the width and height of the window.
|
||||
export function WindowSetSize(width: number, height: number): Promise<Size>;
|
||||
|
||||
// [WindowGetSize](https://wails.io/docs/reference/runtime/window#windowgetsize)
|
||||
// Gets the width and height of the window.
|
||||
export function WindowGetSize(): Promise<Size>;
|
||||
|
||||
// [WindowSetMaxSize](https://wails.io/docs/reference/runtime/window#windowsetmaxsize)
|
||||
// Sets the maximum window size. Will resize the window if the window is currently larger than the given dimensions.
|
||||
// Setting a size of 0,0 will disable this constraint.
|
||||
export function WindowSetMaxSize(width: number, height: number): void;
|
||||
|
||||
// [WindowSetMinSize](https://wails.io/docs/reference/runtime/window#windowsetminsize)
|
||||
// Sets the minimum window size. Will resize the window if the window is currently smaller than the given dimensions.
|
||||
// Setting a size of 0,0 will disable this constraint.
|
||||
export function WindowSetMinSize(width: number, height: number): void;
|
||||
|
||||
// [WindowSetPosition](https://wails.io/docs/reference/runtime/window#windowsetposition)
|
||||
// Sets the window position relative to the monitor the window is currently on.
|
||||
export function WindowSetPosition(x: number, y: number): void;
|
||||
|
||||
// [WindowGetPosition](https://wails.io/docs/reference/runtime/window#windowgetposition)
|
||||
// Gets the window position relative to the monitor the window is currently on.
|
||||
export function WindowGetPosition(): Promise<Position>;
|
||||
|
||||
// [WindowHide](https://wails.io/docs/reference/runtime/window#windowhide)
|
||||
// Hides the window.
|
||||
export function WindowHide(): void;
|
||||
|
||||
// [WindowShow](https://wails.io/docs/reference/runtime/window#windowshow)
|
||||
// Shows the window, if it is currently hidden.
|
||||
export function WindowShow(): void;
|
||||
|
||||
// [WindowMaximise](https://wails.io/docs/reference/runtime/window#windowmaximise)
|
||||
// Maximises the window to fill the screen.
|
||||
export function WindowMaximise(): void;
|
||||
|
||||
// [WindowToggleMaximise](https://wails.io/docs/reference/runtime/window#windowtogglemaximise)
|
||||
// Toggles between Maximised and UnMaximised.
|
||||
export function WindowToggleMaximise(): void;
|
||||
|
||||
// [WindowUnmaximise](https://wails.io/docs/reference/runtime/window#windowunmaximise)
|
||||
// Restores the window to the dimensions and position prior to maximising.
|
||||
export function WindowUnmaximise(): void;
|
||||
|
||||
// [WindowMinimise](https://wails.io/docs/reference/runtime/window#windowminimise)
|
||||
// Minimises the window.
|
||||
export function WindowMinimise(): void;
|
||||
|
||||
// [WindowUnminimise](https://wails.io/docs/reference/runtime/window#windowunminimise)
|
||||
// Restores the window to the dimensions and position prior to minimising.
|
||||
export function WindowUnminimise(): void;
|
||||
|
||||
// [WindowSetBackgroundColour](https://wails.io/docs/reference/runtime/window#windowsetbackgroundcolour)
|
||||
// Sets the background colour of the window to the given RGBA colour definition. This colour will show through for all transparent pixels.
|
||||
export function WindowSetBackgroundColour(R: number, G: number, B: number, A: number): void;
|
||||
|
||||
// [ScreenGetAll](https://wails.io/docs/reference/runtime/window#screengetall)
|
||||
// Gets the all screens. Call this anew each time you want to refresh data from the underlying windowing system.
|
||||
export function ScreenGetAll(): Promise<Screen[]>;
|
||||
|
||||
// [BrowserOpenURL](https://wails.io/docs/reference/runtime/browser#browseropenurl)
|
||||
// Opens the given URL in the system browser.
|
||||
export function BrowserOpenURL(url: string): void;
|
||||
|
||||
// [Environment](https://wails.io/docs/reference/runtime/intro#environment)
|
||||
// Returns information about the environment
|
||||
export function Environment(): Promise<EnvironmentInfo>;
|
||||
|
||||
// [Quit](https://wails.io/docs/reference/runtime/intro#quit)
|
||||
// Quits the application.
|
||||
export function Quit(): void;
|
||||
|
||||
// [Hide](https://wails.io/docs/reference/runtime/intro#hide)
|
||||
// Hides the application.
|
||||
export function Hide(): void;
|
||||
|
||||
// [Show](https://wails.io/docs/reference/runtime/intro#show)
|
||||
// Shows the application.
|
||||
export function Show(): void;
|
174
frontend/wailsjs/runtime/runtime.js
Normal file
@ -0,0 +1,174 @@
|
||||
/*
|
||||
_ __ _ __
|
||||
| | / /___ _(_) /____
|
||||
| | /| / / __ `/ / / ___/
|
||||
| |/ |/ / /_/ / / (__ )
|
||||
|__/|__/\__,_/_/_/____/
|
||||
The electron alternative for Go
|
||||
(c) Lea Anthony 2019-present
|
||||
*/
|
||||
|
||||
export function LogPrint(message) {
|
||||
window.runtime.LogPrint(message);
|
||||
}
|
||||
|
||||
export function LogTrace(message) {
|
||||
window.runtime.LogTrace(message);
|
||||
}
|
||||
|
||||
export function LogDebug(message) {
|
||||
window.runtime.LogDebug(message);
|
||||
}
|
||||
|
||||
export function LogInfo(message) {
|
||||
window.runtime.LogInfo(message);
|
||||
}
|
||||
|
||||
export function LogWarning(message) {
|
||||
window.runtime.LogWarning(message);
|
||||
}
|
||||
|
||||
export function LogError(message) {
|
||||
window.runtime.LogError(message);
|
||||
}
|
||||
|
||||
export function LogFatal(message) {
|
||||
window.runtime.LogFatal(message);
|
||||
}
|
||||
|
||||
export function EventsOnMultiple(eventName, callback, maxCallbacks) {
|
||||
window.runtime.EventsOnMultiple(eventName, callback, maxCallbacks);
|
||||
}
|
||||
|
||||
export function EventsOn(eventName, callback) {
|
||||
EventsOnMultiple(eventName, callback, -1);
|
||||
}
|
||||
|
||||
export function EventsOff(eventName) {
|
||||
return window.runtime.EventsOff(eventName);
|
||||
}
|
||||
|
||||
export function EventsOnce(eventName, callback) {
|
||||
EventsOnMultiple(eventName, callback, 1);
|
||||
}
|
||||
|
||||
export function EventsEmit(eventName) {
|
||||
let args = [eventName].slice.call(arguments);
|
||||
return window.runtime.EventsEmit.apply(null, args);
|
||||
}
|
||||
|
||||
export function WindowReload() {
|
||||
window.runtime.WindowReload();
|
||||
}
|
||||
|
||||
export function WindowReloadApp() {
|
||||
window.runtime.WindowReloadApp();
|
||||
}
|
||||
|
||||
export function WindowSetSystemDefaultTheme() {
|
||||
window.runtime.WindowSetSystemDefaultTheme();
|
||||
}
|
||||
|
||||
export function WindowSetLightTheme() {
|
||||
window.runtime.WindowSetLightTheme();
|
||||
}
|
||||
|
||||
export function WindowSetDarkTheme() {
|
||||
window.runtime.WindowSetDarkTheme();
|
||||
}
|
||||
|
||||
export function WindowCenter() {
|
||||
window.runtime.WindowCenter();
|
||||
}
|
||||
|
||||
export function WindowSetTitle(title) {
|
||||
window.runtime.WindowSetTitle(title);
|
||||
}
|
||||
|
||||
export function WindowFullscreen() {
|
||||
window.runtime.WindowFullscreen();
|
||||
}
|
||||
|
||||
export function WindowUnfullscreen() {
|
||||
window.runtime.WindowUnfullscreen();
|
||||
}
|
||||
|
||||
export function WindowGetSize() {
|
||||
return window.runtime.WindowGetSize();
|
||||
}
|
||||
|
||||
export function WindowSetSize(width, height) {
|
||||
window.runtime.WindowSetSize(width, height);
|
||||
}
|
||||
|
||||
export function WindowSetMaxSize(width, height) {
|
||||
window.runtime.WindowSetMaxSize(width, height);
|
||||
}
|
||||
|
||||
export function WindowSetMinSize(width, height) {
|
||||
window.runtime.WindowSetMinSize(width, height);
|
||||
}
|
||||
|
||||
export function WindowSetPosition(x, y) {
|
||||
window.runtime.WindowSetPosition(x, y);
|
||||
}
|
||||
|
||||
export function WindowGetPosition() {
|
||||
return window.runtime.WindowGetPosition();
|
||||
}
|
||||
|
||||
export function WindowHide() {
|
||||
window.runtime.WindowHide();
|
||||
}
|
||||
|
||||
export function WindowShow() {
|
||||
window.runtime.WindowShow();
|
||||
}
|
||||
|
||||
export function WindowMaximise() {
|
||||
window.runtime.WindowMaximise();
|
||||
}
|
||||
|
||||
export function WindowToggleMaximise() {
|
||||
window.runtime.WindowToggleMaximise();
|
||||
}
|
||||
|
||||
export function WindowUnmaximise() {
|
||||
window.runtime.WindowUnmaximise();
|
||||
}
|
||||
|
||||
export function WindowMinimise() {
|
||||
window.runtime.WindowMinimise();
|
||||
}
|
||||
|
||||
export function WindowUnminimise() {
|
||||
window.runtime.WindowUnminimise();
|
||||
}
|
||||
|
||||
export function WindowSetBackgroundColour(R, G, B, A) {
|
||||
window.runtime.WindowSetBackgroundColour(R, G, B, A);
|
||||
}
|
||||
|
||||
export function ScreenGetAll() {
|
||||
return window.runtime.ScreenGetAll();
|
||||
}
|
||||
|
||||
export function BrowserOpenURL(url) {
|
||||
window.runtime.BrowserOpenURL(url);
|
||||
}
|
||||
|
||||
export function Environment() {
|
||||
return window.runtime.Environment();
|
||||
}
|
||||
|
||||
export function Quit() {
|
||||
window.runtime.Quit();
|
||||
}
|
||||
|
||||
export function Hide() {
|
||||
window.runtime.Hide();
|
||||
}
|
||||
|
||||
export function Show() {
|
||||
window.runtime.Show();
|
||||
}
|