feat(团队账单页): 对接接口（数据不全），调整样式

src/views/TeamBillView.vue

@@ -52,42 +52,22 @@
         </div>
 
         <!-- 账单列表 -->
-        <div v-else-if="billList.length > 0" class="bill-list">
-          <div
+        <div
+          v-else-if="billList.length > 0"
+          style="display: flex; flex-direction: column; gap: 12px"
+        >
+          <!-- 列表项 -->
+          <workReportBox
             v-for="bill in billList"
             :key="bill.id"
-            class="bill-item"
-            @click="showBillDetail(bill)"
-          >
-            <div class="bill-header">
-              <span class="bill-period">{{ bill.billTitle }}</span>
-              <span :class="['bill-status', getStatusClass(bill.status)]">
-                {{ getStatusText(bill.status) }}
-              </span>
-            </div>
-
-            <div class="bill-details">
-              <div class="bill-row">
-                <span class="bill-label">Create Time:</span>
-                <span class="bill-value">{{ bill.createTimeFormatted }}</span>
-              </div>
-
-              <div class="bill-row">
-                <span class="bill-label">Period:</span>
-                <span class="bill-value">{{ bill.billBelong }}</span>
-              </div>
-
-              <div class="bill-row">
-                <span class="bill-label">Last Update:</span>
-                <span class="bill-value">{{ bill.updateTimeFormatted }}</span>
-              </div>
-            </div>
-
-            <div class="more-btn">
-              <span>More</span>
-              <span class="arrow">></span>
-            </div>
-          </div>
+            :type="getStatusText(bill.status)"
+            :date="bill.date"
+            :target="bill.target"
+            :salary="bill.salary"
+            :days="bill.timeDays"
+            more="true"
+            @showMore="showBillDetail(bill)"
+          ></workReportBox>
         </div>
 
         <!-- 空数据状态 -->
@@ -169,7 +149,13 @@
 import { ref, onMounted } from 'vue'
 import MobileHeader from '../components/MobileHeader.vue'
 import TeamBillMore from '../components/team/TeamBillMore.vue'
-import { getTeamBill, getTeamBillWorkMembers, formatBillStatus } from '../api/teamBill.js'
+import { getUserIdentity } from '@/api/wallet.js'
+import {
+  getTeamBill,
+  getTeamBillWorkMembers,
+  formatBillStatus,
+  getTeamReleasePolicy,
+} from '../api/teamBill.js'
 import { getTeamId } from '@/utils/userStore.js'
 
 const loading = ref(false)
@@ -177,6 +163,10 @@ const showHelpModal = ref(false)
 const showDetailModal = ref(false)
 const selectedBill = ref(null)
 
+// 等级政策
+const policyData = ref(null)
+const loadingPolicy = ref(false)
+
 // 数据
 const billList = ref([])
 const selectedBillMembers = ref([])
@@ -188,9 +178,25 @@ const fetchTeamBill = async (teamId) => {
     const response = await getTeamBill(teamId)
 
     if (response.status && response.body) {
+      const userIdentity = await getUserIdentity()
       billList.value = response.body.map((bill) => ({
         ...bill,
         // 将时间戳转换为可读格式
+        date: `${bill.billBelong.toString().substring(0, 4)}.${bill.billBelong
+          .toString()
+          .substring(4, 6)}`,
+        target: getTargetLevel(bill.target?.acceptGiftValue), // 使用政策数据计算等级
+        salary:
+          formatSalaryValue(
+            userIdentity.body?.agent
+              ? (bill.target?.settlementResult?.ownSalary || 0) +
+                  (bill.target?.settlementResult?.memberSalary || 0)
+              : userIdentity.body?.anchor
+              ? bill.target?.settlementResult?.memberSalary
+              : null
+          ) || '-',
+        totalSalary: formatSalaryValue(bill.target?.settlementResult?.totalSalary) || '-',
+        timeDays: bill.target?.effectiveDay || '-',
         createTimeFormatted: new Date(bill.createTime).toLocaleDateString(),
         updateTimeFormatted: new Date(bill.updateTime).toLocaleDateString(),
       }))
@@ -202,6 +208,65 @@ const fetchTeamBill = async (teamId) => {
   }
 }
 
+// 获取政策数据
+const fetchPolicyData = async () => {
+  try {
+    loadingPolicy.value = true
+    const teamId = getTeamId()
+    if (!teamId) {
+      console.warn('No team ID available')
+      return
+    }
+
+    const response = await getTeamReleasePolicy(teamId)
+    if (response && response.status && response.body) {
+      policyData.value = response.body
+      console.debug('Policy data loaded:', policyData.value)
+    }
+  } catch (error) {
+    console.error('Failed to fetch policy data:', error)
+  } finally {
+    loadingPolicy.value = false
+  }
+}
+
+// 根据礼物价值匹配政策等级
+const getTargetLevel = (giftValue) => {
+  if (!policyData.value?.policy || !giftValue) {
+    return 'N/A'
+  }
+
+  const numValue = parseFloat(giftValue)
+  if (isNaN(numValue)) {
+    return 'N/A'
+  }
+
+  // 按target从大到小排序，找到第一个小于等于giftValue的level
+  const sortedPolicy = [...policyData.value.policy].sort((a, b) => {
+    return parseFloat(b.target) - parseFloat(a.target)
+  })
+
+  console.log('sortedPolicy', JSON.stringify(sortedPolicy))
+  console.log('numValue', JSON.stringify(numValue))
+
+  for (const policy of sortedPolicy) {
+    if (numValue >= parseFloat(policy.target)) {
+      return policy.level
+    }
+  }
+
+  // 如果都不匹配，返回最低等级
+  const minLevel = Math.min(...policyData.value.policy.map((p) => p.level))
+  return minLevel
+}
+
+// 格式化薪资数值（与 TeamBillView 保持一致）
+const formatSalaryValue = (value) => {
+  if (!value || value === '0' || value === 0) return '0.00'
+  const numValue = parseFloat(value)
+  return numValue.toFixed(2)
+}
+
 // 获取账单的工资成员信息
 const fetchBillWorkMembers = async (billId) => {
   try {
@@ -267,6 +332,7 @@ onMounted(() => {
   } else {
     console.warn('未找到团队ID')
   }
+  fetchPolicyData()
 })
 </script>
 
@@ -402,13 +468,6 @@ onMounted(() => {
   }
 }
 
-/* 账单列表 */
-.bill-list {
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-}
-
 .bill-item {
   background-color: white;
   padding: 16px;
@@ -422,13 +481,6 @@ onMounted(() => {
   transform: scale(0.98);
 }
 
-.bill-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 12px;
-}
-
 .bill-period {
   font-size: 16px;
   font-weight: 600;