feat(miniprogram): migrate mine and all application lists from bx-mobile.

Unify advance/reimburse browsing under workbench view menus with existing detail routes.

Co-authored-by: Cursor <cursoragent@cursor.com>

miniprogram/api/bx.js

@@ -1,6 +1,7 @@
 import { bxRequest, bxUploadFile } from '@/utils/bxRequest'
 
 export const advanceApi = {
+  list: (params) => bxRequest({ url: '/advances/', method: 'GET', params }),
   my: (params) => bxRequest({ url: '/advances/my', method: 'GET', params }),
   getById: (id) => bxRequest({ url: `/advances/${id}`, method: 'GET' }),
   getApprovals: (id) => bxRequest({ url: `/advances/${id}/approvals`, method: 'GET' }),
@@ -14,6 +15,7 @@ export const advanceApi = {
 export const reimburseApi = {
   generateTitle: (params) =>
     bxRequest({ url: '/reimburses/generate-title', method: 'GET', params }),
+  list: (params) => bxRequest({ url: '/reimburses/', method: 'GET', params }),
   my: (params) => bxRequest({ url: '/reimburses/my', method: 'GET', params }),
   getById: (id) => bxRequest({ url: `/reimburses/${id}`, method: 'GET' }),
   getApprovals: (id) => bxRequest({ url: `/reimburses/${id}/approvals`, method: 'GET' }),

miniprogram/pages/bx/all/list.vue

@@ -1,7 +1,431 @@
 <template>
-  <bx-placeholder-page default-title="全部申请单" />
+  <view class="bx-page">
+    <view class="topbar">
+      <view class="topbar-left">
+        <view class="topbar-back" @click="goBack">
+          <text class="topbar-back-icon">‹</text>
+        </view>
+      </view>
+      <text class="topbar-title">全部申请单</text>
+      <view class="topbar-right" />
+    </view>
+
+    <view class="mine-type-tabs stat-scroll mine-type-tabs--triple">
+      <view
+        class="stat-card"
+        :class="{ active: activeTab === 0 }"
+        @click="onBizTab(0)"
+      >
+        <text class="label">全部</text>
+      </view>
+      <view
+        class="stat-card"
+        :class="{ active: activeTab === 1 }"
+        @click="onBizTab(1)"
+      >
+        <text class="label">备用金</text>
+      </view>
+      <view
+        class="stat-card"
+        :class="{ active: activeTab === 2 }"
+        @click="onBizTab(2)"
+      >
+        <text class="label">报销申请</text>
+      </view>
+    </view>
+
+    <view class="search-wrap">
+      <view class="search-box">
+        <text class="search-box__icon">⌕</text>
+        <input
+          class="search-input"
+          v-model="keyword"
+          placeholder="搜索单号 / 申请人"
+          confirm-type="search"
+          @confirm="reload"
+        />
+        <view v-if="keyword.trim()" class="search-box__clear" @click="clearKeyword">×</view>
+      </view>
+    </view>
+
+    <view class="search-wrap" style="padding-top: 0">
+      <scroll-view scroll-x class="search-filter search-filter--scroll" :show-scrollbar="false">
+        <view
+          v-for="opt in statusFilters"
+          :key="opt.value === '' ? '__all' : opt.value"
+          class="filter-tag"
+          :class="{ active: filterStatus === opt.value }"
+          @click="onStatusFilter(opt.value)"
+        >
+          {{ opt.label }}
+        </view>
+      </scroll-view>
+    </view>
+
+    <scroll-view
+      class="page-padded list-scroll"
+      scroll-y
+      :style="{ height: listHeight }"
+      refresher-enabled
+      :refresher-triggered="refreshing"
+      @refresherrefresh="onPullRefresh"
+      @scrolltolower="onLoadMore"
+    >
+      <view v-if="!loading && !displayList.length" class="empty-state empty-state--fill">
+        <text>暂无记录</text>
+      </view>
+
+      <view
+        v-for="item in displayList"
+        :key="item.id + '-' + item.bizType"
+        class="expense-card"
+        @click="goDetail(item)"
+      >
+        <template v-if="item.bizType === '备用金'">
+          <view class="ec-top">
+            <view class="ec-type">
+              <text class="advance-list-card__title">{{ advanceCardTitle(item) }}</text>
+            </view>
+            <text class="advance-ticket-status" :class="ticketHeaderStatusToneClass(item.status)">
+              {{ statusLabel(item.status) }}
+            </text>
+          </view>
+          <view class="ec-amount-label">申请金额</view>
+          <view class="ec-amount">{{ formatAmount(item.amount) }}</view>
+          <view class="advance-card-subs">
+            <view class="advance-card-sub-row">
+              <text class="k">实际发放金额</text>
+              <text class="v">¥ {{ actualIssuedDisplay(item) }}</text>
+            </view>
+            <view class="advance-card-sub-row">
+              <text class="k">实际冲抵</text>
+              <text class="v">¥ {{ formatAmount(advanceOffsetTotal(item)) }}</text>
+            </view>
+          </view>
+          <view class="list-card-kv">
+            <view class="list-card-kv__row">
+              <text class="list-card-kv__k">申请单号</text>
+              <text class="list-card-kv__v">{{ item.applyCode || '—' }}</text>
+            </view>
+            <view class="list-card-kv__row">
+              <text class="list-card-kv__k">申请人</text>
+              <text class="list-card-kv__v">{{ item.applicantName || '-' }}</text>
+            </view>
+            <view v-if="item.departmentName" class="list-card-kv__row">
+              <text class="list-card-kv__k">部门</text>
+              <text class="list-card-kv__v">{{ item.departmentName }}</text>
+            </view>
+            <view v-if="item.currentNode" class="list-card-kv__row">
+              <text class="list-card-kv__k">当前环节</text>
+              <text class="list-card-kv__v">{{ item.currentNode }}</text>
+            </view>
+            <view v-if="item.remark" class="list-card-kv__row">
+              <text class="list-card-kv__k">备注</text>
+              <text class="list-card-kv__v">{{ item.remark }}</text>
+            </view>
+          </view>
+        </template>
+        <template v-else>
+          <view class="ec-top">
+            <view class="ec-type">
+              <text class="reimburse-list-card__title">{{ reimburseCardTitle(item) }}</text>
+            </view>
+            <text class="status-tag" :class="workflowListStatusTagClass(item.status)">
+              {{ statusLabel(item.status) }}
+            </text>
+          </view>
+          <view class="ec-amount-label">报销金额</view>
+          <view class="ec-amount">{{ formatAmount(item.amount) }}</view>
+          <view class="reimburse-card-subs">
+            <view class="reimburse-card-sub-row">
+              <text class="k">冲抵金额</text>
+              <text class="v">¥ {{ moneyOrDash(item.offsetAmount ?? item.offset_amount) }}</text>
+            </view>
+            <view class="reimburse-card-sub-row">
+              <text class="k">实付金额</text>
+              <text class="v">
+                ¥ {{ moneyOrDash(item.payAmount ?? item.actualAmount ?? item.actual_amount) }}
+              </text>
+            </view>
+          </view>
+          <view class="list-card-kv">
+            <view class="list-card-kv__row">
+              <text class="list-card-kv__k">申请单号</text>
+              <text class="list-card-kv__v">{{ item.applyCode || '—' }}</text>
+            </view>
+            <view class="list-card-kv__row">
+              <text class="list-card-kv__k">申请人</text>
+              <text class="list-card-kv__v">{{ item.applicantName || '-' }}</text>
+            </view>
+            <view v-if="item.departmentName" class="list-card-kv__row">
+              <text class="list-card-kv__k">部门</text>
+              <text class="list-card-kv__v">{{ item.departmentName }}</text>
+            </view>
+            <view v-if="item.currentNode" class="list-card-kv__row">
+              <text class="list-card-kv__k">当前环节</text>
+              <text class="list-card-kv__v">{{ item.currentNode }}</text>
+            </view>
+            <view
+              v-if="resolveExpenseDisplay(item, flatList) !== '-'"
+              class="list-card-kv__row"
+            >
+              <text class="list-card-kv__k">费用项目</text>
+              <text class="list-card-kv__v">{{ resolveExpenseDisplay(item, flatList) }}</text>
+            </view>
+            <view class="list-card-kv__row">
+              <text class="list-card-kv__k">发票 / 附件</text>
+              <text class="list-card-kv__v">
+                {{ item.invoiceCount ?? 0 }} 张 · {{ item.attachCount ?? 0 }} 个
+              </text>
+            </view>
+            <view v-if="item.remark" class="list-card-kv__row">
+              <text class="list-card-kv__k">备注</text>
+              <text class="list-card-kv__v">{{ item.remark }}</text>
+            </view>
+          </view>
+        </template>
+        <view class="ec-meta">
+          <text>{{ formatApplyDateTime(item) }}</text>
+        </view>
+        <view class="ec-bottom all-list-card__bottom" @click.stop>
+          <view class="op-actions">
+            <button class="btn btn-sm btn-primary" @click="goDetail(item)">查看</button>
+          </view>
+        </view>
+      </view>
+
+      <view v-if="displayList.length" class="list-footer-tip">
+        {{ finished ? '没有更多了' : loading ? '加载中...' : '上拉加载更多' }}
+      </view>
+    </scroll-view>
+  </view>
 </template>
 
 <script setup>
-import BxPlaceholderPage from '@/components/bx-ui/bx-placeholder-page.vue'
+import { ref, computed } from 'vue'
+import { onShow } from '@dcloudio/uni-app'
+import { PAGE_PATHS } from '@/config/api'
+import { advanceApi, reimburseApi, expenseItemApi } from '@/api/bx'
+import {
+  statusLabel,
+  ticketHeaderStatusToneClass,
+  workflowListStatusTagClass,
+  formatAmount,
+  formatApplyDateTime,
+  pickApplyTime,
+  flattenExpenseTree,
+  normalizeExpenseItem,
+  resolveExpenseDisplay
+} from '@/utils/bxFormat'
+
+const statusFilters = [
+  { label: '全部', value: '' },
+  { label: '待提交', value: 'draft' },
+  { label: '审批中', value: 'pending' },
+  { label: '已通过', value: 'approved' },
+  { label: '已驳回', value: 'rejected' },
+  { label: '已发放', value: 'issued' },
+  { label: '已支付', value: 'paid' },
+  { label: '已冲抵', value: 'offset' }
+]
+
+const activeTab = ref(0)
+const keyword = ref('')
+const filterStatus = ref('')
+const allRows = ref([])
+const loading = ref(false)
+const refreshing = ref(false)
+const finished = ref(false)
+const displayPage = ref(1)
+const displayPageSize = 20
+const listHeight = ref('55vh')
+const flatList = ref([])
+
+const displayList = computed(() => {
+  const end = displayPage.value * displayPageSize
+  return allRows.value.slice(0, end)
+})
+
+function computeListHeight() {
+  try {
+    const sys = uni.getSystemInfoSync()
+    const h = (sys.windowHeight || 600) - 260
+    listHeight.value = `${Math.max(h, 280)}px`
+  } catch (e) {
+    listHeight.value = '55vh'
+  }
+}
+
+function advanceCardTitle(item) {
+  const r = (item.reason ?? '').toString().trim()
+  if (r) return r
+  const p = (item.purpose ?? '').toString().trim()
+  return p || '—'
+}
+
+function reimburseCardTitle(item) {
+  const t = (item.title ?? '').toString().trim()
+  if (t) return t
+  const ex = resolveExpenseDisplay(item, flatList.value)
+  return ex !== '-' ? ex : '—'
+}
+
+function actualIssuedDisplay(item) {
+  const raw = item.actualAmount ?? item.actual_amount
+  if (raw == null || raw === '') return '—'
+  const n = typeof raw === 'string' ? parseFloat(raw) : Number(raw)
+  if (Number.isNaN(n)) return '—'
+  return formatAmount(n)
+}
+
+function advanceOffsetTotal(item) {
+  const raw = item.offsetAmount ?? item.offset_amount ?? 0
+  const n = typeof raw === 'string' ? parseFloat(raw) : Number(raw)
+  return Number.isNaN(n) ? 0 : n
+}
+
+function moneyOrDash(raw) {
+  if (raw == null || raw === '') return '—'
+  const n = typeof raw === 'string' ? parseFloat(raw) : Number(raw)
+  if (Number.isNaN(n) || n === 0) return '—'
+  return formatAmount(n)
+}
+
+function mapAdvances(rows) {
+  return (rows || []).map((r) => ({
+    ...r,
+    bizType: '备用金',
+    applyCode: r.applyCode || r.code,
+    applicantName: r.applicantName || r.user
+  }))
+}
+
+function mapReimburses(rows) {
+  return (rows || []).map((r) => ({
+    ...r,
+    bizType: '报销申请',
+    applyCode: r.applyCode || r.code,
+    applicantName: r.applicantName || r.user
+  }))
+}
+
+function extractRows(res) {
+  return res?.data?.rows || res?.data?.items || []
+}
+
+function syncFinished() {
+  finished.value = displayList.value.length >= allRows.value.length
+}
+
+async function ensureExpenseFlat() {
+  if (flatList.value.length) return
+  try {
+    const res = await expenseItemApi.tree()
+    const tree = (res.data || []).map(normalizeExpenseItem)
+    flatList.value = flattenExpenseTree(tree)
+  } catch (e) {
+    flatList.value = []
+  }
+}
+
+async function loadAllData() {
+  const kw = keyword.value.trim()
+  const params = { page: 1, pageSize: 280 }
+  if (filterStatus.value) params.status = filterStatus.value
+  if (kw) params.keyword = kw
+
+  loading.value = true
+  try {
+    if (activeTab.value === 1) {
+      const advRes = await advanceApi.list(params)
+      allRows.value = mapAdvances(extractRows(advRes))
+      return
+    }
+    if (activeTab.value === 2) {
+      const reimRes = await reimburseApi.list(params)
+      allRows.value = mapReimburses(extractRows(reimRes))
+      return
+    }
+    const [advRes, reimRes] = await Promise.all([
+      advanceApi.list(params),
+      reimburseApi.list(params)
+    ])
+    const merged = [
+      ...mapAdvances(extractRows(advRes)),
+      ...mapReimburses(extractRows(reimRes))
+    ]
+    merged.sort((a, b) => {
+      const tA = new Date(pickApplyTime(a) || 0).getTime()
+      const tB = new Date(pickApplyTime(b) || 0).getTime()
+      return tB - tA
+    })
+    allRows.value = merged
+  } catch (e) {
+    allRows.value = []
+  } finally {
+    loading.value = false
+    refreshing.value = false
+  }
+}
+
+async function reload() {
+  displayPage.value = 1
+  await loadAllData()
+  syncFinished()
+}
+
+function onPullRefresh() {
+  refreshing.value = true
+  reload()
+}
+
+function onLoadMore() {
+  if (finished.value || loading.value) return
+  if (displayList.value.length < allRows.value.length) {
+    displayPage.value += 1
+    syncFinished()
+  } else {
+    finished.value = true
+  }
+}
+
+async function onBizTab(tab) {
+  if (activeTab.value === tab) return
+  activeTab.value = tab
+  await reload()
+}
+
+async function onStatusFilter(value) {
+  filterStatus.value = value
+  await reload()
+}
+
+function clearKeyword() {
+  keyword.value = ''
+  reload()
+}
+
+function goBack() {
+  uni.navigateBack({ fail: () => uni.switchTab({ url: PAGE_PATHS.workbench }) })
+}
+
+function goDetail(item) {
+  const path =
+    item.bizType === '备用金' ? PAGE_PATHS.bxAdvanceDetail : PAGE_PATHS.bxReimburseDetail
+  uni.navigateTo({ url: `${path}?id=${item.id}` })
+}
+
+onShow(async () => {
+  computeListHeight()
+  await ensureExpenseFlat()
+  await reload()
+})
 </script>
+
+<style lang="scss">
+@import '@/styles/bx-theme.scss';
+
+.list-scroll {
+  box-sizing: border-box;
+}
+</style>

miniprogram/pages/bx/mine/list.vue

@@ -1,7 +1,471 @@
 <template>
-  <bx-placeholder-page default-title="我的申请单" />
+  <view class="bx-page">
+    <view class="topbar">
+      <view class="topbar-left">
+        <view class="topbar-back" @click="goBack">
+          <text class="topbar-back-icon">‹</text>
+        </view>
+      </view>
+      <text class="topbar-title">我的申请单</text>
+      <view class="topbar-right" />
+    </view>
+
+    <view class="fab-add" @click="onFabAdd">+</view>
+
+    <view class="mine-type-tabs stat-scroll">
+      <view
+        class="stat-card"
+        :class="{ active: activeBiz === 'advance' }"
+        @click="onBizChange('advance')"
+      >
+        <text class="label">备用金</text>
+      </view>
+      <view
+        class="stat-card"
+        :class="{ active: activeBiz === 'reimburse' }"
+        @click="onBizChange('reimburse')"
+      >
+        <text class="label">报销申请</text>
+      </view>
+    </view>
+
+    <view class="search-wrap">
+      <view class="search-box">
+        <text class="search-box__icon">⌕</text>
+        <input
+          class="search-input"
+          v-model="keyword"
+          placeholder="搜索单号/标题/原因"
+          confirm-type="search"
+          @confirm="onRefresh"
+        />
+        <view v-if="keyword.trim()" class="search-box__clear" @click="clearKeyword">×</view>
+      </view>
+    </view>
+
+    <view class="search-wrap" style="padding-top: 0">
+      <scroll-view scroll-x class="search-filter search-filter--scroll" :show-scrollbar="false">
+        <view
+          v-for="opt in statusFilters"
+          :key="opt.value === '' ? '__all' : opt.value"
+          class="filter-tag"
+          :class="{ active: statusFilter === opt.value }"
+          @click="onStatusChange(opt.value)"
+        >
+          {{ opt.label }}
+        </view>
+      </scroll-view>
+    </view>
+
+    <scroll-view
+      class="page-padded list-scroll"
+      scroll-y
+      :style="{ height: listHeight }"
+      refresher-enabled
+      :refresher-triggered="refreshing"
+      @refresherrefresh="onPullRefresh"
+      @scrolltolower="onLoadMore"
+    >
+      <view v-if="!list.length && !loading" class="empty-state empty-state--fill">
+        <text>{{ activeBiz === 'advance' ? '暂无备用金申请' : '暂无报销申请' }}</text>
+      </view>
+
+      <!-- 备用金卡片 -->
+      <template v-if="activeBiz === 'advance'">
+        <view
+          v-for="item in list"
+          :key="'adv-' + item.id"
+          class="expense-card"
+          @click="goDetail(item, 'advance')"
+        >
+          <view class="ec-top">
+            <view class="ec-type">
+              <text class="advance-list-card__title">{{ advanceCardTitle(item) }}</text>
+            </view>
+            <text class="status-tag" :class="workflowListStatusTagClass(item.status)">
+              {{ statusLabel(item.status) }}
+            </text>
+          </view>
+          <view class="ec-amount-label">申请金额</view>
+          <view class="ec-amount">{{ formatAmount(item.amount) }}</view>
+          <view class="advance-card-subs">
+            <view class="advance-card-sub-row">
+              <text class="k">实际发放金额</text>
+              <text class="v">¥ {{ actualIssuedDisplay(item) }}</text>
+            </view>
+            <view class="advance-card-sub-row">
+              <text class="k">实际冲抵</text>
+              <text class="v">¥ {{ formatAmount(advanceOffsetTotal(item)) }}</text>
+            </view>
+          </view>
+          <view class="list-card-kv">
+            <view class="list-card-kv__row">
+              <text class="list-card-kv__k">申请单号</text>
+              <text class="list-card-kv__v">{{ item.applyCode || item.code || '—' }}</text>
+            </view>
+            <view class="list-card-kv__row">
+              <text class="list-card-kv__k">申请人</text>
+              <text class="list-card-kv__v">{{ item.applicantName || '—' }}</text>
+            </view>
+            <view v-if="item.currentNode" class="list-card-kv__row">
+              <text class="list-card-kv__k">当前环节</text>
+              <text class="list-card-kv__v">{{ item.currentNode }}</text>
+            </view>
+            <view v-if="item.remark" class="list-card-kv__row">
+              <text class="list-card-kv__k">备注</text>
+              <text class="list-card-kv__v">{{ item.remark }}</text>
+            </view>
+          </view>
+          <view class="ec-meta">
+            <text>{{ formatApplyDateTime(item) }}</text>
+          </view>
+          <view class="ec-bottom" @click.stop>
+            <view v-if="item.status === 'draft'" class="op-actions">
+              <button class="btn btn-sm btn-danger" @click="handleDelete(item, 'advance')">
+                删除
+              </button>
+              <button class="btn btn-sm btn-primary" @click="handleSubmit(item, 'advance')">
+                提交
+              </button>
+            </view>
+            <view v-else-if="item.status === 'rejected'" class="op-actions">
+              <button class="btn btn-sm btn-primary" @click="goDetail(item, 'advance')">
+                查看
+              </button>
+              <button class="btn btn-sm btn-primary" @click="handleSubmit(item, 'advance')">
+                重新提交
+              </button>
+            </view>
+            <view v-else class="op-actions">
+              <button class="btn btn-sm btn-primary" @click="goDetail(item, 'advance')">
+                查看
+              </button>
+            </view>
+          </view>
+        </view>
+      </template>
+
+      <!-- 报销卡片 -->
+      <template v-else>
+        <view
+          v-for="item in list"
+          :key="'reim-' + item.id"
+          class="expense-card"
+          @click="goDetail(item, 'reimburse')"
+        >
+          <view class="ec-top">
+            <view class="ec-type">
+              <text class="reimburse-list-card__title">{{ reimburseCardTitle(item) }}</text>
+            </view>
+            <text class="status-tag" :class="workflowListStatusTagClass(item.status)">
+              {{ statusLabel(item.status) }}
+            </text>
+          </view>
+          <view class="ec-amount-label">报销金额</view>
+          <view class="ec-amount">{{ formatAmount(item.amount) }}</view>
+          <view class="reimburse-card-subs">
+            <view class="reimburse-card-sub-row">
+              <text class="k">冲抵金额</text>
+              <text class="v">¥ {{ moneyOrDash(item.offsetAmount ?? item.offset_amount) }}</text>
+            </view>
+            <view class="reimburse-card-sub-row">
+              <text class="k">实付金额</text>
+              <text class="v">
+                ¥ {{ moneyOrDash(item.payAmount ?? item.actualAmount ?? item.actual_amount) }}
+              </text>
+            </view>
+          </view>
+          <view class="list-card-kv">
+            <view class="list-card-kv__row">
+              <text class="list-card-kv__k">申请单号</text>
+              <text class="list-card-kv__v">{{ item.applyCode || item.code || '—' }}</text>
+            </view>
+            <view class="list-card-kv__row">
+              <text class="list-card-kv__k">申请人</text>
+              <text class="list-card-kv__v">{{ item.applicantName || '—' }}</text>
+            </view>
+            <view
+              v-if="resolveExpenseDisplay(item, flatList) !== '-'"
+              class="list-card-kv__row"
+            >
+              <text class="list-card-kv__k">费用项目</text>
+              <text class="list-card-kv__v">{{ resolveExpenseDisplay(item, flatList) }}</text>
+            </view>
+            <view v-if="item.currentNode" class="list-card-kv__row">
+              <text class="list-card-kv__k">当前环节</text>
+              <text class="list-card-kv__v">{{ item.currentNode }}</text>
+            </view>
+            <view class="list-card-kv__row">
+              <text class="list-card-kv__k">发票 / 附件</text>
+              <text class="list-card-kv__v">
+                {{ item.invoiceCount ?? 0 }} 张 · {{ item.attachCount ?? 0 }} 个
+              </text>
+            </view>
+            <view v-if="item.remark" class="list-card-kv__row">
+              <text class="list-card-kv__k">备注</text>
+              <text class="list-card-kv__v">{{ item.remark }}</text>
+            </view>
+          </view>
+          <view class="ec-meta">
+            <text>{{ formatApplyDateTime(item) }}</text>
+          </view>
+          <view class="ec-bottom" @click.stop>
+            <view v-if="item.status === 'draft'" class="op-actions">
+              <button class="btn btn-sm btn-danger" @click="handleDelete(item, 'reimburse')">
+                删除
+              </button>
+              <button class="btn btn-sm btn-primary" @click="handleSubmit(item, 'reimburse')">
+                提交
+              </button>
+            </view>
+            <view v-else-if="item.status === 'rejected'" class="op-actions">
+              <button class="btn btn-sm btn-primary" @click="goDetail(item, 'reimburse')">
+                查看
+              </button>
+              <button class="btn btn-sm btn-primary" @click="handleSubmit(item, 'reimburse')">
+                重新提交
+              </button>
+            </view>
+            <view v-else class="op-actions">
+              <button class="btn btn-sm btn-primary" @click="goDetail(item, 'reimburse')">
+                查看
+              </button>
+            </view>
+          </view>
+        </view>
+      </template>
+
+      <view v-if="list.length" class="list-footer-tip">
+        {{ finished ? '没有更多了' : loading ? '加载中...' : '上拉加载更多' }}
+      </view>
+    </scroll-view>
+  </view>
 </template>
 
 <script setup>
-import BxPlaceholderPage from '@/components/bx-ui/bx-placeholder-page.vue'
+import { ref } from 'vue'
+import { onShow } from '@dcloudio/uni-app'
+import { PAGE_PATHS } from '@/config/api'
+import { advanceApi, reimburseApi, expenseItemApi } from '@/api/bx'
+import {
+  statusLabel,
+  workflowListStatusTagClass,
+  formatAmount,
+  formatApplyDateTime,
+  flattenExpenseTree,
+  normalizeExpenseItem,
+  resolveExpenseDisplay
+} from '@/utils/bxFormat'
+
+const statusFilters = [
+  { label: '全部', value: '' },
+  { label: '待提交', value: 'draft' },
+  { label: '审批中', value: 'pending' },
+  { label: '已通过', value: 'approved' },
+  { label: '已驳回', value: 'rejected' },
+  { label: '已发放', value: 'issued' },
+  { label: '已支付', value: 'paid' },
+  { label: '已冲抵', value: 'offset' }
+]
+
+const activeBiz = ref('advance')
+const keyword = ref('')
+const statusFilter = ref('')
+const list = ref([])
+const loading = ref(false)
+const finished = ref(false)
+const refreshing = ref(false)
+const currentPage = ref(1)
+const pageSize = 20
+const listHeight = ref('55vh')
+const flatList = ref([])
+
+function computeListHeight() {
+  try {
+    const sys = uni.getSystemInfoSync()
+    const h = (sys.windowHeight || 600) - 260
+    listHeight.value = `${Math.max(h, 280)}px`
+  } catch (e) {
+    listHeight.value = '55vh'
+  }
+}
+
+function advanceCardTitle(item) {
+  const r = (item.reason ?? '').toString().trim()
+  if (r) return r
+  const p = (item.purpose ?? '').toString().trim()
+  return p || '—'
+}
+
+function reimburseCardTitle(item) {
+  const t = (item.title ?? '').toString().trim()
+  if (t) return t
+  const ex = resolveExpenseDisplay(item, flatList.value)
+  return ex !== '-' ? ex : '—'
+}
+
+function actualIssuedDisplay(item) {
+  const raw = item.actualAmount ?? item.actual_amount
+  if (raw == null || raw === '') return '—'
+  const n = typeof raw === 'string' ? parseFloat(raw) : Number(raw)
+  if (Number.isNaN(n)) return '—'
+  return formatAmount(n)
+}
+
+function advanceOffsetTotal(item) {
+  const raw = item.offsetAmount ?? item.offset_amount ?? 0
+  const n = typeof raw === 'string' ? parseFloat(raw) : Number(raw)
+  return Number.isNaN(n) ? 0 : n
+}
+
+function moneyOrDash(raw) {
+  if (raw == null || raw === '') return '—'
+  const n = typeof raw === 'string' ? parseFloat(raw) : Number(raw)
+  if (Number.isNaN(n) || n === 0) return '—'
+  return formatAmount(n)
+}
+
+async function ensureExpenseFlat() {
+  if (flatList.value.length) return
+  try {
+    const res = await expenseItemApi.tree()
+    const tree = (res.data || []).map(normalizeExpenseItem)
+    flatList.value = flattenExpenseTree(tree)
+  } catch (e) {
+    flatList.value = []
+  }
+}
+
+async function fetchPage() {
+  if (loading.value && !refreshing.value) return
+  loading.value = true
+  try {
+    const params = {
+      page: currentPage.value,
+      pageSize
+    }
+    if (statusFilter.value) params.status = statusFilter.value
+    if (keyword.value.trim()) params.keyword = keyword.value.trim()
+    const api = activeBiz.value === 'advance' ? advanceApi : reimburseApi
+    const res = await api.my(params)
+    const rows = res.data?.rows || res.data?.items || []
+    const total = res.data?.total || 0
+    if (currentPage.value === 1) {
+      list.value = rows
+    } else {
+      list.value = list.value.concat(rows)
+    }
+    currentPage.value += 1
+    finished.value = rows.length < pageSize || list.value.length >= total
+  } catch (e) {
+    finished.value = true
+  } finally {
+    loading.value = false
+    refreshing.value = false
+  }
+}
+
+function onRefresh() {
+  currentPage.value = 1
+  finished.value = false
+  loading.value = false
+  list.value = []
+  fetchPage()
+}
+
+function onPullRefresh() {
+  refreshing.value = true
+  currentPage.value = 1
+  finished.value = false
+  fetchPage()
+}
+
+function onLoadMore() {
+  if (finished.value || loading.value) return
+  fetchPage()
+}
+
+function onBizChange(biz) {
+  if (activeBiz.value === biz) return
+  activeBiz.value = biz
+  onRefresh()
+}
+
+function onStatusChange(value) {
+  statusFilter.value = value
+  onRefresh()
+}
+
+function clearKeyword() {
+  keyword.value = ''
+  onRefresh()
+}
+
+function goBack() {
+  uni.navigateBack({ fail: () => uni.switchTab({ url: PAGE_PATHS.workbench }) })
+}
+
+function onFabAdd() {
+  uni.showActionSheet({
+    itemList: ['备用金申请', '报销申请'],
+    success: (res) => {
+      if (res.tapIndex === 0) {
+        uni.navigateTo({ url: PAGE_PATHS.bxAdvanceApplyForm })
+      } else if (res.tapIndex === 1) {
+        uni.navigateTo({ url: PAGE_PATHS.bxReimburseApplyForm })
+      }
+    }
+  })
+}
+
+function goDetail(item, biz) {
+  const path =
+    biz === 'advance' ? PAGE_PATHS.bxAdvanceDetail : PAGE_PATHS.bxReimburseDetail
+  uni.navigateTo({ url: `${path}?id=${item.id}` })
+}
+
+async function handleSubmit(item, biz) {
+  try {
+    const api = biz === 'advance' ? advanceApi : reimburseApi
+    await api.submit(item.id)
+    uni.showToast({ title: '提交成功', icon: 'success' })
+    onRefresh()
+  } catch (e) {
+    // toasted
+  }
+}
+
+function handleDelete(item, biz) {
+  uni.showModal({
+    title: '删除确认',
+    content: '确定要删除该申请单吗？删除后不可恢复。',
+    confirmText: '确定删除',
+    confirmColor: '#ef4444',
+    success: async (res) => {
+      if (!res.confirm) return
+      try {
+        const api = biz === 'advance' ? advanceApi : reimburseApi
+        await api.delete(item.id)
+        uni.showToast({ title: '删除成功', icon: 'success' })
+        onRefresh()
+      } catch (e) {
+        // toasted
+      }
+    }
+  })
+}
+
+onShow(async () => {
+  computeListHeight()
+  await ensureExpenseFlat()
+  onRefresh()
+})
 </script>
+
+<style lang="scss">
+@import '@/styles/bx-theme.scss';
+
+.list-scroll {
+  box-sizing: border-box;
+}
+</style>

miniprogram/styles/bx-theme.scss

@@ -1232,3 +1232,54 @@
   padding-top: 12px;
   border-top: 1px solid var(--border);
 }
+
+/* 我的/全部：业务类型切换卡片 */
+.bx-page .mine-type-tabs.stat-scroll {
+  display: flex;
+  justify-content: center;
+  align-items: stretch;
+  gap: 12px;
+  padding: 10px 16px 8px;
+  overflow-x: visible;
+}
+
+.bx-page .mine-type-tabs .stat-card {
+  flex-shrink: 0;
+  width: auto;
+  min-width: 120px;
+  padding: 16px 22px;
+  border: none;
+  border-radius: var(--r);
+  background: var(--surface);
+  box-shadow: var(--shadow);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.bx-page .mine-type-tabs--triple .stat-card {
+  min-width: 100px;
+  padding: 14px 14px;
+}
+
+.bx-page .mine-type-tabs .stat-card.active {
+  background: var(--primary-bg);
+}
+
+.bx-page .mine-type-tabs .stat-card .label {
+  font-size: 16px;
+  font-weight: 600;
+  color: var(--text);
+}
+
+.bx-page .mine-type-tabs--triple .stat-card .label {
+  font-size: 15px;
+}
+
+.bx-page .mine-type-tabs .stat-card.active .label {
+  color: var(--primary-dark);
+}
+
+.bx-page .all-list-card__bottom {
+  justify-content: flex-end;
+}