refactor(frontend): 规范一些文件命名

Signed-off-by: Myon <[email protected]>

frontend/src/App.vue

@@ -2,22 +2,25 @@
   <router-view />
 </template>
 <script setup>
-import {getJobsStatus, systemState} from 'src/store/systemState';
-import useInterval from 'src/composables/useInterval';
-import {watch} from 'vue';
-import {userState} from 'src/store/userState';
+import { getJobsStatus, systemState } from 'src/store/systemState';
+import useInterval from 'src/composables/use-interval';
+import { watch } from 'vue';
+import { userState } from 'src/store/userState';
 
 const getSystemJobStatus = () => {
   if (userState.accessToken && systemState.systemInfo?.is_setup) {
     getJobsStatus();
   }
-}
+};
 
 useInterval(() => {
-  getSystemJobStatus()
+  getSystemJobStatus();
 }, 8000);
 
-watch(() => systemState.systemInfo?.is_setup, () => {
-  getSystemJobStatus()
-})
+watch(
+  () => systemState.systemInfo?.is_setup,
+  () => {
+    getSystemJobStatus();
+  }
+);
 </script>

frontend/src/components/CopyToClipboardBtn.vue

@@ -4,7 +4,7 @@
 
 <script setup>
 import { copyToClipboard } from 'quasar';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 
 const props = defineProps({
   text: String,

frontend/src/composables/useRealTimeLog.js → frontend/src/composables/use-real-time-log.js

@@ -1,5 +1,5 @@
 import { ref } from 'vue';
-import { useWebSocketApi } from 'src/composables/useWebSocketApi';
+import { useWebSocketApi } from 'src/composables/use-web-socket-api';
 
 export const useRealTimeLog = () => {
   const logLines = ref([]);

frontend/src/composables/useWebSocketApi.js → frontend/src/composables/use-web-socket-api.js

@@ -1,6 +1,6 @@
 import EventEmitter from 'events';
 import { LocalStorage } from 'quasar';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 import { onBeforeUnmount, onMounted } from 'vue';
 
 class WSManager extends EventEmitter {

frontend/src/layouts/BugReportItem.vue

@@ -10,5 +10,5 @@
 </template>
 
 <script setup>
-import { gotoGithubIssuePage } from 'src/utils/CommonUtils';
+import { gotoGithubIssuePage } from 'src/utils/common';
 </script>

frontend/src/pages/access/login/index.vue

@@ -1,13 +1,11 @@
 <template>
   <div id="q-app">
     <q-layout view="lHh Lpr fff">
-      <q-page
-        class="window-height window-width row justify-center items-center"
-      >
-        <login-bg-area/>
+      <q-page class="window-height window-width row justify-center items-center">
+        <login-bg-area />
         <q-form @submit="submit" class="column q-pa-lg">
           <div class="row">
-            <q-card square class="shadow-24" style="width: 400px;">
+            <q-card square class="shadow-24" style="width: 400px">
               <q-card-section class="bg-black">
                 <h4 class="text-h5 text-white q-my-md">系统登录</h4>
               </q-card-section>
@@ -17,7 +15,7 @@
                     square
                     v-model="form.username"
                     lazy-rules
-                    :rules="[val => !!val || '用户名不能为空']"
+                    :rules="[(val) => !!val || '用户名不能为空']"
                     label="用户名"
                   >
                     <template v-slot:prepend>
@@ -29,7 +27,7 @@
                     v-model="form.password"
                     type="password"
                     lazy-rules
-                    :rules="[val => !!val || '密码不能为空']"
+                    :rules="[(val) => !!val || '密码不能为空']"
                     label="密码"
                   >
                     <template v-slot:prepend>
@@ -59,25 +57,25 @@
 </template>
 
 <script setup>
-import {reactive, ref} from 'vue';
-import {SystemMessage} from 'src/utils/Message';
-import {useRouter} from 'vue-router';
+import { reactive, ref } from 'vue';
+import { SystemMessage } from 'src/utils/message';
+import { useRouter } from 'vue-router';
 import AccessApi from 'src/api/AccessApi';
-import {LocalStorage} from 'quasar';
-import {userState} from 'src/store/userState';
+import { LocalStorage } from 'quasar';
+import { userState } from 'src/store/userState';
 import LoginBgArea from 'pages/access/login/LoginBgArea';
 
 const router = useRouter();
 const form = reactive({
   username: '',
   password: '',
-})
+});
 
-const submitting = ref(false)
+const submitting = ref(false);
 
 const submit = async () => {
   submitting.value = true;
-  const formData = {...form}
+  const formData = { ...form };
   delete formData.confirmPassword;
   const [res, err] = await AccessApi.login(formData);
   submitting.value = false;
@@ -87,10 +85,10 @@ const submit = async () => {
   }
   const userData = {
     accessToken: res.access_token,
-    username: form.username
+    username: form.username,
   };
-  Object.assign(userState, userData)
-  LocalStorage.set('token', userData)
-  router.push('/')
-}
+  Object.assign(userState, userData);
+  LocalStorage.set('token', userData);
+  router.push('/');
+};
 </script>

frontend/src/pages/jobs/JobLogBtnDialog.vue

@@ -19,7 +19,7 @@
 <script setup>
 import JobApi from 'src/api/JobApi';
 import { ref } from 'vue';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 import LogViewerRaw from 'components/LogViewerRaw';
 
 const props = defineProps({

frontend/src/pages/jobs/index.vue

@@ -20,16 +20,10 @@
           @click="batchUpdatePriority('low')"
         />
 
-        <q-btn
-          :disable="selected.length === 0"
-          size="md"
-          label="修改状态"
-          color="primary"
-          @click="batchUpdateStatus"
-        />
+        <q-btn :disable="selected.length === 0" size="md" label="修改状态" color="primary" @click="batchUpdateStatus" />
       </div>
 
-      <q-space/>
+      <q-space />
 
       <div class="q-gutter-sm row">
         <q-select
@@ -66,7 +60,7 @@
       </div>
     </div>
 
-    <q-separator class="q-mt-md"/>
+    <q-separator class="q-mt-md" />
 
     <q-table
       :columns="columns"
@@ -77,7 +71,6 @@
       class="sticky-column-table"
       :pagination="{ rowsPerPage: 20 }"
     >
-
       <template v-slot:body-cell-jobStatus="{ row }">
         <q-td>
           <span
@@ -106,7 +99,7 @@
 <script setup>
 import { computed, onMounted, reactive, ref } from 'vue';
 import JobApi from 'src/api/JobApi';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 import { VIDEO_TYPE_NAME_MAP } from 'src/constants/SettingConstants';
 import {
   JOB_STATUS_COLOR_MAP,
@@ -302,7 +295,7 @@ onMounted(() => {
 <style lang="scss">
 .sticky-column-table {
   thead tr:last-child th:last-child {
-    background-color: #fff
+    background-color: #fff;
   }
 
   td:last-child {
@@ -320,5 +313,4 @@ onMounted(() => {
     //border-left: 1px solid $grey-3;
   }
 }
-
 </style>

frontend/src/pages/library/BtnDialogCoverSetting.vue

@@ -19,7 +19,7 @@
 import CommonFormDialog from 'components/CommonFormDialog';
 import { reactive, ref } from 'vue';
 import { LocalStorage } from 'quasar';
-import { coverRule } from 'pages/library/useLibrary';
+import { coverRule } from 'pages/library/use-library';
 
 const emit = defineEmits(['update']);
 

frontend/src/pages/library/BtnDialogPreviewVideo.vue

@@ -46,7 +46,7 @@ import LibraryApi from 'src/api/LibraryApi';
 import Artplayer from 'components/Artplayer';
 import config from 'src/config';
 import { useQuasar } from 'quasar';
-import { getUrl } from 'pages/library/useLibrary';
+import { getUrl } from 'pages/library/use-library';
 import { userState } from 'src/store/userState';
 
 const $q = useQuasar();

frontend/src/pages/library/BtnDialogSearchSubtitle.vue

@@ -44,7 +44,7 @@
 <script setup>
 import { ref } from 'vue';
 import LibraryApi from 'src/api/LibraryApi';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 
 const props = defineProps({
   path: String,

frontend/src/pages/library/BtnIgnoreVideo.vue

@@ -27,7 +27,7 @@
 
 <script setup>
 import LibraryApi from 'src/api/LibraryApi';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 import { useQuasar } from 'quasar';
 import { onMounted, ref } from 'vue';
 import useEventBus from 'src/composables/use-event-bus';

frontend/src/pages/library/BtnDialogLibraryRefresh.vue → frontend/src/pages/library/BtnLibraryRefresh.vue

@@ -8,7 +8,7 @@
 </template>
 
 <script setup>
-import { refreshCacheLoading, refreshLibrary } from 'pages/library/useLibrary';
+import { refreshCacheLoading, refreshLibrary } from 'pages/library/use-library';
 import { useQuasar } from 'quasar';
 
 const $q = useQuasar();

frontend/src/pages/library/BtnDialogMediaServerSubtitleRefresh.vue → frontend/src/pages/library/BtnMediaServerSubtitleRefresh.vue

@@ -10,9 +10,9 @@
 <script setup>
 import { useQuasar } from 'quasar';
 import LibraryApi from 'src/api/LibraryApi';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 import { computed } from 'vue';
-import { settingsState } from 'pages/settings/useSettings';
+import { settingsState } from 'pages/settings/use-settings';
 
 const $q = useQuasar();
 

frontend/src/pages/library/BtnUploadSubtitle.vue

@@ -20,9 +20,9 @@
 
 <script setup>
 import { ref, watch, watchEffect } from 'vue';
-import { getSubtitleUploadList, subtitleUploadList } from 'pages/library/useLibrary';
+import { getSubtitleUploadList, subtitleUploadList } from 'pages/library/use-library';
 import LibraryApi from 'src/api/LibraryApi';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 import eventBus from 'vue3-eventbus';
 
 const props = defineProps({

frontend/src/pages/library/movies/ListItemMovie.vue

@@ -74,10 +74,10 @@
 <script setup>
 import { computed, onMounted, ref, watch } from 'vue';
 import LibraryApi from 'src/api/LibraryApi';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 import { VIDEO_TYPE_MOVIE } from 'src/constants/SettingConstants';
 import { useQuasar } from 'quasar';
-import { getUrl, subtitleUploadList } from 'pages/library/useLibrary';
+import { getUrl, subtitleUploadList } from 'pages/library/use-library';
 import BtnIgnoreVideo from 'pages/library/BtnIgnoreVideo';
 import BtnUploadSubtitle from 'pages/library/BtnUploadSubtitle';
 import BtnDialogPreviewVideo from 'pages/library/BtnDialogPreviewVideo';

frontend/src/pages/library/movies/index.vue

@@ -25,10 +25,10 @@
 </template>
 
 <script setup>
-import { useLibrary } from 'pages/library/useLibrary';
+import { useLibrary } from 'pages/library/use-library';
 import { computed, reactive } from 'vue';
-import BtnDialogLibraryRefresh from 'pages/library/BtnDialogLibraryRefresh';
-import BtnDialogMediaServerSubtitleRefresh from 'pages/library/BtnDialogMediaServerSubtitleRefresh';
+import BtnDialogLibraryRefresh from 'pages/library/BtnLibraryRefresh';
+import BtnDialogMediaServerSubtitleRefresh from 'pages/library/BtnMediaServerSubtitleRefresh';
 import ListItemMovie from './ListItemMovie';
 
 const filterForm = reactive({

frontend/src/pages/library/tvs/DialogTVDetail.vue

@@ -137,11 +137,11 @@
 <script setup>
 import { computed, ref, watch } from 'vue';
 import LibraryApi from 'src/api/LibraryApi';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 import { VIDEO_TYPE_TV } from 'src/constants/SettingConstants';
 import config from 'src/config';
 import { useQuasar } from 'quasar';
-import { useSelection } from 'src/composables/useSelection';
+import { useSelection } from 'src/composables/use-selection';
 import BtnIgnoreVideo from 'pages/library/BtnIgnoreVideo';
 import eventBus from 'vue3-eventbus';
 import BtnUploadSubtitle from 'pages/library/BtnUploadSubtitle';

frontend/src/pages/library/tvs/ListItemTV.vue

@@ -36,7 +36,7 @@
 import { computed, onMounted, ref, watch } from 'vue';
 import DialogTVDetail from 'pages/library/tvs/DialogTVDetail';
 import LibraryApi from 'src/api/LibraryApi';
-import { getUrl, subtitleUploadList } from 'pages/library/useLibrary';
+import { getUrl, subtitleUploadList } from 'pages/library/use-library';
 import { VIDEO_TYPE_TV } from 'src/constants/SettingConstants';
 
 const props = defineProps({

frontend/src/pages/library/tvs/index.vue

@@ -25,11 +25,11 @@
 </template>
 
 <script setup>
-import { useLibrary } from 'pages/library/useLibrary';
+import { useLibrary } from 'pages/library/use-library';
 import { computed, reactive } from 'vue';
 import ListItemTV from 'pages/library/tvs/ListItemTV';
-import BtnDialogLibraryRefresh from 'pages/library/BtnDialogLibraryRefresh';
-import BtnDialogMediaServerSubtitleRefresh from 'pages/library/BtnDialogMediaServerSubtitleRefresh';
+import BtnDialogLibraryRefresh from 'pages/library/BtnLibraryRefresh';
+import BtnDialogMediaServerSubtitleRefresh from 'pages/library/BtnMediaServerSubtitleRefresh';
 
 const filterForm = reactive({
   hasSubtitle: null,

frontend/src/pages/library/useLibrary.js → frontend/src/pages/library/use-library.js

@@ -1,10 +1,10 @@
 import { computed, onBeforeUnmount, onMounted, ref } from 'vue';
 import LibraryApi from 'src/api/LibraryApi';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 import { until } from '@vueuse/core';
 import config from 'src/config';
 import { LocalStorage } from 'quasar';
-import { useSettings } from 'pages/settings/useSettings';
+import { useSettings } from 'pages/settings/use-settings';
 
 export const getUrl = (basePath) => config.BACKEND_URL + basePath.split(/\/|\\/).join('/');
 

frontend/src/pages/overview/index.vue

@@ -24,7 +24,7 @@ import { getJobsStatus, isJobRunning, systemState } from 'src/store/systemState'
 import { useQuasar } from 'quasar';
 import { onMounted, ref } from 'vue';
 import JobApi from 'src/api/JobApi';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 
 const $q = useQuasar();
 

frontend/src/pages/overview/useJob.js → frontend/src/pages/overview/use-job.js

@@ -1,5 +1,5 @@
 import { onMounted, ref, watch, computed } from 'vue';
-import { useWebSocketApi } from 'src/composables/useWebSocketApi';
+import { useWebSocketApi } from 'src/composables/use-web-socket-api';
 import { systemState } from 'src/store/systemState';
 
 export const subJobsDetail = ref(null);

frontend/src/pages/settings/BtnCheckEmbyServer.vue

@@ -5,8 +5,8 @@
 <script setup>
 import { ref } from 'vue';
 import CommonApi from 'src/api/CommonApi';
-import { SystemMessage } from 'src/utils/Message';
-import { formModel } from 'pages/settings/useSettings';
+import { SystemMessage } from 'src/utils/message';
+import { formModel } from 'pages/settings/use-settings';
 
 const loading = ref(false);
 

frontend/src/pages/settings/BtnCheckTmdbApi.vue

@@ -5,8 +5,8 @@
 <script setup>
 import { ref } from 'vue';
 import CommonApi from 'src/api/CommonApi';
-import { SystemMessage } from 'src/utils/Message';
-import { formModel } from 'pages/settings/useSettings';
+import { SystemMessage } from 'src/utils/message';
+import { formModel } from 'pages/settings/use-settings';
 
 const loading = ref(false);
 

frontend/src/pages/settings/ExportSettingBtnDialog.vue → frontend/src/pages/settings/BtnDialogExportSetting.vue

@@ -28,8 +28,8 @@
 
 <script setup>
 import { computed, ref } from 'vue';
-import { getExportSettings } from 'pages/settings/useSettings';
-import { saveText } from 'src/utils/FileDownload';
+import { getExportSettings } from 'pages/settings/use-settings';
+import { saveText } from 'src/utils/file-download';
 import CopyToClipboardBtn from 'components/CopyToClipboardBtn';
 
 const visible = ref(false);

frontend/src/pages/settings/FormSubmitArea.vue

@@ -7,7 +7,7 @@
 </template>
 
 <script setup>
-import { resetForm, submitting } from 'pages/settings/useSettings';
-import ExportSettingBtnDialog from 'pages/settings/ExportSettingBtnDialog';
+import { resetForm, submitting } from 'pages/settings/use-settings';
+import ExportSettingBtnDialog from 'pages/settings/BtnDialogExportSetting';
 import { isJobRunning } from 'src/store/systemState';
 </script>

frontend/src/pages/settings/AdvancedSettings.vue → frontend/src/pages/settings/SettingsPanelAdvanced.vue

@@ -380,10 +380,10 @@ import {
   SUB_TYPE_PRIORITY_NAME_MAP,
   PROXY_TYPE_NAME_MAP,
 } from 'src/constants/SettingConstants';
-import { formModel } from 'pages/settings/useSettings';
+import { formModel } from 'pages/settings/use-settings';
 import { toRefs } from '@vueuse/core';
 import ProxyCheckBtn from 'components/ProxyCheckBtn';
-import EditSubSourceBtnDialog from 'pages/settings/EditSubSourceBtnDialog';
+import EditSubSourceBtnDialog from 'pages/settings/BtnDialogEditSubSource';
 import BtnCheckTmdbApi from 'pages/settings/BtnCheckTmdbApi';
 
 const subNameFormatDescMap = {

frontend/src/pages/settings/BasicSettings.vue → frontend/src/pages/settings/SettingsPanelBasic.vue

@@ -217,8 +217,8 @@
 </template>
 
 <script setup>
-import { formModel } from 'pages/settings/useSettings';
-import { validateCronTime, validateRemotePath } from 'src/utils/QuasarValidators';
+import { formModel } from 'pages/settings/use-settings';
+import { validateCronTime, validateRemotePath } from 'src/utils/quasar-validators';
 import { toRefs } from '@vueuse/core';
 import { ref, watch } from 'vue';
 

frontend/src/pages/settings/DevelopmentSettings.vue → frontend/src/pages/settings/SettingsPanelDevelopment.vue

@@ -20,7 +20,7 @@
 </template>
 
 <script setup>
-import { formModel } from 'pages/settings/useSettings';
+import { formModel } from 'pages/settings/use-settings';
 import { toRefs } from '@vueuse/core';
 
 const { developer_settings: form } = toRefs(formModel);

frontend/src/pages/settings/EmbySettings.vue → frontend/src/pages/settings/SettingsPanelEmby.vue

@@ -78,7 +78,7 @@
 </template>
 
 <script setup>
-import { formModel } from 'pages/settings/useSettings';
+import { formModel } from 'pages/settings/use-settings';
 import { toRefs } from '@vueuse/core';
 import BtnCheckEmbyServer from 'pages/settings/BtnCheckEmbyServer';
 

frontend/src/pages/settings/ExperimentSettings.vue → frontend/src/pages/settings/SettingsPanelExperiment.vue

@@ -53,9 +53,7 @@
       <q-item tag="label" v-ripple>
         <q-item-section>
           <q-item-label>共享字幕</q-item-label>
-          <q-item-label caption
-          >上传字幕能够让本程序变得更加好用，发扬共享精神，一起来共享字幕吧！</q-item-label
-          >
+          <q-item-label caption>上传字幕能够让本程序变得更加好用，发扬共享精神，一起来共享字幕吧！</q-item-label>
         </q-item-section>
         <q-item-section avatar top>
           <q-toggle v-model="form.share_sub_settings.share_sub_enabled" />
@@ -219,16 +217,16 @@
 </template>
 
 <script setup>
-import { formModel } from 'pages/settings/useSettings';
+import { formModel } from 'pages/settings/use-settings';
 import { toRefs } from '@vueuse/core';
 import {
   AUTO_CONVERT_LANG_NAME_MAP,
   DESC_ENCODE_TYPE_NAME_MAP,
   DESC_ENCODE_TYPE_UTF8,
 } from 'src/constants/SettingConstants';
-import {computed, watch} from 'vue';
+import { computed, watch } from 'vue';
 import CopyToClipboardBtn from 'components/CopyToClipboardBtn';
-import {useQuasar} from 'quasar';
+import { useQuasar } from 'quasar';
 
 const $q = useQuasar();
 
@@ -254,12 +252,14 @@ const generateApiKey = () => {
   formModel.experimental_function.api_key_settings.key = uuid;
 };
 
-watch(() => formModel.experimental_function.share_sub_settings.share_sub_enabled, (val) => {
-  if (val) {
-    $q.dialog({
-      title: '共享字幕说明',
-      style: 'width: 600px',
-      message: `<b>开启“共享字幕”功能后：</b>
+watch(
+  () => formModel.experimental_function.share_sub_settings.share_sub_enabled,
+  (val) => {
+    if (val) {
+      $q.dialog({
+        title: '共享字幕说明',
+        style: 'width: 600px',
+        message: `<b>开启“共享字幕”功能后：</b>
 <ul>
   <li>本程序会收集、上传 Emby 中已经观看的视频对应的字幕（如果你没有开启 Emby 那么就不会收集这个部分的字幕）
   <li>如果你使用了本程序提供的 Http API 提交了已经观看的视频和字幕信息，本程序也会收集这个部分
@@ -280,15 +280,18 @@ watch(() => formModel.experimental_function.share_sub_settings.share_sub_enabled
 </ul>
 <div style="color: red;">* 开启共享后，需要重启本程序或者docker容器才能生效</div>
 `,
-      persistent: true,
-      html: true,
-      ok: '共享',
-      cancel: '不共享',
-    }).onOk(() => {
-      // 共享字幕
-    }).onCancel(() => {
-      formModel.experimental_function.share_sub_settings.share_sub_enabled = false;
-    })
+        persistent: true,
+        html: true,
+        ok: '共享',
+        cancel: '不共享',
+      })
+        .onOk(() => {
+          // 共享字幕
+        })
+        .onCancel(() => {
+          formModel.experimental_function.share_sub_settings.share_sub_enabled = false;
+        });
+    }
   }
-})
+);
 </script>

frontend/src/pages/settings/SubSourceSettings.vue → frontend/src/pages/settings/SettingsPanelSubSource.vue

@@ -37,7 +37,7 @@
 </template>
 
 <script setup>
-import { formModel } from 'pages/settings/useSettings';
+import { formModel } from 'pages/settings/use-settings';
 import { toRefs } from '@vueuse/core';
 
 const { subtitle_sources: form } = toRefs(formModel);

frontend/src/pages/settings/index.vue

@@ -72,15 +72,15 @@
 
 <script setup>
 import { computed, ref } from 'vue';
-import BasicSettings from 'pages/settings/BasicSettings';
-import AdvancedSettings from 'pages/settings/AdvancedSettings';
-import EmbySettings from 'pages/settings/EmbySettings';
-import DevelopmentSettings from 'pages/settings/DevelopmentSettings';
-import { settingsState, submitAll, useSettings } from 'pages/settings/useSettings';
+import BasicSettings from 'pages/settings/SettingsPanelBasic';
+import AdvancedSettings from 'pages/settings/SettingsPanelAdvanced';
+import EmbySettings from 'pages/settings/SettingsPanelEmby';
+import DevelopmentSettings from 'pages/settings/SettingsPanelDevelopment';
+import { settingsState, submitAll, useSettings } from 'pages/settings/use-settings';
 import { isJobRunning } from 'src/store/systemState';
-import ExperimentSettings from 'pages/settings/ExperimentSettings';
+import ExperimentSettings from 'pages/settings/SettingsPanelExperiment';
 import FormSubmitArea from 'pages/settings/FormSubmitArea';
-import SubSourceSettings from 'pages/settings/SubSourceSettings';
+import SubSourceSettings from 'pages/settings/SettingsPanelSubSource';
 
 const tab = ref('basic');
 

frontend/src/pages/settings/useSettings.js → frontend/src/pages/settings/use-settings.js

@@ -1,8 +1,8 @@
 import { reactive, ref, watch } from 'vue';
 import SettingApi from 'src/api/SettingApi';
-import { SystemMessage } from 'src/utils/Message';
-import { deepCopy } from 'src/utils/CommonUtils';
-import { useAppStatusLoading } from 'src/composables/useAppStatusLoading';
+import { SystemMessage } from 'src/utils/message';
+import { deepCopy } from 'src/utils/common';
+import { useAppStatusLoading } from 'src/composables/use-app-status-loading';
 import { isRunningInDocker } from 'src/store/systemState';
 import { Dialog } from 'quasar';
 

frontend/src/pages/setup/AdminAccountForm.vue

@@ -7,9 +7,9 @@
       hint="用户名必须在3-16个字符以内，只能包含字母、数字、下划线"
       lazy-rules
       :rules="[
-                (val) => (val && val.length > 0) || '请输入用户名',
-                (val) => /^[_a-zA-Z0-9]{3,16}$/.test(val) || '用户名必须在3-16个字符以内，只能包含字母、数字、下划线',
-              ]"
+        (val) => (val && val.length > 0) || '请输入用户名',
+        (val) => /^[_a-zA-Z0-9]{3,16}$/.test(val) || '用户名必须在3-16个字符以内，只能包含字母、数字、下划线',
+      ]"
     />
 
     <q-input
@@ -20,10 +20,11 @@
       hint="密码必须在6-30位之间"
       lazy-rules
       :rules="[
-                (val) => (val && val.length > 0) || '请输入密码',
-                (val) => /^([a-z]|[A-Z]|[\d~@#$%\*-\+=:,\\?\[\]\{}]){6,30}$/.test(val)
-                 || '密码必须在6-30位之间，且只能由字母、数字、特殊符号组成',
-              ]"
+        (val) => (val && val.length > 0) || '请输入密码',
+        (val) =>
+          /^([a-z]|[A-Z]|[\d~@#$%\*-\+=:,\\?\[\]\{}]){6,30}$/.test(val) ||
+          '密码必须在6-30位之间，且只能由字母、数字、特殊符号组成',
+      ]"
     />
 
     <q-input
@@ -39,5 +40,5 @@
 </template>
 
 <script setup>
-import {setupState} from 'pages/setup/useSetup';
+import { setupState } from 'pages/setup/use-setup';
 </script>

frontend/src/pages/setup/EmbySetupForm.vue

@@ -63,5 +63,5 @@
 </template>
 
 <script setup>
-import { setupState } from 'pages/setup/useSetup';
+import { setupState } from 'pages/setup/use-setup';
 </script>

frontend/src/pages/setup/ScanFolderForm.vue

@@ -18,7 +18,7 @@
           class="col-11"
           filled
           v-model="setupState.form.movieFolder[i]"
-          :label="`电影目录${i > 0 ? i+1 : ''}`"
+          :label="`电影目录${i > 0 ? i + 1 : ''}`"
           hint="输入需要扫描的电影文件夹目录"
           lazy-rules
           :rules="[(val) => (val && val.length > 0) || '不能为空', validateRemotePath]"
@@ -54,7 +54,7 @@
           class="col-11"
           filled
           v-model="setupState.form.seriesFolder[i]"
-          :label="`连续剧目录${i > 0 ? i+1 : ''}`"
+          :label="`连续剧目录${i > 0 ? i + 1 : ''}`"
           hint="输入需要扫描的连续剧文件夹目录"
           lazy-rules
           :rules="[(val) => (val && val.length > 0) || '不能为空', validateRemotePath]"
@@ -71,11 +71,10 @@
         ></q-btn>
       </div>
     </template>
-
   </q-form>
 </template>
 
 <script setup>
-import { validateRemotePath } from 'src/utils/QuasarValidators';
-import {setupState} from 'pages/setup/useSetup';
+import { validateRemotePath } from 'src/utils/quasar-validators';
+import { setupState } from 'pages/setup/use-setup';
 </script>

frontend/src/pages/setup/SelectMediaServerForm.vue

@@ -16,7 +16,7 @@
         </q-item-section>
         <q-item-section>
           <q-item-label>
-            <img src="images/emby-logo.png" style="height: 30px;">
+            <img src="images/emby-logo.png" style="height: 30px" />
           </q-item-label>
         </q-item-section>
       </q-item>
@@ -27,7 +27,7 @@
         </q-item-section>
         <q-item-section>
           <q-item-label>
-            <img src="images/jellyfin-logo.svg" style="height: 30px;">
+            <img src="images/jellyfin-logo.svg" style="height: 30px" />
           </q-item-label>
         </q-item-section>
       </q-item>
@@ -38,15 +38,14 @@
         </q-item-section>
         <q-item-section>
           <q-item-label>
-            <img src="images/plex-logo.svg" style="height: 20px;">
+            <img src="images/plex-logo.svg" style="height: 20px" />
           </q-item-label>
         </q-item-section>
       </q-item>
-
     </q-list>
   </q-form>
 </template>
 
 <script setup>
-import {setupState} from 'pages/setup/useSetup';
+import { setupState } from 'pages/setup/use-setup';
 </script>

frontend/src/pages/setup/index.vue

@@ -48,18 +48,18 @@
 import { computed, ref } from 'vue';
 import { useRouter } from 'vue-router';
 import CommonApi from 'src/api/CommonApi';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 import AdminAccountForm from 'pages/setup/AdminAccountForm';
 import ScanFolderForm from 'pages/setup/ScanFolderForm';
 import { templateRef } from '@vueuse/core';
 import SelectMediaServerForm from 'pages/setup/SelectMediaServerForm';
-import { setupState, useSetup } from 'pages/setup/useSetup';
+import { setupState, useSetup } from 'pages/setup/use-setup';
 import EmbySetupForm from 'pages/setup/EmbySetupForm';
 import LoginBgArea from 'pages/access/login/LoginBgArea';
-import { deepCopy } from 'src/utils/CommonUtils';
+import { deepCopy } from 'src/utils/common';
 import { getInfo, isRunningInDocker } from 'src/store/systemState';
 import { SUB_NAME_FORMAT_NORMAL } from 'src/constants/SettingConstants';
-import { useAppStatusLoading } from 'src/composables/useAppStatusLoading';
+import { useAppStatusLoading } from 'src/composables/use-app-status-loading';
 import { Dialog } from 'quasar';
 
 useSetup();

frontend/src/pages/setup/useSetup.js → frontend/src/pages/setup/use-setup.js

@@ -1,6 +1,6 @@
 import { onMounted, reactive, watch } from 'vue';
 import CommonApi from 'src/api/CommonApi';
-import { SystemMessage } from 'src/utils/Message';
+import { SystemMessage } from 'src/utils/message';
 
 export const setupState = reactive({
   defaultSettings: null,