导出弹窗列表样式优化

src/views/consume/bean/articleVideo.vue

@@ -591,7 +591,7 @@ const getTagText = (state) => {
 
   <!-- 导出弹窗 -->
   <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
-    <el-table :data="exportList" style="width: 100%" :loading="exportListLoading">
+        <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
       <el-table-column prop="fileName" label="文件名" />
       <el-table-column prop="state" label="状态">
         <template #default="scope">

src/views/consume/bean/dieHardFan.vue

@@ -566,7 +566,7 @@ const getTagText = (state) => {
 
   <!-- 导出弹窗 -->
   <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
-    <el-table :data="exportList" style="width: 100%" :loading="exportListLoading">
+        <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
       <el-table-column prop="fileName" label="文件名" />
       <el-table-column prop="state" label="状态">
         <template #default="scope">

src/views/consume/bean/liveStream.vue

@@ -599,7 +599,7 @@ const getTagText = (state) => {
 
   <!-- 导出弹窗 -->
   <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
-    <el-table :data="exportList" style="width: 100%" :loading="exportListLoading">
+        <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
       <el-table-column prop="fileName" label="文件名" />
       <el-table-column prop="state" label="状态">
         <template #default="scope">

src/views/consume/gold/coinConsumeDetail.vue

@@ -739,7 +739,7 @@ const getMarket = async function () {
 
   <!-- 导出弹窗 -->
   <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
-    <el-table :data="exportList" style="width: 100%" :loading="exportListLoading">
+        <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
       <el-table-column prop="fileName" label="文件名"/>
       <el-table-column prop="state" label="状态">
         <template #default="scope">

src/views/recharge/beanOnlineRecharge.vue

@@ -219,6 +219,102 @@ const handleCurrentChange = (value) => {
     get()
 }
 
+//======================导出=======================
+const exportExcel = async () => {
+    const params = {
+        ...getObj.value,
+        "beanRechargeInfo": {
+            ...selectData.value,
+            sortField: sortField.value,
+            sortOrder: sortOrder.value,
+        },
+    }
+    try {
+        const res = await API({ url: '/export', data: params })
+        if (res.code === 200) {
+            ElMessage.success('导出成功')
+        } else {
+            ElMessage.error(res.message || '导出失败，请稍后重试')
+        }
+    } catch (error) {
+        console.log('请求失败', error)
+        ElMessage.error('导出失败，请稍后重试')
+    }
+}
+const exportListVisible = ref(false)
+
+// 打开导出列表弹窗
+const openExportList = () => {
+    getExportList()
+    exportListVisible.value = true
+}
+
+// 导出列表数据
+const exportList = ref([])
+// 导出列表加载状态
+const exportListLoading = ref(false)
+// 获取导出列表
+const getExportList = async () => {
+    exportListLoading.value = true
+    try {
+        const result = await API({ url: '/export/export' })
+        if (result.code === 200) {
+            //   const filteredData = result.data.filter(item => {
+            //     return item.type === 2; //2表示金币充值列表
+            //   });
+            //   exportList.value = filteredData
+            exportList.value = result.data
+        } else {
+            ElMessage.error(result.msg || '获取导出列表失败')
+        }
+    } catch (error) {
+        console.error('获取导出列表出错:', error)
+        ElMessage.error('获取导出列表失败，请稍后重试')
+    } finally {
+        exportListLoading.value = false
+    }
+}
+// 下载导出文件
+const downloadExportFile = (item) => {
+    if (item.state === 2) {
+        const link = document.createElement('a')
+        link.href = item.url
+        link.download = item.fileName
+        link.click()
+    } else {
+        ElMessage.warning('文件还在导出中，请稍后再试')
+    }
+}
+//根据状态返回对应的标签类型
+const getTagType = (state) => {
+    switch (state) {
+        case 0:
+            return 'info';
+        case 1:
+            return 'primary';
+        case 2:
+            return 'success';
+        case 3:
+            return 'danger';
+        default:
+            return 'info';
+    }
+}
+//根据状态返回对应的标签文案
+const getTagText = (state) => {
+    switch (state) {
+        case 0:
+            return '待执行';
+        case 1:
+            return '执行中';
+        case 2:
+            return '执行完成';
+        case 3:
+            return '执行出错';
+        default:
+            return '未知状态';
+    }
+}
 onMounted(async function () {
     await get()
     await getArea()
@@ -265,7 +361,7 @@ onMounted(async function () {
                 </el-row>
 
                 <el-row>
-                    <el-col :span="23">
+                    <el-col :span="24">
                         <div class="head-card-element">
                             <el-text class="mx-1" size="large">充值时间：</el-text>
                             <el-date-picker v-model="getTime" type="datetimerange" range-separator="至"
@@ -282,8 +378,8 @@ onMounted(async function () {
                             </el-button>
                             <el-button type="success" @click="reset()">重置</el-button>
                             <el-button type="primary" @click="search()">查询</el-button>
-                            <!-- <el-button type="primary" @click="exportExcel()">导出Excel</el-button>
-              <el-button type="primary" @click="openExportList">查看导出列表</el-button> -->
+                            <el-button type="primary" @click="exportExcel()">导出Excel</el-button>
+                            <el-button type="primary" @click="openExportList">查看导出列表</el-button>
                         </div>
                     </el-col>
                 </el-row>
@@ -295,8 +391,7 @@ onMounted(async function () {
             <el-card>
                 <div class="bean-info">
                     <!-- 汉字用 <strong> 加粗，动态数据用 <span> 包一层单独改色 -->
-                    <strong>金豆总数：</strong><span class="data-text">{{ beanNum }}</span>
-                    <strong>, 充值金豆数：</strong><span class="data-text">{{ permanentBeans }}</span>
+                    <strong> 充值金豆数：</strong><span class="data-text">{{ beanNum }}</span>
                     <strong>, 合计新币数：</strong><span class="data-text">{{ money }}</span>。
                 </div>
                 <!-- 设置表格容器的高度和滚动样式 -->
@@ -336,13 +431,12 @@ onMounted(async function () {
         </el-col>
     </el-row>
     <!-- 导出弹窗 -->
-    <!-- <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
-    <el-table :data="exportList" style="width: 100%" :loading="exportListLoading">
+    <el-dialog v-model="exportListVisible" title="导出列表" width="80%" class="custom-height-dialog">
+        <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
             <el-table-column prop="fileName" label="文件名" />
             <el-table-column prop="state" label="状态">
                 <template #default="scope">
-          <el-tag :type="getTagType(scope.row.state)"
-                  :effect="scope.row.state === 3 ? 'light' : 'plain'">
+                    <el-tag :type="getTagType(scope.row.state)" :effect="scope.row.state === 3 ? 'light' : 'plain'">
                         {{ getTagText(scope.row.state) }}
                     </el-tag>
                 </template>
@@ -366,6 +460,27 @@ onMounted(async function () {
                 <el-button text @click="exportListVisible = false">关闭</el-button>
             </div>
         </template>
-  </el-dialog> -->
+    </el-dialog>
 </template>
-<style></style>
+<style scoped>
+:deep(.custom-height-dialog .el-dialog__body) {
+  height: 60vh;
+  overflow-y: auto;
+  padding: 15px;
+}
+.bean-info {
+    background-color: #eaf5ff;
+    padding: 12px 16px;
+    border-radius: 6px;
+    font-size: 16px;
+    color: #333;
+}
+
+.bean-info strong {
+    font-weight: 700;
+}
+
+.bean-info .data-text {
+    color: #007bff;
+}
+</style>

src/views/recharge/beanSystemRecharge.vue

@@ -204,6 +204,102 @@ const handleCurrentChange = (value) => {
     get()
 }
 
+//======================导出=======================
+const exportExcel = async () => {
+    const params = {
+        ...getObj.value,
+        "beanRechargeInfo": {
+            ...selectData.value,
+            sortField: sortField.value,
+            sortOrder: sortOrder.value,
+        },
+    }
+    try {
+        const res = await API({ url: '/export', data: params })
+        if (res.code === 200) {
+            ElMessage.success('导出成功')
+        } else {
+            ElMessage.error(res.message || '导出失败，请稍后重试')
+        }
+    } catch (error) {
+        console.log('请求失败', error)
+        ElMessage.error('导出失败，请稍后重试')
+    }
+}
+const exportListVisible = ref(false)
+
+// 打开导出列表弹窗
+const openExportList = () => {
+  getExportList()
+  exportListVisible.value = true
+}
+
+// 导出列表数据
+const exportList = ref([])
+// 导出列表加载状态
+const exportListLoading = ref(false)
+// 获取导出列表
+const getExportList = async () => {
+  exportListLoading.value = true
+  try {
+    const result = await API({url: '/export/export'})
+    if (result.code === 200) {
+    //   const filteredData = result.data.filter(item => {
+    //     return item.type === 2; //2表示金币充值列表
+    //   });
+    //   exportList.value = filteredData
+    exportList.value = result.data
+    } else {
+      ElMessage.error(result.msg || '获取导出列表失败')
+    }
+  } catch (error) {
+    console.error('获取导出列表出错:', error)
+    ElMessage.error('获取导出列表失败，请稍后重试')
+  } finally {
+    exportListLoading.value = false
+  }
+}
+// 下载导出文件
+const downloadExportFile = (item) => {
+  if (item.state === 2) {
+    const link = document.createElement('a')
+    link.href = item.url
+    link.download = item.fileName
+    link.click()
+  } else {
+    ElMessage.warning('文件还在导出中，请稍后再试')
+  }
+}
+//根据状态返回对应的标签类型
+const getTagType = (state) => {
+  switch (state) {
+    case 0:
+      return 'info';
+    case 1:
+      return 'primary';
+    case 2:
+      return 'success';
+    case 3:
+      return 'danger';
+    default:
+      return 'info';
+  }
+}
+//根据状态返回对应的标签文案
+const getTagText = (state) => {
+  switch (state) {
+    case 0:
+      return '待执行';
+    case 1:
+      return '执行中';
+    case 2:
+      return '执行完成';
+    case 3:
+      return '执行出错';
+    default:
+      return '未知状态';
+  }
+}
 onMounted(async function () {
     await get()
     await getArea()
@@ -215,10 +311,10 @@ onMounted(async function () {
         <el-col>
             <el-card style="margin-bottom: 20px;margin-top: 10px">
                 <el-row style="margin-bottom: 10px">
-                    <el-col :span="4">
+                    <el-col :span="3">
                         <div class="head-card-element">
                             <el-text class="mx-1" size="large">精网号：</el-text>
-                            <el-input v-model="selectData.jwcode" placeholder="请输入精网号" style="width: 150px" clearable />
+                            <el-input v-model="selectData.jwcode" placeholder="请输入精网号" style="width: 115px" clearable />
                         </div>
                     </el-col>
                     <el-col :span="4">
@@ -229,7 +325,7 @@ onMounted(async function () {
                             </el-select>
                         </div>
                     </el-col>
-                    <el-col :span="15">
+                    <el-col :span="17">
                         <div class="head-card-element">
                             <el-text class="mx-1" size="large">充值时间：</el-text>
                             <el-date-picker v-model="getTime" type="datetimerange" range-separator="至"
@@ -246,8 +342,8 @@ onMounted(async function () {
                             </el-button>
                             <el-button type="success" @click="reset()">重置</el-button>
                             <el-button type="primary" @click="search()">查询</el-button>
-                            <!-- <el-button type="primary" @click="exportExcel()">导出Excel</el-button>
-              <el-button type="primary" @click="openExportList">查看导出列表</el-button> -->
+                            <el-button type="primary" style="width: 80px;" @click="exportExcel()">导出Excel</el-button>
+                            <el-button type="primary"  style="width: 95px;" @click="openExportList">查看导出列表</el-button>
                         </div>
                     </el-col>
                 </el-row>
@@ -294,8 +390,8 @@ onMounted(async function () {
         </el-col>
     </el-row>
     <!-- 导出弹窗 -->
-    <!-- <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
-    <el-table :data="exportList" style="width: 100%" :loading="exportListLoading">
+    <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
+        <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
       <el-table-column prop="fileName" label="文件名"/>
       <el-table-column prop="state" label="状态">
         <template #default="scope">
@@ -324,9 +420,9 @@ onMounted(async function () {
         <el-button text @click="exportListVisible = false">关闭</el-button>
       </div>
     </template>
-  </el-dialog> -->
+  </el-dialog>
 </template>
-<style>
+<style scoped>
 .bean-info {
     background-color: #eaf5ff;
     padding: 12px 16px;

src/views/recharge/gold/coinRechargeDetail.vue

@@ -658,7 +658,7 @@ const props = {multiple: true}
   </el-row>
   <!-- 导出弹窗 -->
   <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
-    <el-table :data="exportList" style="width: 100%" :loading="exportListLoading">
+        <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
       <el-table-column prop="fileName" label="文件名"/>
       <el-table-column prop="state" label="状态">
         <template #default="scope">

src/views/refund/gold/coinRefundDetail.vue

@@ -785,7 +785,7 @@ const getMarket = async function () {
 
   <!-- 导出弹窗 -->
   <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
-    <el-table :data="exportList" style="width: 100%" :loading="exportListLoading">
+        <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
       <el-table-column prop="fileName" label="文件名"/>
       <el-table-column prop="state" label="状态">
         <template #default="scope">

src/views/usergold/gold/clientCountBalance.vue

@@ -406,17 +406,8 @@ const getMarket = async function () {
           </div>
           <div class="head-card-element">
             <el-text class="mx-1" size="large">所属地区：</el-text>
-            <el-cascader
-                v-model="selectedMarketPath"
-                :options="markets"
-                placeholder="请选择所属地区"
-                clearable
-                collapse-tags
-                collapse-tags-tooltip
-                style="width:180px"
-                @change="handleMarketChange"
-                :props="props"
-            />
+            <el-cascader v-model="selectedMarketPath" :options="markets" placeholder="请选择所属地区" clearable collapse-tags
+              collapse-tags-tooltip style="width:180px" @change="handleMarketChange" :props="props" />
           </div>
           <el-button type="primary" @click="search()">查询</el-button>
           <el-button @click="reset" type="success">重置</el-button>
@@ -540,8 +531,7 @@ const getMarket = async function () {
         <!-- 分页 -->
         <div class="pagination" style="margin-top: 20px">
           <el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]"
-                         layout="total, sizes, prev, pager, next, jumper" :total="total"
-                         @size-change="handlePageSizeChange"
+            layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handlePageSizeChange"
             @current-change="handleCurrentChange"></el-pagination>
         </div>
       </el-card>
@@ -549,7 +539,7 @@ const getMarket = async function () {
   </el-row>
 
   <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
-    <el-table :data="exportList" style="width: 100%" :loading="exportListLoading">
+    <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
       <el-table-column prop="fileName" label="文件名" />
       <el-table-column prop="state" label="状态">
         <template #default="scope">

src/views/usergold/gold/clientCountDetail.vue

@@ -674,7 +674,7 @@ const getMarket = async function () {
 
     <!-- 导出列表弹窗 -->
     <el-dialog v-model="exportListVisible" title="导出列表" width="80%">
-      <el-table :data="exportList" style="width: 100%" :loading="exportListLoading">
+           <el-table :data="exportList" style="width: 100% ;height: 60vh;" :loading="exportListLoading">
         <el-table-column prop="fileName" label="文件名"/>
         <el-table-column prop="state" label="状态">
           <template #default="scope">