搜索，表格封装更改

src/components/common/Search.vue

@@ -25,8 +25,8 @@
             :type="item.dateType || 'date'" :range-separator="item.rangeSeparator || '至'"
             :placeholder="item.placeholder"
             :start-placeholder="item.startPlaceholder || '开始日期'" :end-placeholder="item.endPlaceholder || '结束日期'"
-            :value-format="item.valueFormat || 'YYYY-MM-DD'" :clearable="item.clearable ?? true"
-            :disabled-date="item.disabledDate" :locale="'zhCn'" />
+            :value-format="item.valueFormat || 'YYYY-MM-DD'" :format="item.format || item.valueFormat || 'YYYY-MM-DD'" :clearable="item.clearable ?? true"
+            :disabled-date="item.disabledDate" :locale="'zhCn'" @change="(val: any) => handleDateChange(item, val)" />
         </el-form-item>
 
         <!-- 自定义插槽项 -->
@@ -73,10 +73,12 @@ interface SearchOption {
   startPlaceholder?: string // 日期范围开始占位符
   endPlaceholder?: string // 日期范围结束占位符
   valueFormat?: string // 日期格式
+  format?: string // 显示格式
   disabledDate?: (date: Date) => boolean // 禁用日期函数
   width?: string // 宽度
   minWidth?: string // 最小宽度
-  auth?: string // 最小宽度
+  auth?: string // 权限
+  defaultTime?: 'start' | 'end' // 默认时间：start=00:00:00, end=23:59:59
 }
 
 // 按钮配置类型
@@ -111,6 +113,34 @@ const emit = defineEmits(['search', 'reset', 'blur-input'])
 const handleBlur = () => {
   emit('blur-input')
 }
+
+// 日期选择变化处理：自动设置开始/结束时间
+const handleDateChange = (item: SearchOption, val: any) => {
+  if (!val || !item.defaultTime) return
+  const date = new Date(val)
+  if (item.defaultTime === 'start') {
+    date.setHours(0, 0, 0, 0)
+  } else if (item.defaultTime === 'end') {
+    date.setHours(23, 59, 59, 999)
+  }
+  // 重新格式化日期
+  const formatDate = (d: Date, format: string): string => {
+    const year = d.getFullYear()
+    const month = String(d.getMonth() + 1).padStart(2, '0')
+    const day = String(d.getDate()).padStart(2, '0')
+    const hours = String(d.getHours()).padStart(2, '0')
+    const minutes = String(d.getMinutes()).padStart(2, '0')
+    const seconds = String(d.getSeconds()).padStart(2, '0')
+    return format.replace(/YYYY|MM|DD|HH|mm|ss/g, (match) => {
+      const map: Record<string, string | number> = {
+        YYYY: year, MM: month, DD: day, HH: hours, mm: minutes, ss: seconds
+      }
+      return String(map[match])
+    })
+  }
+  const format = item.valueFormat || 'YYYY-MM-DD HH:mm:ss'
+  searchForm.value[item.prop] = formatDate(date, format)
+}
 </script>
 
 <style scoped lang="scss">

src/components/common/Table.vue

@@ -131,10 +131,16 @@
             </div>
           </template>
           <template v-if="column.isNumber" #default="{ row }">
-            <span>{{ formatDecimalTruncate(row[column.prop]) }}</span>
+            <span class="cell-content">{{ formatDecimalTruncate(row[column.prop]) }}</span>
+            <el-icon v-if="column.copy" class="copy-icon" @click.stop="handleCopy(row[column.prop])"><DocumentCopy /></el-icon>
           </template>
           <template v-else-if="column.options" #default="{ row }">
-            <span>{{ getOptionLabel(column.options, row[column.prop]) }}</span>
+            <span class="cell-content">{{ getOptionLabel(column.options, row[column.prop]) }}</span>
+            <el-icon v-if="column.copy" class="copy-icon" @click.stop="handleCopy(row[column.prop])"><DocumentCopy /></el-icon>
+          </template>
+          <template v-else #default="{ row }">
+            <span class="cell-content">{{ row[column.prop] }}</span>
+            <el-icon v-if="column.copy" class="copy-icon" @click.stop="handleCopy(row[column.prop])"><DocumentCopy /></el-icon>
           </template>
         </el-table-column>
 
@@ -157,9 +163,10 @@
 
 <script setup lang="ts">
 import { ref, watch, computed, onMounted, reactive } from 'vue'
-import { Setting, Rank, Filter } from '@element-plus/icons-vue'
+import { Setting, Rank, Filter, DocumentCopy } from '@element-plus/icons-vue'
 import draggable from 'vuedraggable'
 import type { TableInstance } from 'element-plus'
+import { ElMessage } from 'element-plus'
 import { formatDecimalTruncate } from '@/utils/formatDecimal'
 import { useRoute } from 'vue-router'
 import { useUserStore } from '@/stores/modules/user'
@@ -193,6 +200,8 @@ interface TableColumn {
   filterMethod?: (value: any, row: any, column: any) => boolean
   filterable?: boolean
   filterPlaceholder?: string
+  // 复制功能
+  copy?: boolean
 }
 
 // 定义表格组件属性接口
@@ -505,6 +514,16 @@ const handleFilterClear = (column: TableColumn) => {
   emit('filter-change', { ...filterStates })
 }
 
+// 复制文本
+const handleCopy = async (text: string) => {
+  try {
+    await navigator.clipboard.writeText(text)
+    ElMessage.success('复制成功')
+  } catch (error) {
+    console.error('复制失败', error)
+  }
+}
+
 // 暴露方法
 defineExpose({
   clearCurrentRow: () => {
@@ -638,17 +657,33 @@ defineExpose({
   .header-filter-input {
     width: 100%;
     // max-width: 140px;
-    
+
     :deep(.el-input__wrapper) {
       padding: 0 8px;
       font-size: 12px;
       height: 26px;
     }
-    
+
     :deep(.el-input__inner) {
       height: 24px;
       line-height: 24px;
     }
   }
 }
+
+// 复制图标样式
+.copy-icon {
+  margin-left: 4px;
+  cursor: pointer;
+  color: #909399;
+  font-size: 14px;
+
+  &:hover {
+    color: #409eff;
+  }
+}
+
+.cell-content {
+  // 可选：让文字和图标在同一行
+}
 </style>