优化黑白主题下代码块颜色

buka-inc · Sep 1, 2024 · 9da187f · 9da187f
1 parent cb26cd9
commit 9da187f
Show file tree

Hide file tree

Showing 7 changed files with 90 additions and 29 deletions.
diff --git a/.changeset/sixty-nails-dream.md b/.changeset/sixty-nails-dream.md
@@ -0,0 +1,5 @@
+---
+"@opendoc/frontend": patch
+---
+
+优化黑白主题下代码块颜色
diff --git a/app/frontend/assets/css/schema.css b/app/frontend/assets/css/schema.css
@@ -33,16 +33,16 @@
 }
 
 .schema-keyword {
-  @apply text-blue-500
+  @apply text-ctp-blue
 }
 
 .schema-string {
-  @apply text-green-500
+  @apply text-ctp-green
 }
 
 .schema-constant,
 .schema-number {
-  @apply text-orange-500
+  @apply text-ctp-peach
 }
 
 .schema-prompt:hover,
@@ -56,7 +56,7 @@
 }
 
 .schema-builtin {
-  @apply text-purple-500
+  @apply text-purple-500 text-ctp-mauve
 }
 
 .schema-prompt:hover {

diff --git a/app/frontend/pages/administration/forbidden-application-code-management.vue b/app/frontend/pages/administration/forbidden-application-code-management.vue
@@ -6,6 +6,8 @@ import { createForbiddenApplicationCode, deleteForbiddenApplicationCode, queryFo
 const { data: forbiddenApplicationCodes, pending, execute: reload } = useAsyncData(
   async () => await queryForbiddenApplicationCodes<'200'>(),
 )
+// 定时刷新列表
+useIntervalFn(reload, 10000)
 
 const alert = useAlert()
 const applicationCode = ref('')
@@ -19,7 +21,8 @@ const {
         code: applicationCode.value,
       })
       applicationCode.value = ''
-    } catch (e) {
+    }
+    catch (e) {
       if (e instanceof Error) alert.error(e.message)
     }
 
@@ -29,7 +32,7 @@ const {
 
 const removingForbiddenApplicationCode = ref<string[]>([])
 
-async function removeForbiddenApplicationCode (code: string) {
+async function removeForbiddenApplicationCode(code: string): Promise<void> {
   removingForbiddenApplicationCode.value.push(code)
   await deleteForbiddenApplicationCode({ code })
   await reload()
@@ -66,8 +69,14 @@ async function removeForbiddenApplicationCode (code: string) {
           :class="!applicationCode.length && 'd-btn-disabled'"
           @click="() => !appending && appendForbiddenApplicationCode()"
         >
-          <span v-if="appending" class="loading loading-spinner" />
-          <IconPlus v-else class="size-5" />
+          <span
+            v-if="appending"
+            class="loading loading-spinner"
+          />
+          <IconPlus
+            v-else
+            class="size-5"
+          />
         </button>
       </div>
 

diff --git a/app/frontend/pages/administration/plugin-management.vue b/app/frontend/pages/administration/plugin-management.vue
@@ -12,6 +12,7 @@ const { status, data: plugins, execute: reload } = useAsyncData(async () => {
 
   return body.results
 })
+useIntervalFn(reload, 10000)
 
 const urlInput = ref('')
 const pluginUrl = computed(() => `ws://${urlInput.value}`)
@@ -26,34 +27,37 @@ const { pending: appending, execute: create } = useAsyncFn(async () => {
 
     urlInput.value = ''
     await reload()
-  } catch (err) {
+  }
+  catch (err) {
     if (!(err instanceof RequestException)) throw err
     alert.error(err.message)
   }
 })
 
 const removingCompilerIds = ref<string[]>([])
 
-async function remove (plugin: Plugin): Promise<void> {
+async function remove(plugin: Plugin): Promise<void> {
   try {
     const pluginId = plugin.id
     removingCompilerIds.value.push(pluginId)
     await deletePlugin({ pluginId })
     removingCompilerIds.value = removingCompilerIds.value.filter(id => id !== pluginId)
     await reload()
-  } catch (e) {
+  }
+  catch (e) {
     if (e instanceof Error) alert.error(e.message)
   }
 }
 
-async function toggleStatus (plugin: Plugin): Promise<void> {
+async function toggleStatus(plugin: Plugin): Promise<void> {
   try {
     await updatePlugin({
       pluginId: plugin.id,
       status: plugin.status !== 'enabled' ? 'enabled' : 'disabled',
     })
     await reload()
-  } catch (e) {
+  }
+  catch (e) {
     if (e instanceof Error) alert.error(e.message)
   }
 }
@@ -83,7 +87,10 @@ const tipMap = {
           <span>插件</span>
         </h1>
 
-        <span v-if="status === 'pending' && !!plugins" class="ml-2 d-loading d-loading-sm d-loading-spinner text-gray-600" />
+        <span
+          v-if="status === 'pending' && !!plugins"
+          class="ml-2 d-loading d-loading-sm d-loading-spinner text-gray-600"
+        />
       </div>
 
       <div class="flex-grow-0 flex-shrink-0 flex w-full space-x-4 mb-2">
@@ -108,8 +115,14 @@ const tipMap = {
           :class="!isValidUrl && 'd-btn-disabled'"
           @click="() => !appending && create()"
         >
-          <span v-if="appending" class="d-loading d-loading-spinner" />
-          <IconPlus v-else class="size-5" />
+          <span
+            v-if="appending"
+            class="d-loading d-loading-spinner"
+          />
+          <IconPlus
+            v-else
+            class="size-5"
+          />
         </button>
       </div>
 
@@ -131,7 +144,10 @@ const tipMap = {
             </div>
 
             <div class="d-card-actions ">
-              <div class="d-tooltip" :data-tip="tipMap[plugin.status]">
+              <div
+                class="d-tooltip"
+                :data-tip="tipMap[plugin.status]"
+              >
                 <button
                   class="d-btn d-btn-sm d-btn-ghost d-btn-square transition-colors"
                   @click="() => toggleStatus(plugin)"
@@ -156,7 +172,10 @@ const tipMap = {
                 </button>
               </div>
 
-              <div class="d-tooltip" data-tip="日志">
+              <div
+                class="d-tooltip"
+                data-tip="日志"
+              >
                 <button
                   class="d-btn d-btn-sm d-btn-ghost d-btn-square"
                   @click="pluginInLogs = plugin"
@@ -165,7 +184,10 @@ const tipMap = {
                 </button>
               </div>
 
-              <div class="d-tooltip" data-tip="设置">
+              <div
+                class="d-tooltip"
+                data-tip="设置"
+              >
                 <button
                   class="d-btn d-btn-sm d-btn-ghost d-btn-square"
                   @click="pluginInSettings = plugin"

diff --git a/...ontend/pages/application/[application_id]/sheet/[sheet_id]/[version]/asyncapi/version.vue b/...ontend/pages/application/[application_id]/sheet/[sheet_id]/[version]/asyncapi/version.vue
@@ -5,7 +5,7 @@ import { querySheetVersions } from '~/api/backend'
 
 const sheetId = useRouteParams<string>('sheet_id')
 
-const { pending, data: sheetVersions } = useAsyncData(
+const { pending, data: sheetVersions, execute: reload } = useAsyncData(
   async () => {
     const body = await querySheetVersions<'200'>({
       sheetId: sheetId.value,
@@ -16,6 +16,7 @@ const { pending, data: sheetVersions } = useAsyncData(
     default: () => [],
   },
 )
+useIntervalFn(reload, 10000)
 
 const versionTagMap = computed(() => {
   const tags = R.groupBy(
@@ -37,8 +38,14 @@ const versionTagMap = computed(() => {
 </script>
 
 <template>
-  <StuffedLoading v-if="pending" :pending="pending" />
-  <div v-if="!pending" class="bg-ctp-base p-10">
+  <StuffedLoading
+    v-if="pending"
+    :pending="pending"
+  />
+  <div
+    v-if="!pending"
+    class="bg-ctp-base p-10"
+  >
     <div
       v-for="sheetVersion in sheetVersions"
       :key="sheetVersion.id"

diff --git a/...rontend/pages/application/[application_id]/sheet/[sheet_id]/[version]/openapi/version.vue b/...rontend/pages/application/[application_id]/sheet/[sheet_id]/[version]/openapi/version.vue
@@ -6,7 +6,7 @@ import { querySheetVersions } from '~/api/backend/query_sheet_versions.js'
 
 const sheetId = useRouteParams<string>('sheet_id')
 
-const { pending, data: sheetVersions } = useAsyncData(
+const { pending, data: sheetVersions, execute: reload } = useAsyncData(
   async () => {
     const body = await querySheetVersions<'200'>({
       sheetId: sheetId.value,
@@ -17,6 +17,7 @@ const { pending, data: sheetVersions } = useAsyncData(
     default: () => [],
   },
 )
+useIntervalFn(reload, 10000)
 
 const versionTagMap = computed(() => {
   const tags = R.groupBy(
@@ -36,7 +37,6 @@ const versionTagMap = computed(() => {
 
   return mapping
 })
-
 </script>
 
 <template>

diff --git a/app/frontend/pages/applications.vue b/app/frontend/pages/applications.vue
@@ -35,6 +35,9 @@ const { status, refresh } = useAsyncData(
   },
 )
 
+// 定时刷新应用列表
+useIntervalFn(refresh, 10000)
+
 const showCreateModal = ref(false)
 
 const filterTypeDescription = {
@@ -61,7 +64,10 @@ const filterTypeDescription = {
         </div>
 
         <div class="flex-none">
-          <theme-swap class="d-btn d-btn-square d-btn-ghost" :size="8" />
+          <theme-swap
+            class="d-btn d-btn-square d-btn-ghost"
+            :size="8"
+          />
 
           <NuxtLink
             class="d-btn d-btn-square d-btn-ghost"
@@ -75,18 +81,27 @@ const filterTypeDescription = {
 
     <div class="pt-2 container m-auto flex items-center justify-between">
       <div class="d-join  w-1/2 flex">
-        <SelectBox v-model="filterType" class="w-32">
+        <SelectBox
+          v-model="filterType"
+          class="w-32"
+        >
           <SelectButton
             class="d-join-item d-select-bordered"
           >
             {{ filterTypeDescription[filterType] }}
           </SelectButton>
 
           <template #options>
-            <SelectOption value="title" class="!w-32">
+            <SelectOption
+              value="title"
+              class="!w-32"
+            >
               {{ filterTypeDescription.title }}
             </SelectOption>
-            <SelectOption value="code" class="!w-32">
+            <SelectOption
+              value="code"
+              class="!w-32"
+            >
               {{ filterTypeDescription.code }}
             </SelectOption>
           </template>
@@ -110,7 +125,10 @@ const filterTypeDescription = {
 
     <StuffedLoading :pending="status === 'pending' && !applications.length">
       <div class="container m-auto flex-auto pt-4 space-y-4">
-        <div v-for="application in applications" :key="application.id">
+        <div
+          v-for="application in applications"
+          :key="application.id"
+        >
           <application-preview-card :application="application" />
         </div>
       </div>