Merge pull request #13 from Lemonnnnnnnnnnn/master

feat: 更换UI库
Lemonnnnnnnnnnn · Feb 28, 2024 · 8c43b04 · 8c43b04
2 parents ff1ea5c + 77eb1ba
commit 8c43b04
Show file tree

Hide file tree

Showing 17 changed files with 1,881 additions and 591 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "tauri-yapi-to-ts",
-	"version": "0.1.2",
+	"version": "0.1.3",
 	"scripts": {
 		"dev": "vite dev",
 		"build": "vite build",
@@ -13,13 +13,15 @@
 	"devDependencies": {
 		"@fontsource/fira-mono": "^4.5.10",
 		"@neoconfetti/svelte": "^1.0.0",
+		"@smui/button": "7.0.0-beta.16",
 		"@sveltejs/adapter-auto": "^2.0.0",
 		"@sveltejs/adapter-static": "^2.0.3",
 		"@sveltejs/kit": "^1.27.4",
 		"@tauri-apps/cli": "^1.5.8",
 		"@types/cookie": "^0.5.1",
 		"@typescript-eslint/eslint-plugin": "^6.0.0",
 		"@typescript-eslint/parser": "^6.0.0",
+		"@zerodevx/svelte-toast": "^0.9.5",
 		"eslint": "^8.28.0",
 		"eslint-config-prettier": "^9.1.0",
 		"eslint-plugin-svelte": "^2.30.0",
@@ -29,12 +31,18 @@
 		"svelte-check": "^3.6.0",
 		"tslib": "^2.4.1",
 		"typescript": "^5.0.0",
-		"vite": "^4.4.2",
-		"@zerodevx/svelte-toast": "^0.9.5",
-		"carbon-components-svelte": "^0.82.0"
+		"vite": "^4.4.2"
 	},
 	"type": "module",
 	"dependencies": {
-		"@tauri-apps/api": "^1.5.2"
+		"@smui-extra/accordion": "7.0.0-beta.16",
+		"@smui/dialog": "7.0.0-beta.16",
+		"@smui/linear-progress": "7.0.0-beta.16",
+		"@smui/tab": "7.0.0-beta.16",
+		"@smui/tab-bar": "7.0.0-beta.16",
+		"@smui/textfield": "7.0.0-beta.16",
+		"@smui/tooltip": "7.0.0-beta.16",
+		"@tauri-apps/api": "^1.5.2",
+		"svelte-material-ui": "7.0.0-beta.16"
 	}
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src-tauri/Cargo.lock b/src-tauri/Cargo.lock
diff --git a/src-tauri/Cargo.toml b/src-tauri/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "yapi-to-ts"
-version = "0.1.2"
+version = "0.1.3"
 description = "A Tauri App"
 authors = ["you"]
 license = ""

diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
@@ -8,7 +8,7 @@
   },
   "package": {
     "productName": "tauri-yapi-to-ts",
-    "version": "0.1.0"
+    "version": "0.1.3"
   },
   "tauri": {
     "allowlist": {

diff --git a/src/app.html b/src/app.html
@@ -4,6 +4,7 @@
 		<meta charset="utf-8" />
 		<link rel="icon" href="%sveltekit.assets%/dog.svg" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
+		<link rel="stylesheet" href="node_modules/svelte-material-ui/bare.css" />
 		%sveltekit.head%
 	</head>
 	<body data-sveltekit-preload-data="hover">

diff --git a/src/lib/components/ProcessingModal.svelte b/src/lib/components/ProcessingModal.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { listen } from '@tauri-apps/api/event';
-	import { Modal, ProgressBar } from 'carbon-components-svelte';
+	import Dialog, { Title, Content, Header } from '@smui/dialog';
 	import { onDestroy, onMount } from 'svelte';
 	import { runningTask, processingModalOpen, processingModalTotal } from '../store';
 	import { request } from '@/utils';
@@ -9,6 +9,7 @@
 	import { toastTheme } from '@/consts';
 	import { tweened } from 'svelte/motion';
 	import { cubicOut } from 'svelte/easing';
+	import LinearProgress from '@smui/linear-progress';
 
 	const progress = tweened(0, {
 		duration: 400,
@@ -36,7 +37,7 @@
 			});
 			log_list = log_list;
 			log_area.scrollTop = log_area.scrollHeight;
-			progress.set(event.payload.success_number);
+			progress.set(event.payload.success_number / $processingModalTotal);
 		});
 	});
 
@@ -66,25 +67,30 @@
 	}
 </script>
 
-<Modal
+<Dialog
 	bind:open={$processingModalOpen}
-	modalHeading="Log"
-	preventCloseOnClickOutside
-	passiveModal
-	on:close={onClose}
+	fullscreen
+	aria-labelledby="simple-title"
+	aria-describedby="simple-content"
+	on:SMUIDialog:closed={onClose}
 >
-	<div bind:this={log_area} style="max-height:300px;overflow-y:auto;">
-		{#each log_list as log}
-			{#if log.is_success}
-				<p>{log.msg}</p>
-			{:else}
-				<p style="color:crimson">{log.msg}</p>
-			{/if}
-		{/each}
-	</div>
-
-	<ProgressBar value={$progress} max={$processingModalTotal} labelText="进度条" />
-</Modal>
+	<Header>
+		<Title id="fullscreen-title">日志</Title>
+		<button style="background:#fff;" on:click={() => ($processingModalOpen = false)}>&#x2715;</button>
+	</Header>
+	<Content id="fullscreen-content">
+		<div bind:this={log_area} style="max-height:300px;overflow-y:auto;">
+			{#each log_list as log}
+				{#if log.is_success}
+					<p>{log.msg}</p>
+				{:else}
+					<p style="color:crimson">{log.msg}</p>
+				{/if}
+			{/each}
+		</div>
+		<LinearProgress progress={$progress} />
+	</Content>
+</Dialog>
 
 <style>
 </style>
diff --git a/src/lib/components/Prompt.svelte b/src/lib/components/Prompt.svelte
@@ -3,7 +3,7 @@
 	import { request } from '@/utils';
 	import { open } from '@tauri-apps/api/dialog';
 	import { toast } from '@zerodevx/svelte-toast';
-	import { Button } from 'carbon-components-svelte';
+	import Button from '@smui/button';
 	import type { SuccessResponse } from '@/types/public';
 
 	export let need_init: boolean;
@@ -32,7 +32,7 @@
 </script>
 
 <main class="flex justify-center items-center w-full" style="min-height:100vh">
-	<Button type="primary" on:click={choose}>选择代码库</Button>
+	<Button variant="raised" on:click={choose}>选择代码库</Button>
 </main>
 
 <style>

diff --git a/src/lib/modules/ConfigModule/index.svelte b/src/lib/modules/ConfigModule/index.svelte
@@ -3,7 +3,11 @@
 	import type { Config, SuccessResponse } from '@/types/public';
 	import { request } from '@/utils';
 	import { toast } from '@zerodevx/svelte-toast';
-	import { Button, TextInput, Tooltip } from 'carbon-components-svelte';
+	import Tooltip, { Wrapper } from '@smui/tooltip';
+	import Textfield from '@smui/textfield';
+	import Button from '@smui/button';
+	
+
 	import { onMount } from 'svelte';
 
 	let init_form: Config = {
@@ -18,7 +22,7 @@
 		header_template: '',
 		file_name_template: '',
 		type_import_template: '',
-		proxy:''
+		proxy: ''
 	};
 
 	let form = init_form;
@@ -77,94 +81,73 @@
 	}
 </script>
 
-<main style="height:500px; overflow:auto">
-	<TextInput
-		value={form.source_path}
-		on:change={(e) => (form.source_path = String(e.detail))}
-		labelText="本地项目根路径"
-		placeholder="请输入本地项目根路径"
-	/>
-	<TextInput
-		value={form.base_url}
-		on:change={(e) => (form.base_url = String(e.detail))}
-		labelText="Yapi地址根路径"
-		placeholder="请输入Yapi地址根路径"
-	/>
-	<TextInput
-		value={form.types_path}
-		on:change={(e) => (form.types_path = String(e.detail))}
-		labelText="项目类型目录文件夹路径"
-		placeholder="你想要把接口ts文件放到哪个文件夹下？"
-	/>
-	<TextInput
-		value={form.rate_limit}
-		on:change={(e) => (form.rate_limit = Number(e.detail))}
-		labelText="请求yapi-openapi最大并行请求数"
-		placeholder="请输入请求yapi-openapi最大并行请求数"
+<main
+	style="height:500px; overflow:auto; display:flex;flex-direction: column;gap:18px; padding-top:24px"
+>
+	<Textfield variant="outlined" bind:value={form.source_path} label="本地项目根路径"></Textfield>
+	<Textfield variant="outlined" bind:value={form.base_url} label="Yapi地址根路径"></Textfield>
+	<Textfield
+		variant="outlined"
+		bind:value={form.types_path}
+		label="你想要把接口ts文件放到哪个文件夹下？"
+	></Textfield>
+	<Textfield
 		type="number"
-	/>
-	<TextInput
-		value={form.break_seconds}
-		on:change={(e) => (form.break_seconds = Number(e.detail))}
-		labelText="请求yapi-openapi时间间隔"
-		placeholder="请输入请求yapi-openapi时间间隔"
+		variant="outlined"
+		bind:value={form.rate_limit}
+		label="请求yapi-openapi最大并行请求数"
+	></Textfield>
+	<Textfield
 		type="number"
-	/>
-
-	<TextInput
-		value={form.request_path}
-		on:change={(e) => (form.request_path = String(e.detail))}
-		labelText="Request 目录文件夹路径"
-		placeholder="你想要把定义 request 的 ts 文件放到哪个文件夹下？"
-	/>
-	<TextInput
-		value={form.request_template}
-		on:change={(e) => (form.request_template = String(e.detail))}
-		labelText="请求模板字符串"
-		placeholder="请输入请求模板字符串"
-	/>
-	<Tooltip align="start" direction="top">
-		<p>$1: 请求名</p>
-		<p>$2: 请求类型</p>
-		<p>$3: 返回类型</p>
-		<p>$4: 接口地址</p>
-	</Tooltip>
-
-	<TextInput
-		value={form.type_import_template}
-		on:change={(e) => (form.type_import_template = String(e.detail))}
-		labelText="import类型模板"
-		placeholder="请输入import类型模板"
-	/>
-	<Tooltip align="start" direction="top">
-		<p>$1: Request Type 类型</p>
-		<p>$2: Response Type 类型</p>
-		<p>$3: 类型文件相对地址（请在前面添加类型文件夹别名）</p>
-	</Tooltip>
-	<TextInput
-		value={form.header_template}
-		on:change={(e) => (form.header_template = String(e.detail))}
-		labelText="请求文件首部字符串"
-		placeholder="请输入请求文件首部字符串"
-	/>
-	<TextInput
-		value={form.file_name_template}
-		on:change={(e) => (form.file_name_template = String(e.detail))}
-		labelText="文件名模板字符串"
-		placeholder="请输入文件名模板字符串"
-	/>
-	<Tooltip align="start" direction="top">
-		<p>$1: 文件名</p>
-	</Tooltip>
-	<TextInput
-		value={form.proxy}
-		on:change={(e) => (form.proxy = String(e.detail))}
-		labelText="代理地址"
-		placeholder="请输入代理地址"
-	/>
+		variant="outlined"
+		bind:value={form.break_seconds}
+		label="请求yapi-openapi时间间隔"
+	></Textfield>
+
+	<Textfield
+		variant="outlined"
+		bind:value={form.request_path}
+		label="你想要把定义 request 的 ts 文件放到哪个文件夹下？"
+	></Textfield>
+	<Wrapper>
+		<Textfield variant="outlined" bind:value={form.request_template} label="请求模板字符串"
+		></Textfield>
+		<Tooltip>
+			<p>$1: 请求名</p>
+			<p>$2: 请求类型</p>
+			<p>$3: 返回类型</p>
+			<p>$4: 接口地址</p>
+		</Tooltip>
+	</Wrapper>
+
+	<Wrapper>
+		<Textfield variant="outlined" bind:value={form.type_import_template} label="import类型模板"
+		></Textfield>
+		<Tooltip>
+			<p>$1: Request Type 类型</p>
+			<p>$2: Response Type 类型</p>
+			<p>$3: 类型文件相对地址（请在前面添加类型文件夹别名）</p>
+		</Tooltip>
+	</Wrapper>
+
+	<Textfield variant="outlined" bind:value={form.header_template} label="请求文件首部字符串"
+	></Textfield>
+
+	<Wrapper>
+		<Textfield variant="outlined" bind:value={form.file_name_template} label="文件名模板字符串"
+		></Textfield>
+
+		<Tooltip>
+			<p>$1: 文件名</p>
+		</Tooltip>
+	</Wrapper>
+
+	<Textfield variant="outlined" bind:value={form.proxy} label="代理地址"
+	></Textfield>
+
 </main>
 <footer class="config-module-footer">
-	<Button type="primary" on:click={update_config}>提交</Button>
+	<Button variant="raised" on:click={update_config}>提交</Button>
 </footer>
 
 <style>