diff --git a/src/components/ExportRecord/index.vue b/src/components/ExportRecord/index.vue
new file mode 100644
index 0000000..ea2086b
--- /dev/null
+++ b/src/components/ExportRecord/index.vue
@@ -0,0 +1,296 @@
+<template>
+  <a-modal
+    v-model:open="visible"
+    :title="title || '导出记录'"
+    width="1200px"
+    :footer="null"
+    :maskClosable="false"
+    @cancel="handleCancel"
+    :destroyOnClose="true"
+  >
+    <div class="import-records-modal">
+      <!-- 表格 -->
+      <a-table
+        :dataSource="tableData"
+        :columns="columns"
+        :pagination="pagination"
+        :loading="loading"
+        :scroll="{ x: 1200 }"
+        rowKey="taskId"
+      >
+        <!-- 状态列渲染 -->
+        <template #status="{ record }">
+          <a-tag :color="getStatusColor(record.status)">
+            {{ getStatusText(record.status) }}
+          </a-tag>
+        </template>
+
+        <!-- 进度列渲染 -->
+        <template #progress="{ record }">
+          <a-progress
+            :percent="record.progress"
+            size="small"
+            :status="getProgressStatus(record.status)"
+          />
+        </template>
+
+        <!-- 操作列渲染 -->
+        <template #action="{ record }">
+          <a-space>
+            <a-button type="link" size="small" @click="viewDetails(record)" :disabled="record.status !== 'completed'">
+              查看详情
+            </a-button>
+            <a-button type="primary" size="small" @click="downloadResult(record)" :disabled="record.status !== 'completed'">
+              下载文件
+            </a-button>
+            <a-button type="link" size="small" @click="retryExport(record)" :disabled="record.status !== 'failed'">
+              重新导出
+            </a-button>
+          </a-space>
+        </template>
+      </a-table>
+    </div>
+  </a-modal>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted, watch } from 'vue';
+import { message } from 'ant-design-vue';
+
+// 定义props
+const props = defineProps({
+  // 弹框标题
+  title: {
+    type: String,
+    default: '导出记录'
+  },
+  // 是否显示弹框
+  modelValue: {
+    type: Boolean,
+    default: false
+  },
+  // 数据获取函数
+  fetchData: {
+    type: Function,
+    required: true
+  }
+});
+
+// 定义emit
+const emit = defineEmits(['update:modelValue', 'close', 'view-details', 'download-result', 'retry-export']);
+
+// 弹框显示状态
+const visible = ref(false);
+
+// 表格数据
+const tableData = ref([]);
+
+// 加载状态
+const loading = ref(false);
+
+// 分页配置
+const pagination = reactive({
+  current: 1,
+  pageSize: 10,
+  total: 0,
+  showSizeChanger: true,
+  showQuickJumper: true,
+  pageSizeOptions: ['10', '20', '50', '100'],
+  onChange: (page, pageSize) => {
+    pagination.current = page;
+    pagination.pageSize = pageSize;
+    fetchTableData();
+  },
+  onShowSizeChange: (current, size) => {
+    pagination.current = 1;
+    pagination.pageSize = size;
+    fetchTableData();
+  }
+});
+
+// 表格列配置
+const columns = [
+  {
+    title: '任务ID',
+    dataIndex: 'taskId',
+    key: 'taskId',
+    align: 'center',
+    fixed: 'left',
+    width: 150,
+  },
+  {
+    title: '任务类型',
+    dataIndex: 'alias',
+    key: 'alias',
+    align: 'center',
+    width: 150,
+  },
+  {
+    title: '状态',
+    dataIndex: 'status',
+    key: 'status',
+    align: 'center',
+    width: 100,
+    slots: { customRender: 'status' },
+  },
+  {
+    title: '进度',
+    dataIndex: 'progress',
+    key: 'progress',
+    align: 'center',
+    width: 150,
+    slots: { customRender: 'progress' },
+  },
+  {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    key: 'createTime',
+    align: 'center',
+    width: 180,
+  },
+  {
+    title: '操作人',
+    dataIndex: 'createByName',
+    key: 'createByName',
+    align: 'center',
+    width: 120,
+  },
+  {
+    title: '操作',
+    key: 'action',
+    align: 'center',
+    fixed: 'right',
+    width: 280,
+    slots: { customRender: 'action' },
+  },
+];
+
+// 监听父组件传入的modelValue
+watch(
+  () => props.modelValue,
+  (val) => {
+    visible.value = val;
+    if (val) {
+      // 弹框打开时获取数据
+      fetchTableData();
+    }
+  },
+  { immediate: true } // 立即执行，确保初始值正确
+);
+
+// 获取表格数据
+const fetchTableData = async () => {
+  loading.value = true;
+  
+  try {
+    // 调用父组件传入的数据获取函数
+    const result = await props.fetchData({
+      page: pagination.current,
+      pageSize: pagination.pageSize
+    });
+    
+    // 假设返回的数据格式为 { list: [...], total: 100 }
+    tableData.value = Array.isArray(result.list) ? result.list : result;
+    pagination.total = result.total || tableData.value.length;
+    
+  } catch (error) {
+    console.error('获取数据失败:', error);
+    message.error(error.message || '获取导出记录失败');
+    tableData.value = [];
+    pagination.total = 0;
+  } finally {
+    loading.value = false;
+  }
+};
+
+// 获取状态文本
+const getStatusText = (status) => {
+  switch (status) {
+    case 'completed': return '已完成';
+    case 'failed': return '失败';
+    case 'processing': return '处理中';
+    case 'pending': return '待处理';
+    default: return status;
+  }
+};
+
+// 获取状态颜色
+const getStatusColor = (status) => {
+  switch (status) {
+    case 'completed': return 'green';
+    case 'failed': return 'red';
+    case 'processing': return 'blue';
+    case 'pending': return '#ffcc00';
+    default: return 'default';
+  }
+};
+
+// 获取进度条状态
+const getProgressStatus = (status) => {
+  if (status === 'completed') return 'success';
+  if (status === 'failed') return 'exception';
+  if (status === 'processing') return 'active';
+  return 'normal';
+};
+
+// 关闭弹框
+const handleCancel = () => {
+  visible.value = false;
+  emit('update:modelValue', false);
+  emit('close');
+};
+
+// 查看详情
+const viewDetails = (record) => {
+  emit('view-details', record);
+};
+
+// 下载文件
+const downloadResult = (record) => {
+  emit('download-result', record);
+};
+
+// 重新导出
+const retryExport = (record) => {
+  emit('retry-export', record);
+};
+</script>
+
+<style scoped>
+.import-records-modal {
+  padding: 10px 0;
+}
+
+/* 针对表格的样式优化 */
+:deep(.ant-table) {
+  background: #fff;
+  border-radius: 6px;
+}
+
+:deep(.ant-table-thead > tr > th) {
+  text-align: center;
+  background-color: #f9f9f9;
+  font-weight: 600;
+}
+
+:deep(.ant-table-tbody > tr > td) {
+  text-align: center;
+}
+
+/* 操作按钮样式 */
+:deep(.ant-btn-link) {
+  height: auto;
+  padding: 2px 4px;
+  color: #1890ff;
+}
+
+:deep(.ant-btn-link:hover) {
+  color: #40a9ff;
+}
+
+:deep(.ant-btn-primary) {
+  height: 24px;
+  padding: 0 8px;
+  font-size: 12px;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/ImportRecord/index.vue b/src/components/ImportRecord/index.vue
new file mode 100644
index 0000000..42e86f2
--- /dev/null
+++ b/src/components/ImportRecord/index.vue
@@ -0,0 +1,310 @@
+<!-- ImportRecordsModal.vue -->
+<template>
+  <a-modal
+    v-model:open="visible"
+    :title="title || '导入记录'"
+    width="1200px"
+    :footer="null"
+    :maskClosable="false"
+    @cancel="handleCancel"
+    :destroyOnClose="true"
+  >
+    <div class="import-records-modal">
+      <!-- 表格 -->
+      <a-table
+        :dataSource="tableData"
+        :columns="columns"
+        :pagination="pagination"
+        :loading="loading"
+        :scroll="{ x: 1200 }"
+        rowKey="taskId"
+      >
+        <!-- 状态列渲染 -->
+        <template #status="{ record }">
+          <a-tag :color="getStatusColor(record.status)">
+            {{ getStatusText(record.status) }}
+          </a-tag>
+        </template>
+
+        <!-- 进度列渲染 -->
+        <template #progress="{ record }">
+          <a-progress
+            :percent="record.progress"
+            size="small"
+            :status="getProgressStatus(record.status)"
+          />
+        </template>
+
+        <!-- 操作列渲染 -->
+        <template #action="{ record }">
+          <a-space>
+            <a-button type="link" size="small" @click="viewDetails(record)">
+              查看异常数据
+            </a-button>
+          </a-space>
+        </template>
+      </a-table>
+    </div>
+  </a-modal>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted, watch } from 'vue';
+import { message } from 'ant-design-vue';
+
+// 定义props
+const props = defineProps({
+  // 弹框标题
+  title: {
+    type: String,
+    default: '导入记录'
+  },
+  // 是否显示弹框
+  modelValue: {
+    type: Boolean,
+    default: false
+  },
+  // 数据获取函数
+  fetchData: {
+    type: Function,
+    required: true
+  }
+});
+
+// 定义emit
+const emit = defineEmits(['update:modelValue', 'close', 'view-details', 'download-result', 'retry-import']);
+
+// 弹框显示状态
+const visible = ref(false);
+
+// 表格数据
+const tableData = ref([]);
+
+// 加载状态
+const loading = ref(false);
+
+// 分页配置
+const pagination = reactive({
+  current: 1,
+  pageSize: 10,
+  total: 0,
+  showSizeChanger: true,
+  showQuickJumper: true,
+  pageSizeOptions: ['10', '20', '50', '100'],
+  onChange: (page, pageSize) => {
+    pagination.current = page;
+    pagination.pageSize = pageSize;
+    fetchTableData();
+  },
+  onShowSizeChange: (current, size) => {
+    pagination.current = 1;
+    pagination.pageSize = size;
+    fetchTableData();
+  }
+});
+
+// 表格列配置
+const columns = [
+  {
+    title: '批次号',
+    dataIndex: 'taskId',
+    key: 'taskId',
+    align: 'center',
+    fixed: 'left',
+    width: 150,
+  },
+  {
+    title: '状态',
+    dataIndex: 'status',
+    key: 'status',
+    align: 'center',
+    width: 100,
+    slots: { customRender: 'status' },
+  },
+  {
+    title: '导入任务类型',
+    dataIndex: 'alias',
+    key: 'alias',
+    align: 'center',
+    width: 150,
+  },
+  {
+    title: '总数量',
+    dataIndex: 'totalCount',
+    key: 'totalCount',
+    align: 'center',
+    width: 100,
+  },
+  {
+    title: '成功数量',
+    dataIndex: 'successCount',
+    key: 'successCount',
+    align: 'center',
+    width: 100,
+  },
+  {
+    title: '异常数量',
+    dataIndex: 'failCount',
+    key: 'failCount',
+    align: 'center',
+    width: 100,
+  },
+  {
+    title: '上传时间',
+    dataIndex: 'createTime',
+    key: 'createTime',
+    align: 'center',
+    width: 180,
+  },
+  {
+    title: '操作人',
+    dataIndex: 'createByName',
+    key: 'createByName',
+    align: 'center',
+    width: 120,
+  },
+  {
+    title: '进度',
+    dataIndex: 'progress',
+    key: 'progress',
+    align: 'center',
+    width: 150,
+    slots: { customRender: 'progress' },
+  },
+  {
+    title: '操作',
+    key: 'action',
+    align: 'center',
+    fixed: 'right',
+    width: 200,
+    slots: { customRender: 'action' },
+  },
+];
+
+// 监听父组件传入的modelValue
+watch(() => props.modelValue, (val) => {
+  visible.value = val;
+  if (val) {
+    // 弹框打开时获取数据
+    fetchTableData();
+  }
+});
+
+// 获取表格数据
+const fetchTableData = async () => {
+  loading.value = true;
+  
+  try {
+    // 调用父组件传入的数据获取函数
+    const result = await props.fetchData({
+      page: pagination.current,
+      pageSize: pagination.pageSize
+    });
+    
+    // 假设返回的数据格式为 { list: [...], total: 100 }
+    tableData.value = Array.isArray(result.list) ? result.list : result;
+    pagination.total = result.total || tableData.value.length;
+    
+  } catch (error) {
+    console.error('获取数据失败:', error);
+    message.error(error.message || '获取导入记录失败');
+    tableData.value = [];
+    pagination.total = 0;
+  } finally {
+    loading.value = false;
+  }
+};
+
+// 获取状态文本
+const getStatusText = (status) => {
+  switch (status) {
+    case 'completed': return '已完成';
+    case 'failed': return '失败';
+    case 'processing': return '处理中';
+    case 'pending': return '待处理';
+    default: return status;
+  }
+};
+
+// 获取状态颜色
+const getStatusColor = (status) => {
+  switch (status) {
+    case 'completed': return 'green';
+    case 'failed': return 'red';
+    case 'processing': return 'blue';
+    case 'pending': return '#ffcc00';
+    default: return 'default';
+  }
+};
+
+// 获取进度条状态
+const getProgressStatus = (status) => {
+  if (status === 'completed') return 'success';
+  if (status === 'failed') return 'exception';
+  if (status === 'processing') return 'active';
+  return 'normal';
+};
+
+// 关闭弹框
+const handleCancel = () => {
+  visible.value = false;
+  emit('update:modelValue', false);
+  emit('close');
+};
+
+// 查看详情
+const viewDetails = (record) => {
+  emit('view-details', record);
+};
+
+// 下载结果
+const downloadResult = (record) => {
+  emit('download-result', record);
+};
+
+// 重新导入
+const retryImport = (record) => {
+  emit('retry-import', record);
+};
+
+// 组件卸载时清理数据
+onMounted(() => {
+  // 初始化时不需要获取数据，等待父组件打开弹框
+});
+</script>
+
+<style scoped>
+.import-records-modal {
+  padding: 10px 0;
+}
+
+/* 针对表格的样式优化 */
+:deep(.ant-table) {
+  background: #fff;
+  border-radius: 6px;
+}
+
+:deep(.ant-table-thead > tr > th) {
+  text-align: center;
+  background-color: #f9f9f9;
+  font-weight: 600;
+}
+
+:deep(.ant-table-tbody > tr > td) {
+  text-align: center;
+}
+
+/* 操作按钮样式 */
+:deep(.ant-btn-link) {
+  height: auto;
+  padding: 2px 4px;
+  color: #1890ff;
+}
+
+:deep(.ant-btn-link:hover) {
+  color: #40a9ff;
+}
+</style>
+
+
+
diff --git a/src/views/serviceMenu/serviceSites/index.vue b/src/views/serviceMenu/serviceSites/index.vue
index 037a2a6..a790f1d 100644
--- a/src/views/serviceMenu/serviceSites/index.vue
+++ b/src/views/serviceMenu/serviceSites/index.vue
@@ -66,18 +66,18 @@
                     导入
                 </a-button>
 
-                <a-button v-action="'add'" type="primary" @click="$refs.editDialogRef.handleCreate()">
+                <a-button v-action="'add'" type="primary" @click="showImportRecordModal = true">
                     <template #icon>
                         <UnorderedListOutlined />
                     </template>
                     导入记录
                 </a-button>
 
-                <a-button v-action="'add'" type="primary" @click="$refs.editDialogRef.handleCreate()">
+                <a-button v-action="'add'" type="primary" @click="handleExport">
                     导出
                 </a-button>
 
-                <a-button v-action="'add'" type="primary" @click="$refs.editDialogRef.handleCreate()">
+                <a-button v-action="'add'" type="primary" @click="handleShowExportRecords">
                     <template #icon>
                         <UnorderedListOutlined />
                     </template>
@@ -145,8 +145,29 @@
     <import-modal 
         v-model:visible="showImportModal" 
         @download="handleDownloadTemplate"
-        @upload="handleFileUpload"
+        @upload="handleFileUpload"/>
+    
+    <!-- 导入记录弹框组件 -->
+    <ImportRecordsModal
+        v-model:visible="showImportRecordModal"
+        title="导入记录"
+        :fetchData="fetchImportRecords"
+        @close="handleImportRecordClose"
+        @view-details="handleViewImportDetails"
+        @download-result="handleDownloadImportResult"
+        @retry-import="handleRetryImport"
     />
+
+    <!-- 导出记录弹框组件 -->
+    <ExportRecordsModal
+        v-model="showExportRecordModal" 
+        title="导出记录"
+        :fetchData="fetchExportRecords"
+        @close="handleExportRecordClose"
+        @view-details="handleViewExportDetails"
+        @download-result="handleDownloadExportResult"
+        @retry-export="handleRetryExport"
+        />
 </template>
 
 <script setup>
@@ -160,7 +181,10 @@ import { usePagination, useForm } from '@/hooks'
 import { formatUtcDateTime } from '@/utils/util'
 import EditDialog from './components/EditDialog.vue'
 // 引入导入组件
-import ImportModal from '@/components/Import/index.vue' // 假设你的导入组件路径是这个
+import ImportModal from '@/components/Import/index.vue'
+// 引入导入记录组件
+import ImportRecordsModal from '@/components/ImportRecord/index.vue'
+import ExportRecordsModal from '@/components/ExportRecord/index.vue'
 import { useI18n } from 'vue-i18n'
 import storage from '@/utils/storage'
 
@@ -172,6 +196,10 @@ const { t } = useI18n() // 解构出t方法
 // 控制导入弹框显示/隐藏的变量
 const showImportModal = ref(false)
 
+// 控制导入记录弹框显示/隐藏的变量
+const showImportRecordModal = ref(false)
+const showExportRecordModal = ref(false)
+
 const columns = ref([
     { title: '工单号', dataIndex: 'name', key: 'name', fixed: true, width: 280 },
     { title: '服务对象', dataIndex: 'code', key: 'code', width: 240 },
@@ -275,7 +303,31 @@ async function onOk() {
     await getMenuList()
 }
 
+/**
+ * 导出数据
+ */
+function handleExport() {
+    Modal.confirm({
+        title: '确认导出',
+        content: '是否导出当前查询条件下的所有服务站点数据？',
+        onOk: () => {
+            // 调用导出API
+            apis.exportServiceSite(searchFormData.value).then(() => {
+                message.success('导出任务已提交，请在导出记录中查看进度');
+                showExportRecordModal.value = true;
+            }).catch(() => {
+                message.error('导出任务提交失败');
+            });
+        }
+    });
+}
 
+/**
+ * 显示导出记录
+ */
+function handleShowExportRecords() {
+    showExportRecordModal.value = true;
+}
 
 /**
  * 处理下载模板
@@ -323,6 +375,211 @@ function handleChange() {
     // 可以添加选择框变化后的逻辑
 }
 
+// 获取导入记录数据
+const fetchImportRecords = async (params) => {
+    // 模拟API调用 - 实际项目中需要替换为真实的API调用
+    await new Promise(resolve => setTimeout(resolve, 800));
+    
+    // 模拟数据
+    const mockData = [
+        {
+            taskId: 'BATCH_20231201_001',
+            status: 'completed',
+            alias: '服务站点数据导入',
+            totalCount: 1500,
+            successCount: 1480,
+            failCount: 20,
+            createTime: '2023-12-01 14:30:25',
+            createByName: '张三',
+            progress: 100
+        },
+        {
+            taskId: 'BATCH_20231201_002',
+            status: 'failed',
+            alias: '服务站点信息导入',
+            totalCount: 800,
+            successCount: 750,
+            failCount: 50,
+            createTime: '2023-12-01 15:45:10',
+            createByName: '李四',
+            progress: 93.75
+        },
+        {
+            taskId: 'BATCH_20231201_003',
+            status: 'processing',
+            alias: '服务站点数据导入',
+            totalCount: 3200,
+            successCount: 1200,
+            failCount: 0,
+            createTime: '2023-12-01 16:20:30',
+            createByName: '王五',
+            progress: 37.5
+        },
+        {
+            taskId: 'BATCH_20231201_004',
+            status: 'pending',
+            alias: '服务站点批量导入',
+            totalCount: 500,
+            successCount: 0,
+            failCount: 0,
+            createTime: '2023-12-01 17:10:15',
+            createByName: '赵六',
+            progress: 0
+        },
+        {
+            taskId: 'BATCH_20231201_005',
+            status: 'completed',
+            alias: '服务站点信息导入',
+            totalCount: 2100,
+            successCount: 2095,
+            failCount: 5,
+            createTime: '2023-12-01 18:05:40',
+            createByName: '钱七',
+            progress: 100
+        }
+    ];
+    
+    // 根据分页参数返回数据
+    const start = (params.page - 1) * params.pageSize;
+    const end = start + params.pageSize;
+    const list = mockData.slice(start, end);
+    
+    return {
+        list,
+        total: mockData.length
+    };
+};
+
+// 获取导出记录数据
+const fetchExportRecords = async (params) => {
+    // 模拟API调用 - 实际项目中需要替换为真实的API调用
+    await new Promise(resolve => setTimeout(resolve, 800));
+    
+    // 模拟数据
+    const mockData = [
+        {
+            taskId: 'EXPORT_20231201_001',
+            status: 'completed',
+            alias: '服务站点数据导出',
+            totalCount: 1500,
+            successCount: 1500,
+            failCount: 0,
+            createTime: '2023-12-01 14:30:25',
+            createByName: '张三',
+            progress: 100
+        },
+        {
+            taskId: 'EXPORT_20231201_002',
+            status: 'completed',
+            alias: '服务站点信息导出',
+            totalCount: 800,
+            successCount: 800,
+            failCount: 0,
+            createTime: '2023-12-01 15:45:10',
+            createByName: '李四',
+            progress: 100
+        },
+        {
+            taskId: 'EXPORT_20231201_003',
+            status: 'processing',
+            alias: '服务站点数据导出',
+            totalCount: 3200,
+            successCount: 2500,
+            failCount: 0,
+            createTime: '2023-12-01 16:20:30',
+            createByName: '王五',
+            progress: 78.125
+        },
+        {
+            taskId: 'EXPORT_20231201_004',
+            status: 'pending',
+            alias: '服务站点批量导出',
+            totalCount: 500,
+            successCount: 0,
+            failCount: 0,
+            createTime: '2023-12-01 17:10:15',
+            createByName: '赵六',
+            progress: 0
+        },
+        {
+            taskId: 'EXPORT_20231201_005',
+            status: 'completed',
+            alias: '服务站点信息导出',
+            totalCount: 2100,
+            successCount: 2100,
+            failCount: 0,
+            createTime: '2023-12-01 18:05:40',
+            createByName: '钱七',
+            progress: 100
+        }
+    ];
+    
+    // 根据分页参数返回数据
+    const start = (params.page - 1) * params.pageSize;
+    const end = start + params.pageSize;
+    const list = mockData.slice(start, end);
+    
+    return {
+        list,
+        total: mockData.length
+    };
+};
+
+// 关闭导入记录弹框
+const handleImportRecordClose = () => {
+    console.log('导入记录弹框已关闭');
+};
+
+// 查看导入详情
+const handleViewImportDetails = (record) => {
+    message.info(`查看批次 ${record.taskId} 的详情`);
+    console.log('查看详情:', record);
+};
+
+// 下载导入结果
+const handleDownloadImportResult = (record) => {
+    message.success(`正在下载批次 ${record.taskId} 的结果文件`);
+    console.log('下载结果:', record);
+};
+
+// 重新导入
+const handleRetryImport = (record) => {
+    message.info(`正在重新导入批次 ${record.taskId}`);
+    console.log('重新导入:', record);
+};
+
+// 关闭导出记录弹框
+const handleExportRecordClose = () => {
+    console.log('导出记录弹框已关闭');
+};
+
+// 查看导出详情
+const handleViewExportDetails = (record) => {
+    message.info(`查看导出批次 ${record.taskId} 的详情`);
+    console.log('查看导出详情:', record);
+};
+
+// 下载导出结果
+const handleDownloadExportResult = (record) => {
+    message.success(`正在下载导出批次 ${record.taskId} 的结果文件`);
+    // 调用实际的下载API
+    apis.downloadExportResult(record.taskId).then(() => {
+        message.success('文件下载成功');
+    }).catch(() => {
+        message.error('文件下载失败');
+    });
+};
+
+// 重新导出
+const handleRetryExport = (record) => {
+    message.info(`正在重新导出批次 ${record.taskId}`);
+    // 调用重新导出的API
+    apis.retryExport(record.taskId).then(() => {
+        message.success('重新导出任务已提交');
+    }).catch(() => {
+        message.error('重新导出失败');
+    });
+};
 </script>
 
 <style lang="less" scoped>
@@ -337,4 +594,4 @@ function handleChange() {
     background-color: #e8e8e8; // 灰色横线
     margin-top: 8px;
 }
-</style>
+</style>
\ No newline at end of file