feat(管理员): 对接获取列表的接口

2025-09-09 18:53:20 +08:00 · 2025-09-09 18:53:20 +08:00 · 2a7ab3e733
commit 2a7ab3e733
parent 9decb72520
2 changed files with 179 additions and 144 deletions
--- a/src/api/userInfo.js
+++ b/src/api/userInfo.js
@ -1,50 +1,64 @@
-import { get, post } from '../utils/http.js';
+import { get, post } from '../utils/http.js'

 export const searchUser = async (userId) => {
  try {
-    const response = await get(`/user/user-profile/open-search?account=${userId}`);
-    return response;
+    const response = await get(`/user/user-profile/open-search?account=${userId}`)
+    return response
  } catch (error) {
-    console.error('Failed to fetch search user:', error);
-    console.error('error:' + error.response.errorMsg);
-    throw error;
+    console.error('Failed to fetch search user:', error)
+    console.error('error:' + error.response.errorMsg)
+    throw error
  }
-};
+}

 // 用户支付充值用户搜索
 export const searchPayRechargeUser = async (params) => {
  try {
    const response = await get(
      `/order/web/pay/user-profile?sysOrigin=${params.sysOrigin}&account=${params.account}&type=GOLD`
-    );
-    return response;
+    )
+    return response
  } catch (error) {
-    console.error('Failed to fetch search pay recharge user:', error);
-    console.error('error:' + error.response.errorMsg);
-    throw error;
+    console.error('Failed to fetch search pay recharge user:', error)
+    console.error('error:' + error.response.errorMsg)
+    throw error
  }
-};
+}

 // 获取BD列表
-export const getBDList = async (userId) => {
+export const getBDList = async (data) => {
  try {
-    const response = await get(`/team/bd/page?sysOrigin=LIKEI&userId=${userId}`);
-    return response;
+    const response = await get(
+      `/team/bd/page2?sysOrigin=LIKEI&userId=${data.userId}&cursor=${data.cursor}&limit=${data.limit}`
+    )
+    return response
  } catch (error) {
-    console.error('Failed to fetch get BD list:', error);
-    console.error('error:' + error.response.errorMsg);
-    throw error;
+    console.error('Failed to fetch get BD list:', error)
+    console.error('error:' + error.response.errorMsg)
+    throw error
  }
-};
+}

 // 获取金币代理列表
 export const getAgencyList = async (data) => {
  try {
-    const response = await post(`/wallet/freight-gold/client/pageFreight`, data);
-    return response;
+    const response = await get(`/app/h5/recharge-page?cursor=${data.cursor}&limit=${data.limit}`)
+    return response
  } catch (error) {
-    console.error('Failed to fetch get agency list:', error);
-    console.error('error:' + error.response.errorMsg);
-    throw error;
+    console.error('Failed to fetch get agency list:', error)
+    console.error('error:' + error.response.errorMsg)
+    throw error
  }
-};
+}
+
+// 获取货运代理充值月度汇总（当月，上月）
+export const getAgencyTotalRecharge = async (data) => {
+  try {
+    const response = await get(`/app/h5/recharge-summary`)
+    return response
+  } catch (error) {
+    console.error('Failed to fetch get agency total recharge:', error)
+    console.error('error:' + error.response.errorMsg)
+    throw error
+  }
+}
--- a/src/views/AdminCenter.vue
+++ b/src/views/AdminCenter.vue
@ -59,10 +59,16 @@
        <!-- 基本信息 -->
        <div style="display: flex; justify-content: space-between">
          <div style="display: flex; align-items: center">
-            <img src="../assets/icon/coin.png" alt="" style="width: 36px; border-radius: 50%" />
+            <img
+              :src="info.userProfile.userAvatar"
+              alt="../assets/icon/coin.png"
+              style="width: 36px; height: 36px; border-radius: 50%"
+            />
            <div style="margin-left: 8px">
-              <div style="font-weight: 700">{{ info.name }}</div>
-              <div style="font-weight: 700; color: rgba(0, 0, 0, 0.4)">ID:{{ info.id }}</div>
+              <div style="font-weight: 700">{{ info.userProfile.userNickname }}</div>
+              <div style="font-weight: 700; color: rgba(0, 0, 0, 0.4)">
+                ID:{{ info.userProfile.userNickname }}
+              </div>
            </div>
          </div>
          <div style="display: flex; align-items: center">
@ -79,17 +85,21 @@
          <div style="display: flex" v-show="BDIndex == selectedBDIndex">
            <div style="flex: 1">
              <div style="font-weight: 500; color: rgba(0, 0, 0, 0.4)">Host</div>
-              <div style="font-weight: 600; color: rgba(0, 0, 0, 0.8)">{{ info.host }}</div>
+              <div style="font-weight: 600; color: rgba(0, 0, 0, 0.8)">
+                {{ info.allAnchorCount || 0 }}
+              </div>
            </div>
            <div style="flex: 1">
              <div style="font-weight: 500; color: rgba(0, 0, 0, 0.4)">Agency</div>
-              <div style="font-weight: 600; color: rgba(0, 0, 0, 0.8)">{{ info.agency }}</div>
+              <div style="font-weight: 600; color: rgba(0, 0, 0, 0.8)">
+                {{ info.agentCount || 0 }}
+              </div>
            </div>
          </div>
        </transition>
      </div>
      <!-- 触发加载功能 -->
-      <div ref="loadmore" v-if="showLoading"></div>
+      <div ref="BDloadmore" v-if="showBDLoading"></div>
    </div>

    <!-- agency列表 -->
@ -104,10 +114,12 @@
        "
      >
        <div style="font-weight: 500; color: rgba(0, 0, 0, 0.4)">Total recharge for the month:</div>
-        <div style="font-weight: 600; color: rgba(0, 0, 0, 0.8)">${{ rechargeDetail.total }}</div>
+        <div style="font-weight: 600; color: rgba(0, 0, 0, 0.8)">
+          ${{ totalRechargeDetail[0]?.totalAmount || 0 }}
+        </div>
        <div style="font-weight: 500; color: rgba(0, 0, 0, 0.4)">Total recharge last month:</div>
        <div style="font-weight: 600; color: rgba(0, 0, 0, 0.8)">
-          ${{ rechargeDetail.lastMonth }}
+          ${{ totalRechargeDetail[1]?.totalAmount || 0 }}
        </div>
      </div>
      <div
@ -125,10 +137,10 @@
        <!-- 基本信息 -->
        <div style="display: flex; justify-content: space-between">
          <div style="display: flex; align-items: center">
-            <img src="../assets/icon/coin.png" alt="" style="width: 36px; border-radius: 50%" />
+            <img :src="agency.userAvatar" alt="" style="width: 36px; border-radius: 50%" />
            <div style="margin-left: 8px">
              <div style="font-weight: 700">{{ agency.name }}</div>
-              <div style="font-weight: 700; color: rgba(0, 0, 0, 0.4)">ID:{{ agency.id }}</div>
+              <div style="font-weight: 700; color: rgba(0, 0, 0, 0.4)">ID:{{ agency.account }}</div>
            </div>
          </div>
          <div style="display: flex; align-items: center">
@ -146,31 +158,35 @@
          <div style="display: flex" v-show="aIndex == selectedAgencyIndex">
            <div style="flex: 1">
              <div style="font-weight: 500; color: rgba(0, 0, 0, 0.4)">This month:</div>
-              <div style="font-weight: 600; color: rgba(0, 0, 0, 0.8)">${{ agency.thisMonth }}</div>
+              <div style="font-weight: 600; color: rgba(0, 0, 0, 0.8)">
+                ${{ formatPrice(agency.thisMonth) || 0 }}
+              </div>
            </div>
            <div style="flex: 1">
              <div style="font-weight: 500; color: rgba(0, 0, 0, 0.4)">Last month:</div>
-              <div style="font-weight: 600; color: rgba(0, 0, 0, 0.8)">${{ agency.lastMonth }}</div>
+              <div style="font-weight: 600; color: rgba(0, 0, 0, 0.8)">
+                ${{ formatPrice(agency.lastMonth) || 0 }}
+              </div>
            </div>
          </div>
        </transition>
      </div>
+      <!-- 触发加载功能 -->
+      <div ref="Agloadmore" v-if="showAgLoading"></div>
    </div>
  </div>
 </template>

 <script setup>
-import MobileHeader from '../components/MobileHeader.vue';
-import { onMounted, ref, computed, watch } from 'vue';
-import { getAdminCenterList, giveProps } from '@/api/itemDistribution';
-import { getBDList, getAgencyList } from '@/api/userInfo';
-import { showError, showWarning, showInfo, showSuccess } from '@/utils/toast.js';
-import { useRouter } from 'vue-router';
-import { usePageInitializationWithConfig } from '@/utils/pageConfig.js';
-import { getUserId } from '@/utils/userStore.js';
-import { useDebounce, useThrottle } from '@/utils/useDebounce';
+import MobileHeader from '../components/MobileHeader.vue'
+import { onMounted, ref, computed } from 'vue'
+import { getBDList, getAgencyList, getAgencyTotalRecharge } from '@/api/userInfo'
+import { useRouter } from 'vue-router'
+import { usePageInitializationWithConfig } from '@/utils/pageConfig.js'
+import { getUserId } from '@/utils/userStore.js'
+import { useDebounce, useThrottle } from '@/utils/useDebounce'

-const router = useRouter();
+const router = useRouter()

 const tabList = ref([
  {
@ -181,152 +197,157 @@ const tabList = ref([
    id: 2,
    name: 'Recharge Agency',
  },
-]);
+])

-const activeIndex = ref(0);
-const tabItems = ref([]); // 存储标签DOM引用
+const activeIndex = ref(0)
+const tabItems = ref([]) // 存储标签DOM引用

 // 选择标签
 const setActiveTab = (index) => {
  if (activeIndex.value != index) {
-    console.log('切换标签');
-    activeIndex.value = index;
-    selectedBDIndex.value = -1;
-    selectedAgencyIndex.value = -1;
+    console.log('切换标签')
+    activeIndex.value = index
+    selectedBDIndex.value = -1
+    selectedAgencyIndex.value = -1
  }
-};
+}

 // 计算下划线样式
 const underlineStyle = computed(() => {
-  console.log('计算属性');
+  console.log('计算属性')

-  if (tabItems.value.length === 0) return {}; //没有这个元素
-  const activeTab = tabItems.value[activeIndex.value];
-  console.log('选中元素的左边距', activeTab.offsetLeft);
+  if (tabItems.value.length === 0) return {} //没有这个元素
+  const activeTab = tabItems.value[activeIndex.value]
+  console.log('选中元素的左边距', activeTab.offsetLeft)

  return {
    position: 'absolute',
    left: `${activeTab.offsetLeft + activeTab.offsetWidth / 2 - 15 / 2}px`,
    bottom: '0',
    transition: 'left 0.3s ease', // 平滑过渡
-  };
-});
+  }
+})

-const selectedBDIndex = ref(-1); //选中的BD用户下标
+const selectedBDIndex = ref(-1) //选中的BD用户下标
 const showUserInfo = (index) => {
-  selectedBDIndex.value = selectedBDIndex.value != index ? index : -1;
-}; //选中的BD用户
+  selectedBDIndex.value = selectedBDIndex.value != index ? index : -1
+} //选中的BD用户

-const selectedAgencyIndex = ref(-1); //选中的agency用户下标
+const selectedAgencyIndex = ref(-1) //选中的agency用户下标
 const showAgencyInfo = (index) => {
-  selectedAgencyIndex.value = selectedAgencyIndex.value != index ? index : -1;
-}; //选中的agency用户
+  selectedAgencyIndex.value = selectedAgencyIndex.value != index ? index : -1
+} //选中的agency用户

 const send = async () => {
-  router.push({ path: '/item-distribution' });
-};
-
-// const BDList = ref([]) // BD列表
-const BDList = ref(
-  Array.from(
-    { length: 20 },
-    (item) =>
-      (item = {
-        name: 'BD2',
-        id: '456',
-        host: '333',
-        agency: '444',
-      })
-  )
-); // BD列表
-
-const agencyList = ref([
-  {
-    name: 'agency1',
-    id: '666',
-    thisMonth: '112',
-    lastMonth: '223',
-  },
-  {
-    name: 'agency2',
-    id: '777',
-    thisMonth: '334',
-    lastMonth: '445',
-  },
-]); // 代理列表
-
-const rechargeDetail = ref({
-  total: '123456',
-  lastMonth: '12345',
-}); //代理消费金额
+  router.push({ path: '/item-distribution' })
+}

 // 页面加载时获取申请记录
-usePageInitializationWithConfig('ADMIN_CENTER');
+usePageInitializationWithConfig('ADMIN_CENTER')

-const totalAgencyCurrent = ref(2); //代理的总数量
-const agencyCurrent = ref(1); //第几页
-const showLoading = ref(true);
+const BDList = ref([]) // BD列表
+const BDCurrent = ref(1) //BD列表第几页
+const showBDLoading = ref(true) //触底加载功能
+
+const totalRechargeDetail = ref([]) //代理消费金额
+const agencyList = ref([]) // 代理列表
+const agencyCurrent = ref(1) //代理列表第几页
+const showAgLoading = ref(true) //触底加载功能

 onMounted(async () => {
  if (tabItems.value.length > 0) {
-    underlineStyle.value; // 触发计算属性更新
+    underlineStyle.value // 触发计算属性更新
  }

-  const userId = getUserId();
-  const resBDList = await getBDList(userId);
-  console.log('resBDList:', resBDList);
-
-  getAgencise();
+  getBDs() // 获取BD列表
+  getAgencise() // 获取代理列表
+  getAgencyMonthsRecharge() //获取代理总支付

  // 开始监听底部元素
-  if (loadmore.value) {
-    observer.observe(loadmore.value);
+  if (BDloadmore.value) {
+    observer.observe(BDloadmore.value)
  }
-});
+  // 开始监听底部元素
+  if (Agloadmore.value) {
+    observer.observe(Agloadmore.value)
+  }
+})
+
+// 获取BD列表
+const getBDs = async () => {
+  let data = {
+    userId: getUserId(),
+    cursor: BDCurrent.value,
+    limit: 20,
+  }
+
+  const resBDList = await getBDList(data)
+  console.log('resBDList:', resBDList)
+  if (resBDList.status && resBDList.body) {
+    BDList.value.push(...resBDList.body.records)
+    if (resBDList.body.total <= resBDList.body.current * resBDList.body.size) {
+      showBDLoading.value = false
+    }
+  }
+}
+
+// 获取代理列表
+const getAgencyMonthsRecharge = async () => {
+  const resTotalRecharge = await getAgencyTotalRecharge()
+  console.log('resTotalRecharge:', resTotalRecharge)
+  if (resTotalRecharge.status && resTotalRecharge.body) {
+    totalRechargeDetail.value = resTotalRecharge.body
+  }
+}

 // 获取代理列表
 const getAgencise = async () => {
-  let agencyData = {
-    pageQuery: {
-      cursor: agencyCurrent.value,
-      limit: 20,
-      searchCount: true,
-    },
-    sysOrigin: 'LIKEI',
-    close: false,
-  };
-  const resagencyList = await getAgencyList(agencyData);
-  console.log('resagencyList:', resagencyList);
+  let data = {
+    cursor: agencyCurrent.value,
+    limit: 20,
+  }
+  const resagencyList = await getAgencyList(data)
+  console.log('resagencyList:', resagencyList)
  if (resagencyList.status && resagencyList.body) {
-    totalAgencyCurrent.value = resagencyList.body.total;
-    agencyCurrent.value = resagencyList.body.current;
+    agencyList.value.push(...resagencyList.body.records)
    if (resagencyList.body.total <= resagencyList.body.current * resagencyList.body.size) {
-      // showLoading.value = false
+      showAgLoading.value = false
    }
  }
-};
+}

 // 获取底部加载div
-const loadmore = ref(null);
+const BDloadmore = ref(null)
+const Agloadmore = ref(null)

-const test = () => {
-  console.log('加载数据1');
-};
-
-const debouceGetBDList = useThrottle(test, 1000);
+const debouceGetBDList = useThrottle(getBDs, 1000)
+const debouceGetAgList = useThrottle(getAgencise, 1000)

 // IntersectionObserver配置
 const observer = new IntersectionObserver((entries) => {
  entries.forEach((entry) => {
    if (entry.intersectionRatio > 0) {
-      debouceGetBDList();
-      // 被观察者进入视口
-      if (totalAgencyCurrent.value > agencyCurrent.value) {
-        // console.log('加载数据')
+      console.log('监控')
+
+      // 根据目标元素执行对应操作
+      if (entry.target == BDloadmore.value && BDList.value.length != 0) {
+        BDCurrent.value++
+        debouceGetBDList()
+      }
+      if (entry.target == Agloadmore.value && agencyList.value.length != 0) {
+        agencyCurrent.value++
+        debouceGetAgList()
      }
    }
-  });
-});
+  })
+})
+
+const formatPrice = (value) => {
+  if (value && value != 0) {
+    return Number(value).toFixed(2)
+  }
+  return 0
+}
 </script>

 <style scoped>