fix(mobile): 修复移动端 TMDB 搜索图标不可见及弹窗交互问题 (#576)

src/components/dialog/AddDownloadDialog.vue

@@ -280,6 +280,7 @@ onMounted(() => {
           <VCol cols="12">
             <VTextField
               v-model="mediaId"
+              class="app-responsive-input--keep-append-action"
               :label="mediaIdLabel"
               :placeholder="t('dialog.reorganize.mediaIdPlaceholder')"
               :rules="[numberValidator]"

src/components/dialog/AddSubtitleDownloadDialog.vue

@@ -232,6 +232,7 @@ onMounted(() => {
           <VCol cols="12">
             <VTextField
               v-model="mediaId"
+              class="app-responsive-input--keep-append-action"
               :label="mediaIdLabel"
               :placeholder="t('dialog.reorganize.mediaIdPlaceholder')"
               :rules="[numberValidator]"

src/components/dialog/ReorganizeDialog.vue

@@ -1451,6 +1451,7 @@ onUnmounted(() => {
                   <VCol cols="12" md="4">
                     <VTextField
                       v-model="transferForm.media_id"
+                      class="app-responsive-input--keep-append-action"
                       :disabled="transferForm.type_name === ''"
                       :label="mediaIdLabel"
                       :placeholder="t('dialog.reorganize.mediaIdPlaceholder')"

src/components/dialog/ScrapeDialog.vue

@@ -147,6 +147,7 @@ watch(mediaSource, () => {
           <VCol cols="12" md="4">
             <VTextField
               v-model="mediaId"
+              class="app-responsive-input--keep-append-action"
               :disabled="mediaType === ''"
               :label="mediaIdLabel"
               :placeholder="t('dialog.reorganize.mediaIdPlaceholder')"

src/components/misc/MediaIdSelector.vue

@@ -105,29 +105,32 @@ onMounted(() => {
 
 <template>
   <VCard class="mx-auto" width="100%">
-    <VToolbar flat class="p-0">
+    <VCardTitle class="d-flex align-center justify-space-between">
+      <span>{{ t('dialog.reorganize.mediaSearchInput') }}</span>
+      <VDialogCloseBtn
+        inner-class="static"
+        @click="
+          () => {
+            emit('close')
+          }
+        "
+      />
+    </VCardTitle>
+    <VCardText class="pt-0">
       <VTextField
         ref="inputKeyword"
         v-model="keyword"
-        :label="t('dialog.reorganize.mediaSearchInput')"
+        :mobile-layout="false"
         single-line
         :placeholder="t('dialog.reorganize.mediaSearchPlaceholder')"
         variant="solo"
-        prepend-inner-icon="mdi-magnify"
+        append-inner-icon="mdi-magnify"
         flat
-        class="mx-1"
         :loading="loading"
         @click:append-inner="searchMedias"
         @keydown.enter="searchMedias"
       />
-    </VToolbar>
+    </VCardText>
-    <VDialogCloseBtn
-      @click="
-        () => {
-          emit('close')
-        }
-      "
-    />
     <VDivider />
     <VList v-if="items.length > 0" lines="three">
       <template v-for="(item, i) in items" :key="i">

src/styles/common.scss

@@ -558,6 +558,12 @@ html[data-theme-radius='extra'] {
   display: none;
 }
 
+// 少数字段的内嵌图标承担了唯一的交互入口（如按名称搜索媒体编号），
+// 不是纯装饰，移动端也需要保留可点击。
+.app-responsive-input--keep-append-action .app-responsive-input__native .v-field__append-inner {
+  display: inline-flex;
+}
+
 .app-responsive-input--field .v-field,
 .app-responsive-input--multiline .v-field {
   border-radius: var(--app-control-radius) !important;