dev/dcp-web-gate/src_old/views/helpCenter/development/developmentDetails.vue

<template>
    <div class="autoBox box" >
        <div class="crumbs">
          <el-breadcrumb separator="/">
            <el-breadcrumb-item :to="{ path: 'home' }">{{$t('common.Home')}}</el-breadcrumb-item>
            <el-breadcrumb-item :to="{ path: 'developmentCooperation' }">发展合作留言</el-breadcrumb-item>
            <el-breadcrumb-item>发展合作留言详情</el-breadcrumb-item>
          </el-breadcrumb>
        </div>
        <!-- 留言内容 -->
         <div style="margin: 20px auto;padding:20px 10px;width:92%;border-bottom:1px dashed #cecece">
            <div>
                <div style="width:40px;height:40px;border-radius:50%;border:1px solid #aaaaaa;display:inline-block">
                    <img src="@/assets/img/helpCenter/head.jpg" alt="" style="width:100%;border-radius: 50%;">
                </div>
                <div style="width:92%;float:right;">
                    <div>
                        <span style="float:left;color:#3a88c6;">{{messageList.title}}</span>
                        <span style="float:right;color:#c1c1c1">{{$t('common.MessageTime')}}：{{formatDate(messageList.update_date)}}</span>
                    </div>
                    <div style="margin:30px 0;">
                        <p v-html="messageList.content"> </p>
                    </div>
                    <div>
                        <span style="float:right;margin-left:34px;color:#c1c1c1"><span style="color:#000">{{messageList.collect_num}} </span>{{$t('common.Collect')}}</span>
                        <span style="float:right;margin-left:34px;color:#c1c1c1"><span style="color:#000">{{messageList.like_num}}</span>{{$t('common.Praise')}}</span>
                    </div>
                </div>
                <div style="clear:both"></div>
            </div>
        </div>
        <!-- 平台回复 -->
        <div class="Platform" v-show="this.replyMess ">
            <div style="height:70px;background:#f1f4f9;border-bottom:1px solid #cecece;padding:0 30px;line-height: 70px;">
                <span style="float:left;font-size:24px;color:#3c5375;font-weight:700">GEIDCP平台回复</span>
            </div>
            <div v-for="(item,index) in replyMess" style="border-bottom:1px dotted #aaaaaa;width:95%;margin:auto" >
                <div style="margin:30px 0;">
                    <span style="float:right;color:#c1c1c1;width:18%">回复时间：<span>{{item.update_date}}</span></span>
                    <p style="float:left;width:70%;display:inline-block" v-html="item.content"> </p>
                    <div style="clear:both"></div>
                </div>
                <!-- <div style="height: 20px;margin-bottom: 30px;padding:0 40px;">
                    <span style="float:right;margin-left:34px;color:#c1c1c1"><span style="color:#000">15 </span>{{$t('common.Collect')}}</span>
                    <span style="float:right;margin-left:34px;color:#c1c1c1"><span style="color:#000">10</span>{{$t('common.Praise')}}</span>
                </div> -->
            </div>
            
        </div>
    </div>
  
</template>
<script>
    import Screen from '@/components/screen'
    import { getMessage,getsCustomized,getColumnTree,saveOrUpdate } from "@/api/baseDevelopment"
    import { formatDate } from "@/utils/formatUtils";
    import Base from "@/views/base/Base";
    export default {
    name: 'developmentDetails',
    extends: Base,
    components:{Screen},
    data () {
        return {
            active:1,
            messageList:{},
            replyMess:[]
        }
    },
    mounted(){
        this.getMessages()
    },
    methods:{
        getImg(url){
            return require(url);
        },
        //获取留言信息
        getMessages(){
            var params={
                id:this.$route.query.key.id
            };     
            getMessage(params).then(res=>{                
                this.messageList = res.data.baseDevelopmentCooperationMessage;              
                this.replyMess = res.data.baseDevelopmentCooperationReplyMessages;
                this.replyMess.forEach((i) => {
                    i.update_date = i.update_date
                        ? formatDate(i.update_date, "YYYY-MM-DD")
                        : "";
                })
            });
        },
    }

    }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

body {
    margin: 0;
}
.box {
    margin-top: 10px;
    background: #fff;
    /* height: 500px; */
    padding: 20px 0;
}
.crumbs {
    margin-left: 20px;
}

.Platform{
    width: 100%;
    margin: 28px 0;
    border-top: 3px solid #2f5586;
    border-bottom: 3px solid #2f5586;
}

</style>