refactor(global): remove some unnecessary imports like defineProps

Author: Kinplemelon

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: {

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: {

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 = ','
 

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: {

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: {

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: {

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)
 }

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

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'
 

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'

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: {

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'

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: {

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: {

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'

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)

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'

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'
 

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<{

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'

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'

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<{

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({

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'

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'

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({

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'

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'

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'
 

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'
 

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'

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'

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'