From ea6a74dca7d9412a1a882307a07834f8f6770dfb Mon Sep 17 00:00:00 2001
From: Kinplemelon <wujiu529@gmail.com>
Date: Thu, 26 Sep 2024 17:25:08 +0800
Subject: [PATCH] refactor(global): remove some unnecessary imports like
 `defineProps`

---
 src/components/AdvancedSettingsBtn.vue        |  1 -
 src/components/ArrayEditor.vue                |  2 +-
 src/components/ArrayEditorInput.vue           |  3 ++-
 src/components/ArrayEditorTable.vue           |  3 ++-
 src/components/BooleanSelect.vue              |  3 ++-
 src/components/CustomInputNumber.vue          |  3 ++-
 src/components/InputWithPlaceholderSelect.vue | 24 ++++++++++++-------
 src/components/InputWithUnit.vue              |  4 ++--
 src/components/KeyAndValueEditor.vue          |  2 +-
 .../ListenerDrawer/CustomConfigs.vue          |  2 +-
 .../ListenerDrawer/DTLSVersionSelect.vue      |  2 +-
 .../ListenerDrawer/ListenerDrawer.vue         |  2 +-
 .../ListenerDrawer/SSLVersionSelect.vue       |  2 +-
 src/components/MiniPagination.vue             |  2 +-
 src/components/Monaco.vue                     |  2 +-
 src/components/Oneof.vue                      |  6 ++---
 src/components/OneofRefs.vue                  |  4 ++--
 src/components/OneofRefsSelect.vue            |  2 +-
 src/components/PayloadDialog.vue              |  2 +-
 src/components/PluginsForm/PluginFormKit.vue  |  5 ++--
 .../PluginsForm/PluginFormKitItem.vue         |  3 ++-
 src/components/SelectAllowInput.vue           |  2 +-
 src/components/TLSConfig/CertFileInput.vue    |  3 ++-
 src/components/TLSConfig/CommonTLSConfig.vue  |  3 ++-
 .../TLSConfig/ConfigItemDataLook.vue          |  2 +-
 src/components/TLSConfig/TLSBaseConfig.vue    |  3 ++-
 src/components/TLSConfig/TLSEnableConfig.vue  |  2 +-
 src/components/TextareaWithUploader.vue       |  3 ++-
 src/components/ZoneSelect.vue                 |  2 +-
 src/components/commonPagination.vue           |  5 ++--
 .../Auth/components/AuthnUsersImport.vue      |  2 +-
 .../Auth/components/AuthzSettingDrawer.vue    |  2 +-
 src/views/Auth/components/LdapConfig.vue      |  3 ++-
 .../PasswordHashAlgorithmFormItems.vue        |  3 ++-
 src/views/Base/QuickPanel.vue                 |  2 +-
 src/views/Clients/ClientDetails.vue           | 14 +++++------
 .../Clients/components/ClientAttrsDialog.vue  |  3 ++-
 .../Clients/components/ClientFieldSelect.vue  |  2 +-
 .../Connector/components/TypeSelect.vue       |  2 +-
 .../Rule/components/ActionSelect.vue          |  2 +-
 .../Rule/components/DeleteRuleConfirm.vue     |  2 +-
 .../Rule/components/RuleFilterForm.vue        |  8 ++-----
 src/views/Settings/Help.vue                   |  2 +-
 src/views/Settings/Settings.vue               |  2 +-
 src/views/Webhook/components/Trigger.vue      |  2 +-
 src/views/Webhook/components/WebhookForm.vue  |  2 +-
 46 files changed, 86 insertions(+), 71 deletions(-)

diff --git a/src/components/AdvancedSettingsBtn.vue b/src/components/AdvancedSettingsBtn.vue
index 8fca66dea..ed7760559 100644
--- a/src/components/AdvancedSettingsBtn.vue
+++ b/src/components/AdvancedSettingsBtn.vue
@@ -15,7 +15,6 @@
 <script setup lang="ts">
 import useI18nTl from '@/hooks/useI18nTl'
 import { ArrowRight } from '@element-plus/icons-vue'
-import { defineEmits, defineProps } from 'vue'
 
 const props = defineProps({
   modelValue: {
diff --git a/src/components/ArrayEditor.vue b/src/components/ArrayEditor.vue
index 57b290d49..4bfe4f6c2 100644
--- a/src/components/ArrayEditor.vue
+++ b/src/components/ArrayEditor.vue
@@ -28,7 +28,7 @@ export default defineComponent({
 
 <script setup lang="ts">
 import type { PropType, WritableComputedRef } from 'vue'
-import { computed, defineEmits, defineProps } from 'vue'
+import { computed } from 'vue'
 
 const props = defineProps({
   modelValue: {
diff --git a/src/components/ArrayEditorInput.vue b/src/components/ArrayEditorInput.vue
index c4e19ca8c..ebb40822c 100644
--- a/src/components/ArrayEditorInput.vue
+++ b/src/components/ArrayEditorInput.vue
@@ -3,7 +3,8 @@
 </template>
 
 <script setup lang="ts">
-import { computed, defineProps, PropType, defineEmits } from 'vue'
+import type { PropType } from 'vue'
+import { computed } from 'vue'
 
 const SEPARATOR = ','
 
diff --git a/src/components/ArrayEditorTable.vue b/src/components/ArrayEditorTable.vue
index fbf8398fe..2d8122531 100644
--- a/src/components/ArrayEditorTable.vue
+++ b/src/components/ArrayEditorTable.vue
@@ -21,7 +21,8 @@
 </template>
 
 <script setup lang="ts">
-import { computed, defineProps, PropType, defineEmits } from 'vue'
+import { computed } from 'vue'
+import type { PropType } from 'vue'
 
 const props = defineProps({
   modelValue: {
diff --git a/src/components/BooleanSelect.vue b/src/components/BooleanSelect.vue
index 22426be85..84e13dfd7 100644
--- a/src/components/BooleanSelect.vue
+++ b/src/components/BooleanSelect.vue
@@ -14,7 +14,8 @@ export default defineComponent({
 </script>
 
 <script setup lang="ts">
-import { defineProps, computed, defineEmits, WritableComputedRef } from 'vue'
+import type { WritableComputedRef } from 'vue'
+import { computed } from 'vue'
 
 const props = defineProps({
   modelValue: {
diff --git a/src/components/CustomInputNumber.vue b/src/components/CustomInputNumber.vue
index 9fca97ca1..b4792df1e 100644
--- a/src/components/CustomInputNumber.vue
+++ b/src/components/CustomInputNumber.vue
@@ -11,7 +11,8 @@
 </template>
 
 <script setup lang="ts">
-import { ref, defineProps, defineEmits, computed, PropType } from 'vue'
+import type { PropType } from 'vue'
+import { computed, ref } from 'vue'
 
 const props = defineProps({
   modelValue: {
diff --git a/src/components/InputWithPlaceholderSelect.vue b/src/components/InputWithPlaceholderSelect.vue
index 88a458f89..1dc83f482 100644
--- a/src/components/InputWithPlaceholderSelect.vue
+++ b/src/components/InputWithPlaceholderSelect.vue
@@ -24,10 +24,13 @@
 <script setup lang="ts">
 import useSQLAvailablePlaceholder from '@/hooks/Rule/useSQLAvailablePlaceholder'
 import { escapeRegExp } from 'lodash'
-import { computed, defineEmits, defineProps, ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 
-const props =
-  defineProps<{ modelValue?: string; [key: string]: any; customPlaceholders?: Array<string> }>()
+const props = defineProps<{
+  modelValue?: string
+  [key: string]: any
+  customPlaceholders?: Array<string>
+}>()
 const emit = defineEmits<{
   (e: 'update:modelValue', v: string): void
   (e: 'input', v: any): void
@@ -52,12 +55,15 @@ const fetchSuggestions = (queryString: string, cb: any) => {
   if (matchPart) {
     const filterReg = new RegExp(escapeRegExp(matchPart), 'i')
     const availableList = props.customPlaceholders || availablePlaceholders.value
-    ret = availableList.reduce((arr: Array<{ value: string }>, value: string) => {
-      if (filterReg.test(value)) {
-        arr.push({ value })
-      }
-      return arr
-    }, [] as Array<{ value: string }>)
+    ret = availableList.reduce(
+      (arr: Array<{ value: string }>, value: string) => {
+        if (filterReg.test(value)) {
+          arr.push({ value })
+        }
+        return arr
+      },
+      [] as Array<{ value: string }>,
+    )
   }
   cb(ret)
 }
diff --git a/src/components/InputWithUnit.vue b/src/components/InputWithUnit.vue
index d0b700269..9fd93665b 100644
--- a/src/components/InputWithUnit.vue
+++ b/src/components/InputWithUnit.vue
@@ -39,7 +39,7 @@ export default defineComponent({
 <script setup lang="ts">
 import { escapeRegExp } from 'lodash'
 import type { PropType, WritableComputedRef } from 'vue'
-import { computed, defineEmits, defineProps, ref } from 'vue'
+import { computed, ref } from 'vue'
 
 const props = defineProps({
   modelValue: {
@@ -143,7 +143,7 @@ const numPart: WritableComputedRef<string> = computed({
 /**
  * handle the situation that does not input num but selected unit
  */
-let selectedUnit = ref('')
+const selectedUnit = ref('')
 const unit: WritableComputedRef<string> = computed({
   get() {
     const { disabledOpt } = props
diff --git a/src/components/KeyAndValueEditor.vue b/src/components/KeyAndValueEditor.vue
index a45a17375..038ed8181 100644
--- a/src/components/KeyAndValueEditor.vue
+++ b/src/components/KeyAndValueEditor.vue
@@ -105,7 +105,7 @@ import { splitOnComma, splitOnSymbol } from '@/common/tools'
 import { Delete, Plus } from '@element-plus/icons-vue'
 import { cloneDeep, isEqual, isPlainObject } from 'lodash'
 import type { PropType } from 'vue'
-import { computed, defineEmits, defineProps, ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import InputWithPlaceholderSelect from './InputWithPlaceholderSelect.vue'
 
diff --git a/src/components/ListenerDrawer/CustomConfigs.vue b/src/components/ListenerDrawer/CustomConfigs.vue
index d12a9b629..38719f661 100644
--- a/src/components/ListenerDrawer/CustomConfigs.vue
+++ b/src/components/ListenerDrawer/CustomConfigs.vue
@@ -14,7 +14,7 @@
 </template>
 
 <script lang="ts" setup>
-import { PropType, defineEmits, defineProps, ref, watch, defineExpose } from 'vue'
+import { PropType, ref, watch } from 'vue'
 import useI18nTl from '@/hooks/useI18nTl'
 import { Listener } from '@/types/listener'
 import { unexposedConfigs } from '@/common/constants'
diff --git a/src/components/ListenerDrawer/DTLSVersionSelect.vue b/src/components/ListenerDrawer/DTLSVersionSelect.vue
index fc29aefac..c5a5a86ac 100644
--- a/src/components/ListenerDrawer/DTLSVersionSelect.vue
+++ b/src/components/ListenerDrawer/DTLSVersionSelect.vue
@@ -14,7 +14,7 @@ export default defineComponent({
 
 <script setup lang="ts">
 import type { PropType, WritableComputedRef } from 'vue'
-import { computed, defineEmits, defineProps } from 'vue'
+import { computed } from 'vue'
 
 const props = defineProps({
   modelValue: {
diff --git a/src/components/ListenerDrawer/ListenerDrawer.vue b/src/components/ListenerDrawer/ListenerDrawer.vue
index 1b803aec3..0784eb8bd 100644
--- a/src/components/ListenerDrawer/ListenerDrawer.vue
+++ b/src/components/ListenerDrawer/ListenerDrawer.vue
@@ -429,7 +429,7 @@ import useListenerDrawer from '@/hooks/Config/useListenerDrawer'
 import useI18nTl from '@/hooks/useI18nTl'
 import { GatewayName, ListenerType, ListenerTypeForGateway } from '@/types/enum'
 import { Listener } from '@/types/listener'
-import { PropType, computed, defineEmits, defineProps } from 'vue'
+import { PropType, computed } from 'vue'
 import ArrayEditorInput from '../ArrayEditorInput.vue'
 import CustomInputNumber from '../CustomInputNumber.vue'
 import DTLSVersionSelect from './DTLSVersionSelect.vue'
diff --git a/src/components/ListenerDrawer/SSLVersionSelect.vue b/src/components/ListenerDrawer/SSLVersionSelect.vue
index 48b7b6109..8586ae6ba 100644
--- a/src/components/ListenerDrawer/SSLVersionSelect.vue
+++ b/src/components/ListenerDrawer/SSLVersionSelect.vue
@@ -14,7 +14,7 @@ export default defineComponent({
 
 <script setup lang="ts">
 import type { PropType, WritableComputedRef } from 'vue'
-import { computed, defineEmits, defineProps } from 'vue'
+import { computed } from 'vue'
 
 const props = defineProps({
   modelValue: {
diff --git a/src/components/MiniPagination.vue b/src/components/MiniPagination.vue
index ebbe93271..e51a9c6d8 100644
--- a/src/components/MiniPagination.vue
+++ b/src/components/MiniPagination.vue
@@ -10,7 +10,7 @@
 </template>
 
 <script setup lang="ts">
-import { defineProps, computed, defineEmits } from 'vue'
+import { computed } from 'vue'
 
 const props = defineProps({
   currentPage: {
diff --git a/src/components/Monaco.vue b/src/components/Monaco.vue
index 005083fbb..a56b40931 100644
--- a/src/components/Monaco.vue
+++ b/src/components/Monaco.vue
@@ -14,7 +14,7 @@ export default defineComponent({
 import * as monaco from 'monaco-editor'
 import { conf as sqlConf, language as sql } from 'monaco-editor/esm/vs/basic-languages/sql/sql'
 import { debounce } from 'lodash'
-import { defineProps, defineEmits, onMounted, onUnmounted, watch, nextTick, computed } from 'vue'
+import { onMounted, onUnmounted, watch, nextTick, computed } from 'vue'
 import { useStore } from 'vuex'
 import EditorDark from '@/assets/theme/editor-dark.json'
 import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker'
diff --git a/src/components/Oneof.vue b/src/components/Oneof.vue
index 06be1673e..ff597433e 100644
--- a/src/components/Oneof.vue
+++ b/src/components/Oneof.vue
@@ -15,7 +15,7 @@
     <div class="switch-container">
       <el-switch
         v-model="switchProxy"
-        :inactive-value="(oneOfInfo.valueDisabled as string)"
+        :inactive-value="oneOfInfo.valueDisabled as string"
         :disabled="disabled"
       />
       <span class="tip" v-if="valueProxy === oneOfInfo.valueDisabled">
@@ -91,7 +91,7 @@ import { Properties, Property } from '@/types/schemaForm'
 import { ElFormItem } from 'element-plus'
 import { isFunction } from 'lodash'
 import type { ComputedRef, PropType, WritableComputedRef } from 'vue'
-import { computed, defineEmits, defineProps, getCurrentInstance, nextTick, watch } from 'vue'
+import { computed, getCurrentInstance, nextTick, watch } from 'vue'
 import CustomInputNumber from './CustomInputNumber.vue'
 import InputWithUnit from './InputWithUnit.vue'
 import TimeInputWithUnitSelect from './TimeInputWithUnitSelect.vue'
@@ -172,7 +172,7 @@ const valueProxy: WritableComputedRef<any> = computed({
   set(val) {
     const { valueDisabled, propEnabled } = oneOfInfo.value
     if (valueDisabled !== undefined) {
-      const value = val === valueDisabled ? valueDisabled : val ?? propEnabled?.default
+      const value = val === valueDisabled ? valueDisabled : (val ?? propEnabled?.default)
       emit('update:modelValue', value)
     } else {
       emit('update:modelValue', val)
diff --git a/src/components/OneofRefs.vue b/src/components/OneofRefs.vue
index 8da5ec7ee..21345d176 100644
--- a/src/components/OneofRefs.vue
+++ b/src/components/OneofRefs.vue
@@ -39,7 +39,7 @@
           </template>
           <SchemaFormItem
             v-model="(fieldValue as any)[$key]"
-            :type="(item.type as any)"
+            :type="(item as any).type"
             :symbols="item.symbols"
             :format="item.format"
             :customProps="item.componentProps"
@@ -57,7 +57,7 @@ import { useSymbolLabel } from '@/hooks/Schema/useItemLabelAndDesc'
 import { Properties, Property } from '@/types/schemaForm'
 import { cloneDeep, isEqual, isFunction, snakeCase } from 'lodash'
 import type { PropType } from 'vue'
-import { computed, defineEmits, defineProps, ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 import CustomFormItem from './CustomFormItem.vue'
 import FormItemLabel from './FormItemLabel.vue'
 import SchemaFormItem from './SchemaFormItem'
diff --git a/src/components/OneofRefsSelect.vue b/src/components/OneofRefsSelect.vue
index dd60c5665..5d78f6918 100644
--- a/src/components/OneofRefsSelect.vue
+++ b/src/components/OneofRefsSelect.vue
@@ -27,7 +27,7 @@ import { getLabelFromValueInOptionList } from '@/common/tools'
 import { useSymbolLabel } from '@/hooks/Schema/useItemLabelAndDesc'
 import { Properties, Property } from '@/types/schemaForm'
 import { isEqual, isFunction, snakeCase } from 'lodash'
-import { computed, defineEmits, defineProps, ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 import type { PropType } from 'vue'
 import CustomFormItem from './CustomFormItem.vue'
 
diff --git a/src/components/PayloadDialog.vue b/src/components/PayloadDialog.vue
index b7e934ff5..cc72322f3 100644
--- a/src/components/PayloadDialog.vue
+++ b/src/components/PayloadDialog.vue
@@ -45,7 +45,7 @@ import useI18nTl from '@/hooks/useI18nTl'
 import useShowTextByDifferent from '@/hooks/useShowTextByDifferent'
 import { PayloadShowByType } from '@/types/enum'
 import { ElDialog } from 'element-plus'
-import { computed, defineEmits, defineProps, watch, withDefaults } from 'vue'
+import { computed, watch, withDefaults } from 'vue'
 
 const props = withDefaults(
   defineProps<{
diff --git a/src/components/PluginsForm/PluginFormKit.vue b/src/components/PluginsForm/PluginFormKit.vue
index 1f1356ec3..2cc047e8c 100644
--- a/src/components/PluginsForm/PluginFormKit.vue
+++ b/src/components/PluginsForm/PluginFormKit.vue
@@ -11,7 +11,7 @@
         v-for="(configs, name) in layouts.$form"
         v-model="configsForm[name]"
         :key="name"
-        :name="(name as string)"
+        :name="name as string"
         :form-configs="configs"
       />
     </el-row>
@@ -26,7 +26,8 @@
 </template>
 
 <script lang="ts" setup>
-import { PropType, defineProps, defineEmits, ref, watch, nextTick } from 'vue'
+import type { PropType } from 'vue'
+import { ref, watch, nextTick } from 'vue'
 import { PluginUIConfigs } from '@/types/plugin'
 import PluginFormKitItem from './PluginFormKitItem.vue'
 import _ from 'lodash'
diff --git a/src/components/PluginsForm/PluginFormKitItem.vue b/src/components/PluginsForm/PluginFormKitItem.vue
index 5c8e0b660..d43f940e4 100644
--- a/src/components/PluginsForm/PluginFormKitItem.vue
+++ b/src/components/PluginsForm/PluginFormKitItem.vue
@@ -76,7 +76,8 @@ export default {
 
 <script lang="ts" setup>
 import { ConfigField } from '@/types/plugin'
-import { PropType, defineProps, ref, watch, defineEmits } from 'vue'
+import type { PropType } from 'vue'
+import { ref, watch } from 'vue'
 import PluginFormKitItem from './PluginFormKitItem.vue'
 import FormItemLabel from '@/components/FormItemLabel.vue'
 import KeyValueEditor from '@/components/KeyAndValueEditor.vue'
diff --git a/src/components/SelectAllowInput.vue b/src/components/SelectAllowInput.vue
index 6f0ce8a9a..438d4cd85 100644
--- a/src/components/SelectAllowInput.vue
+++ b/src/components/SelectAllowInput.vue
@@ -10,7 +10,7 @@
 
 <script setup lang="ts">
 import { escapeRegExp, isObject, isUndefined } from 'lodash'
-import { computed, defineEmits, defineProps, withDefaults } from 'vue'
+import { computed, withDefaults } from 'vue'
 
 const props = withDefaults(
   defineProps<{
diff --git a/src/components/TLSConfig/CertFileInput.vue b/src/components/TLSConfig/CertFileInput.vue
index 7c6b51ca0..823853bd2 100644
--- a/src/components/TLSConfig/CertFileInput.vue
+++ b/src/components/TLSConfig/CertFileInput.vue
@@ -12,7 +12,8 @@
 <script setup lang="ts">
 import { CER_FILE_ACCEPTS } from '@/common/constants'
 import TextareaWithUploader from '@/components/TextareaWithUploader.vue'
-import { PropType, computed, defineEmits, defineProps, ref } from 'vue'
+import type { PropType } from 'vue'
+import { computed, ref } from 'vue'
 import ConfigItemDataLook from './ConfigItemDataLook.vue'
 
 const props = defineProps({
diff --git a/src/components/TLSConfig/CommonTLSConfig.vue b/src/components/TLSConfig/CommonTLSConfig.vue
index 5e6f4b0bd..0ff13a662 100644
--- a/src/components/TLSConfig/CommonTLSConfig.vue
+++ b/src/components/TLSConfig/CommonTLSConfig.vue
@@ -24,7 +24,8 @@ export default defineComponent({
 </script>
 
 <script setup lang="ts">
-import { defineProps, defineEmits, computed, PropType, WritableComputedRef } from 'vue'
+import type { PropType, WritableComputedRef } from 'vue'
+import { computed } from 'vue'
 import TLSBaseConfig from './TLSBaseConfig.vue'
 import TLSEnableConfig from './TLSEnableConfig.vue'
 import { SSL } from '@/types/common'
diff --git a/src/components/TLSConfig/ConfigItemDataLook.vue b/src/components/TLSConfig/ConfigItemDataLook.vue
index 21cb76438..0802a4fb2 100644
--- a/src/components/TLSConfig/ConfigItemDataLook.vue
+++ b/src/components/TLSConfig/ConfigItemDataLook.vue
@@ -26,7 +26,7 @@ export default defineComponent({
 </script>
 
 <script setup lang="ts">
-import { defineEmits, defineProps, computed } from 'vue'
+import { computed } from 'vue'
 import { DocumentCopy } from '@element-plus/icons-vue'
 import { useI18n } from 'vue-i18n'
 import useCopy from '@/hooks/useCopy'
diff --git a/src/components/TLSConfig/TLSBaseConfig.vue b/src/components/TLSConfig/TLSBaseConfig.vue
index b48d57b63..fec9a214b 100644
--- a/src/components/TLSConfig/TLSBaseConfig.vue
+++ b/src/components/TLSConfig/TLSBaseConfig.vue
@@ -17,7 +17,8 @@ export default defineComponent({
 </script>
 
 <script setup lang="ts">
-import { defineProps, defineEmits, computed, PropType, WritableComputedRef } from 'vue'
+import type { PropType, WritableComputedRef } from 'vue'
+import { computed } from 'vue'
 import { SSL } from '@/types/common'
 
 const props = defineProps({
diff --git a/src/components/TLSConfig/TLSEnableConfig.vue b/src/components/TLSConfig/TLSEnableConfig.vue
index f8d25aaa9..eddddd9d6 100644
--- a/src/components/TLSConfig/TLSEnableConfig.vue
+++ b/src/components/TLSConfig/TLSEnableConfig.vue
@@ -108,7 +108,7 @@ import InfoTooltip from '@/components/InfoTooltip.vue'
 import useI18nTl from '@/hooks/useI18nTl'
 import { SSL } from '@/types/common'
 import type { PropType } from 'vue'
-import { computed, defineEmits, defineProps, ref } from 'vue'
+import { computed, ref } from 'vue'
 import CustomFormItem from '../CustomFormItem.vue'
 import TextareaWithUploader from '../TextareaWithUploader.vue'
 import ConfigItemDataLook from './ConfigItemDataLook.vue'
diff --git a/src/components/TextareaWithUploader.vue b/src/components/TextareaWithUploader.vue
index 973bc3545..0ace05d12 100644
--- a/src/components/TextareaWithUploader.vue
+++ b/src/components/TextareaWithUploader.vue
@@ -28,7 +28,8 @@ export default defineComponent({
 </script>
 
 <script setup lang="ts">
-import { defineProps, computed, defineEmits, PropType } from 'vue'
+import type { PropType } from 'vue'
+import { computed } from 'vue'
 import { UploadFile, ElMessageBox, ElMessage } from 'element-plus'
 import useI18nTl from '@/hooks/useI18nTl'
 import { findExtensionByName } from '@/common/tools'
diff --git a/src/components/ZoneSelect.vue b/src/components/ZoneSelect.vue
index 9d9f195f2..3ff4c7a90 100644
--- a/src/components/ZoneSelect.vue
+++ b/src/components/ZoneSelect.vue
@@ -14,7 +14,7 @@ export default defineComponent({
 
 <script setup lang="ts">
 import type { WritableComputedRef } from 'vue'
-import { computed, defineEmits, defineProps, ref } from 'vue'
+import { computed, ref } from 'vue'
 import { getZoneConfigs } from '@/api/config'
 import { DEFAULT_ZONE } from '@/common/constants'
 
diff --git a/src/components/commonPagination.vue b/src/components/commonPagination.vue
index fbe076aed..56c8fc70b 100644
--- a/src/components/commonPagination.vue
+++ b/src/components/commonPagination.vue
@@ -17,14 +17,15 @@
     <MiniPagination
       v-else-if="meta.count === -1"
       :current-page="meta.page"
-      :hasnext="(meta.hasnext as boolean)"
+      :hasnext="!!meta.hasnext"
       @current-change="handleCurrentChanged"
     />
   </div>
 </template>
 
 <script setup lang="ts">
-import { computed, watch, PropType, defineProps, defineEmits } from 'vue'
+import { computed, watch } from 'vue'
+import type { PropType } from 'vue'
 import MiniPagination from './MiniPagination.vue'
 import { PageData } from '@/types/common'
 
diff --git a/src/views/Auth/components/AuthnUsersImport.vue b/src/views/Auth/components/AuthnUsersImport.vue
index 3b3b05c87..f06696ed2 100644
--- a/src/views/Auth/components/AuthnUsersImport.vue
+++ b/src/views/Auth/components/AuthnUsersImport.vue
@@ -71,7 +71,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, defineEmits } from 'vue'
+import { ref } from 'vue'
 import { Upload } from '@element-plus/icons-vue'
 import { downloadByURL } from '@/common/tools'
 import useI18nTl from '@/hooks/useI18nTl'
diff --git a/src/views/Auth/components/AuthzSettingDrawer.vue b/src/views/Auth/components/AuthzSettingDrawer.vue
index 64d0ea4c2..0ec03e8fe 100644
--- a/src/views/Auth/components/AuthzSettingDrawer.vue
+++ b/src/views/Auth/components/AuthzSettingDrawer.vue
@@ -78,7 +78,7 @@ import InputWithUnit from '@/components/InputWithUnit.vue'
 import { AuthzSetting } from '@/types/auth'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import type { Ref, WritableComputedRef } from 'vue'
-import { computed, defineEmits, defineProps, ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import FormItemLabel from '@/components/FormItemLabel.vue'
 import ArrayEditor from '@/components/ArrayEditor.vue'
diff --git a/src/views/Auth/components/LdapConfig.vue b/src/views/Auth/components/LdapConfig.vue
index 38e55e8cd..63b6e59e7 100644
--- a/src/views/Auth/components/LdapConfig.vue
+++ b/src/views/Auth/components/LdapConfig.vue
@@ -142,7 +142,8 @@
 </template>
 
 <script lang="ts" setup>
-import { PropType, ref, defineProps, watch, defineEmits, defineExpose } from 'vue'
+import type { PropType } from 'vue'
+import { ref, watch } from 'vue'
 import CommonTLSConfig from '@/components/TLSConfig/CommonTLSConfig.vue'
 import useLdapConfigFrom from '@/hooks/Auth/useLdapConfigForm'
 import TimeInputWithUnitSelect from '@/components/TimeInputWithUnitSelect.vue'
diff --git a/src/views/Auth/components/PasswordHashAlgorithmFormItems.vue b/src/views/Auth/components/PasswordHashAlgorithmFormItems.vue
index 5fea9c337..d0ac3fe2e 100644
--- a/src/views/Auth/components/PasswordHashAlgorithmFormItems.vue
+++ b/src/views/Auth/components/PasswordHashAlgorithmFormItems.vue
@@ -55,7 +55,8 @@ import { PASSWORD_HASH_TYPES_WHICH_NEED_SALT_POSITION } from '@/common/constants
 import { titleCase } from '@/common/tools'
 import usePassword from '@/hooks/usePassword'
 import { SaltPosition } from '@/types/enum'
-import { defineProps, computed, defineEmits, PropType, watch } from 'vue'
+import type { PropType } from 'vue'
+import { computed, watch } from 'vue'
 
 interface PasswordHashAlgorithmFormItems {
   password_hash_algorithm: {
diff --git a/src/views/Base/QuickPanel.vue b/src/views/Base/QuickPanel.vue
index a03ccf09f..e5e03b464 100644
--- a/src/views/Base/QuickPanel.vue
+++ b/src/views/Base/QuickPanel.vue
@@ -42,7 +42,7 @@ import { routes } from '@/router'
 import { ArrowRight, Search } from '@element-plus/icons-vue'
 import { ElDialog } from 'element-plus'
 import { escapeRegExp } from 'lodash'
-import { computed, defineEmits, defineProps, ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { RouteRecordRaw, useRouter } from 'vue-router'
 
diff --git a/src/views/Clients/ClientDetails.vue b/src/views/Clients/ClientDetails.vue
index 2c12dd434..22d517d88 100644
--- a/src/views/Clients/ClientDetails.vue
+++ b/src/views/Clients/ClientDetails.vue
@@ -193,7 +193,7 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, defineEmits, defineProps, ref } from 'vue'
+import { computed, defineComponent, ref } from 'vue'
 
 export default defineComponent({
   name: 'ClientDetails',
@@ -330,7 +330,7 @@ const clientType = computed<ClientTypes>((): ClientTypes => {
   return proto_name.toUpperCase() as ClientTypes
 })
 const clientDetailParts = computed(() => {
-  let allParts = Object.keys(clientsOrganizied)
+  const allParts = Object.keys(clientsOrganizied)
   if (clientType.value === 'MQISDP') {
     return clientsOrganizied.MQTT
   }
@@ -380,7 +380,7 @@ const handleDisconnect = async () => {
 
 const handleDisconnectGateway = async () => {
   if (record.value === null) return
-  let res = await disconnGatewayClient(props.gateway, record.value.clientid as string)
+  const res = await disconnGatewayClient(props.gateway, record.value.clientid as string)
   if (res) {
     emit('refreshGateway')
     return Promise.resolve()
@@ -394,7 +394,7 @@ const loadData = async () => {
     return loadGatewayData()
   }
   clientDetailLock.value = true
-  let res = await loadClientDetail(clientId.value).catch((error) => {
+  const res = await loadClientDetail(clientId.value).catch((error) => {
     if (error.response.status === 404) {
       doesTheClientExist.value = false
     }
@@ -410,7 +410,7 @@ const loadData = async () => {
 
 const loadGatewayData = async () => {
   clientDetailLock.value = true
-  let res = await getGatewayClientDetail(props.gateway, clientId.value).catch(() => {
+  const res = await getGatewayClientDetail(props.gateway, clientId.value).catch(() => {
     clientDetailLock.value = false
   })
   if (res) {
@@ -434,7 +434,7 @@ const loadSubs = async () => {
     return loadGatewaySubs()
   }
   subsLockTable.value = true
-  let res = await loadSubscriptions(clientId.value).catch(() => {
+  const res = await loadSubscriptions(clientId.value).catch(() => {
     subsLockTable.value = false
   })
   if (res) {
@@ -447,7 +447,7 @@ const loadSubs = async () => {
 
 const loadGatewaySubs = async () => {
   subsLockTable.value = true
-  let res = await getGatewayClientSubs(props.gateway, clientId.value).catch(() => {
+  const res = await getGatewayClientSubs(props.gateway, clientId.value).catch(() => {
     subsLockTable.value = false
   })
   if (res) {
diff --git a/src/views/Clients/components/ClientAttrsDialog.vue b/src/views/Clients/components/ClientAttrsDialog.vue
index ed6c4ab19..8a42c218e 100644
--- a/src/views/Clients/components/ClientAttrsDialog.vue
+++ b/src/views/Clients/components/ClientAttrsDialog.vue
@@ -14,7 +14,8 @@
 <script lang="ts" setup>
 import KeyAndValueEditor from '@/components/KeyAndValueEditor.vue'
 import useI18nTl from '@/hooks/useI18nTl'
-import { PropType, computed, defineEmits, defineProps } from 'vue'
+import type { PropType } from 'vue'
+import { computed } from 'vue'
 
 const props = defineProps({
   modelValue: {
diff --git a/src/views/Clients/components/ClientFieldSelect.vue b/src/views/Clients/components/ClientFieldSelect.vue
index 45d214276..1f33a0656 100644
--- a/src/views/Clients/components/ClientFieldSelect.vue
+++ b/src/views/Clients/components/ClientFieldSelect.vue
@@ -40,7 +40,7 @@ import useI18nTl from '@/hooks/useI18nTl'
 import { Setting } from '@element-plus/icons-vue'
 import { ElMessage } from 'element-plus'
 import { isEqual } from 'lodash'
-import { defineEmits, defineProps, ref, watch } from 'vue'
+import { ref, watch } from 'vue'
 
 const { t, tl } = useI18nTl('Clients')
 
diff --git a/src/views/RuleEngine/Connector/components/TypeSelect.vue b/src/views/RuleEngine/Connector/components/TypeSelect.vue
index a023c6add..ed2078e91 100644
--- a/src/views/RuleEngine/Connector/components/TypeSelect.vue
+++ b/src/views/RuleEngine/Connector/components/TypeSelect.vue
@@ -22,7 +22,7 @@
 <script setup lang="ts">
 import { useBridgeTypeIcon, useConnectorTypeValue } from '@/hooks/Rule/bridge/useBridgeTypeValue'
 import { BridgeType } from '@/types/enum'
-import { computed, defineEmits, defineProps } from 'vue'
+import { computed } from 'vue'
 
 const props = defineProps<{
   modelValue: BridgeType
diff --git a/src/views/RuleEngine/Rule/components/ActionSelect.vue b/src/views/RuleEngine/Rule/components/ActionSelect.vue
index 398445163..490a867c6 100644
--- a/src/views/RuleEngine/Rule/components/ActionSelect.vue
+++ b/src/views/RuleEngine/Rule/components/ActionSelect.vue
@@ -36,7 +36,7 @@ import useCommonConnectionStatus from '@/hooks/useCommonConnectionStatus'
 import useI18nTl from '@/hooks/useI18nTl'
 import { BridgeDirection } from '@/types/enum'
 import { BridgeItem } from '@/types/rule'
-import { computed, defineEmits, defineProps, ref, withDefaults } from 'vue'
+import { computed, ref, withDefaults } from 'vue'
 
 /**
  * do not selecting exiting one, create a new one
diff --git a/src/views/RuleEngine/Rule/components/DeleteRuleConfirm.vue b/src/views/RuleEngine/Rule/components/DeleteRuleConfirm.vue
index f49577bc9..8668b9d2b 100644
--- a/src/views/RuleEngine/Rule/components/DeleteRuleConfirm.vue
+++ b/src/views/RuleEngine/Rule/components/DeleteRuleConfirm.vue
@@ -47,7 +47,7 @@ import { RuleEvent, RuleItem } from '@/types/rule'
 import { WarningFilled } from '@element-plus/icons-vue'
 import { ElDialog, ElMessage } from 'element-plus'
 import { lowerCase } from 'lodash'
-import { computed, defineEmits, defineProps, ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 
 const props = defineProps<{ modelValue: boolean; rule?: RuleItem }>()
 const emit = defineEmits(['update:modelValue', 'submitted'])
diff --git a/src/views/RuleEngine/Rule/components/RuleFilterForm.vue b/src/views/RuleEngine/Rule/components/RuleFilterForm.vue
index 5a8af083e..9719dfb0f 100644
--- a/src/views/RuleEngine/Rule/components/RuleFilterForm.vue
+++ b/src/views/RuleEngine/Rule/components/RuleFilterForm.vue
@@ -68,11 +68,7 @@
         <el-col v-bind="colProps">
           <el-form-item>
             <div
-              class="
-                el-input el-input-group el-input-group--prepend
-                el-input--suffix
-                input-target-value
-              "
+              class="el-input el-input-group el-input-group--prepend el-input--suffix input-target-value"
             >
               <div class="el-input-group__prepend">
                 <el-select class="select-topic-type" v-model="keyForFilterActionOrSource">
@@ -142,7 +138,7 @@ import { FilterParamsForQueryRules } from '@/types/rule'
 import { ArrowDown, ArrowUp, RefreshLeft, Search } from '@element-plus/icons-vue'
 import { omit } from 'lodash'
 import type { Ref } from 'vue'
-import { computed, defineEmits, defineProps, ref } from 'vue'
+import { computed, ref } from 'vue'
 
 const props = defineProps({
   initialValue: {
diff --git a/src/views/Settings/Help.vue b/src/views/Settings/Help.vue
index 34c132d1d..7470fa96e 100644
--- a/src/views/Settings/Help.vue
+++ b/src/views/Settings/Help.vue
@@ -78,7 +78,7 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, defineEmits, defineProps } from 'vue'
+import { computed, defineComponent } from 'vue'
 
 export default defineComponent({
   name: 'Help',
diff --git a/src/views/Settings/Settings.vue b/src/views/Settings/Settings.vue
index 3428cd057..e5271b66a 100644
--- a/src/views/Settings/Settings.vue
+++ b/src/views/Settings/Settings.vue
@@ -75,7 +75,7 @@
 
 <script lang="ts">
 import type { WritableComputedRef } from 'vue'
-import { computed, defineComponent, defineEmits, defineProps, reactive, ref } from 'vue'
+import { computed, defineComponent, reactive, ref } from 'vue'
 
 export default defineComponent({
   name: 'Settings',
diff --git a/src/views/Webhook/components/Trigger.vue b/src/views/Webhook/components/Trigger.vue
index f71bea485..4596996bf 100644
--- a/src/views/Webhook/components/Trigger.vue
+++ b/src/views/Webhook/components/Trigger.vue
@@ -67,7 +67,7 @@ import { RuleEvent } from '@/types/rule'
 import { Delete, Plus } from '@element-plus/icons-vue'
 import { escapeRegExp, startCase } from 'lodash'
 import type { ComputedRef, Ref, WritableComputedRef } from 'vue'
-import { computed, defineEmits, defineExpose, defineProps, nextTick, ref, watch } from 'vue'
+import { computed, nextTick, ref, watch } from 'vue'
 import { useStore } from 'vuex'
 
 const enum TriggerType {
diff --git a/src/views/Webhook/components/WebhookForm.vue b/src/views/Webhook/components/WebhookForm.vue
index 31485c7aa..41d83bc74 100644
--- a/src/views/Webhook/components/WebhookForm.vue
+++ b/src/views/Webhook/components/WebhookForm.vue
@@ -112,7 +112,7 @@ import { WebhookForm, WebhookItem } from '@/types/webhook'
 import BridgeResourceOpt from '@/views/RuleEngine/Bridge/Components/BridgeConfig/BridgeResourceOpt.vue'
 import { ElMessage } from 'element-plus'
 import type { PropType, WritableComputedRef } from 'vue'
-import { computed, defineEmits, defineExpose, defineProps, ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 import Trigger from './Trigger.vue'
 
 const props = defineProps({