add load file

Sjj1024 · Sep 26, 2024 · f9140c6 · f9140c6
1 parent c434383
commit f9140c6
Show file tree

Hide file tree

Showing 11 changed files with 307 additions and 10 deletions.
diff --git a/assets/config.txt b/assets/config.txt
@@ -0,0 +1,49 @@
+$APPCONFIG：
+
+$APPDATA：
+
+$APPLOCALDATA：
+
+$APPCACHE：
+
+$APPLOG：
+
+$AUDIO：
+
+$CACHE：
+
+$CONFIG：
+
+$DATA：
+
+$LOCALDATA：
+
+$DESKTOP：
+
+$DOCUMENT：
+
+$DOWNLOAD：
+
+$EXE：
+
+$FONT：
+
+$HOME：
+
+$PICTURE：
+
+$PUBLIC：
+
+$RUNTIME：
+
+$TEMPLATE：
+
+$VIDEO：
+
+$RESOURCE：
+
+$APP：
+
+$LOG：
+
+$TEMP：
diff --git a/src-tauri/Cargo.lock b/src-tauri/Cargo.lock
diff --git a/src-tauri/Cargo.toml b/src-tauri/Cargo.toml
@@ -11,7 +11,7 @@ edition = "2021"
 tauri-build = { version = "1", features = [] }
 
 [dependencies]
-tauri = { version = "1", features = [ "clipboard-all", "fs-all", "http-all", "window-all", "shell-open"] }
+tauri = { version = "1", features = [ "path-all", "protocol-all", "dialog-all", "clipboard-all", "fs-all", "http-all", "window-all", "shell-open"] }
 serde = { version = "1", features = ["derive"] }
 serde_json = "1"
 base64 = "0.22.1"

diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
@@ -7,21 +7,44 @@
     },
     "package": {
         "productName": "PakePlus",
-        "version": "0.1.0"
+        "version": "0.1.1"
     },
     "tauri": {
         "allowlist": {
             "all": false,
+            "path": {
+                "all": true
+            },
             "fs": {
                 "all": true,
                 "readFile": true,
                 "writeFile": true,
-                "scope": ["$APPCONFIG/*"]
+                "readDir": true,
+                "copyFile": true,
+                "createDir": true,
+                "removeDir": true,
+                "removeFile": true,
+                "renameFile": true,
+                "exists": true,
+                "scope": ["$RESOURCE/*"]
             },
             "http": {
                 "all": true,
                 "scope": ["https://api.github.com/*"]
             },
+            "dialog": {
+                "all": true,
+                "ask": true,
+                "confirm": true,
+                "message": true,
+                "open": true,
+                "save": true
+            },
+            "protocol": {
+                "all": true,
+                "asset": true,
+                "assetScope": ["$RESOURCE/*"]
+            },
             "shell": {
                 "all": false,
                 "open": true
@@ -46,7 +69,7 @@
             }
         ],
         "security": {
-            "csp": null
+            "csp": "default-src 'self'; img-src 'self'; asset: https://asset.localhost"
         },
         "bundle": {
             "active": true,

diff --git a/src/App.vue b/src/App.vue
@@ -1,6 +1,19 @@
 <script setup lang="ts">
 const userLanguage = navigator.language
 console.log('System language:', userLanguage)
+
+let theme = localStorage.getItem('theme') || 'dark'
+if (theme !== 'dark') {
+    document.documentElement.setAttribute('theme', 'light')
+    document.querySelector('html')?.classList.remove('dark')
+    document.querySelector('html')?.classList.add('light')
+    // userStore.setTheme('light')
+} else {
+    document.documentElement.setAttribute('theme', 'dark')
+    document.querySelector('html')?.classList.remove('light')
+    document.querySelector('html')?.classList.add('dark')
+    // userStore.setTheme('dark')
+}
 </script>
 
 <template>

diff --git a/src/assets/theme.css b/src/assets/theme.css
@@ -0,0 +1,45 @@
+/* 默认dark主题 */
+:root[theme='dark'] {
+    --bg-color: #0d1117;
+    --text-color: #f0f6fc;
+    --box-shadow: unset;
+    --input-color: black;
+    --menu-ative-bg: rgba(201, 211, 225, 0.08);
+    --scroll-thumb: rgba(255, 255, 255, 0.2);
+    --scroll-track: rgba(251, 249, 249, 0.1);
+    --api-process: #363637;
+    --filt-item: rgba(201, 211, 225, 0.08);
+    --selected-item: rgba(218, 223, 231, 0.247);
+    --file-menu-color: #181818;
+    --file-menu-hover: rgb(145, 145, 145);
+    --file-loading-mask: #0d1117ba;
+    --file-loading-hover: rgba(201, 211, 225, 0);
+    --img-pre-btn-bg: rgb(31 45 61 / 11%);
+    --img-pre-btn-bg-hover: rgb(31 45 61 / 33%);
+    --gpt-message-bg-hover: rgba(201, 211, 225, 0.2);
+    --gpt-me-message-bg: rgb(123, 194, 87);
+    --gpt-me-message-bg-hover: rgb(134, 212, 95);
+}
+
+/* light主题 */
+:root[theme='light'] {
+    --bg-color: #fff;
+    --text-color: #181818;
+    --box-shadow: 8px 8px 16px #d1d9e6, -8px -8px 16px #f9f9f9;
+    --input-color: #181818;
+    --menu-ative-bg: rgba(9, 30, 66, 0.08);
+    --scroll-thumb: rgba(0, 0, 0, 0.2);
+    --scroll-track: rgba(0, 0, 0, 0.1);
+    --api-process: #cdcdcd;
+    --filt-item: #ecf5ff;
+    --selected-item: #d4e7fd;
+    --file-menu-color: #181818;
+    --file-menu-hover: rgb(200, 200, 200);
+    --file-loading-mask: #ecf5ff6a;
+    --file-loading-hover: #ecf5ff3a;
+    --img-pre-btn-bg: rgba(31, 45, 61, 0.11);
+    --img-pre-btn-bg-hover: rgba(31, 45, 61, 0.53);
+    --gpt-message-bg-hover: rgba(9, 30, 66, 0.15);
+    --gpt-me-message-bg: rgb(149, 236, 105);
+    --gpt-me-message-bg-hover: rgb(137, 217, 97);
+}
diff --git a/src/main.ts b/src/main.ts
@@ -7,6 +7,7 @@ import i18n from './lang/index'
 import '@/assets/fonts/iconfont.css'
 import '@/assets/global.scss'
 import 'element-plus/dist/index.css'
+import '@/assets/theme.css'
 import * as ElementPlusIconsVue from '@element-plus/icons-vue'
 
 const app = createApp(App)

diff --git a/src/pages/about.vue b/src/pages/about.vue
@@ -1,13 +1,41 @@
 <template>
     <div @click="goBack">关于TurnApp</div>
+    <div @click="uploadIcon">选择图片</div>
+    <img :src="localImagePath" alt="展示图片" />
 </template>
 
 <script setup lang="ts">
+import { convertFileSrc } from '@tauri-apps/api/tauri'
 import { ref, reactive } from 'vue'
 import { useRouter } from 'vue-router'
+import { open } from '@tauri-apps/api/dialog'
 
 const router = useRouter()
 
+// local image path
+const localImagePath = ref('')
+
+// 上传icon
+const uploadIcon = async () => {
+    console.log('uploadIcon')
+    const selected = await open({
+        multiple: false, // 只允许选择一个文件
+        filters: [
+            {
+                name: 'Image',
+                extensions: ['png', 'jpg', 'jpeg', 'gif'],
+            },
+        ],
+    })
+
+    if (selected) {
+        console.log('Selected file path:', selected)
+        const url = convertFileSrc(selected as string)
+        localImagePath.value = url
+        return selected // 返回选择的文件路径
+    }
+}
+
 const goBack = () => {
     router.go(-1)
 }