chore: update

src/components/base/AppCard.vue

@@ -5,7 +5,6 @@ const styleHeight = computed(() => {
 })
 </script>
 
-
 <template>
   <div class="app-card">
     <div class="app-card-hd">
@@ -24,6 +23,8 @@ const styleHeight = computed(() => {
 
 <style lang="scss">
 .app-card {
+  display: flex;
+  flex-direction: column;
   min-height: v-bind(styleHeight);
   background: #fff;
   box-shadow: 0 1px 6px 0 rgb(228 232 235 / 20%);
@@ -49,4 +50,9 @@ const styleHeight = computed(() => {
     font-size: 14px;
   }
 }
+.app-card-bd {
+  flex: 1;
+  overflow-x: hidden;
+  overflow-y: auto;
+}
 </style>

src/modules/home/views/Index.vue

@@ -18,30 +18,37 @@ getExperimentData().then(res => {
 })
 
 // 最近活跃客户
-let userList = $ref<{ name: string; id: string; isActive: boolean; gender: string }[]>()
+let userList = $ref<{ name: string; id: string; isActive: boolean; gender: string }[]>([])
 getMembersList().then(res => {
   userList = res.data.map((element: any, index: number) => {
     element.isActive = index === 0
     return element
   })
-  if (userList) getEvent(userList[0]?.id)
 })
 
+const activeUser = computed(() => {
+  return userList.find(item => item.isActive)
+})
 // 最近活跃客户的事件
-let eventData = $ref<{ list: any }>()
+let eventData = $ref<{ list: Array<any>; total: number }>({ list: [], total: 0 })
+const eventCurrentPage = ref(1)
 const getEvent = function (id: string) {
+  id = id || activeUser.value?.id
   if (id) {
-    getEventList({ member_id: id }).then(res => {
+    getEventList({ member_id: id, page: eventCurrentPage.value, 'per-page': 10 }).then(res => {
       eventData = res.data
     })
   }
 }
+watchEffect(() => {
+  getEvent()
+})
 
 // 切换客户事件
 const handleUser = (item: any) => {
   userList?.map(item => (item.isActive = false && item))
   item.isActive = true
-  getEvent(item.id)
+  eventCurrentPage.value = 1
 }
 
 // 获取上下午
@@ -97,27 +104,33 @@ function handleViewEvent(item: any) {
       <AppCard class="card" title="最近活跃用户跟踪">
         <div class="content-user">
           <div :class="item.isActive ? 'content-user_item active' : 'content-user_item'" v-for="item in userList" :key="item.id" @click="handleUser(item)">
-            <img :src="item.gender === '1' ? 'https://webapp-pub.ezijing.com/pages/assa/dml_boy.png' : 'https://webapp-pub.ezijing.com/pages/assa/dml_girl.png'" />
+            <img
+              :src="item.gender === '1' ? 'https://webapp-pub.ezijing.com/pages/assa/dml_boy.png' : 'https://webapp-pub.ezijing.com/pages/assa/dml_girl.png'" />
             <div class="name">{{ item.name }}</div>
           </div>
         </div>
-        <el-empty v-if="!eventData?.list || !eventData?.list.length" description="暂无数据" :image-size="80" />
-        <div class="event-box" v-for="item in eventData?.list" :key="item.id" v-else>
-          <div class="date">{{ item.updated_time?.slice(0, item.updated_time.indexOf(' ')) }}</div>
-          <div class="event-content">
-            <div class="time">
-              {{ item.updated_time?.slice(item.updated_time.indexOf(' '), item.updated_time.length - 3) }}
-              {{ getDate(item.updated_time) }}
-            </div>
-            <!-- <Icon :name="item.connection_type" w="30" h="30"></Icon> -->
-            <div class="event">
-              <Icon class="icon" :name="item.connection_type" :multiColor="true" w="24" h="24"></Icon>
-              在
-              <span>"{{ item.connection_name }}"</span> 上
-              <span style="cursor: pointer" @click="handleViewEvent(item)">"{{ item.event_name }}"</span>
+        <template v-if="eventData.total">
+          <div class="event-box" v-for="item in eventData.list" :key="item.id">
+            <div class="date">{{ item.updated_time?.slice(0, item.updated_time.indexOf(' ')) }}</div>
+            <div class="event-content">
+              <div class="time">
+                {{ item.updated_time?.slice(item.updated_time.indexOf(' '), item.updated_time.length - 3) }}
+                {{ getDate(item.updated_time) }}
+              </div>
+              <!-- <Icon :name="item.connection_type" w="30" h="30"></Icon> -->
+              <div class="event">
+                <Icon class="icon" :name="item.connection_type" :multiColor="true" w="24" h="24"></Icon>
+                在
+                <span>"{{ item.connection_name }}"</span> 上
+                <span style="cursor: pointer" @click="handleViewEvent(item)">"{{ item.event_name }}"</span>
+              </div>
             </div>
           </div>
-        </div>
+          <div style="display: flex; align-items: center; justify-content: center; margin-top: 20px">
+            <el-pagination layout="prev, pager, next" v-model:current-page="eventCurrentPage" :total="eventData.total" hide-on-single-page />
+          </div>
+        </template>
+        <el-empty description="暂无数据" :image-size="80" v-else />
       </AppCard>
     </div>
   </div>

src/modules/user/views/Image.vue

@@ -185,9 +185,11 @@ watch(currentConnection, () => {
       </el-tabs>
     </AppCard>
     <AppCard class="card" title="用户行为轨迹">
-      <el-radio-group v-model="currentConnection">
-        <el-radio-button :value="item.id" v-for="item in connectionList" :key="item.id">{{ item.type_name }}</el-radio-button>
-      </el-radio-group>
+      <div style="text-align: center">
+        <el-radio-group v-model="currentConnection">
+          <el-radio-button :value="item.id" v-for="item in connectionList" :key="item.id">{{ item.type_name }}</el-radio-button>
+        </el-radio-group>
+      </div>
       <template v-if="event.list.length">
         <div class="event-box" v-for="(item, index) in event.list" :key="index">
           <div class="date">{{ item.updated_time?.slice(0, item.updated_time.indexOf(' ')) }}</div>