comit

src/api/report.js

@@ -157,5 +157,15 @@ export default {
      */
     reportContentSave(params){
         return post('/report/saveReportContent',params)
+    },
+    /**
+     * 新增晨报/周报
+     * @param Title
+     * @param ReportType
+     * @param CreateTime
+     * @param Author
+     */
+    dayWeekReportAdd(params){
+        return post('/report/addDayWeekReport',params)
     }
 }

src/assets/styles/common.scss

@@ -6,9 +6,10 @@
     --van-button-round-radius:6PX;
 }
 
-html,body{
+html,body,#app{
     font-size: 30px;
     color: #333;
+    height: 100%;
 }
 
 @media screen and (min-width:650px){

src/layouts/Index.vue

@@ -107,6 +107,7 @@ function goBack(){
 
 <style lang="scss" scoped>
 .layout-wrap{
+    height: 100%;
     overflow:visible;
 }
 .pad-header-box{

src/router/report.js

@@ -1,5 +1,21 @@
 // 中文研报路由模块
 export const reportRoutes=[
+    {
+        path:"/report/preview",
+        name:"ReportPreview",
+        component: () => import("@/views/report/PreviewDetail.vue"),
+        meta: { 
+            title: "中文研报",
+        },
+    },
+    {
+        path:"/report/dayweek/add",
+        name:"ReportDayWeekAdd",
+        component: () => import("@/views/report/ReportDayWeekAdd.vue"),
+        meta: { 
+            title: "添加晨报/周报",
+        },
+    },
     {
         path:"/report/edit",
         name:"ReportEdit",

src/views/report/EditReport.vue

@@ -8,6 +8,8 @@ import apiChart from '@/api/chart'
 import moment from 'moment'
 import { showToast } from 'vant'
 import { useRoute, useRouter } from 'vue-router'
+import {useCachedViewsStore} from '@/store/modules/cachedViews'
+const cachedViewsStore=useCachedViewsStore()
 
 const router=useRouter()
 const route=useRoute()
@@ -415,7 +417,7 @@ async function reportPublish(id){
     }
 }
 .add-report-page{
-    height: 100vh;
+    height: 100%;
     display: flex;
     flex-direction: column;
     overflow: hidden;

src/views/report/PreviewDetail.vue

@@ -0,0 +1,191 @@
+<script setup name="ReportPreview">
+import {ref} from 'vue'
+import { useRoute, useRouter } from "vue-router";
+import apiReport from '@/api/report'
+import AudioBox from './components/AudioBox.vue'
+import {showToast} from 'vant'
+
+const route=useRoute()
+const router=useRouter()
+
+
+// 获取报告详情
+let reportInfo=ref(null)
+async function getReportDetail(){
+    const res=await apiReport.getReportDetail({ReportId:Number(route.query.id)})
+    if(res.Ret===200){
+        reportInfo.value=res.Data
+        document.title=res.Data.Title
+    }
+}
+getReportDetail()
+
+//去编辑
+async function goEdit(){
+    // 先mark一下
+    const markRes=await apiReport.reportMark({
+        Status:1,
+        ReportId:reportInfo.value.Id
+    })
+    if(markRes.Ret===200){
+        if(markRes.Data.Status===1){
+            showToast(markRes.Data.Msg || '该研报正在编辑，不可重复编辑')
+            return
+        }
+    }else{
+        showToast(markRes.ErrMsg || '未知错误，请稍后重试')
+        return
+    }
+
+    if(['day','week'].includes(reportInfo.value.ChapterType)){
+        router.push({
+            path:"/report/chapter/list",
+            query:{
+                id:reportInfo.value.Id
+            }
+        })
+    }else{
+        // 研报
+        router.push({
+            path:'/report/edit',
+            query:{
+                id:reportInfo.value.Id
+            }
+        })
+    }
+}
+
+</script>
+
+<template>
+    <div class="report-detail-page" v-if="reportInfo">
+        <div class="top-stage-box">
+            <span class="stage">第{{reportInfo.Stage}}期 / {{reportInfo.Frequency}}</span>
+            <img v-if="reportInfo.State==1" class="edit-icon" src="@/assets/imgs/report/icon_edit2.png" alt="" @click="goEdit">
+        </div>
+        <h1 class="report-title">{{reportInfo.Title}}</h1>
+        <div class="auth-box">
+            <span>{{reportInfo.Author}}</span>
+            <span>{{reportInfo.PublishTime}}</span>
+        </div>
+        <!-- 晨报/周报 -->
+        <template v-if="['day','week'].includes(reportInfo.ChapterType)">
+            <div class="report-abstract">摘要：{{reportInfo.Abstract}}</div>
+            <ul class="chapter-list-wrap">
+                <li class="chapter-item-box" v-for="item in reportInfo.ChapterList" :key="item.ReportChapterId">
+                    <div class="type-box">
+                        <span class="tag">{{item.TypeName}}</span>
+                        <span>{{item.Title}}</span>
+                    </div>
+                    <!-- 音频 -->
+                    <AudioBox :url="item.VideoUrl" v-if="item.VideoUrl"/>
+                    <div class="report-html-wrap" v-html="item.Content"></div>
+                </li>
+            </ul>
+        </template>
+        <!-- 研报 -->
+        <template v-else>
+            <!-- 音频 -->
+            <AudioBox :url="reportInfo.VideoUrl" v-if="reportInfo.VideoUrl"/>
+            <div class="report-abstract">摘要：{{reportInfo.Abstract}}</div>
+            <div class="report-html-wrap" v-html="reportInfo.Content"></div>
+        </template>
+    </div>
+</template>
+
+<style lang="scss" scoped>
+.report-detail-page{
+    padding: 30px 34px;
+    .report-title{
+        margin: 30px 0;
+        font-weight: 600;
+        font-size: 42px;
+        line-height: 56px;
+    }
+    .auth-box{
+        display: flex;
+        justify-content: space-between;
+        font-size: $font-grey;
+        font-size: 36px;
+        padding-bottom: 40px;
+        border-bottom: 1px solid $border-color;
+        margin-bottom: 40px;
+    }
+    .report-abstract{
+        font-size: 34px;
+        line-height: 54px;
+        margin: 40px 0;
+    }
+    .audio-box{
+        margin: 40px 0;
+    }
+    .chapter-list-wrap{
+        .chapter-item-box{
+            padding-bottom: 20px;
+            border-bottom: 1px dashed $border-color;
+            margin-bottom: 20px;
+            .type-box{
+                display: flex;
+                align-items: center;
+                .tag{
+                    display: inline-block;
+                    padding: 10px;
+                    font-size: 24px;
+                    background: rgba(0, 82, 217, 0.1);
+                    border-radius: 4px;
+                    color: $theme-color;
+                    margin-right: 20px;
+                }
+            }
+        }
+    }
+}
+.top-stage-box{
+    .stage{
+        display: inline-block;
+        background-color: #F2F3FF;
+        border-radius: 8px;
+        height: 72px;
+        line-height: 72px;
+        padding: 0 20px;
+        font-size: 28px;
+    }
+    .edit-icon{
+        float: right;
+        width: 70px;
+        height: 70px;
+    }
+}
+
+@media screen and (min-width:$media-width){
+    .report-detail-page{
+        max-width: 800px;
+        margin: 0 auto;
+        padding: 30px;
+        .report-title{
+            margin: 15px 0;
+            font-size: 21px;
+            line-height: 28px;
+        }
+        .auth-box{
+            font-size: 18px;
+            padding-bottom: 20px;
+            margin-bottom: 20px;
+        }
+        .report-abstract{
+            font-size: 17px;
+            line-height: 27px;
+            margin: 20px 0;
+        }
+    }
+    .top-stage-box{
+        .stage{
+            border-radius: 4px;
+            height: 36px;
+            line-height: 36px;
+            padding: 0 10px;
+            font-size: 14px;
+        }
+    }
+}
+</style>

src/views/report/ReportDayWeekAdd.vue

@@ -0,0 +1,220 @@
+<script setup name="ReportDayWeekAdd">
+import moment from 'moment'
+import {ref,reactive} from 'vue'
+import { useRouter } from 'vue-router'
+import apiReport from '@/api/report'
+import { showToast } from 'vant'
+
+const router=useRouter()
+
+// 基本数据
+const reportBaseInfo=reactive({
+    addType:'',
+    title:'',
+    author:'弘则研究',
+    createtime:moment().format('YYYY-MM-DD'),
+})
+
+//报告类型
+const showAddTypePop=ref(false)
+function handleShowAddType(){
+    showAddTypePop.value=true
+}
+function selectAddType(e){
+    reportBaseInfo.addType=e.value
+    reportBaseInfo.title=`【弘则FICC${e.value}】`
+}
+
+// 报告标题
+const showReportTitlePop=ref(false)
+const temReportTitleVal=ref('')
+function handleShowReportTitle(){
+    temReportTitleVal.value=reportBaseInfo.title
+    showReportTitlePop.value=true
+}
+function handleConfirmReportTitle(){
+    reportBaseInfo.title=temReportTitleVal.value
+    showReportTitlePop.value=false
+}
+
+// 创建日期
+const minDate=new Date(2015, 0, 1)
+const defaultDate=ref(new Date())
+const showCreateTimePop=ref(false)
+function handleShowCreatetime(){
+    defaultDate.value=new Date(reportBaseInfo.createtime.replace(/-/g,'/'))
+    showCreateTimePop.value=true
+}
+function handleConfirmCreatime(e){
+    reportBaseInfo.createtime=moment(e).format('YYYY-MM-DD')
+    showCreateTimePop.value=false
+}
+
+//作者
+const showAuthorPop=ref(false)
+const temAuthorVal=ref('')
+function handleShowAuthor(){
+    temAuthorVal.value=reportBaseInfo.author
+    showAuthorPop.value=true
+}
+function handleConfirmAuthor(){
+    reportBaseInfo.author=temAuthorVal.value
+    showAuthorPop.value=false
+}
+
+
+// 新增晨报/周报
+function handleSave(){
+    if(!reportBaseInfo.addType){
+        showToast('请选择报告类型')
+        return
+    }
+    if(!reportBaseInfo.title){
+        showToast('请填写报告标题')
+        return
+    }
+    if(!reportBaseInfo.createtime){
+        showToast('请选择发布时间')
+        return
+    }
+    apiReport.dayWeekReportAdd({
+        Title:reportBaseInfo.title,
+        ReportType:reportBaseInfo.addType=='晨报'?'day':'week',
+        CreateTime:reportBaseInfo.createtime,
+        Author:reportBaseInfo.author
+    }).then(res=>{
+        if(res.Ret===200){
+            router.replace({
+                path:'/report/chapter/list',
+                query:{
+                    id:res.Data.ReportId
+                }
+            })
+        }
+    })
+}
+
+
+function close(){
+    router.back()
+}
+</script>
+
+<template>
+    <div class="dayweek-report-add">
+        <van-cell-group>
+            <van-cell 
+                value-class="cell-con" 
+                required 
+                title="报告类型" 
+                :value="reportBaseInfo.addType" 
+                is-link 
+                @click="handleShowAddType"
+            />
+        </van-cell-group>
+        <van-cell-group style="margin:10px 0">
+            <van-cell required title="报告标题" :label="reportBaseInfo.title" is-link @click="handleShowReportTitle"/>
+        </van-cell-group>
+        <van-cell-group>
+            <van-cell required title="发布时间" :value="reportBaseInfo.createtime" is-link @click="handleShowCreatetime"/>
+            <van-cell title="作者" :value="reportBaseInfo.author" is-link @click="handleShowAuthor"/>
+        </van-cell-group>
+
+        <div class="bot-btns">
+            <van-button class="bot-btn" type="default" @click="close">取消</van-button>
+            <van-button class="bot-btn" type="primary" @click="handleSave">保存</van-button>
+        </div>
+    </div>
+
+    <!-- 新增方式 -->
+    <van-action-sheet 
+        v-model:show="showAddTypePop"
+        cancel-text="取消"
+        close-on-click-action
+        :actions="[
+            {
+                name:'晨报',
+                value:'晨报'
+            },
+            {
+                name:'周报',
+                value:'周报'
+            }
+        ]" 
+        @select="selectAddType" 
+    />
+
+    <!-- 标题 -->
+    <van-popup
+        v-model:show="showReportTitlePop"
+        position="bottom"
+        :style="{ height: '100%' }"
+    >
+        <div class="input-report-title-pop">
+             <van-field v-model="temReportTitleVal" placeholder="请输入报告标题" />
+            <div class="bot-btns">
+                <van-button class="bot-btn" type="default" @click="showReportTitlePop=false">取消</van-button>
+                <van-button class="bot-btn" type="primary" :disabled="!temReportTitleVal" @click="handleConfirmReportTitle">确定</van-button>
+            </div>
+        </div>
+    </van-popup>
+
+    <!-- 创建日期 -->
+    <van-calendar
+        :min-date="minDate"
+        :default-date="defaultDate"
+        v-model:show="showCreateTimePop"
+        title="选择创建日期"
+        @confirm="handleConfirmCreatime" 
+    />
+
+    <!-- 作者 -->
+    <van-popup
+        v-model:show="showAuthorPop"
+        position="bottom"
+        :style="{ height: '100%' }"
+    >
+        <div class="input-report-title-pop">
+             <van-field v-model="temAuthorVal" placeholder="请填写作者" />
+            <div class="bot-btns">
+                <van-button class="bot-btn" type="default" @click="showAuthorPop=false">取消</van-button>
+                <van-button class="bot-btn" type="primary" :disabled="!temAuthorVal" @click="handleConfirmAuthor">确定</van-button>
+            </div>
+        </div>
+    </van-popup>
+</template>
+
+<style lang="scss" scoped>
+.dayweek-report-add{
+    height: 100%;
+    position: relative;
+    background: #EDEDED;
+    :deep(.cell-con){
+        flex: 2;
+    }
+    .bot-btns{
+        position: absolute;
+        bottom: 48px;
+        left: 0;
+        width: 100%;
+        text-align: center;
+    }
+}
+.bot-btn{
+    width: 315px;
+    margin: 0 10px;
+}
+.input-report-title-pop{
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    background-color: $page-bg-grey;
+    
+    .bot-btns{
+        flex-shrink: 0;
+        padding: 20px 0;
+        text-align: center;
+    }
+}
+</style>

src/views/report/Search.vue

@@ -53,21 +53,12 @@ function handleSearch(){
 }
 
 function goDetail(item){
-    if(['day','week'].includes(item.ChapterType)){
-        router.push({
-            path:"/report/chapter/list",
-            query:{
-                id:item.Id
-            }
-        })
-    }else{
-        router.push({
-            path:"/report/detail",
-            query:{
-                id:item.Id
-            }
-        })
-    }
+    router.push({
+        path:"/report/preview",
+        query:{
+            id:item.Id
+        }
+    })
 }
 </script>
 

src/views/report/chapter/Detail.vue

@@ -1,12 +1,37 @@
 <script setup name="reportChapterDetail">
-import {ref} from 'vue'
+import {ref,onMounted,onUnmounted, reactive, nextTick} from 'vue'
 import apiReport from '@/api/report'
 import { useRoute } from 'vue-router'
-import AudioBox from '../components/AudioBox.vue'
+import EditChapterBaseInfo from './components/EditChapterBaseInfo.vue' 
 import moment from 'moment'
+import {useInitFroalaEditor} from '@/hooks/useFroalaEditor'
+import {useUserInfo} from '@/hooks/common'
+import { showToast } from 'vant'
+import {useUploadFileToOSS} from '@/hooks/useUploadFileToOSS'
+import MD5 from 'js-md5'
 
+const userInfo=useUserInfo()
+
+const {FroalaEditorIns,initFroalaEditor,frolaEditorContentChange}=useInitFroalaEditor()
 const route=useRoute()
 
+let autoSaveTimer=null
+
+onMounted(() => {
+    getChapterDetail()
+    autoSaveTimer=setInterval(() => {
+        autoSaveReportContent()
+    }, 6000);
+})
+onUnmounted(()=>{
+    clearInterval(autoSaveTimer)
+})
+// 自动保存
+function autoSaveReportContent(){
+
+}
+
+
 let info=ref(null)
 function getChapterDetail(){
     apiReport.getChapterDetail({
@@ -14,96 +39,252 @@ function getChapterDetail(){
     }).then(res=>{
         if(res.Ret===200){
             info.value=res.Data
-            document.title=`${res.Data.ClassifyNameFirst}-${res.Data.Title}`
+            document.title=`${res.Data.ClassifyNameFirst}-${res.Data.TypeName}`
+
+            chapterBaseInfo.type=res.Data.TypeName
+            chapterBaseInfo.title=res.Data.Title
+            chapterBaseInfo.addType=res.Data.AddType
+            chapterBaseInfo.author=res.Data.Author||userInfo.RealName
+            chapterBaseInfo.createTime=moment(res.Data.CreateTime).format('YYYY-MM-DD')
+            if(res.Data.VideoKind==1){
+                chapterBaseInfo.audioUrl=res.Data.VideoUrl
+                chapterBaseInfo.audioDuration=res.Data.VideoPlaySeconds
+                chapterBaseInfo.audioSize=res.Data.VideoSize
+            }
+            
+            nextTick(()=>{
+                const el=document.getElementById('editor')
+                initFroalaEditor('#editor',{height:el.offsetHeight-150})
+
+                FroalaEditorIns.value.html.set(res.Data.Content);
+            })
+            
         }
     })
 }
 getChapterDetail()
 
+// 报告基本内容
+const showChapterBaseInfo=ref(false)
+const chapterBaseInfo=reactive({
+    type:'',
+    title:'',
+    addType:'',
+    ticket:[],
+    author:'',
+    createTime:'',
+    audioUrl:'',
+    audioDuration:0,
+    audioSize:0,
+})
+// 保存报告基本内容
+function handleChapterBaseInfoSave(e){
+
+}
+
+// 上传音频
+const showUploadAudio=ref(false)
+const temAudioData=reactive({
+    time:0,
+    size:0,
+    url:''
+})
+// 获取音频时长
+function handleGetAudioDuration(file){
+    return new Promise((resolve,reject)=>{
+        const fileUrl=URL.createObjectURL(file)
+        const audioEl=new Audio(fileUrl)
+        audioEl.addEventListener('loadedmetadata',(e)=>{
+            // console.log('e.path',e.path)
+            // console.log('e.composedPath',e.composedPath())
+            // console.log('获取音频时长',e.composedPath()[0].duration);
+            // console.log(audioEl.duration);
+            const t=e.composedPath()[0].duration
+            resolve(t)
+        })
+    })
+}
+function handleAudioUploadBeforeRead(e){
+    const temFile=e
+    if(temFile.name.indexOf('.mp3')==-1 
+        && temFile.name.indexOf('.wav')==-1 
+        && temFile.name.indexOf('.wma')==-1
+        &&temFile.name.indexOf('.m4a')==-1
+    ){
+        showToast('上传失败，上传音频格式不正确')
+        return false
+    }
+    return true
+}
+async function handleAudioUploadAfterRead(e){
+    // console.log(e);
+    const duration=await handleGetAudioDuration(e.file)
+    if(duration>60*15){
+        showToast('音频时长不得超过15分钟')
+        return
+    }
+    temAudioData.time=duration
+    temAudioData.size=e.file.size/1024/1024 //单位MB
+    // 生成文件名
+    const t=new Date().getTime().toString()
+    const temName=`static/yb/audio/${import.meta.env.MODE}/${MD5(t)}.${e.file.type.split('/')[1]}`
+    console.log(temName);
+    const url=await useUploadFileToOSS(e.file,temName)
+
+}
+
 </script>
 
 <template>
-    <div class="chapter-report-detail-page report-detail-wrap" v-if="info">
-        <div class="top-stage-box">
-            <span class="stage">第{{info.Stage}}期 / {{info.ClassifyNameFirst}}</span>
+    <div class="chapter-detail-edit-page">
+        <van-cell title="基础信息" is-link @click="showChapterBaseInfo=true"/>
+        <van-cell title="上传音频" is-link v-if="info?.ReportType==='week'" @click="showUploadAudio=true"/>
+        <div class="main-wrap">
+            <div class="editor-box" id="editor"></div>
         </div>
-        <h1 class="report-title">{{info.Title}}</h1>
-        <div class="auth-box">
-            <span>{{info.Author}}</span>
-            <span>{{moment(info.CreateTime).format('YYYY-MM-DD HH:mm:ss')}}</span>
+        <!-- 底部操作 -->
+        <div class="bot-action-box">
+            <div class="left-box">
+                <div class="item" @click="handleRefreshAllChart">
+                    <img src="@/assets/imgs/report/icon_refresh.png" alt="">
+                    <span>刷新</span>
+                </div>
+                <div class="item" @click="handleReportOpt('yl')">
+                    <img src="@/assets/imgs/report/icon_preview.png" alt="">
+                    <span>预览</span>
+                </div>
+                <div class="item" @click="handleReportOpt('cg')">
+                    <img src="@/assets/imgs/report/icon_save2.png" alt="">
+                    <span>保存</span>
+                </div>
+                <div class="item" @click="handleReportOpt('fb')">
+                    <img src="@/assets/imgs/report/icon_publish3.png" alt="">
+                    <span>发布</span>
+                </div>
+            </div>
+            <div class="right-btn" @click="showReportInsertPop=true">
+                <svg width="28" height="28" viewBox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path d="M12.0499 15.9499V27.5H15.9499V15.9499H27.5V12.0499H15.9499V0.5H12.0499V12.0499H0.5V15.9499H12.0499Z" fill="white"/>
+                </svg>
+            </div>
         </div>
-        <!-- 音频 -->
-        <AudioBox :url="info.VideoUrl" v-if="info.VideoUrl"/>
-        <div class="report-abstract">{{info.Abstract}}</div>
-        <div class="report-html-wrap" v-html="info.Content"></div>
     </div>
+
+    <!-- 基础信息 -->
+    <van-popup 
+        v-model:show="showChapterBaseInfo" 
+        position="bottom"
+        :style="{height:'100%'}"
+    >
+        <EditChapterBaseInfo
+            v-if="showChapterBaseInfo"
+            :chapterInfo="info"
+            :defaultData="chapterBaseInfo"
+            @close="showChapterBaseInfo=false"
+            @confirm="handleChapterBaseInfoSave"
+        />
+    </van-popup>
+
+    <!-- 上传音频 -->
+    <van-popup 
+        v-model:show="showUploadAudio" 
+        position="bottom"
+        :style="{height:'100%'}"
+    >
+        <div class="upload-audio-wrap">
+
+            <div class="bot-btns">
+                <van-uploader 
+                    accept="*" 
+                    :after-read="handleAudioUploadAfterRead"
+                    :before-read="handleAudioUploadBeforeRead"
+                >
+                    <van-button class="bot-btn" type="default">重新上传</van-button>
+                </van-uploader>
+                <van-button class="bot-btn" type="primary">保存</van-button>
+            </div>
+        </div>
+    </van-popup>
 </template>
 
 <style lang="scss" scoped>
-.top-stage-box{
-    .stage{
-        display: inline-block;
-        background-color: #F2F3FF;
-        border-radius: 8px;
-        height: 72px;
-        line-height: 72px;
-        padding: 0 20px;
-        font-size: 28px;
-    }
+.chapter-detail-edit-page{
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
 }
-.report-detail-wrap{
-    padding: 30px 34px;
-    .report-title{
-        margin: 30px 0;
-        font-weight: 600;
-        font-size: 42px;
-        line-height: 56px;
+.van-cell{
+    flex-shrink: 0;
+}
+.main-wrap{
+    flex: 1;
+    width: calc(100% - 32PX);
+    margin: 0 auto;
+    margin-top: 30px;
+    .editor-box{
+        width: 100%;
+        height: 100%;
     }
-    .auth-box{
+}
+.bot-action-box{
+    padding: 20px 16PX;
+    display: flex;
+    align-items: center;
+    .left-box{
+        flex: 1;
+        background: #FFFFFF;
+        box-shadow: 0px 12px 60px 10px rgba(0, 0, 0, 0.05), 0px 32px 48px 4px rgba(0, 0, 0, 0.04), 0px 16px 20px -10px rgba(0, 0, 0, 0.08);
+        border-radius: 100px;
+        height: 112px;
         display: flex;
-        justify-content: space-between;
-        font-size: $font-grey;
-        font-size: 36px;
-        padding-bottom: 40px;
-        border-bottom: 1px solid $border-color;
-        margin-bottom: 40px;
+        align-items: center;
+        margin-right: 20px;
+        padding: 0 20px;
+        .item{
+            flex: 1;
+            text-align: center;
+            font-size: 20px;
+            img{
+                width: 40px;
+                height: 40px;
+                display: block;
+                margin: 5px auto;
+            }
+        }
     }
-    .report-abstract{
-        font-size: 34px;
-        line-height: 54px;
-        margin: 40px 0;
+    .right-btn{
+        flex-shrink: 0;
+        position: relative;
+        width: 96px;
+        height: 96px;
+        background-color: $theme-color;
+        border-radius: 50%;
+        box-shadow: 0px 6px 28px 4px rgba(0, 0, 0, 0.05), 0px 16px 20px 2px rgba(0, 0, 0, 0.06), 0px 10px 10px -6px rgba(0, 0, 0, 0.1);
+        svg{
+            width: 27px;
+            height: 27px;
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%,-50%);
+        }
     }
 }
 
-@media screen and (min-width:$media-width){
-    .top-stage-box{
-        .stage{
-            border-radius: 4px;
-            height: 36px;
-            line-height: 36px;
-            padding: 0 10px;
-            font-size: 14px;
-        }
-    }
-    .report-detail-wrap{
-        padding: 30px;
-        max-width: 800px;
-        margin: 0 auto;
-        .report-title{
-            margin: 15px 0;
-            font-size: 21px;
-            line-height: 28px;
-        }
-        .auth-box{
-            font-size: 18px;
-            padding-bottom: 20px;
-            margin-bottom: 20px;
-        }
-        .report-abstract{
-            font-size: 17px;
-            line-height: 27px;
-            margin: 20px 0;
+.upload-audio-wrap{
+    height: 100%;
+    position: relative;
+    .bot-btns{
+        width: 100%;
+        position: absolute;
+        bottom: 0;
+        padding: 20px 0;
+        text-align: center;
+        .bot-btn{
+            width: 315px;
+            margin: 0 10px;
         }
     }
-}
+}   
 </style>

src/views/report/chapter/List.vue

@@ -7,6 +7,7 @@ import moment from 'moment';
 import { showToast,showDialog } from 'vant';
 import { useWindowSize } from '@vueuse/core'
 import {useCachedViewsStore} from '@/store/modules/cachedViews'
+import EditBaseInfo from './components/EidtBaseInfo.vue'
 
 const cachedViewsStore=useCachedViewsStore()
 const { width, height } = useWindowSize()
@@ -15,13 +16,22 @@ const { width, height } = useWindowSize()
 const route=useRoute()
 const router=useRouter()
 
+//基础信息
+const showBaseInfoPop=ref(false)
+//更新基本信息
+function handleUpdateBaseInfo(e){
+    reportInfo.value.Title=e.title
+    reportInfo.value.Author=e.author
+    reportInfo.value.CreateTime=e.createtime
+    showBaseInfoPop.value=false
+}
+
 // 获取报告详情
 let reportInfo=ref(null)
 async function getReportDetail(){
     const res=await apiReport.getReportDetail({ReportId:Number(route.query.id)})
     if(res.Ret===200){
         reportInfo.value=res.Data
-        currentDate.value=moment(res.Data.CreateTime).format('YYYY-MM-DD').split('-')
         document.title=res.Data.ClassifyNameFirst
     }
     getChapterList()
@@ -93,14 +103,6 @@ function goChapterDetail(item){
     })
 }
 
-// 修改报告时间
-const showDate=ref(false)
-const currentDate=ref([])
-function handleConfirmDateChange(e){
-    reportInfo.value.CreateTime=e.selectedValues.join('-')
-    showDate.value=false
-}
-
 
 // 保存报告信息
 async function handleSaveReportInfo(){
@@ -152,7 +154,7 @@ async function handlePublishReport(){
 
     if(reportInfo.value.ClassifyNameFirst==='周报'){
         showToast('发布成功')
-        getReportDetail()
+        router.back()
         return
     }
     // 晨报
@@ -172,11 +174,11 @@ async function handlePublishReport(){
                 const pushRes=await apiReport.reportMessageSend({ReportId:Number(reportInfo.value.Id)})
                 if(pushRes.Ret===200){
                     showToast('推送成功')
-                    getReportDetail()
+                    router.back()
                 }
             }).catch(()=>{
                 showToast('发布成功')
-                getReportDetail()
+                router.back()
             })
         })
     }else{
@@ -191,35 +193,15 @@ async function handlePublishReport(){
             const pushRes=await apiReport.reportMessageSend({ReportId:Number(reportInfo.value.Id)})
             if(pushRes.Ret===200){
                 showToast('推送成功')
-                getReportDetail()
+                router.back()
             }
         }).catch(()=>{
             showToast('发布成功')
-            getReportDetail()
+            router.back()
         })
     }
 }
 
-// 推送消息
-function handleSendMsg(){
-    apiReport.reportMessageSend({ReportId:Number(reportInfo.value.Id)}).then(res=>{
-        if(res.Ret===200){
-            showToast('推送成功')
-            getReportDetail()
-        }
-    })
-}
-
-// 取消发布
-function handlePublishCancel(){
-    apiReport.reportPublishCancle({ReportIds:Number(reportInfo.value.Id)}).then(res=>{
-        if(res.Ret===200){
-            showToast('取消发布成功')
-            getReportDetail()
-        }
-    })
-}
-
 // 显示海报
 const showChapterItemPoster=ref(false)
 const chapterItemPosterInfo=ref(null)
@@ -241,45 +223,10 @@ async function handleShowPoster(item){
 
 <template>
     <div class="report-chapterlist-page" v-if="reportInfo">
-        <div class="top-form-wrap">
-            <div class="form-item">
-                <span class="label">报告类型</span>
-                <span class="con" style="color:#999">{{reportInfo.ClassifyNameFirst}}</span>
-            </div>
-            <div :class="['form-item', reportInfo.State==1&&'edit-box']">
-                <span class="label">报告标题</span>
-                <input class="con" type="text" placeholder="请输入标题" v-model="reportInfo.Title" v-if="reportInfo.State==1">
-                <span class="con" style="color:#999" v-else>{{reportInfo.Title}}</span>
-            </div>
-            <div :class="['form-item', reportInfo.State==1&&'calendar-box']">
-                <span class="label">发布时间</span>
-                <span class="con" @click="showDate=true" v-if="reportInfo.State==1">{{moment(reportInfo.CreateTime).format('YYYY-MM-DD')}}</span>
-                <span class="con" style="color:#999" v-else>{{moment(reportInfo.CreateTime).format('YYYY-MM-DD')}}</span>
-            </div>
-            <div :class="['form-item', reportInfo.State==1&&'edit-box']">
-                <span class="label">作者</span>
-                <input class="con" type="text" placeholder="请输入作者" v-model="reportInfo.Author" v-if="reportInfo.State==1">
-                <span class="con" style="color:#999" v-else>{{reportInfo.Author}}</span>
-            </div>
-        </div>
-
+        <van-cell title="基础信息" is-link @click="showBaseInfoPop=true"/>
         <div class="chapter-list-wrap">
             <div class="top-box">
                 <span class="list-lable">章节列表</span>
-                <!-- 未发布 -->
-                <div v-if="reportInfo.State==1">
-                    <!-- 保存 -->
-                    <img @click="handleSaveReportInfo" class="btn" src="@/assets/imgs/report/icon_save.png" alt="" style="margin-right:20px">
-                    <!-- 发布 -->
-                    <img @click="handlePublishValid" class="btn" src="@/assets/imgs/report/icon_publish2.png" alt="">
-                </div>
-                <!-- 已发布 -->
-                <div v-if="reportInfo.State==2">
-                    <!-- 推送消息 -->
-                    <img v-if="reportInfo.MsgIsSend==0" @click="handleSendMsg" class="btn" src="@/assets/imgs/report/icon_sendmsg.png" alt="推送消息" style="margin-right:20px">
-                    <!-- 取消发布 -->
-                    <img @click="handlePublishCancel" class="btn" src="@/assets/imgs/report/icon_publish_cancel.png" alt="取消发布">
-                </div>
             </div>
             
             <ul class="chapter-list">
@@ -290,12 +237,10 @@ async function handleShowPoster(item){
                     </div>
                     <div class="content">
                         <div class="title">{{item.TypeName}}</div>
-                        <div 
-                            v-if="reportInfo.ClassifyNameFirst=='周报'" 
-                            :class="['audio-status',item.VideoUrl&&item.VideoKind==1?'audio-status-success':'']"
-                        >{{item.VideoUrl&&item.VideoKind==1?'已传录音':'未传录音'}}</div>
+                        <div class="tag-text" v-if="item.Trend">#{{item.Trend}}</div>
                         <div class="time">{{item.ModifyTime}}</div>
-
+                        <!-- 上传了音频icon -->
+                        <img class="audio-icon" src="@/assets/imgs/report/icon_audio.png" alt="" v-if="reportInfo.ClassifyNameFirst=='周报'&&item.VideoUrl&&item.VideoKind==1">
                         <div :class="['status',item.PublishState!=1&&'status-success']">{{item.PublishState==1?'未发布':'已发布'}}</div>
                         <img @click.stop="handleShowTrendTag(item)" class="icon icon-tag" src="@/assets/imgs/report/icon_tag.png" alt="">
                         <img v-if="item.PublishState==2" @click.stop="handleShowPoster(item)" class="icon icon-wx" src="@/assets/imgs/report/icon_wx.png" alt="">
@@ -303,8 +248,27 @@ async function handleShowPoster(item){
                 </li>
             </ul>
         </div>
-        
+
+        <div class="bot-btns">
+            <van-button class="bot-btn" type="default" @click="handlePublishValid">发布</van-button>
+            <van-button class="bot-btn" type="primary" @click="handleSaveReportInfo">保存</van-button>
+        </div>
     </div>
+
+    <!-- 基础信息 -->
+    <van-popup 
+        v-model:show="showBaseInfoPop" 
+        position="bottom"
+        :style="{height:'100%'}"
+    >
+        <EditBaseInfo 
+            v-if="showBaseInfoPop" 
+            :defaultData="reportInfo"
+            @close="showBaseInfoPop=false"
+            @confirm="handleUpdateBaseInfo"
+        />
+    </van-popup>
+
     <!-- 选择标签 -->
     <van-popup 
         v-model:show="showTagPop" 
@@ -322,21 +286,6 @@ async function handleShowPoster(item){
         />
     </van-popup>
 
-    <!-- 修改时间 -->
-    <van-popup 
-        v-model:show="showDate" 
-        round 
-        :position="width>650?'center':'bottom'"
-        :style="width>650?{ width: '400px'}:''"
-    >
-        <van-date-picker
-            v-model="currentDate"
-            title="选择日期"
-            @confirm="handleConfirmDateChange"
-            @cancel="showDate=false"
-        />
-    </van-popup>
-
     <!-- 海报 -->
     <van-popup 
         v-model:show="showChapterItemPoster" 
@@ -352,62 +301,29 @@ async function handleShowPoster(item){
 </template>
 
 <style lang="scss" scoped>
-.top-form-wrap{
-    padding: 32px 32px 0 32px;
-    .form-item{
+.report-chapterlist-page{
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    .bot-btns{
+        padding: 20px 0;
         display: flex;
-        align-items: center;
-        padding: 32px 0px;
-        font-size: 32px;
-        border-bottom: 1px solid $border-color;
-        .label{
-            color: #000;
-            display: inline-block;
-            width: 194px;
-        }
-        .con{
-            flex: 1;
+        justify-content: center;
+        .bot-btn{
+            width: 315px;
+            margin: 0 10px;
         }
     }
-    .edit-box::after{
-        content: '';
-        display: block;
-        width: 48px;
-        height: 48px;
-        background-image: url('@/assets/imgs/report/icon_edit.png');
-        background-size: cover;
-        background-repeat: no-repeat;
-    }
-    .calendar-box::after{
-        content: '';
-        display: block;
-        width: 48px;
-        height: 48px;
-        background-image: url('@/assets/imgs/report/icon_calendar.png');
-        background-size: cover;
-        background-repeat: no-repeat;
-    }
 }
 
-
 .chapter-list-wrap{
-    border-top: 10px solid #F2F6FA;
-    padding: 60px 34px;
-    .top-box{
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        align-items: center;
-        margin-bottom: 55px;
-        .btn{
-            width: 70px;
-            height: 70px;
-        }
-    }
+    flex: 1;
+    overflow-y: auto;
+    padding: 60px $page-padding;
     .list-lable{
         display: block;
-        font-weight: 600;
         font-size: 32px;
+        margin-bottom: 30px;
     }
 
 }
@@ -450,15 +366,18 @@ async function handleShowPoster(item){
             .title{
                 font-size: 32px;
                 font-weight: 600;
+                padding-right: 160px;
             }
             .time{
                 color: $font-grey;
             }
-            .audio-status{
-                color: $font-grey_999;
-                &.audio-status-success{
-                    color: $font-success;
-                }
+            
+            .audio-icon{
+                position: absolute;
+                width: 36px;
+                height: 36px;
+                top: 0;
+                right: 100px;
             }
 
             .status{
@@ -513,25 +432,13 @@ async function handleShowPoster(item){
     }
 }
 
+.report-baseinfo-wrap{
+    height: 100%;
+    position: relative;
+    background-color: $page-bg-grey;
+}
+
 @media screen and (min-width:$media-width){
-    .top-form-wrap{
-        padding: 16px 30px;
-        .form-item{
-            padding: 16px 0;
-            font-size: 16px;
-            .label{
-                width: 100px;
-            }
-        }
-        .edit-box::after{
-            width: 24px;
-            height: 24px;
-        }
-        .calendar-box::after{
-            width: 24px;
-            height: 24px;
-        }
-    }
     .chapter-list-wrap{
         border: none;
         padding: 30px;

src/views/report/chapter/components/EditChapterBaseInfo.vue

@@ -0,0 +1,168 @@
+<script setup>
+import { showToast } from "vant";
+import { reactive,ref } from "vue";
+
+const props=defineProps({
+    chapterInfo:null,
+    defaultData:null
+})
+const emits=defineEmits(['close','confirm'])
+
+const baseInfo=reactive({
+    type:props.defaultData.type||'',
+    title:props.defaultData.title||'',
+    addType:props.defaultData.addType||1,
+    ticket:[],
+    author:props.defaultData.author||'',
+    createTime:props.defaultData.createTime||'',
+})
+
+// 报告新增类型
+const showAddTypePop=ref(false)
+const addTypeOpts=[
+    {
+        value:1,
+        name:'空白报告'
+    },
+    {
+        value:2,
+        name:'继承报告'
+    }
+]
+function getAddTypeName(value){
+    return addTypeOpts.filter(item=>item.value===value)[0].name
+}
+function selectAddType(e){
+    baseInfo.addType=e.value
+}
+
+// 创建日期
+const minDate=new Date(2015, 0, 1)
+const defaultDate=ref(new Date())
+const showCreateTimePop=ref(false)
+function handleShowCreatetime(){
+    defaultDate.value=new Date(baseInfo.createtime.replace(/-/g,'/'))
+    showCreateTimePop.value=true
+}
+function handleConfirmCreatime(e){
+    baseInfo.createtime=moment(e).format('YYYY-MM-DD')
+    showCreateTimePop.value=false
+}
+
+// 报告标题
+const showReportTitlePop=ref(false)
+const temReportTitleVal=ref('')
+function handleShowReportTitle(){
+    temReportTitleVal.value=baseInfo.title
+    showReportTitlePop.value=true
+}
+function handleConfirmReportTitle(){
+    baseInfo.title=temReportTitleVal.value
+    showReportTitlePop.value=false
+}
+
+
+
+
+function close(){
+    emits('close')
+}
+
+function handleSave(){
+    if(!baseInfo.title){
+        showToast('请填写标题')
+        return
+    }
+    emits('confirm',baseInfo)
+}
+
+</script>
+
+<template>
+    <div class="chapter-baseinfo-wrap">
+        <van-cell-group>
+            <van-cell value-class="cell-con" required title="品种" :value="baseInfo.type"/>
+            <van-cell value-class="cell-con" required title="新增方式" is-link :value="getAddTypeName(baseInfo.addType)" @click="showAddTypePop=true"/>
+            <van-cell value-class="cell-con" title="显示指标" is-link value="" v-if="chapterInfo.ReportType==='day'"/>
+            <van-cell value-class="cell-con" title="创建人" is-link :value="baseInfo.author"/>
+            <van-cell value-class="cell-con" title="创建时间" is-link :value="baseInfo.createTime" @click="handleShowCreatetime"/>
+        </van-cell-group>
+        <van-cell-group style="margin-top:10px">
+             <van-cell value-class="cell-con" required title="标题" is-link :label="baseInfo.title" @click="handleShowReportTitle"/>
+        </van-cell-group>
+
+
+        <div class="bot-btns">
+            <van-button class="bot-btn" type="default" @click="close">取消</van-button>
+            <van-button class="bot-btn" type="primary" @click="handleSave">保存</van-button>
+        </div>
+    </div>
+
+    <!-- 新增方式 -->
+    <van-action-sheet 
+        v-model:show="showAddTypePop"
+        cancel-text="取消"
+        close-on-click-action
+        :actions="addTypeOpts" 
+        @select="selectAddType" 
+    />
+
+    <!-- 创建日期 -->
+    <van-calendar
+        :min-date="minDate"
+        :default-date="defaultDate"
+        v-model:show="showCreateTimePop"
+        title="选择创建日期"
+        @confirm="handleConfirmCreatime" 
+    />
+
+    <!-- 标题 -->
+    <van-popup
+        v-model:show="showReportTitlePop"
+        position="bottom"
+        :style="{ height: '100%' }"
+    >
+        <div class="input-report-title-pop">
+             <van-field v-model="temReportTitleVal" placeholder="请输入报告标题" />
+            <div class="bot-btns">
+                <van-button class="bot-btn" type="default" @click="showReportTitlePop=false">取消</van-button>
+                <van-button class="bot-btn" type="primary" :disabled="!temReportTitleVal" @click="handleConfirmReportTitle">确定</van-button>
+            </div>
+        </div>
+    </van-popup>
+</template>
+
+<style lang="scss" scoped>
+.chapter-baseinfo-wrap{
+    height: 100%;
+    position: relative;
+    background: $page-bg-grey;
+    :deep(.cell-con){
+        flex: 2;
+    }
+    .bot-btns{
+        position: absolute;
+        bottom: 48px;
+        left: 0;
+        width: 100%;
+        text-align: center;
+    }
+}
+.bot-btn{
+    width: 315px;
+    margin: 0 10px;
+}
+.input-report-title-pop{
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    background-color: $page-bg-grey;
+    
+    .bot-btns{
+        flex-shrink: 0;
+        padding: 20px 0;
+        text-align: center;
+    }
+}
+</style>

src/views/report/chapter/components/EidtBaseInfo.vue

@@ -0,0 +1,169 @@
+<script setup>
+import moment from 'moment'
+import {ref,reactive} from 'vue'
+import { showToast } from 'vant'
+
+const props=defineProps({
+    defaultData:null
+})
+
+const emits=defineEmits(['confirm','close'])
+
+// 基本数据
+const reportBaseInfo=reactive({
+    addType:props.defaultData.ClassifyNameFirst,
+    title:props.defaultData.Title||'',
+    author:props.defaultData.Author||'弘则研究',
+    createtime:moment(props.defaultData.CreateTime).format('YYYY-MM-DD')||moment().format('YYYY-MM-DD'),
+})
+
+
+// 报告标题
+const showReportTitlePop=ref(false)
+const temReportTitleVal=ref('')
+function handleShowReportTitle(){
+    temReportTitleVal.value=reportBaseInfo.title
+    showReportTitlePop.value=true
+}
+function handleConfirmReportTitle(){
+    reportBaseInfo.title=temReportTitleVal.value
+    showReportTitlePop.value=false
+}
+
+// 创建日期
+const minDate=new Date(2015, 0, 1)
+const defaultDate=ref(new Date())
+const showCreateTimePop=ref(false)
+function handleShowCreatetime(){
+    defaultDate.value=new Date(reportBaseInfo.createtime.replace(/-/g,'/'))
+    showCreateTimePop.value=true
+}
+function handleConfirmCreatime(e){
+    reportBaseInfo.createtime=moment(e).format('YYYY-MM-DD')
+    showCreateTimePop.value=false
+}
+
+//作者
+const showAuthorPop=ref(false)
+const temAuthorVal=ref('')
+function handleShowAuthor(){
+    temAuthorVal.value=reportBaseInfo.author
+    showAuthorPop.value=true
+}
+function handleConfirmAuthor(){
+    reportBaseInfo.author=temAuthorVal.value
+    showAuthorPop.value=false
+}
+
+function handleSave(){
+    if(!reportBaseInfo.title){
+        showToast('请填写报告标题')
+        return
+    }
+    emits('confirm',reportBaseInfo)
+}
+
+
+function close(){
+    emits('close')
+}
+</script>
+
+<template>
+    <div class="dayweek-report-add">
+        <van-cell-group>
+            <van-cell 
+                value-class="cell-con" 
+                required 
+                title="报告类型" 
+                :value="reportBaseInfo.addType"
+            />
+        </van-cell-group>
+        <van-cell-group style="margin:10px 0">
+            <van-cell required title="报告标题" :label="reportBaseInfo.title" is-link @click="handleShowReportTitle"/>
+        </van-cell-group>
+        <van-cell-group>
+            <van-cell required title="发布时间" :value="reportBaseInfo.createtime" is-link @click="handleShowCreatetime"/>
+            <van-cell title="作者" :value="reportBaseInfo.author" is-link @click="handleShowAuthor"/>
+        </van-cell-group>
+
+        <div class="bot-btns">
+            <van-button class="bot-btn" type="default" @click="close">取消</van-button>
+            <van-button class="bot-btn" type="primary" @click="handleSave">保存</van-button>
+        </div>
+    </div>
+    
+    <!-- 标题 -->
+    <van-popup
+        v-model:show="showReportTitlePop"
+        position="bottom"
+        :style="{ height: '100%' }"
+    >
+        <div class="input-report-title-pop">
+             <van-field v-model="temReportTitleVal" placeholder="请输入报告标题" />
+            <div class="bot-btns">
+                <van-button class="bot-btn" type="default" @click="showReportTitlePop=false">取消</van-button>
+                <van-button class="bot-btn" type="primary" :disabled="!temReportTitleVal" @click="handleConfirmReportTitle">确定</van-button>
+            </div>
+        </div>
+    </van-popup>
+
+    <!-- 创建日期 -->
+    <van-calendar
+        :min-date="minDate"
+        :default-date="defaultDate"
+        v-model:show="showCreateTimePop"
+        title="选择创建日期"
+        @confirm="handleConfirmCreatime" 
+    />
+
+    <!-- 作者 -->
+    <van-popup
+        v-model:show="showAuthorPop"
+        position="bottom"
+        :style="{ height: '100%' }"
+    >
+        <div class="input-report-title-pop">
+             <van-field v-model="temAuthorVal" placeholder="请填写作者" />
+            <div class="bot-btns">
+                <van-button class="bot-btn" type="default" @click="showAuthorPop=false">取消</van-button>
+                <van-button class="bot-btn" type="primary" :disabled="!temAuthorVal" @click="handleConfirmAuthor">确定</van-button>
+            </div>
+        </div>
+    </van-popup>
+</template>
+
+<style lang="scss" scoped>
+.dayweek-report-add{
+    height: 100%;
+    position: relative;
+    background: #EDEDED;
+    :deep(.cell-con){
+        flex: 2;
+    }
+    .bot-btns{
+        position: absolute;
+        bottom: 48px;
+        left: 0;
+        width: 100%;
+        text-align: center;
+    }
+}
+.bot-btn{
+    width: 315px;
+    margin: 0 10px;
+}
+.input-report-title-pop{
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    background-color: $page-bg-grey;
+    
+    .bot-btns{
+        flex-shrink: 0;
+        padding: 20px 0;
+        text-align: center;
+    }
+}
+</style>

src/views/report/components/EditReportBaseInfo.vue

@@ -283,7 +283,7 @@ function handleSave(){
 .report-baseinfo-wrap{
     height: 100%;
     position: relative;
-    background: #EDEDED;
+    background: $page-bg-grey;
     :deep(.cell-con){
         flex: 2;
     }