为所有文本输入框添加右键快速粘贴的功能

src/renderer/views/List/MusicList/components/SearchList.vue

@@ -6,13 +6,14 @@
           <div :class="$style.form">
             <input
               ref="dom_input" v-model.trim="text" class="ignore-esc" :placeholder="placeholder" @input="handleDelaySearch"
-              @keyup.enter="handleTemplistClick(selectIndex)" @keyup.arrow-down.prevent.exact="handleKeyDown" @keyup.arrow-up.prevent.exact="handleKeyUp"
+              @keydown.arrow-down.arrow-up.prevent @keyup.arrow-down.prevent.exact="handleKeyDown" @keyup.arrow-up.prevent.exact="handleKeyUp"
+              @keyup.enter="handleTemplistClick(selectIndex)"
               @keyup.escape.prevent.exact="handleKeyEsc" @keydown.control.prevent="handle_key_mod_down" @keydown.meta.prevent="handle_key_mod_down"
               @keyup.control.prevent="handle_key_mod_up" @keyup.meta.prevent="handle_key_mod_up" @contextmenu="handleContextMenu"
             >
             <button type="button" @click="handleHide">
               <slot>
-                <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" height="100%" viewBox="0 0 212.982 212.982" space="preserve">
+                <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" height="70%" viewBox="0 0 212.982 212.982" space="preserve">
                   <use xlink:href="#icon-delete" />
                 </svg>
               </slot>
@@ -191,10 +192,18 @@ export default {
     },
     handleContextMenu() {
       let str = clipboardReadText()
+      str = str.trim()
       str = str.replace(/\t|\r\n|\n|\r/g, ' ')
       str = str.replace(/\s+/g, ' ')
       let dom_input = this.$refs.dom_input
-      this.text = `${this.text.substring(0, dom_input.selectionStart)}${str}${this.text.substring(dom_input.selectionEnd, this.text.length)}`
+      const text = dom_input.value
+      // if (dom_input.selectionStart == dom_input.selectionEnd) {
+      const value = text.substring(0, dom_input.selectionStart) + str + text.substring(dom_input.selectionEnd, text.length)
+      // event.target.value = value
+      this.text = value
+      // } else {
+      //   clipboardWriteText(text.substring(dom_input.selectionStart, dom_input.selectionEnd))
+      // }
     },
     async handleSearch() {
       if (!this.text.length) return this.resultList = []
@@ -279,7 +288,7 @@ export default {
       border-bottom-right-radius: 4px;
       cursor: pointer;
       height: 100%;
-      padding: 6px 7px;
+      padding: 6px 9px;
       color: var(--color-button-font);
       transition: background-color .2s ease;
       opacity: 0.8;

src/renderer/views/List/MyList/index.vue

@@ -57,17 +57,17 @@
           </transition>
           {{ item.name }}
         </span>
-        <input
+        <base-input
           :class="$style.listsInput" type="text" :value="item.name"
-          :placeholder="item.name" @contextmenu.stop @keyup.enter="handleSaveListName(index, $event)" @blur="handleSaveListName(index, $event)"
-        >
+          :placeholder="item.name" @keyup.enter="handleSaveListName(index, $event)" @blur="handleSaveListName(index, $event)"
+        />
       </li>
       <transition enter-active-class="animated-fast slideInLeft" leave-active-class="animated-fast fadeOut" @after-leave="isNewListLeave = false" @after-enter="$refs.dom_listsNewInput.focus()">
         <li v-if="isShowNewList" :class="[$style.listsItem, $style.listsNew, {[$style.newLeave]: isNewListLeave}]">
-          <input
-            ref="dom_listsNewInput" :class="$style.listsInput" type="text" :placeholder="$t('lists__new_list_input')" @contextmenu.stop
+          <base-input
+            ref="dom_listsNewInput" :class="$style.listsInput" type="text" :placeholder="$t('lists__new_list_input')"
             @keyup.enter="handleCreateList" @blur="handleCreateList"
-          >
+          />
         </li>
       </transition>
     </ul>
@@ -378,20 +378,21 @@ export default {
 .listsInput {
   width: 100%;
   height: @lists-item-height;
-  border: none;
+  // border: none;
   padding: 0;
   // padding-bottom: 1px;
   line-height: @lists-item-height;
-  background: none;
-  outline: none;
+  background: none !important;
+  border-radius: 0;
+  // outline: none;
   font-size: 13px;
   display: none;
-  font-family: inherit;
+  // font-family: inherit;
 }
 
 .listsNew {
   padding: 0 10px;
-  background-color: var(--color-primary-background-hover);
+  background-color: var(--color-primary-background-hover) !important;
   .listsInput {
     display: block;
   }

src/renderer/views/List/MyList/useEditList.ts

@@ -11,7 +11,7 @@ export default ({ dom_lists_list }: {
   const styles = useCssModule()
 
   const handleRename = (index: number) => {
-    console.log(index)
+    // console.log(index)
     const dom = dom_lists_list.value?.querySelectorAll('.user-list')[index]
     if (!dom) return
     void nextTick(() => {

src/renderer/views/Setting/components/PlayTimeoutModal.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-material-modal(:show="modelValue" bg-close @close="handleCloseModal" @after-enter="$refs.dom_input.focus()" teleport="#view")
+material-modal(:show="modelValue" @close="handleCloseModal" @after-enter="$refs.dom_input.focus()" teleport="#view")
   main(:class="$style.main")
     h2 {{$t('play_timeout')}}
     div(:class="$style.content")
@@ -52,7 +52,7 @@ export default {
       if (rxp.test(text)) {
         text = RegExp.$1
         if (parseInt(text) > MAX_MIN) {
-          text = text.substring(0, text.length - 1)
+          text = MAX_MIN
         }
       } else {
         text = ''

src/renderer/views/Setting/components/SettingHotKey.vue

@@ -7,7 +7,7 @@ dd
   div(:class="$style.hotKeyContainer" :style="{ opacity: current_hot_key.local.enable ? 1 : .6 }")
     div(:class="$style.hotKeyItem" v-for="item in allHotKeys.local")
       h4(:class="$style.hotKeyItemTitle") {{$t('setting__hot_key_' + item.name)}}
-      base-input(:class="$style.hotKeyItemInput" readonly @keyup.prevent :placeholder="$t('setting__hot_key_unset_input')"
+      base-input(:class="$style.hotKeyItemInput" readonly @keyup.prevent :auto-paste="false" :placeholder="$t('setting__hot_key_unset_input')"
         :value="hotKeyConfig.local[item.name] && formatHotKeyName(hotKeyConfig.local[item.name].key)"
         @focus="handleHotKeyFocus($event, item, 'local')"
         @blur="handleHotKeyBlur($event, item, 'local')")
@@ -19,7 +19,7 @@ dd
     div(:class="$style.hotKeyItem" v-for="item in allHotKeys.global")
       h4(:class="$style.hotKeyItemTitle") {{$t('setting__hot_key_' + item.name)}}
       base-input(:class="[$style.hotKeyItemInput, hotKeyConfig.global[item.name] && hotKeyStatus[hotKeyConfig.global[item.name].key] && hotKeyStatus[hotKeyConfig.global[item.name].key].status === false ? $style.hotKeyFailed : null]"
-        :value="hotKeyConfig.global[item.name] && formatHotKeyName(hotKeyConfig.global[item.name].key)" @input.prevent readonly :placeholder="$t('setting__hot_key_unset_input')"
+        :value="hotKeyConfig.global[item.name] && formatHotKeyName(hotKeyConfig.global[item.name].key)" @input.prevent :auto-paste="false" readonly :placeholder="$t('setting__hot_key_unset_input')"
         @focus="handleHotKeyFocus($event, item, 'global')"
         @blur="handleHotKeyBlur($event, item, 'global')")
 </template>

src/renderer/views/Setting/components/SettingSync.vue

@@ -15,7 +15,7 @@ dd
   h3#sync_port {{$t('setting__sync_port')}}
   div
     p
-      base-input.gap-left(:modelValue="appSetting['sync.port']" @update:modelValue="setSyncPort" :placeholder="$t('setting__sync_port_tip')")
+      base-input.gap-left(:modelValue="appSetting['sync.port']" type="number" @update:modelValue="setSyncPort" :placeholder="$t('setting__sync_port_tip')")
 </template>
 
 <script>