MrDanil/ToDo
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Автоматизация создания установщика для Arch, доработка API

Browse Source
This commit is contained in:
Danil
2024-07-06 17:33:46 +07:00
parent c3c95a1d53
commit 84443bef49
16 changed files with 732 additions and 191 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/ApiApp.vue
+53 -35
View File
@@ -8,10 +8,13 @@ import {invoke} from "@tauri-apps/api";
import ConfirmModal from "./api_components/ConfirmModal.vue";
import {listen} from "@tauri-apps/api/event";
import SettingsModal from "./api_components/SettingsModal.vue";
import PageHandler from "./api_wiki/PageHandler.vue";
const isDark = useDark();
const toggleDark = useToggle(isDark);
let wiki_open = ref(false);
let pending = ref(true);
let api_status = ref(false);
@@ -106,7 +109,11 @@ function select_input(event){
</script>
<template>
<div data-tauri-drag-region class="z-50 opacity-50 titlebar h-[30px] select-none fixed flex justify-end top-0 right-0 left-0 bg-gray-100 dark:bg-zinc-800">
<div data-tauri-drag-region class="z-50 titlebar h-[30px] select-none fixed flex justify-end top-0 right-0 left-0 bg-gray-100 dark:bg-zinc-800">
<p class="fixed left-2 top-0.5 text-lg dark:text-white">
<span v-if="!wiki_open">API</span>
<span v-else>API Wiki</span>
</p>
<div @click="appWindow.minimize()" class="titlebar-button hover:bg-gray-200 dark:hover:bg-gray-700 justify-center inline-flex w-[30px] h-[30px] items-center dark:text-white" id="titlebar-minimize">
<Icon class="" icon="mdi:window-minimize" width="20" height="20"/>
</div>
@@ -121,48 +128,59 @@ function select_input(event){
<Icon icon="line-md:loading-twotone-loop" width="96" height="96" class="text-green-500 absolute top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%]"/>
</div>
<div v-else>
<button class="absolute top-10 left-2" @click="open_settings">
<Icon icon="material-symbols:settings-outline" width="38" height="38" class="text-zinc-600 dark:text-zinc-200"/>
</button>
<button class="absolute top-10 right-2" @click="toggleDark()">
<Icon v-if="!isDark" class="group-hover:invert text-yellow-400" icon="flowbite:sun-solid" width="38" height="38"/>
<Icon v-else class="group-hover:invert text-blue-400" icon="ri:moon-fill" width="38" height="38"/>
</button>
<div class="mt-8">
<p class="text-center dark:text-white">API</p>
<div class="grid grid-cols-1 grid-rows-1 sm:grid-cols-2 sm:grid-rows-2 mt-8 sm:mt-2 gap-2.5 dark:text-white md:mt-4 md:mx-16 lg:mt-8 lg:mx-24">
<div class="text-center shadow dark:shadow-white mx-4 sm:mx-0 sm:ml-4 rounded-lg p-1">
<p class="mb-4">Статус</p>
<div v-if="!api_status" class="flex text-center align-middle items-center">
<Icon class="text-red-500" icon="oui:dot" width="36" height="36"/>
<span>Не подключено</span>
<button @click="run_api" class="bg-green-500 text-white rounded-lg py-1 px-2 ml-2 hover:bg-green-600 transition-colors">Запустить</button>
</div>
<div v-else class="flex text-center align-middle items-center">
<Icon class="text-green-500" icon="oui:dot" width="36" height="36"/>
<span>Работает</span>
<button @click="stop_api" class="bg-green-500 text-white rounded-lg py-1 px-2 ml-2 hover:bg-green-600 transition-colors">Остановить</button>
</div>
</div>
<div class="grid text-center shadow dark:shadow-white mx-4 sm:mx-0 sm:mr-4 rounded-lg p-1 justify-center items-center">
<div v-if="api_status">
<p class="mb-2">Токен подключения</p>
<div>
<input @click="select_input" size="30" id="token_con" readonly type="password" class="rounded-lg my-0.5 px-2 dark:bg-zinc-700"
:value="input_val">
<div v-if="!wiki_open">
<button class="absolute top-10 left-2" @click="open_settings">
<Icon icon="material-symbols:settings-outline" width="38" height="38" class="text-zinc-600 dark:text-zinc-200"/>
</button>
<div class="mt-8">
<div class="mt-[28vh] grid grid-cols-1 grid-rows-3 sm:grid-cols-2 sm:grid-rows-2 gap-2.5 dark:text-white md:mx-16 lg:mx-24">
<div class="text-center shadow dark:shadow-white mx-4 sm:mx-0 sm:ml-4 rounded-lg p-1 row-span-1">
<p class="mb-4">Статус</p>
<div v-if="!api_status" class="flex text-center align-middle items-center">
<Icon class="text-red-500" icon="oui:dot" width="36" height="36"/>
<span>Не подключено</span>
<button @click="run_api" class="bg-green-500 text-white rounded-lg py-1 px-2 ml-2 hover:bg-green-600 transition-colors">Запустить</button>
</div>
<div class="flex justify-center items-center">
<button class="text-[15px] m-1 rounded-lg bg-red-500 text-white py-1 px-2" @click="confirm_modal = true">Сгенерировать новый</button>
<p id="timer" class="text-xl ml-2"></p>
<div v-else class="flex text-center align-middle items-center">
<Icon class="text-green-500" icon="oui:dot" width="36" height="36"/>
<span>Работает</span>
<button @click="stop_api" class="bg-green-500 text-white rounded-lg py-1 px-2 ml-2 hover:bg-green-600 transition-colors">Остановить</button>
</div>
</div>
<p v-else class="underline decoration-red-500 decoration-2 underline-offset-2">Нет подключения</p>
<div class="grid text-center shadow dark:shadow-white mx-4 sm:mx-0 sm:mr-4 rounded-lg p-1 justify-center items-center row-start-2 sm:row-span-1">
<div v-if="api_status">
<p class="mb-2">Токен подключения</p>
<div>
<input @click="select_input" size="30" id="token_con" readonly type="password" class="rounded-lg my-0.5 px-2 dark:bg-zinc-700"
:value="input_val">
</div>
<div class="flex justify-center items-center">
<button class="text-[15px] m-1 rounded-lg bg-red-500 text-white py-1 px-2" @click="confirm_modal = true">Сгенерировать новый</button>
<p id="timer" class="text-xl ml-2"></p>
</div>
</div>
<p v-else class="underline decoration-red-500 decoration-2 underline-offset-2">Нет подключения</p>
</div>
<div @click="wiki_open = true" class="cursor-pointer group mt-2 text-center shadow dark:shadow-white hover:shadow-md dark:hover:shadow-white ml-4 mr-6 sm:mr-4 rounded-lg p-1 col-start-1 col-end-3 row-start-3 sm:row-span-2">
<Icon class="mt-1 text-zinc-800 dark:text-zinc-100 mx-auto" icon="mingcute:question-line" width="48" height="48"/>
<p class="text-xl mt-1 mb-2.5 group-hover:underline">Как этим пользоваться?</p>
</div>
</div>
</div>
<div v-if="confirm_modal || settings_modal" class="bg-black w-[100vw] h-full fixed top-0 opacity-70 z-40"/>
<ConfirmModal v-if="confirm_modal" @close="confirm_modal = false" @yes="regen_token"/>
<SettingsModal v-if="settings_modal" @close="settings_modal = false" :autostart="settings_autostart" :port="settings_port"/>
</div>
<div v-else>
<button class="absolute top-10 left-2" @click="wiki_open = false">
<Icon icon="material-symbols:arrow-back" width="38" height="38" class="text-zinc-600 dark:text-zinc-200"/>
</button>
<PageHandler/>
</div>
<div v-if="confirm_modal || settings_modal" class="bg-black w-[100vw] h-full fixed top-0 opacity-70 z-40"/>
<ConfirmModal v-if="confirm_modal" @close="confirm_modal = false" @yes="regen_token"/>
<SettingsModal v-if="settings_modal" @close="settings_modal = false" :autostart="settings_autostart" :port="settings_port"/>
</div>
</template>
@@ -178,7 +196,7 @@ function select_input(event){
line-height: 24px;
font-weight: 400;
background-color: rgb(246 247 248);
background-color: rgb(244 245 246);
font-synthesis: none;
text-rendering: optimizeLegibility;
@@ -188,6 +206,6 @@ function select_input(event){
}
:root.dark {
background-color: rgb(30, 30, 30);
background-color: rgb(35, 35, 35);
}
</style>