Merge branch 'hbchen_sale_manage'

src/router/modules/sellerRoutes.js

@@ -118,24 +118,24 @@ export default [
 			// 	},
 			// 	hidden: true
 			// },
-			// {
-			// 	path:"ficcProductStatistic",
-			// 	component: () => import('@/views/dataReport_manage/statistic/ficcProduct.vue'),
-			// 	name: 'ficcProductStatistic',
-			// 	meta: {
-			// 		title: "分产品阅读统计",
-			// 	}
-			// },
-			// {
-			// 	path: 'ficcProductlist',
-			// 	component: () => import('@/views/dataReport_manage/statistic/ficcProductList.vue'),
-			// 	name: '分产品阅读客户列表',
-			// 	meta: {
-			// 		pathFrom: 'ficcProductStatistic',
-			// 		pathName: '分产品阅读统计'
-			// 	},
-			// 	hidden: true
-			// },
+			{
+				path:"ficcProductStatistic",
+				component: () => import('@/views/dataReport_manage/statistic/ficcProduct.vue'),
+				name: 'ficcProductStatistic',
+				meta: {
+					title: "分产品阅读统计",
+				}
+			},
+			{
+				path: 'ficcProductlist',
+				component: () => import('@/views/dataReport_manage/statistic/ficcProductList.vue'),
+				name: 'ficcProductlist',
+				meta: {
+					pathFrom: 'ficcProductStatistic',
+					pathName: '分产品阅读统计',
+					title:'分产品阅读客户列表'
+				},
+			},
 			{
 				path:"receiveCompanyPermission",
 				name: 'receiveCompanyPermission',

src/views/dataReport_manage/components/CollectDetail.vue

@@ -0,0 +1,175 @@
+<script setup>
+import { reactive, ref, watch } from "vue"
+
+import { dataMainInterface } from '@/api/api.js';
+
+const props = defineProps({
+  isCollectDetailShow:{
+    type:Boolean,
+    default:false
+  },
+  customItem:{
+    type:Object,
+    default:()=>{
+      return {}
+    }
+  },
+  StartDate:{
+    type:String
+  },
+  EndDate:{
+    type:String
+  },
+  customStatus:{
+    type:String
+  },
+  SellerIds:{
+    type:String
+  }
+})
+
+const emits = defineEmits(['cancel'])
+
+const tableColumns=reactive([
+  {
+    label:'标题',
+    key:'Title'
+  },
+  {
+    label:'类型',
+    key:'CollectionType',
+  },
+  {
+    label:'收藏时间',
+    key:'ModifyTime',
+    minwidthsty:'80'
+  }
+])
+const pageNo=ref(1)
+const pageSize=ref(5)
+const total=ref(0)
+const tableData=ref([])
+const collectionType=ref(0)
+const collectionTypes=[
+  {value:0,label:'全部'},
+  {value:1,label:'研报'},
+  {value:2,label:'视频社区'},
+  {value:3,label:'线上路演'}
+]
+
+watch(()=>props.isCollectDetailShow,(val)=>{
+  if(val){
+    collectionType.value = 0
+    getTableData()
+  }
+})
+
+const cancelHandle=()=>{
+  pageNo.value=1
+  tableData.value=[]
+  emits('cancel')
+}
+const getTableData=()=>{
+  const {/* Status,SellerIds, */OldUserId} = props.customItem
+  dataMainInterface.collectDetailList({
+    StartDate:props.StartDate,
+    EndDate:props.EndDate,
+    SellerIds:props.SellerIds,
+    CompanyStatus:props.customStatus,
+    UserId:OldUserId,
+    CurrentIndex:pageNo.value,
+    PageSize:pageSize.value,
+    CollectionType:collectionType.value?collectionType.value+'':''
+  }).then(res=>{
+    if(res.Ret!==200) return 
+    const {Paging,List} = res.Data
+    total.value = Paging.Totals
+    tableData.value = List
+  })
+}
+const handleCurrentChange=(page)=>{
+  pageNo.value = page
+  getTableData()
+}
+const handleSelectChange=()=>{
+  pageNo.value=1
+  getTableData()
+}
+</script>
+
+<template>
+  <div class="collect-detail-wrap">
+    <el-dialog
+    :model-value="props.isCollectDetailShow"
+    :close-on-click-modal="false"
+    :modal-append-to-body="false"
+    @close="cancelHandle"
+    width="860px"
+    v-dialogDrag
+    center
+    >
+      <template #header>
+        <div style="display: flex; align-items: center">
+          <span style="font-size: 16px"
+            >{{props.customItem?props.customItem.OldRealName:''}}研报 / 视频收藏详情</span
+          >
+        </div>
+      </template>
+      <div class="dialog-container" >
+        <div class="select-wrap">
+          <span style="margin-right:12px;">类型</span>
+          <el-select v-model="collectionType" @change="handleSelectChange">
+            <el-option
+              v-for="item in collectionTypes"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </div>
+        <div class="table-wrap">
+          <el-table 
+            v-if="tableData"
+            :data="tableData"
+            max-height="600"
+            border
+            style="width: 100%; margin-bottom: 20px">
+            <el-table-column align="center" v-for="item in tableColumns" :key="item.key" :label="item.label" :prop="item.key"
+              :min-width="item.minwidthsty">
+              <template #default="{row}">
+                <span v-if="item.key==='CollectionType'">
+                  {{collectionTypes[row['CollectionType']].label||'--'}}
+                </span>
+                <span v-else>{{row[item.key]||'--'}}</span>
+              </template>
+            </el-table-column>
+          </el-table>
+          <el-pagination 
+            layout="total,prev,pager,next" 
+            background
+            :current-page="pageNo"
+            @current-change="handleCurrentChange"
+            :page-size="pageSize" 
+            :total="total"
+            style="justify-content:flex-end;padding:20px 0;">
+					</el-pagination>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<style scoped lang="scss">
+.dialog-container{
+  padding: 0 25px;
+  .select-wrap{
+    margin-bottom: 20px;
+  }
+}
+
+</style>
+<style lang="scss">
+.el-dialog .el-input{
+  width: 100%;
+}
+</style>

src/views/dataReport_manage/components/CollectList.vue

@@ -0,0 +1,209 @@
+
+<script setup>
+import { ref, watch } from "vue"
+
+import { dataMainInterface,departInterence } from '@/api/api.js';
+
+const props = defineProps({
+  isCollectListShow:{
+    type:Boolean,
+    default:false
+  },
+  customItem:{
+    type:Object,
+    default:()=>{
+      return {}
+    }
+  },
+  StartDate:{
+    type:String
+  },
+  EndDate:{
+    type:String
+  },
+  customStatus:{
+    type:String
+  },
+  SellerIds:{
+    type:String
+  }
+})
+const emits = defineEmits(['cancel'])
+
+const pageNo=ref(1)
+const pageSize=ref(8)
+const total=ref(0)
+const ListData=ref([])
+const allCharts=ref([])
+const listLoading=ref(false)
+
+watch(()=>props.isCollectListShow,(val)=>{
+  if(val){
+    getCollectList()
+  }
+})
+
+const cancelHandle=()=>{
+  ListData.value=[]
+  pageNo.value=1
+  emits('cancel')
+}
+const getCollectList=async()=>{
+  listLoading.value = true
+  const {OldUserId,CompanyId} = props.customItem
+  const res = await dataMainInterface.chartDetailList({
+    StartDate:props.StartDate,
+    EndDate:props.EndDate,
+    SellerIds:props.SellerIds,
+    CompanyId:CompanyId,
+    CompanyStatus:props.customStatus,
+    UserId:OldUserId,
+    CurrentIndex:pageNo.value,
+    PageSize:pageSize.value,
+  })
+  if(res.Ret!==200) return 
+  const {Paging,List} = res.Data
+  ListData.value = List.map(item=>{
+    const ChartInfo = item.ChartInfo||{}
+    const {UniqueCode,ChartName,ChartImage,ChartInfoId} = ChartInfo
+    const temp = {
+      Id:item.Id||'',
+      UniqueCode:UniqueCode||'',
+      ChartName:ChartName||'',
+      ChartImage:ChartImage||'',
+      CreateTime:item.CreateTime||'',
+      ChartInfoId:ChartInfoId||''
+    }
+    return temp
+  })
+  total.value = Paging.Totals
+  allCharts.value = ListData.value.map(item=>{return item.UniqueCode})
+  //剔除UniqueCode为空的
+  allCharts.value = allCharts.value.filter(item=>{return item})
+  listLoading.value = false
+}
+const handleCurrentChange=(page)=>{
+  pageNo.value = page
+  getCollectList()
+}
+const showChartDetail=async(item)=>{
+  if(!item.UniqueCode) return
+  // 跳转去ETA
+  const redirect_uri=encodeURIComponent(`/chartsetting?code=${item.UniqueCode}&id=${item.ChartInfoId}`)
+  let href = import.meta.env.VITE_ETA_SYSTEM
+  // console.log(href);
+  // console.log(redirect_uri);
+  // 获取临时code
+  const res=await departInterence.getToETASysCode()
+  if(res.Ret===200){
+    href=`${href}?code=${res.Data}&redirect_uri=${redirect_uri}`
+    window.open(href,'_blank');
+  }
+}
+
+</script>
+
+<template>
+  <div class="collect-list-wrap">
+    <el-dialog
+    :model-value="props.isCollectListShow"
+    :close-on-click-modal="false"
+    :modal-append-to-body="false"
+    @close="cancelHandle"
+    width="70%"
+    top="4vh"
+    v-dialogDrag
+    center
+    >
+      <template #header>
+        <div style="display: flex; align-items: center">
+          <span style="font-size: 16px"
+            >{{props.customItem?props.customItem.OldRealName:''}}图收藏详情</span
+          >
+        </div>
+      </template>
+
+      <div class="dialog-container" >
+        <p>共{{total||0}}张图表</p>
+        <div class="list-wrap" v-loading="listLoading">
+          <div class="list-item" v-for="item in ListData" :key="item.Id" @click="showChartDetail(item)">
+            <span class="item-title">{{item.ChartName||'该图表已被删除'}}</span>
+            <div class="item-image-wrap">
+              <div class="image" :style="{backgroundImage:`url(${item.ChartImage})`}">
+              </div>
+            </div>
+            <span class="item-time">收藏时间：{{item.CreateTime||' '}}</span>
+          </div>
+        </div>
+        <el-pagination 
+          layout="total,prev,pager,next" 
+          background
+          :current-page="pageNo"
+          @current-change="handleCurrentChange"
+          :page-size="pageSize" 
+          :total="total"
+          style="justify-content: flex-end;padding:20px 0;">
+        </el-pagination>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<style lang="scss">
+.collect-list-wrap{
+  .el-dialog__wrapper{
+    overflow: hidden;
+  }
+}
+</style>
+<style scoped lang="scss">
+.dialog-container{
+  padding: 0 25px;
+  .list-wrap{
+    min-height: 686px;
+    margin-top: 20px;
+    display: flex;
+    flex-wrap: wrap;
+    .list-item{
+      margin: 0 25px 20px 0;
+      border: 1px solid #ECECEC;
+      box-sizing: border-box;
+      width:22%;
+      height:323px;
+      color:#333333;
+      display: flex;
+      flex-direction: column;
+      padding:10px;
+      cursor: pointer;
+      span{
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
+      .item-title{
+        font-weight: 700;
+        font-size: 16px;
+      }
+      .item-time{
+        margin-top: -10px;
+        font-size: 14px;
+      }
+      .item-image-wrap{
+        flex:1;
+        border-top:1px solid #ECECEC;
+        margin:10px -10px;
+        padding:10px;
+        .image{
+          width:100%;
+          height:100%;
+          background-color:#D9D9D9;
+          background-position: 0 0;
+          background-size: 100% 100%;
+        }
+      }
+    }
+  }
+  
+}
+
+</style>

src/views/dataReport_manage/statistic/ficcProduct.vue

@@ -0,0 +1,376 @@
+<script setup>
+import {ref} from "vue"
+import _ from "lodash"
+import { useRouter} from 'vue-router';
+import { ArrowDown,ArrowUp } from '@element-plus/icons-vue'
+import moment from "moment";
+
+import { dataMainInterface,customInterence } from '@/api/api.js';
+import {dataReportStatisticHook} from './hook.js';
+
+const $router=useRouter()
+
+const tipMap=new Map([
+	['试用','在所选时间段内，新建的或转为试用状态的客户数量（正式转试用的除外）'],
+	['正式','首次申请转正的审批通过时间，在所选时间段内的客户数'],
+])
+const productOpts=ref([])
+const selectProductIndex=ref(0)
+
+/* 获取表格数据 */
+const getTableData=()=>{
+	dataLoading.value = false;
+	const productOpt = productOpts.value[selectProductIndex.value]
+	const collectMap = {
+		999:'collectStatistic',
+		998:'chartStatistic'
+	}
+	const InterfaceName = selectProductIndex.value>=998?collectMap[selectProductIndex.value]:'ficcProductStatistic'
+	dataMainInterface[InterfaceName]({
+		DataType: default_tab.value === '周度统计表' ? 'week' : default_tab.value === '月度统计表' ? 'month' : 'time_interval',
+		StartDate: select_date.value ? select_date.value[0] : '',
+		EndDate: select_date.value ? select_date.value[1] : '',
+		ProductId:productOpt?productOpt.ProductId:'',
+		ProductType:productOpt?productOpt.ProductType:'',
+	}).then(res => {
+		const { Data,Ret } = res;
+		if(Ret !== 200) return
+
+		//总合计数据处理
+		totalGroupArr.value = filterTableData(Data.SellerYbLogRecordNumList,{},'ficcproduct');
+
+		//处理数据结构
+		let data = _.cloneDeep(Data.List).sort((a,b) => b.Item.length - a.Item.length);
+		if(!['admin','ficc_admin'].includes(Role.value)) data = data.sort((a,b) => b.Item.length - a.Item.length);
+
+		data.forEach(item => {
+			item.showDetail=false
+			
+			let groupDataArr = filterTableData(item.SellerYbLogRecordNumList,{
+				rs_name: item.Name + '合计'
+			},'ficcproduct');
+			item.subGroupArr=groupDataArr
+
+			item.Item && item.Item.forEach(sub_item => {
+				
+				let dataArr = filterTableData(sub_item.SellerYbLogRecordNumList,{
+					rs_name : sub_item.Name,
+
+				},'ficcproduct')
+				sub_item.dataArr=dataArr
+			})
+		})
+
+		datalist.value = data;
+		dataLoading.value = true;
+		
+	})
+}
+
+//获取产品选项数据
+const getProductOpts=async()=>{
+	const res=await customInterence.getSubProduct({StatisticFlag:true})
+	if(res.Ret===200){
+		productOpts.value=res.Data||[]
+		selectProductIndex.value=0
+		getTableData()
+	}
+}
+
+const productChange=(index)=>{
+	selectProductIndex.value=index 
+	getTableData()
+}
+
+/* 获取数据对应表头 */
+const getColumnTitle=(index)=>{
+	let title = '';
+
+	if(['周度统计表','月度统计表'].includes(default_tab.value)) {
+		title = [0,1,2].includes(index) 
+		? tableTheadColumns.value[0] 
+		: [3,4,5].includes(index) 
+		? tableTheadColumns.value[1] 
+		: [6,7,8].includes(index) 
+		? tableTheadColumns.value[2] 
+		: [9,10,11].includes(index) 
+		? tableTheadColumns.value[3]
+		: [12,13,14].includes(index) 
+		? tableTheadColumns.value[4]
+		: [15,16,17].includes(index) 
+		? tableTheadColumns.value[5] 
+		: '';
+	} else {
+		title = default_tab.value || `${select_date.value[0]}~${select_date.value[1]}`;
+	}
+	
+	return title
+}
+
+/* 进入列表 */
+const goList=({ ids, key, rs_name, value },index, parent,sub_index= "")=>{
+	if(!parent.length || !value||key=='合计') return
+	if(sub_index && (!value[sub_index] || !parent.length)) return
+	const productOpt = productOpts.value[selectProductIndex.value]
+	// 产品ID (收藏统计fakeId:998,999)
+	const productionId = productOpt?productOpt.ProductId:selectProductIndex.value
+	// 产品类型 (收藏统计fakeType:998,999)
+	const ProductType=productOpt?productOpt.ProductType:selectProductIndex.value
+	// 客户状态
+	const CompanyStatus = key
+	//销售ids
+	const SellerIds = ids
+	console.log('value',ids)
+	
+	// 开始结束日期
+	let StartDate=''
+	let EndDate=''
+	
+	// 应该是前几周
+	let num = Math.floor(index/3) 
+	if(default_tab.value=='周度统计表'){
+		StartDate = moment().subtract(num, 'week').startOf('isoWeek').format('YYYY-MM-DD');
+		EndDate = moment().subtract(num, 'week').endOf('isoWeek').format('YYYY-MM-DD');
+	}else{
+		StartDate = moment().subtract(num, 'M').startOf('month').format('YYYY-MM-DD');
+		EndDate = moment().subtract(num, 'M').endOf('month').format('YYYY-MM-DD');
+	}
+
+	let column_title = getColumnTitle(index);
+
+	let title =  encodeURIComponent(`${column_title}/${rs_name}/${key}`);
+	sessionStorage.setItem('renewalTab',activeTab.value.tabName)	
+	const {href}=$router.resolve({
+		path: '/ficcProductlist',
+		query: {
+			ids: sub_index !== '' ? encodeURIComponent(ids[sub_index]) : encodeURIComponent(ids),
+			title,
+			productionId,
+			ProductType,
+			CompanyStatus,
+			StartDate,
+			EndDate,
+			SellerIds
+		}
+	})
+	
+	window.open(href,'_blank')
+}
+
+const HOOK = dataReportStatisticHook({getTableData})
+const {dataLoading,default_tab,select_date,totalGroupArr,datalist,tableTheadColumns,staticTabs}=HOOK.datas
+const {Role,activeTab}=HOOK.computeds
+const {filterTableData,changeTabHandle}=HOOK.functions
+//start
+getProductOpts()
+
+</script>
+
+<template>
+    <div class="statistic-container product-statistic-page">
+        <div class="tabs-box">
+			<span
+				class="custom-tab" 
+				:class="index===selectProductIndex ?'activeTab':''"
+				v-for="(item,index) in productOpts"
+				:key="item.ProductId+item.ProductType"
+				@click="productChange(index)"
+			>
+				{{item.ProductName}}
+			</span>
+      <!-- 加一个 收藏统计 crm12.3改名为 研报 / 视频收藏统计 -->
+      <span 
+        class="custom-tab"
+        :class="selectProductIndex===999 ?'activeTab':''"
+        @click="productChange(999)"
+      >
+        研报 / 视频收藏统计
+      </span>
+      <!-- 再加一个 图收藏统计 -->
+      <span 
+        class="custom-tab"
+        :class="selectProductIndex===998 ?'activeTab':''"
+        @click="productChange(998)"
+      >
+        图收藏统计
+      </span>
+		</div>
+		<div class="frequency-cont">
+			<ul class="frequency-ul">
+				<li v-for="tab in staticTabs.slice(0,2)" :key="tab" :class="{act: tab=== default_tab}" @click="changeTabHandle(tab)">{{ tab }}</li>
+			</ul>
+		</div>
+        <div class="table-cont"  v-loading="!dataLoading">
+            <div class="table-body-wrapper">
+				<table>
+					<thead>
+						<tr>
+							<td rowspan="2" class="thead-rs">组别</td>
+							<td rowspan="2" class="thead-rs">销售</td>
+							<td
+								:colspan="['周度统计表','月度统计表'].includes(default_tab) ? 3 : 1"
+								v-for="item in tableTheadColumns"
+								:key="item" 
+								class="head-column"
+							>
+								{{item}}
+							</td>	
+						</tr>
+						<tr v-if="['月度统计表'].includes(default_tab)">
+							<template v-for="(item,index) in new Array(6).fill('')">
+								<td>正式</td>
+								<td>试用</td>
+								<td>合计</td>
+							</template>
+						</tr>
+						<tr v-else-if="['周度统计表'].includes(default_tab)">
+							<template v-for="(item,index) in new Array(6).fill('')">
+								<td>
+									正式
+									<!-- <el-tooltip 
+										effect="rk" 
+										placement="top-start" 
+										v-if="index === 0"
+										:content="tipMap.get('正式')"
+									>
+										<i class="el-icon-info"/>
+									</el-tooltip> -->
+								</td>
+								<td>
+									试用
+								<!-- <el-tooltip 
+									effect="dark" 
+									placement="top-start" 
+									v-if="index === 0"
+									:content="tipMap.get('试用')"
+								>
+									<i class="el-icon-info"/>
+								</el-tooltip> -->
+								</td>
+								<td>
+									合计
+								</td>
+								
+							</template>
+						</tr>
+					</thead>
+					<tbody v-for="item in datalist" :key="item.Name">
+							<tr>
+								<td colspan="2" 
+									@click="item.showDetail=!item.showDetail" 
+								>{{item.Name}}合计
+								<el-icon :size="14" style="vertical-align: text-top;" v-if="item.Item.length">
+									<ArrowUp v-show="item.showDetail" />
+									<ArrowDown v-show="!item.showDetail" />
+								</el-icon>	
+							</td>
+								<td 
+									v-for="(group_data,group_data_key) in item.subGroupArr" 
+									:key="group_data_key"
+									:class="{link: item.Item.length}"
+								>
+
+									<span 
+										@click="goList(group_data,group_data_key,item.Item)" 
+										v-if="Object.prototype.toString.call(group_data.value) === '[object Number]'"
+										:style="{color:group_data.key=='合计'?'#333':''}"
+									>
+										{{ group_data.value !== 0 ? group_data.value : '' }}
+									</span>
+
+									<span 
+										v-else 
+										v-for="(sub_data_value,sub_index) in group_data.value" 
+										@click="goList(group_data,group_data_key,item.Item,sub_index)" 
+										:key="sub_index" 
+										:style=" sub_data_value ? '' : 'color:#666'"
+									>
+										{{sub_data_value}} 
+										<span style="color:#666">{{ sub_index === group_data.value.length - 1 ? '' : '/' }}</span>
+									</span>
+								</td>
+							</tr>
+							<template v-if="item.Item.length" >
+								<tr :style="{display:item.showDetail?'table-row':'none'}">
+									<td :rowspan="item.Item.length+1" class="thead-rs">{{item.Name}}</td>
+								</tr>
+
+								<tr v-for="rs in item.Item" :key="rs.AdminId" :style="{display:item.showDetail?'table-row':'none'}">
+									<td class="thead-rs">{{rs.Name}}</td>
+
+									<td 
+										:class="['data-cell',{link: item.Item.length}]" 
+										v-for="(data,data_key) in rs.dataArr" 
+										:key="data_key"
+									>
+										
+										<span 
+											@click="goList(data,data_key,item.Item)" 
+											v-if="Object.prototype.toString.call(data.value) === '[object Number]'"
+											:style="{color:data.key=='合计'?'#333':''}"
+										>
+											{{ data.value !== 0 ? data.value : '' }}
+										</span>
+
+										<span 
+											v-else 
+											v-for="(sub_data_value,sub_index) in data.value" 
+											:key="sub_index" 
+											:style=" sub_data_value ? '' : 'color:#666'" 
+											@click="goList(data,data_key,item.Item,sub_index)"
+										>
+											{{sub_data_value}} 	
+											<span style="color:#666">{{ sub_index === data.value.length - 1 ? '' : '/' }}</span>
+										</span>
+									</td>
+									
+								</tr>
+							</template>	
+							
+					</tbody>
+
+					<tfoot>
+						<tr>
+							<td colspan="2">{{activeTab.tabSummationName}}</td>
+							<td v-for="(total_data,total_data_key) in totalGroupArr" :key="total_data_key">
+
+								<span v-if="Object.prototype.toString.call(total_data.value) === '[object Number]'">
+									{{ total_data.value !== 0 ? total_data.value : '' }}
+								</span>
+
+								<span v-else v-for="(sub_data_value,sub_index) in total_data.value" :key="sub_index">
+									{{sub_data_value}} 
+									<span>{{ sub_index === total_data.value.length - 1 ? '' : '/' }}</span>
+								</span>
+							</td>
+						</tr>
+					</tfoot>
+				</table>
+			</div>
+        </div>
+    </div>
+</template>
+
+<style lang='scss' scoped>
+*{ box-sizing: border-box;}
+@import './index.scss';
+.product-statistic-page{
+	min-height: calc(100vh - 120px);;
+}
+.tabs-box{
+	font-size: 18px;
+	color: #999;
+	.custom-tab{
+		display: inline-block;
+		margin-right: 30px;
+		margin-bottom: 20px;
+		color: #333;
+		cursor: pointer;
+    font-family: SimHei;
+	}
+	.activeTab{
+		color: #409EFF;
+		border-bottom: 2px solid #409EFF;
+	}
+}
+</style>

src/views/dataReport_manage/statistic/ficcProductList.vue

@@ -0,0 +1,417 @@
+<script>
+import { defineComponent } from "vue";
+
+export default defineComponent({
+  beforeRouteEnter(to, from, next) {
+		/* 页面进入前是否清除参数 */
+		if(from.path!='/customDetail') {
+			sessionStorage.removeItem('newCustomBack')
+		}
+		next()
+  },
+});
+</script>
+
+<script setup>
+import { ref,reactive } from "vue";
+import { useRouter,useRoute} from 'vue-router';
+import {onBeforeRouteLeave} from "vue-router"
+
+import { dataMainInterface } from '@/api/api.js';
+import mPage from '@/components/mPage.vue';
+import CollectDetail from '../components/CollectDetail.vue';
+import CollectList from '../components/CollectList.vue';
+import {formatTime} from '@/hooks/mixins/index.js'
+
+const $router = useRouter()
+const $route = useRoute()
+
+const title=ref('')
+const ids=ref('')//公司id
+const tableData=ref([])
+const tableColumns=reactive([
+	{
+		label: '联系人',
+		key: 'OldRealName',
+		minwidthsty: '80px',
+	},
+	{
+		label: '点击量',
+		key: 'YbLogNum',
+		minwidthsty: '100px',
+	},
+	{
+		label: '客户名称',
+		key: 'CompanyName',
+		minwidthsty: '180px',
+	},
+	{
+		label: '客户类型',
+		key: 'CompanyType',
+		widthsty: '80px',
+	},
+	{
+		label: '所属行业',
+		key: 'IndustryName',
+	},
+	{
+		label: '客户地址',
+		key: 'City',
+		widthsty: '110px',
+	},
+	{
+		label: '所属销售',
+		key: 'SellerName',
+	},
+	{
+		label: '客户状态',
+		key: 'Status',
+		// widthsty: '180px',
+	},
+	{
+		label: '累计阅读次数',
+		key: 'viewTotal',
+	},
+	{
+		label: '累计路演次数',
+		key: 'RoadShowTotal',
+	},
+	{
+		label: '最近一次阅读时间',
+		key: 'LastViewTime',
+		widthsty: '200px',
+	},
+	{
+		label: '服务期限',
+		key: 'EndDate',
+		minwidthsty: '180px',
+	},
+	{
+		label: '到期天数',
+		key: 'ExpireDay',
+		widthsty: '110px'
+	}
+])
+let sort_obj=reactive({
+	param: '',
+	type: ''
+})//排序字段
+const total=ref(0)
+const page_no=ref(1)
+const pageSize=ref(20)
+// 产品ID
+const productionId=ref(0)
+// 产品类型
+const ProductType=ref(0)
+const CompanyStatus=ref('')
+const StartDate=ref('')
+const EndDate=ref('')
+const isCollectDetailShow=ref(false)//研报 / 视频收藏统计 弹窗
+const customItem=ref(null)
+const isCollectListShow=ref(false)//图收藏统计弹窗
+
+/* 获取数据	 */
+const getTableData=()=>{
+	const { param, type } = sort_obj;
+	const collectMap = {
+		999:'collectStatisticList',
+		998:'chartStatisticList'
+	}
+	const InterfaceName = productionId.value>=998&&ProductType.value>=998?collectMap[productionId.value]:'newCustomProductionList'
+	dataMainInterface[InterfaceName]({
+		ProductId:productionId.value,
+		ProductType:ProductType.value,
+		StartDate:StartDate.value,
+		StartDate:StartDate.value,
+		EndDate:EndDate.value,
+		CompanyStatus: CompanyStatus.value,
+		CurrentIndex: page_no.value,
+		SortParam: param,
+		SortType: type,
+		SellerIds: ids.value,
+		PageSize:pageSize.value
+	}).then(res => {
+		const { Ret,Data } = res;
+		if(Ret !== 200) return
+
+		total.value = res.Data.Paging.Totals;
+		tableData.value = Data.List || [];
+	})
+}
+
+/* 切换页码 */
+const handleCurrentChange=(page)=>{
+	page_no.value = page;
+	getTableData();
+}
+
+/* 排序变化时 */
+const sortChangeHandle=({ prop,order })=>{
+	console.log(prop,order)
+	page_no.value = 1;
+
+	const typeMap = {
+		'RoadShowTotal': 'roadShowTotal',
+		'LastViewTime': 'viewTime',
+		'ExpireDay': 'expireDay',
+		'YbLogNum':'ybUserLog',
+		'CollectNum':'ybCollectLog'
+	}
+
+	sort_obj = {
+		type: order === 'ascending' ? 'asc' : order === 'descending' ? 'desc' : '',
+		param: typeMap[prop] || prop
+	}
+	getTableData();
+}
+
+/* 前往详情页 */
+const goDetail=({CompanyId})=>{
+	$router.push({
+		path:'/customDetail',
+		query:{
+			id: CompanyId,
+		}
+	})
+}
+
+/* 打开收藏详情弹窗 */
+const showCollectDetail=(item)=>{
+	customItem.value = item
+	//如果是 研报 / 视频收藏统计
+	if(productionId.value===999&&ProductType.value===999){
+		isCollectDetailShow.value = true
+	}
+	//如果是 图收藏统计
+	if(productionId.value===998&&ProductType.value===998){
+		isCollectListShow.value = true
+	}
+}
+
+const init=()=>{
+	if($route.query.ids) {
+		ids.value = decodeURIComponent($route.query.ids);	
+	}
+	title.value = decodeURIComponent($route.query.title);
+	if($route.query.sort_obj){
+		sort_obj = $route.query.sort_obj
+	}
+	productionId.value = parseInt($route.query.productionId) || 0
+	ProductType.value = parseInt($route.query.ProductType) || 0
+	if(productionId.value>=998&&ProductType.value>=998){
+		//如果从收藏统计进入详情，将点击量列换成收藏量列
+		const index = tableColumns.findIndex(item=>item.label==='点击量')
+		tableColumns.splice(index,1,{
+				label: '收藏量',
+				key: 'CollectNum',
+				minwidthsty: '100px',
+			},)
+	}
+	
+	// 客户状态 
+	CompanyStatus.value = $route.query.CompanyStatus || ''
+	// 开始日期
+	StartDate.value = $route.query.StartDate || ''
+	// 结束日期
+	EndDate.value = $route.query.EndDate || ''
+	if($route.query.ids||$route.query.title||$route.query.sort_obj){
+		let backData = {
+			page_no: page_no.value,
+			ids: ids.value,
+			title: title.value,
+			sort_obj
+		};
+		localStorage.setItem("newCustomBack", JSON.stringify(backData));
+	}
+	if(sessionStorage.getItem('newCustomBack')) {
+		let data = JSON.parse(sessionStorage.getItem('newCustomBack'));
+		page_no.value = data.page_no;
+		ids.value = data.ids;
+		title.value = data.title;
+		sort_obj = data.sort_obj
+	}else if(localStorage.getItem("newCustomBack")){
+		let data = JSON.parse(localStorage.getItem("newCustomBack"));
+		page_no.value = data.page_no;
+		ids.value = data.ids;
+		title.value = data.title;
+		sort_obj = data.sort_obj
+	}
+	ids.value && getTableData();
+}
+
+/* 页面跳转前记录参数 */
+onBeforeRouteLeave((to, form, next) =>{
+	let backData = {
+		page_no: page_no.value,
+		ids: ids.value,
+		title: title.value,
+		sort_obj
+	}
+	sessionStorage.setItem('newCustomBack',JSON.stringify(backData))
+	localStorage.removeItem("newCustomBack");
+	next()
+})
+init()
+
+</script>
+
+<template>
+	<div class="list-container">
+		<span class="tag">{{title}}</span>
+		<el-table
+			:data="tableData"
+			@sort-change="sortChangeHandle"
+			border
+			class="table-cont"
+		>
+			<el-table-column
+				v-for="item in tableColumns"
+				:key="item.label"
+				:label="item.label"
+				:width="item.widthsty"
+				:min-width="item.minwidthsty"
+				:prop="item.key"
+				align="center"
+				:sortable="['YbLogNum','CollectNum','viewTotal','RoadShowTotal','LastViewTime','ExpireDay','createTime'].includes(item.key) ? 'custom' : false"
+			>
+				<template #default="{row}">
+
+					<span v-if="item.key === 'CompanyName'" @click="goDetail(row)" class="customName editsty">
+						{{row.CompanyName}}
+					</span>
+
+					<span v-else-if="item.key === 'CompanyType'">
+						<span :style="row.IsSuspend===1?'color:#bbb':''">{{row.CompanyType}}</span> 
+						<span v-if="row.FiccPackageType"  class="ficc-package">{{row.FiccPackageType == 1 ? '大套餐': '小套餐'}}</span>
+					</span>
+
+					<span v-else-if="item.key === 'City'">
+						{{`${row.Province}/${row.City}`}}
+					</span>
+
+					<span v-else-if="item.key === 'Status'">
+						{{row.Status}}
+					</span>
+
+					<span v-else-if="item.key === 'viewTotal'">
+						{{row.AllViewTotal}}
+					</span>
+
+					<span v-else-if="item.key === 'LastViewTime'">
+						{{
+							row.FiccLastViewTime 
+							? `ficc： ${row.FiccLastViewTime}` 
+							:row.RaiLastViewTime?
+							 `权益： ${row.RaiLastViewTime}`:'--'
+						}}
+					</span>
+
+					<span v-else-if="item.key === 'EndDate'">
+						<!-- 正常的时间显示 -->
+						<template v-if="row.StartDate.indexOf('/')==-1">
+							<template v-if="row.Status=='流失'">
+								创建时间：{{formatTime(row.CreatedTime)}}
+							</template>
+							<template v-else-if="row.Status == '永续'">
+								永久
+							</template>
+							<template v-else-if="row.Status == '冻结'">
+								{{row.FreezeStartDate}}~{{row.FreezeEndDate}}
+							</template>
+							<template v-else>
+								{{row.StartDate}}~{{row.EndDate}}
+							</template>
+						</template>
+						<!-- 公用客户的时间显示 -->
+						<template v-else>
+							{{row.StartDate.substr(0,10)}}~{{row.EndDate.substr(0,10)}}/{{row.StartDate.substr(11)}}~{{row.EndDate.substr(11)}}
+						</template>
+					</span>
+
+          <span v-else-if="item.key==='CollectNum'" @click="showCollectDetail(row)" class=" editsty">
+            {{row.CollectNum}}
+          </span>
+					<span v-else>{{ row[item.key]}}</span>
+				</template>
+			</el-table-column>
+			<el-table-column
+				:prop="title.includes('正式') ? 'formalTime' : 'createTime'"
+				:label="title.includes('正式') ? '转正时间' : '创建时间'"
+				sortable="custom"
+				align="center" 
+				min-width="120"
+			>
+				<template #default="scope">
+					<span>
+						<template v-if="title.includes('正式')">
+							{{formatTime(scope.row.FormalTime)}}
+						</template>
+						<template v-else>
+							{{formatTime(scope.row.CreatedTime)}}
+						</template>
+					</span> 
+				</template>
+			</el-table-column>
+			<template #empty>
+				<div style="line-height: 44px; margin: 60px 0; color: #999">
+					<img src="~@/assets/img/cus_m/nodata.png" alt="" style="display: block; width: 160px; height: 128px; margin: auto"/>
+					<span>暂无数据</span>
+				</div>
+			</template>
+		</el-table>
+		<div class="bottom">
+			<m-page
+				:total="total"
+				:page_no="page_no"
+        :pageSize="pageSize"
+				@handleCurrentChange="handleCurrentChange"
+			/>
+		</div>
+    <!-- 研报/视频收藏统计 -->
+    <collect-detail 
+      :isCollectDetailShow="isCollectDetailShow"
+      :customItem="customItem"
+      :StartDate="StartDate"
+      :EndDate="EndDate"
+      :customStatus="$route.query.CompanyStatus"
+      :SellerIds="$route.query.SellerIds"
+      @cancel="isCollectDetailShow=false"
+    />
+    <!-- 图收藏统计 -->
+    <collect-list 
+      :isCollectListShow="isCollectListShow"
+      :customItem="customItem"
+      :StartDate="StartDate"
+      :EndDate="EndDate"
+      :customStatus="$route.query.CompanyStatus"
+      :SellerIds="$route.query.SellerIds"
+      @cancel="isCollectListShow=false"
+    />
+	</div>
+</template>
+
+<style lang="scss" scoped>
+*{ box-sizing: border-box; }
+.list-container {
+	min-height: calc(100vh - 120px);
+	background-color: #fff;
+	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
+	border-radius: 4px;
+	padding: 30px 20px;
+	.tag {
+		padding: 10px 24px;
+		display: inline-block;
+		background: #E8F3FF;
+		color: #2D8CF0;
+		font-size: 14px;
+		border-radius: 4px;
+	}
+	.table-cont {
+		margin-top: 20px;
+		margin-bottom: 20px;
+	}
+	.bottom {
+		height: 40px;
+	}
+}
+</style>