Pārlūkot izejas kodu

用户累计收藏图表详情

yujinwen 1 dienu atpakaļ
vecāks
revīzija
4e045a5b60

+ 5 - 0
src/api/customer/user.js

@@ -44,4 +44,9 @@ export default{
     return get('/chart_collect/stat/chart',{})
   },
 
+  // 用户行为统计详情
+  getUserActionStatisticInfo:params=>{
+    return get('/chart_collect/stat/user/detailList',params)
+  },
+
 }

+ 31 - 18
src/views/customer/user/components/ActionStatisticForCustomer.vue

@@ -25,6 +25,27 @@ const timeType = [
 const timeTypeValue = ref('')
 const selectDate = ref([])
 const selectBusinessValue=ref([])
+// 获取选择的起止日期值
+function getStartAndEndDate(){
+  let StartDate=selectDate.value?.[0]||'',EndDate=selectDate.value?.[1]||'';
+  if(timeTypeValue.value==='今天'){
+    StartDate=moment().format('YYYY-MM-DD')
+    EndDate=moment().format('YYYY-MM-DD')
+  }else if(timeTypeValue.value==='过去3天'){
+    EndDate=moment().format('YYYY-MM-DD')
+    StartDate=moment().subtract(3,'days').format('YYYY-MM-DD')
+  }else if(timeTypeValue.value==='过去一周'){
+    EndDate=moment().format('YYYY-MM-DD')
+    StartDate=moment().subtract(7,'days').format('YYYY-MM-DD')
+  }else if(timeTypeValue.value==='过去一月'){
+    EndDate=moment().format('YYYY-MM-DD')
+    StartDate=moment().subtract(30,'days').format('YYYY-MM-DD')
+  }
+  return {
+    StartDate,
+    EndDate
+  }
+}
 
 const tableData = ref([])
 const columns = [
@@ -41,27 +62,13 @@ const tablePagination = ref({
 })
 let SortParam='',SortType='';
 async function getStatisticList(){
-  let StartDate=selectDate.value?.[0]||'',EndDate=selectDate.value?.[1]||'';
-  if(timeTypeValue.value==='今天'){
-    StartDate=moment().format('YYYY-MM-DD')
-    EndDate=moment().format('YYYY-MM-DD')
-  }else if(timeTypeValue.value==='过去3天'){
-    EndDate=moment().format('YYYY-MM-DD')
-    StartDate=moment().subtract(3,'days').format('YYYY-MM-DD')
-  }else if(timeTypeValue.value==='过去一周'){
-    EndDate=moment().format('YYYY-MM-DD')
-    StartDate=moment().subtract(7,'days').format('YYYY-MM-DD')
-  }else if(timeTypeValue.value==='过去一月'){
-    EndDate=moment().format('YYYY-MM-DD')
-    StartDate=moment().subtract(30,'days').format('YYYY-MM-DD')
-  }
-
+  
   const res=await apiCustomerUser.getUserActionStatistic({
     CurrentIndex:tablePagination.value.current,
     PageSize:tablePagination.value.pageSize,
     EtaBusinessIds:selectBusinessValue.value.join(','),
-    StartDate:StartDate,
-    EndDate:EndDate,
+    StartDate:getStartAndEndDate().StartDate,
+    EndDate:getStartAndEndDate().EndDate,
     SortParam:SortParam,
     SortType:SortType
   })
@@ -108,8 +115,10 @@ function handleSelectDate(){
 
 const showFavChart=ref(false)
 const activeUser=ref(null)
+const filterDate=ref(null)
 function handleShowDetail(item){
   activeUser.value=item
+  filterDate.value=getStartAndEndDate()
   showFavChart.value=true
 }
 </script>
@@ -152,7 +161,11 @@ function handleShowDetail(item){
   </t-table>
 
   <!-- 用户收藏图表 -->
-  <FavChartStatistic v-model:show="showFavChart" :data="activeUser"/>
+  <FavChartStatistic 
+    v-model:show="showFavChart" 
+    :data="activeUser"
+    :filterDate="filterDate"
+  />
 </template>
 
 <style lang="scss" scoped>

+ 54 - 7
src/views/customer/user/components/FavChartStatistic.vue

@@ -1,22 +1,69 @@
 <script setup>
 import {SearchIcon} from 'tdesign-icons-vue-next'
+import {apiCustomerUser} from '@/api/customer'
+import { watch } from 'vue'
 
 const show = defineModel('show', { type: Boolean, default: false })
 const props=defineProps({
   data:{
     type:[null,Object],
     default:null
+  },
+  filterDate:{
+    type:Object,
+    default:()=>{}
   }
 })
 
 const keyword=ref('')
+let finished=false
+let loading=false
+let page=1
+const pageSize=30
+const list=ref([])
+async function getChartList(){
+  loading=true
+  const res=await apiCustomerUser.getUserActionStatisticInfo({
+    Keyword:keyword.value,
+    PageSize:pageSize,
+    CurrentIndex:page,
+    UserId:props.data.UserId,
+    StartDate:props.filterDate.StartDate,
+    EndDate:props.filterDate.EndDate
+  })
+  loading=false
+  if(res.Ret!==200) return
+  const arr=res.Data.List||[]
+  list.value=[...list.value,...arr]
+  finished=res.Data.Paging.IsEnd
+}
 
 function handleScroll({scrollBottom}){
-  if(scrollBottom<50){
-
+  if(scrollBottom<50&&!finished){
+    page++
+    getChartList()
   }
 }
 
+function handleSearch(){
+  page=1
+  finished=false
+  list.value=[]
+  getChartList()
+}
+
+watch(
+  ()=>show.value,
+  (n)=>{
+    if(n){
+      page=1
+      finished=false
+      list.value=[]
+      getChartList()
+    }
+  }
+)
+
 </script>
 
 <template>
@@ -32,16 +79,16 @@ function handleScroll({scrollBottom}){
     :footer="false"
     class="fav-chart-wrap"
   >
-    <t-input placeholder="图表名称" v-model="keyword" clearable>
+    <t-input placeholder="图表名称" v-model="keyword" clearable @change="handleSearch">
       <template #prefixIcon><SearchIcon /></template>
     </t-input>
     <t-list class="chart-list" @scroll="handleScroll">
-      <div class="chart-item-box" v-for="item in 26" :key="item">
-        <div class="text-ellipsis--l1 title">图表标题图表标题图表标题图表标题</div>
-        <img class="img" src="" alt="">
+      <div class="chart-item-box" v-for="item in list" :key="item.ChartCollectId">
+        <div class="text-ellipsis--l1 title">{{item.ChartName}}</div>
+        <img class="img" :src="item.ChartImage" alt="">
         <div>
           <span>收藏时间:</span>
-          <span>{{formatTime('2024-10-10','YYYY-MM-DD')}}</span>
+          <span>{{formatTime(item.CollectTime,'YYYY-MM-DD')}}</span>
         </div>
       </div>
     </t-list>

+ 5 - 5
src/views/system/RoleMenuAuth.vue

@@ -63,11 +63,11 @@ async function handleSave(){
             :label="item.Name"
             class="check-all-box"
           />
-            <t-checkbox 
-              :key="child.MenuId" 
-              :value="child.MenuId" 
-              v-for="child in item.Child"
-            >{{child.Name}}</t-checkbox>
+          <t-checkbox 
+            :key="child.MenuId" 
+            :value="child.MenuId" 
+            v-for="child in item.Child"
+          >{{child.Name}}</t-checkbox>
         </t-checkbox-group>
       </div>
     </div>