eta1.1.4

src/api/modules/smartReport.js

@@ -26,6 +26,21 @@ const apiSmartReport={
     //报告取消发布
     publishCancel:params=>{
         return http.post('/report/publish/cancle',params)
+    },
+
+    // 作者
+    reportAuthor:params=>{
+        return http.get('/report/author',params)
+    },
+
+    //新增报告
+    reportAdd:params=>{
+        return http.post('/report/add',params)
+    },
+
+    //编辑报告
+    reportEdit:params=>{
+        return http.post('/report/edit',params)
     }
 
 

src/views/smartReport/components/BaseInfo.vue

@@ -0,0 +1,227 @@
+<template>
+    <el-dialog
+        title="基础信息"
+        :visible.sync="show"
+        :modal-append-to-body="false"
+        :close-on-click-modal="false"
+        :center="true"
+        v-dialogDrag
+        custom-class="dialogclass"
+        width="440px"
+        @close="handleClose"
+    >
+        <el-form 
+            :model="formData" 
+            :rules="rules" 
+            ref="baseinfoForm"
+            class="baseinfo-form-wrap"
+        >  
+            <el-form-item prop="type">
+                <el-radio-group v-model="formData.type">
+                    <el-radio :label="1">新增报告</el-radio>
+                    <el-radio :label="2">继承报告</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item prop="classify">
+                <el-cascader
+					ref="cascader"
+					:options="classifyArr"
+					v-model="formData.classify"
+					placeholder="请选择分类"
+					size="medium"
+                    style="width:340px"
+				/>
+            </el-form-item>
+            <el-form-item prop="title">
+                <el-input placeholder="请输入标题" v-model="formData.title" style="width:340px"></el-input>
+            </el-form-item>
+            <el-form-item prop="abstract">
+                <el-input type="textarea" placeholder="请输入摘要" v-model="formData.abstract" style="width:340px"></el-input>
+            </el-form-item>
+            <el-form-item prop="author">
+				<el-select
+					v-model="formData.author"
+					multiple
+					placeholder="请选择作者"
+					size="medium"
+					style="width: 340px"
+				>
+					<el-option
+						v-for="(item, i) in authorlist"
+						:key="i"
+						:label="item.ReportAuthor"
+						:value="item.ReportAuthor"
+					></el-option>
+				</el-select>
+			</el-form-item>
+            <el-form-item prop="frequency">
+                <el-select
+					v-model="formData.frequency"
+					placeholder="请选择频度"
+					size="medium"
+					style="width: 340px"
+				>
+                    <el-option label="年度" value="年度"></el-option>
+                    <el-option label="半年度" value="半年度"></el-option>
+                    <el-option label="季度" value="季度"></el-option>
+                    <el-option label="月度" value="月度"></el-option>
+                    <el-option label="双周度" value="双周度"></el-option>
+                    <el-option label="周度" value="周度"></el-option>
+                    <el-option label="日度" value="日度"></el-option>
+                    <el-option label="不定时" value="不定时"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item prop="time">
+                <el-date-picker
+					v-model="formData.time"
+					type="date"
+					value-format="yyyy-MM-dd"
+					placeholder="选择日期"
+					size="medium"
+					:clearable="false"
+					style="width: 340px"
+				></el-date-picker>
+            </el-form-item>
+        </el-form>
+        <div style="text-align:center;margin-top:60px;margin-bottom:40px">
+            <el-button type="primary" plain style="width:120px" @click="handleClose">取消</el-button>
+            <el-button type="primary" style="width:120px" @click="handleConfirm">确定</el-button>
+        </div>
+    </el-dialog>
+</template>
+
+<script>
+import {apiSmartReport}  from '@/api/modules/smartReport'
+export default {
+    name:"BaseInfo",
+    model:{
+        prop:'show',
+        event:'showChange'
+    },
+    props:{
+        show:{
+            type:Boolean,
+            default:false
+        },
+        id:{
+            type:Number,
+            default:0
+        }
+    },
+    watch: {
+        show(n){
+            if(!n){
+                this.formData.type=1
+                this.formData.classify=[]
+                this.formData.title=''
+                this.formData.abstract=''
+                this.formData.author=[]
+                this.formData.frequency=''
+                this.formData.time=this.$moment().format('YYYY-MM-DD')
+            }
+        }  
+    },
+    data() {
+        return {
+            rules:{
+                type:[{ required: true, message: '请选择报告类型', trigger: 'change' }],
+                classify:[{ required: true, message: '请选择报告分类', trigger: 'change' }],
+                title:[{ required: true, message: '请填写报告标题', trigger: 'blur' }],
+            },
+            formData:{
+                type:1,
+                classify:[],
+                title:'',
+                abstract:'',
+                author:[],
+                frequency:'',
+                time:this.$moment().format('YYYY-MM-DD')||''
+            },
+            classifyArr:[],
+            authorlist:[]
+        }
+    },
+   
+    methods: {
+        handleClose(){
+            this.$emit('showChange', false)
+        },
+
+        handleConfirm(){
+            this.$refs.baseinfoForm.validate((valid)=>{
+                if(valid){
+                    const params={
+                        AddType: this.formData.type,
+                        ClassifyIdFirst: '',
+                        ClassifyNameFirst: '',
+                        ClassifyIdSecond:'',
+                        ClassifyNameSecond:'',
+                        Title: this.formData.title,
+                        Abstract: this.formData.abstract,
+                        Author:
+                            this.formData.author.length > 0
+                                ? this.formData.author.join(',')
+                                : '',
+                        Frequency: this.formData.frequency,
+                        Content: '',
+                        CreateTime: this.formData.time,
+                        ReportVersion: 2
+                    }
+                }
+            })
+        },
+
+        // 获取分类
+        getclassifylist() {
+            let params = { CurrentIndex: 0, PageSize: 1000, KeyWord: "",HideDayWeek:1,/*不显示晨报/周报*/ };
+            apiSmartReport.classifyList(params).then((res) => {
+                if (res.Ret == 200 && Array.isArray(res.Data.List)) {
+                    this.classifyArr = [];
+                    res.Data.List.forEach((item, index) => {
+                        let newitem = {
+                            label: item.ClassifyName,
+                            value: item.Id,
+                        };
+                        if (item.Child) {
+                            let childnode = [];
+                            item.Child.forEach((itemchild, i) => {
+                                childnode.push({
+                                    label: itemchild.ClassifyName,
+                                    value: itemchild.Id,
+                                });
+                            });
+                            newitem.children = childnode;
+                        }
+                        this.classifyArr.push(newitem);
+                    });
+                }
+            });
+        },
+        // 获取作者
+        getreportauthor() {
+			apiSmartReport.reportAuthor({}).then((res) => {
+				if (res.Ret == 200) {
+					this.authorlist = res.Data.List || [];
+				}
+			});
+		},
+    },
+    mounted(){
+        this.getclassifylist()
+        this.getreportauthor()
+    },
+}
+</script>
+
+<style lang="scss">
+.baseinfo-form-wrap{
+    .el-input{
+        width: 100%;
+    }
+    .el-form-item{
+        width: 340px;
+        margin-left: auto;
+        margin-right: auto;
+    }
+}
+</style>

src/views/smartReport/editReport.vue

@@ -1,58 +1,106 @@
 <template>
     <div class="edit-smart-report-page">
-        <div class="left-wrap">
-            <draggable
-                :list="compList"
-                :group="{ name: 'component', pull: 'clone', put: false }"
-                class="temp-component-list"
-                animation="300"
-                tag="div"
-                :sort="false"
-            >
-                <div 
-                    class="item"
-                    v-for="item in compList" 
-                    :key="item.compId" 
-                    :comp-type="item.compType"
-                >{{item.compType}}</div>
-            </draggable>
+        <!-- 顶部操作栏 -->
+        <div class="top-action-wrap">
+            <div class="title">标题</div>
+            <ul class="action-list">
+                <li class="action-item">
+                    <img src="~@/assets/img/smartReport/icon01.png" alt="">
+                    <span>基础信息</span>
+                </li>
+                <li class="action-item">
+                    <img src="~@/assets/img/smartReport/icon02.png" alt="">
+                    <span>图表刷新 </span>
+                </li>
+                <li class="action-item">
+                    <img src="~@/assets/img/smartReport/icon03.png" alt="">
+                    <span>预览</span>
+                </li>
+                <li class="action-item">
+                    <img src="~@/assets/img/smartReport/icon01.png" alt="">
+                    <span>存草稿</span>
+                </li>
+                <li class="action-item">
+                    <img src="~@/assets/img/smartReport/icon01.png" alt="">
+                    <span>定时发布</span>
+                </li>
+                <li class="action-item">
+                    <img src="~@/assets/img/smartReport/icon01.png" alt="">
+                    <span>发布</span>
+                </li>
+            </ul>
         </div>
         <div class="main-wrap">
-            <!-- <draggable
-                :list="conList"
-                :group="{ name: 'component', pull: true, put: true }"
-                class="report-html-wrap"
-                animation="300"
-                tag="div"
-                @add="handleAdd"
-            >
-                <template v-for="comp in conList">
-                    <component :is="getComponentName(comp)" :key="comp.id" :compData="comp" @childAdd="handleChildAdd"/>
-                </template>
-            </draggable> -->
-            <draggable
-                :list="conList"
-                :group="{ name: 'component', pull: true, put: true }"
-                class="report-html-wrap"
-                animation="300"
-                tag="div"
-                @add="handleAdd"
-            >
-                <div class="report-drag-item-wrap " v-for="item in conList" :key="item.id">
+            <div class="report-action-wrap">
+                <ul class="top-type-list">
+                    <li class="item">
+                        <img class="icon" src="~@/assets/img/smartReport/icon04.png" alt="">
+                        <span>图库</span>
+                    </li>
+                    <li class="item">
+                        <img class="icon" src="~@/assets/img/smartReport/icon05.png" alt="">
+                        <span>ETA表格</span>
+                    </li>
+                    <li class="item">
+                        <img class="icon" src="~@/assets/img/smartReport/icon06.png" alt="">
+                        <span>统计分析</span>
+                    </li>
+                    <li class="item">
+                        <img class="icon" src="~@/assets/img/smartReport/icon07.png" alt="">
+                        <span>商品价格曲线</span>
+                    </li>
+                    <li class="item">
+                        <img class="icon" src="~@/assets/img/smartReport/icon08.png" alt="">
+                        <span>沙盘图</span>
+                    </li>
+                    <li class="item">
+                        <img class="icon" src="~@/assets/img/smartReport/icon09.png" alt="">
+                        <span>语义分析</span>
+                    </li>
+                </ul>
+                <!-- 公共组件 -->
+                <draggable
+                    :list="compList"
+                    :group="{ name: 'component', pull: 'clone', put: false }"
+                    class="report-comp-wrap"
+                    animation="300"
+                    :sort="false"
+                    tag="ul"
+                >
+                    <li class="comp-item" :comp-type="comp.compType" v-for="comp in compList" :key="comp.id">
+                        <img :src="comp.icon">
+                    </li>
+                </draggable>
+
+                <div class="report-content-box">
                     <draggable
-                        :list="item.child"
+                        :list="conList"
                         :group="{ name: 'component', pull: true, put: true }"
+                        class="report-html-wrap"
                         animation="300"
                         tag="div"
-                        class="report-drag-item-wrap_child-wrap"
-                        @add="handleChildAdd"
+                        @add="handleAdd"
                     >
-                        <div class="report-drag-item-wrap_child" v-for="child in item.child" :key="child.id">
-                        {{child.type}}
+                        <div class="report-drag-item-wrap" v-for="item in conList" :key="item.id">
+                            <draggable
+                                :list="item.child"
+                                :group="{ name: 'component', pull: true, put: true }"
+                                animation="300"
+                                tag="div"
+                                class="report-drag-item-wrap_child-wrap"
+                                @add="handleChildAdd"
+                            >
+                                <div class="report-drag-item-wrap_child" v-for="child in item.child" :key="child.id">
+                                {{child.type}}
+                                </div>
+                            </draggable>
                         </div>
                     </draggable>
                 </div>
-            </draggable>
+            </div>
+
+            <div class="right-action-wrap">
+            </div>
         </div>
     </div>
 </template>
@@ -76,51 +124,18 @@ export default {
     data() {
         return {
             compList:[
-                {
-                    compId:0,
-                    compType:'wrap'
-                },
                 {
                     compId:1,
-                    compType:'text'
-                },
-                {
-                    compId:2,
-                    compType:'chart'
+                    compType:'text',
+                    icon:require('@/assets/img/smartReport/icon10.png')
                 },
                 {
                     compId:3,
-                    compType:'img'
+                    compType:'img',
+                    icon:require('@/assets/img/smartReport/icon11.png')
                 },
             ],
-            conList:[
-                {
-                    id:1,
-                    child:[
-                        {
-                            id:'21324321',
-                            type:'1'
-                        },
-                        {
-                            id:'21324re321',
-                            type:'4'
-                        }
-                    ]
-                },
-                {
-                    id:2,
-                    child:[
-                        {
-                            id:'414214',
-                            type:'2'
-                        },
-                        {
-                            id:'654432',
-                            type:'3'
-                        }
-                    ]
-                }
-            ]
+            conList:[]
         }
     },
     methods: {
@@ -142,13 +157,14 @@ export default {
             return type+new Date().getTime()
         },
 
-        handleChildAdd({list,data}){
-            console.log(list,data);
-            this.conList.forEach(item=>{
-                if(item.id===data.id){
-                    item.child=list
-                }
-            })
+        handleChildAdd(e){
+            console.log('child-onAdd操作------------------->', e);
+            // console.log(list,data);
+            // this.conList.forEach(item=>{
+            //     if(item.id===data.id){
+            //         item.child=list
+            //     }
+            // })
         },
 
         handleAdd(e){
@@ -166,6 +182,7 @@ export default {
                 id:this.getCompId(comp.compType),
                 child:[]
             }
+            console.log(tempCompData);
             this.conList.splice(newDraggableIndex,1,tempCompData)
         }
     },
@@ -177,27 +194,119 @@ div{
     box-sizing: border-box;
 }
 .edit-smart-report-page{
-    display: flex;
-    .left-wrap{
-        width: 300px;
+    .top-action-wrap{
+        position: sticky;
+        top: 0px;
         background-color: #fff;
-        min-height: 90vh;
-        .temp-component-list{
-            .item{
-                margin-left: 10px;
-                margin-bottom: 30px;
-                width: 280px;
-                height: 150px;
-                background-color: beige;
+        box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.10);
+        height: 60px;
+        display: flex;
+        justify-content: space-between;
+        align-content: center;
+        .title{
+            line-height: 60px;
+            font-size: 16px;
+        }
+        .action-list{
+            display: flex;
+            align-items: center;
+            .action-item{
+                height: 36px;
+                display: flex;
+                align-items: center;
+                border-right: 1px solid #C8CDD9;
+                padding: 0 30px;
+                font-size: 16px;
+                cursor: pointer;
+                img{
+                    width: 16px;
+                    height: 16px;
+                    margin-right: 4px;
+                    position: relative;
+                    top: 2px;
+                }
+                &:last-child{
+                    border-right: none;
+                }
             }
         }
     }
+    .main-wrap{
+        display: flex;
+
+    }
 }
+.report-action-wrap{
+    width: 800px;
+    flex-shrink: 0;
+    margin-left: 90px;
+    margin-right: 60px;
+    position: relative;
+    .report-comp-wrap{
+            position: absolute;
+            left: -62px;
+            top: 72px;
+            width: 40px;
+            border: 1px solid var(--gary-gy-5-line, #C8CDD9);
+            background: var(--gary-gy-white, #FFF);
+            border-radius: 4px;
+            overflow: hidden;
+            .comp-item{
+                cursor: pointer;
+                height: 40px;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                border-bottom: 1px solid var(--gary-gy-5-line, #C8CDD9);
+                &:last-child{
+                    border-bottom: none;
+                }
+                img{
+                    width: 16px;
+                }
+            }
+    }
+    .top-type-list{
+        margin-bottom: 20px;
+        display: flex;
+        align-items: center;
+        background-color: #fff;
+        height: 50px;
+        border-radius: 4px;
+        border: 1px solid var(--gary-gy-5-line, #C8CDD9);
+        .item{
+            cursor: pointer;
+            flex: auto;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            border-right: 1px solid #C8CDD9;
+            font-size: 16px;
+            &:last-child{
+                border-right: none;
+            }
+            .icon{
+                width: 20px;
+                height: 20px;
+                margin-right: 4px;
+            }
+        }
+    }
+    .report-content-box{
+        border-radius: 4px;
+        border: 1px solid var(--gary-gy-5-line, #C8CDD9);
+        background: #FFF;
+        padding: 20px 20px 20px 64px;
+        height: 80vh;
+        position: relative;
+        overflow-y: auto;
+        
+    }
+}
+
+
+
 .main-wrap{
-    background-color: #fff;
-    width: 864px;
-    min-height: 90vh;
-    margin: 0 30px;
     .report-html-wrap{
         min-height: 50vh;
         .report-drag-item-wrap{
@@ -216,6 +325,9 @@ div{
             flex: 1;
             
         }
+        .blue-bg{
+            background: var(--brand-brand-1-light, #ECF2FE);
+        }
     }
 }
 </style>

src/views/smartReport/reportList.vue

@@ -8,7 +8,7 @@
                         v-permission="permissionBtn.reportManageBtn.reportManage_reportAdd"
                         type="primary"
                         size="medium"
-                        @click="$router.push({ path: '/addreportNew' })"
+                        @click="showAddReport=true"
                     >添加研报</el-button>
                 </el-form-item>
                 <el-form-item label="">
@@ -367,13 +367,18 @@
                 >
             </div>
         </el-dialog>
+
+        <!-- 新增报告基础信息 -->
+        <BaseInfo v-model="showAddReport" :id="0" />
     </div>
 </template>
 
 <script>
 import { voiceupload } from "api/api.js";
 import {apiSmartReport}  from '@/api/modules/smartReport'
+import BaseInfo from './components/BaseInfo.vue'
 export default {
+    components:{BaseInfo},
     computed:{
         Role() {
             let role = localStorage.getItem("Role") || "";
@@ -414,6 +419,8 @@ export default {
                 audioname: "",
             },
             uploadloading: false,
+
+            showAddReport:false
         }
     },
     methods:{
@@ -545,7 +552,7 @@ export default {
         //报告类型
         getclassifylist() {
             //获取分类列表
-            let params = { CurrentIndex: 0, PageSize: 1000, KeyWord: "" };
+            let params = { CurrentIndex: 0, PageSize: 1000, KeyWord: "",HideDayWeek:1,/*不显示晨报/周报*/ };
             apiSmartReport.classifyList(params).then((res) => {
                 if (res.Ret == 200 && Array.isArray(res.Data.List)) {
                     this.optionsArr = [];