shanbinzhang 1 săptămână în urmă
părinte
comite
abf97e1944

+ 3 - 3
src/components/Audio.vue

@@ -93,9 +93,9 @@ const closeAudioPop=()=>{
         <div class="drag-head" ref="drag"></div>
         <div class="flex content">
             <div class="flex btns" style="flex-shrink: 0;">
-                <div class="before-btn" @click="handleClickAudioBtn('before')"></div>
+                <!-- <div class="before-btn" @click="handleClickAudioBtn('before')"></div> -->
                 <div :class="['center-btn',!store.audioData.paused&&'center-btn-play']" @click="handleClickAudioBtn('center')"></div>
-                <div class="next-btn" @click="handleClickAudioBtn('next')"></div>
+                <!-- <div class="next-btn" @click="handleClickAudioBtn('next')"></div> -->
             </div>
             <div class="right-box">
                 <div class="top flex">
@@ -156,7 +156,7 @@ const closeAudioPop=()=>{
             display: block;
             width: 34px;
             height: 34px;
-            margin: 0 12px;
+            // margin: 0 12px;
             background-image: url('@/assets/imgs/audio_pause.png');
             background-size: cover;
             cursor: pointer;

+ 29 - 2
src/views/report/Classify.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { nextTick, reactive, ref } from 'vue'
-import { SearchIcon,InfoCircleFilledIcon } from 'tdesign-icons-vue-next';
+import { SearchIcon,InfoCircleFilledIcon,ChevronDownIcon  } from 'tdesign-icons-vue-next';
 import { useRoute, useRouter } from 'vue-router'
 import { apiEtaReport } from '@/api/etaReport'
 import { useReportStore } from '@/store/modules/report'
@@ -109,6 +109,10 @@ function handleToIndex() {
   router.replace('/etaReport/index')
 }
 
+function clickHandler(e) {
+  console.log(e)
+  handleClickFirstType(e.value)
+}
 
 // 实现头部的适配
 const contentRef=ref('')
@@ -150,10 +154,24 @@ onUnmounted(() => {
           <div class="first-tab flex">
             <div 
               :class="['item', item.PermissionName == selectFirstType && 'item-active']" 
-              v-for="item in firstClassifyList" 
+              v-for="item in firstClassifyList.slice(0,6)" 
               :key="item.PermissionName" 
               @click="handleClickFirstType(item)"
             >{{ item.PermissionName }}</div> 
+
+            <t-dropdown @click="clickHandler" trigger="click" v-if="firstClassifyList.length>6">
+              <t-button variant="text" style="font-size:16px">更多
+                <template #suffix><ChevronDownIcon size="16" /></template>
+              </t-button>
+              <t-dropdown-menu>
+                <t-dropdown-item
+                  v-for="item in firstClassifyList.slice(6)" 
+                  :key="item.PermissionName"
+                  :value="item"
+                  :active="item.PermissionName == selectFirstType"
+                >{{item.PermissionName}}</t-dropdown-item>
+              </t-dropdown-menu>
+            </t-dropdown>  
           </div>
         </div>
 
@@ -311,6 +329,15 @@ onUnmounted(() => {
         box-shadow: 0px 6px 7px 1px #FFF7EB;
       }
     }
+    :deep(.t-dropdown__menu) {
+      .t-dropdown__item {
+
+        &.item-active {
+          color: #3D5EFF;
+          background-color: #3D5EFF;
+        }
+      }
+    }
 
     .sub-tab {
       margin-top: 30px;

+ 13 - 8
src/views/report/Detail.vue

@@ -139,7 +139,11 @@ async function handleCancelCollectReport() {
 
   if(res.Ret !== 200) return
   MessagePlugin.success('取消成功')
-  info.value.IsCollected=false
+  if(route.query.chapterId) {
+    chapterInfo.value.IsCollected = false
+  }else {
+    info.value.IsCollected=false
+  }
 }
 
 
@@ -172,12 +176,12 @@ onUnmounted(() => {
           返回
         </div>
 
-        <div class="flex">
+        <div class="flex" v-if="!info.HasChapter||route.query.chapterId">
           <div class="collect-icon">
-            <svg-icon v-if="info?.IsCollected" name="star_fill" style="font-size:20px;cursor: pointer;" @click="handleCancelCollectReport"></svg-icon>
+            <svg-icon v-if="info?.IsCollected||chapterInfo?.IsCollected" name="star_fill" style="font-size:20px;cursor: pointer;" @click="handleCancelCollectReport"></svg-icon>
             <svg-icon v-else name="star" style="font-size:20px;cursor: pointer;" @click="showCollectReport=true"></svg-icon>
           </div>
-          {{info.IsCollected ? '已收藏' : '收藏研报'}}
+          {{(info.IsCollected||chapterInfo.IsCollected) ? '已收藏' : '收藏研报'}}
         </div>
       </div>  
     </div>
@@ -194,12 +198,12 @@ onUnmounted(() => {
 
          <!-- 章节详情内容区 -->
         <div class="report-wrapper " 
-          :style="info.HasChapter?'chapter-detail':''" 
+          :class="info.HasChapter?'chapter-detail':''" 
           v-if="info.HasChapter||route.query.chapterId"
         >
           <!-- 无版头板尾显示标题 -->
 
-          <div class="title">{{formatChapterTitle(chapterInfo)}}</div>
+          <div class="title" v-if="chapterInfo?.Title">{{formatChapterTitle(chapterInfo)}}</div>
           <div class="time flex">
               <span>{{chapterInfo.Author}}</span>
               <span>{{moment(chapterInfo.PublishTime).format('YYYY.MM.DD HH:mm')}}</span>
@@ -235,7 +239,7 @@ onUnmounted(() => {
         <div class="report-wrapper" v-else>
           <!-- 无版头板尾显示标题 -->
           <template v-if="(!info.HeadImg) && (!info.EndImg)">
-              <div class="title">{{formatTitle(info)}}</div>
+              <div class="title" v-if="info?.Title">{{formatTitle(info)}}</div>
               <div class="time flex">
                   <span>{{info.Author}}</span>
                   <span>{{moment(info.PublishTime).format('YYYY.MM.DD HH:mm')}}</span>
@@ -317,7 +321,7 @@ onUnmounted(() => {
       reportId: Number(route.query.id),
       chapterId: Number(route.query.chapterId)
     }" 
-    @success="info.IsCollected=true"
+    @success="route.query.chapterId?(info.IsCollected=true):(chapterInfo.IsCollected=true)"
   />
 
   <t-back-top
@@ -372,6 +376,7 @@ onUnmounted(() => {
     max-width: 970px;
     margin: 0 auto;
     padding-bottom: 20px;
+    overflow: hidden;
     &.chapter-detail {
       padding-left: 230px;
       max-width: none;

+ 42 - 16
src/views/report/Index.vue

@@ -3,9 +3,9 @@ import { reactive, ref } from 'vue'
 import { SearchIcon,InfoCircleFilledIcon } from 'tdesign-icons-vue-next';
 import { useReportStore } from '@/store/modules/report'
 import { useRouter } from 'vue-router';
-import moment from 'moment'
 import _ from 'lodash'
-import 'moment/locale/zh-cn';
+import moment from 'moment'
+import 'moment/locale/zh-cn.js';
 moment.locale('zh-cn')
 import { apiEtaReport } from '@/api/etaReport'
 import LoadList from '@/components/LoadList.vue'
@@ -66,13 +66,30 @@ function initList() {
 // 格式化列表日期
 const formatDate=(e)=>{
   const isSameYear=moment(e).isSame(new Date(), 'year');
+  
+  const weekMap = {
+    1: '一',
+    2: '二',
+    3: '三',
+    4: '四',
+    5: '五',
+    6: '六',
+    7: '日',
+  }
+  const weekDay = '星期'+weekMap[moment(e).format('E')];
+
   if(isSameYear){//今年
-    return moment(e).format('MM.DD')+' '+ moment(e).format('dddd')
+    return moment(e).format('MM.DD')+' '+weekDay
   }else{
-    return moment(e).format('YY.MM.DD')+' '+moment(e).format('ddd')
+    return moment(e).format('YY.MM.DD')+' '+weekDay
   }
 }
 
+const colors = [ '#49517E','#DB4E2A','#53B3FF','#FBA730','#00C1CF','#8A4294' ]
+function getColor(index) {
+  return colors[index] || '#49517E'
+}
+
 // 实现头部的适配
 const contentRef=ref('')
 const headerRef=ref('')
@@ -150,7 +167,12 @@ onUnmounted(() => {
                   <img :src="citem.ClassifyCoverImg" class="report-img">
                   <div style="flex:1">
                     <div class="c-stage">
-                      <t-tag theme="primary" v-if="citem.PermissionNames">{{citem.PermissionNames[0]}}</t-tag>
+                      <t-tag 
+                        theme="primary" 
+                        v-for="(tag,index) in citem.PermissionNames" 
+                        :key="tag"
+                        :style="`background: ${getColor(index)}`"
+                      >{{tag}}</t-tag>
                       {{ `第${citem.Stage}期` }}
                       | {{ citem.ClassifyName }}
                     </div>
@@ -205,8 +227,20 @@ onUnmounted(() => {
         margin-left: 4px;
         border-left: 1px solid #DAE0FE;
         position: relative;
-        padding: 0 20px 30px;
 
+      }
+
+      .item-time {
+        margin-left: 20px;
+        padding: 10px;
+        background: #F5F7F9;
+        color: #3D5EFF;
+        font-size: 16px;
+        margin-bottom: 20px;
+        font-weight: bold;
+        position: sticky;
+        top: 161px;
+        z-index: 9;
         &::before {
           content: '';
           display: block;
@@ -215,24 +249,16 @@ onUnmounted(() => {
           height: 10px;
           border-radius: 50%;
           position: absolute;
-          left: 0;
+          left: -20px;
           top: 5px;
           background: #4B64F7;
           transform: translate(-50%, -50%);
           z-index: 2;
         }
       }
-      .item-time {
-        padding: 10px;
-        background: #F5F7F9;
-        color: #3D5EFF;
-        font-size: 16px;
-        margin-bottom: 20px;
-        font-weight: bold;
-      }
 
       .content-list {
-
+        padding: 0 20px 30px;
         .content-item {
           padding: 20px 0;
           border-bottom: 1px solid #DCDFE6;

+ 12 - 4
src/views/report/Search.vue

@@ -5,9 +5,6 @@ import { useReportStore } from '@/store/modules/report'
 import { apiEtaReport } from '@/api/etaReport'
 import { useRouter } from 'vue-router';
 import { useReport } from './hooks/useReport'
-import moment from 'moment'
-import 'moment/locale/zh-cn';
-moment.locale('zh-cn')
 import LoadList from '@/components/LoadList.vue'
 import RightSideWrap from './components/RightSlideWrap.vue'
 
@@ -69,6 +66,12 @@ function handleClickClassify() {
 }
 
 
+const colors = [ '#49517E','#DB4E2A','#53B3FF','#FBA730','#00C1CF','#8A4294' ]
+function getColor(index) {
+  return colors[index] || '#49517E'
+}
+
+
 // 实现头部的适配
 const contentRef=ref('')
 const headerRef=ref('')
@@ -146,7 +149,12 @@ onUnmounted(() => {
                 <div class="right-info">
                   <div class="c-stage flex">
                     <div>
-                      <t-tag theme="primary" v-if="item.PermissionNames">{{item.PermissionNames[0]}}</t-tag>
+                      <t-tag 
+                        theme="primary" 
+                        v-for="(tag,index) in item.PermissionNames" 
+                        :key="tag"
+                        :style="`background: ${getColor(index)}`"
+                      >{{tag}}</t-tag>
                       {{ `第${item.Stage}期` }}
                       | {{ item.ClassifyName }}
 

+ 4 - 5
src/views/report/components/ReportContent.vue

@@ -1,6 +1,7 @@
 <script setup>
 import {reactive,watch,onMounted,onUnmounted, nextTick} from 'vue'
-import { useThrottleFn } from '@vueuse/core'
+// import { useThrottleFn } from '@vueuse/core'
+import _ from 'lodash'
 
 const props=defineProps({
     html:{
@@ -20,15 +21,13 @@ function loadContent(){
     listState.list = listState.list.concat(listState.totalList.slice(listState.page*listState.pageSize, (listState.page + 1)*listState.pageSize))
 }
 
-const load=useThrottleFn(()=>{
+const load=_.throttle(()=>{
     if(listState.page>=listState.totalPage) return
     const clientHeight = document.documentElement.clientHeight || document.body.clientHeight; // 可视高度
     const scrollHeight = document.body.scrollHeight; // 总高度
     const scrollTop = document.documentElement.scrollTop || document.body.scrollTop; // 滚动的高度
     // console.log(clientHeight,scrollHeight);
-    const bufferHeight = 600;
-
-    if((scrollHeight - scrollTop - clientHeight) < bufferHeight) {
+    if (scrollTop + clientHeight >= scrollHeight - 80) {
         console.log('触底')
         listState.page ++;
         loadContent();

+ 2 - 2
src/views/report/components/RightSlideWrap.vue

@@ -78,8 +78,8 @@ function handleToBanner() {
 
       .recmd-wrap {
         flex-wrap: wrap;
-        gap: 10px;
-        justify-content: space-around;
+        gap: 15px;
+        // justify-content: space-around;
         max-height:30vh;
         overflow-y: auto; 
         .recmd-item {