Przeglądaj źródła

feat: 转账记录筛选表单增加时间范围选择器,控件加宽,创建时间列格式化为东8

alphaH 2 tygodni temu
rodzic
commit
513395fed5
1 zmienionych plików z 40 dodań i 5 usunięć
  1. 40 5
      frontend/src/views/module_payment/account/index.vue

+ 40 - 5
frontend/src/views/module_payment/account/index.vue

@@ -298,10 +298,10 @@
             <div class="mb-4">
               <el-form :inline="true" :model="transferSearchForm">
                 <el-form-item label="订单号">
-                  <el-input v-model="transferSearchForm.out_biz_no" placeholder="请输入订单号" clearable />
+                  <el-input v-model="transferSearchForm.out_biz_no" placeholder="请输入订单号" clearable style="width: 220px" />
                 </el-form-item>
                 <el-form-item label="状态">
-                  <el-select v-model="transferSearchForm.status" placeholder="请选择状态" clearable>
+                  <el-select v-model="transferSearchForm.status" placeholder="请选择状态" clearable style="width: 180px">
                     <el-option label="处理中" value="DEALING" />
                     <el-option label="成功" value="SUCCESS" />
                     <el-option label="失败" value="FAIL" />
@@ -309,15 +309,27 @@
                   </el-select>
                 </el-form-item>
                 <el-form-item v-if="is_platform_user" label="租户">
-                  <el-select v-model="transferSearchForm.tenant_id" placeholder="选择租户" clearable filterable>
+                  <el-select v-model="transferSearchForm.tenant_id" placeholder="选择租户" clearable filterable style="width: 180px">
                     <el-option v-for="t in allTenantData" :key="t.id" :label="t.name" :value="t.id" />
                   </el-select>
                 </el-form-item>
                 <el-form-item label="企业">
-                  <el-select v-model="transferSearchForm.enterprise_id" placeholder="选择企业" clearable filterable>
+                  <el-select v-model="transferSearchForm.enterprise_id" placeholder="选择企业" clearable filterable style="width: 180px">
                     <el-option v-for="e in enterpriseStore.getEnterpriseList" :key="e.enterprise_id" :label="e.name" :value="e.enterprise_id" />
                   </el-select>
                 </el-form-item>
+                <el-form-item label="时间范围">
+                  <el-date-picker
+                    v-model="transferSearchForm.dateRange"
+                    type="daterange"
+                    range-separator="至"
+                    start-placeholder="开始日期"
+                    end-placeholder="结束日期"
+                    value-format="YYYY-MM-DD"
+                    style="width: 280px"
+                    @change="handleTransferDateChange"
+                  />
+                </el-form-item>
                 <el-form-item>
                   <el-button type="primary" @click="handleTransferSearch">查询</el-button>
                   <el-button @click="handleTransferSearchReset">重置</el-button>
@@ -350,7 +362,11 @@
                 </template>
               </el-table-column>
               <el-table-column prop="order_title" label="转账标题" min-width="150" />
-              <el-table-column prop="created_time" label="创建时间" min-width="160" />
+              <el-table-column prop="created_time" label="创建时间" min-width="160">
+                <template #default="{ row }">
+                  {{ row.created_time ? dayjs(row.created_time).format("YYYY-MM-DD HH:mm:ss") : "" }}
+                </template>
+              </el-table-column>
               <el-table-column label="操作" width="160" fixed="right">
                 <template #default="{ row }">
                   <el-button type="primary" link @click="handleViewTransferDetail(row.out_biz_no)">
@@ -783,6 +799,7 @@ import { Refresh, Loading, Plus, QuestionFilled } from "@element-plus/icons-vue"
 import { ElMessage, ElMessageBox } from "element-plus";
 import type { FormInstance, FormRules } from "element-plus";
 import * as ExcelJS from "exceljs";
+import dayjs from "dayjs";
 
 const enterpriseStore = useEnterpriseStore();
 const userStore = useUserStore();
@@ -1160,6 +1177,9 @@ const transferSearchForm = reactive({
   status: "",
   tenant_id: undefined as number | undefined,
   enterprise_id: undefined as string | undefined,
+  dateRange: null as string[] | null,
+  start_time: undefined as string | undefined,
+  end_time: undefined as string | undefined,
 });
 
 const allTenantData = ref<TenantTable[]>([]);
@@ -1759,11 +1779,24 @@ async function handleTransferSearch() {
   await fetchTransferList();
 }
 
+function handleTransferDateChange() {
+  if (transferSearchForm.dateRange && transferSearchForm.dateRange.length === 2) {
+    transferSearchForm.start_time = (transferSearchForm.dateRange as any)[0];
+    transferSearchForm.end_time = (transferSearchForm.dateRange as any)[1];
+  } else {
+    transferSearchForm.start_time = undefined;
+    transferSearchForm.end_time = undefined;
+  }
+}
+
 function handleTransferSearchReset() {
   transferSearchForm.out_biz_no = "";
   transferSearchForm.status = "";
   transferSearchForm.tenant_id = undefined;
   transferSearchForm.enterprise_id = undefined;
+  transferSearchForm.dateRange = null;
+  transferSearchForm.start_time = undefined;
+  transferSearchForm.end_time = undefined;
   handleTransferSearch();
 }
 
@@ -1777,6 +1810,8 @@ async function fetchTransferList() {
       status: transferSearchForm.status || undefined,
       tenant_id: transferSearchForm.tenant_id || undefined,
       enterprise_id: transferSearchForm.enterprise_id || undefined,
+      start_time: transferSearchForm.start_time || undefined,
+      end_time: transferSearchForm.end_time || undefined,
     });
     transferList.value = res.data.data?.items || res.data.data?.list || [];
     transferPage.total = res.data.data.total || 0;