🧹 清理文件管理日期控件

src/views/manage/FileManageView.vue

@@ -434,17 +434,9 @@
                     <span
                       class="inline-flex max-w-full items-center rounded-full px-2 py-0.5 text-xs font-medium"
                       :class="getInsightBadgeClass(file.statusInsightSeverity)"
-                      :title="file.displayHealthAction"
                     >
                       {{ file.displayHealthState }}
                     </span>
-                    <span
-                      class="max-w-[16rem] truncate text-xs"
-                      :class="[mutedTextClass]"
-                      :title="file.displayHealthAction"
-                    >
-                      {{ file.displayHealthAction }}
-                    </span>
                   </div>
                 </div>
               </div>
@@ -949,10 +941,6 @@
               <h4 class="mt-1 text-base font-semibold" :class="[primaryTextClass]">
                 {{ getInsightStateLabel(selectedFileDetail.statusInsightState) }}
               </h4>
-              <p class="mt-1 text-sm" :class="[mutedTextClass]">
-                {{ t('fileManage.nextAction') }}:
-                {{ getInsightActionLabel(selectedFileDetail.statusInsightNextAction) }}
-              </p>
             </div>
             <span
               class="inline-flex w-fit items-center rounded-full px-2.5 py-1 text-xs font-medium"
@@ -1159,11 +1147,32 @@
           :label="t('fileManage.form.suffix')"
           :placeholder="t('fileManage.form.suffixPlaceholder')"
         />
-        <FileEditField
-          v-model="editForm.expired_at"
-          type="datetime-local"
-          :label="t('send.expiration.label')"
-        />
+        <div class="space-y-2 group">
+          <label
+            class="flex items-center space-x-2 text-sm font-medium transition-colors duration-200"
+            :class="[
+              isDarkMode
+                ? 'text-gray-300 group-focus-within:text-indigo-400'
+                : 'text-gray-700 group-focus-within:text-indigo-600'
+            ]"
+          >
+            <span>{{ t('send.expiration.label') }}</span>
+            <div
+              class="h-px flex-1 transition-colors duration-200"
+              :class="[
+                isDarkMode
+                  ? 'bg-gray-700 group-focus-within:bg-indigo-500/50'
+                  : 'bg-gray-200 group-focus-within:bg-indigo-500/30'
+              ]"
+            ></div>
+          </label>
+          <NativeDateSelect
+            v-model="editForm.expired_at"
+            include-time
+            :field-class="fieldClass"
+            :aria-label="t('send.expiration.label')"
+          />
+        </div>
         <FileEditField
           v-model="editForm.expired_count"
           type="number"
@@ -1235,12 +1244,32 @@
           </div>
         </div>
 
-        <FileEditField
-          v-if="batchEditForm.mode === 'expiresAt'"
-          v-model="batchEditForm.expired_at"
-          type="datetime-local"
-          :label="t('fileManage.batchEditExpiresAt')"
-        />
+        <div v-if="batchEditForm.mode === 'expiresAt'" class="space-y-2 group">
+          <label
+            class="flex items-center space-x-2 text-sm font-medium transition-colors duration-200"
+            :class="[
+              isDarkMode
+                ? 'text-gray-300 group-focus-within:text-indigo-400'
+                : 'text-gray-700 group-focus-within:text-indigo-600'
+            ]"
+          >
+            <span>{{ t('fileManage.batchEditExpiresAt') }}</span>
+            <div
+              class="h-px flex-1 transition-colors duration-200"
+              :class="[
+                isDarkMode
+                  ? 'bg-gray-700 group-focus-within:bg-indigo-500/50'
+                  : 'bg-gray-200 group-focus-within:bg-indigo-500/30'
+              ]"
+            ></div>
+          </label>
+          <NativeDateSelect
+            v-model="batchEditForm.expired_at"
+            include-time
+            :field-class="fieldClass"
+            :aria-label="t('fileManage.batchEditExpiresAt')"
+          />
+        </div>
         <div v-else-if="batchEditForm.mode === 'relativeExpire'" class="grid gap-3 sm:grid-cols-[1fr_10rem]">
           <FileEditField
             v-model="batchEditForm.relative_expire_value"
@@ -1421,6 +1450,7 @@ import {
 import DataTable from '@/components/common/DataTable.vue'
 import DataPagination from '@/components/common/DataPagination.vue'
 import FileEditField from '@/components/common/FileEditField.vue'
+import NativeDateSelect from '@/components/common/NativeDateSelect.vue'
 import BaseModal from '@/components/common/BaseModal.vue'
 import BaseButton from '@/components/common/BaseButton.vue'
 import { useAdminFiles, useInjectedDarkMode, useTransferAnalytics } from '@/composables'
@@ -1924,8 +1954,6 @@ const getInsightSeverityLabel = (severity: AdminFileInsightSeverity) =>
 
 const getInsightStateLabel = (state: string) => t(`fileManage.insightStates.${state}`)
 
-const getInsightActionLabel = (action: string) => t(`fileManage.insightActions.${action}`)
-
 const getInsightPanelClass = (severity: AdminFileInsightSeverity) => {
   const darkClasses: Record<AdminFileInsightSeverity, string> = {
     success: 'border-emerald-500/20 bg-emerald-500/10',