study_sm/src/containers/center/message/index.vue.bak

<template>
  <div class="m-right-block fr mh576" style="position: relative;">
    <div class="right-block-bd">

      <div class="right mh500 mt30" v-if="isPost">
        
         <div class="tr">
           <a class="ui-btn btn-gr btn-m" @click="isPost=false">
             返回</a>
        </div>
        
        <div class="m-notice-detail ">
          <p class="fs18 tc bor-b mb30 pb20 pt20 b rel ng-binding">
            {{info.title}}
           </p>
          <p class="notice-info tc ng-binding">
            发布时间：{{info.publishTime}}
            <span class="ml30 ng-binding">来源：{{info.author}}</span>
            <span class="ml30 ng-binding">阅读数：{{info.viewCount}}</span>
          </p>

          <span v-html="info.content"></span>
        </div>
      </div>

      <div v-else class="ng-scope">
        <div class="m-account">
          <div class="account-tit">
            <a @click="type='交流互动'" :class="{'current':type=='交流互动'}"  href="javascript:void(0)">交流互动</a>
            <a @click="type='常见问题'" :class="{'current':type=='常见问题'}"  href="javascript:void(0)">常见问题</a>
          </div>
        </div>

        <ul class="m-notice ng-scope" v-for="item in list" :key="item.postId">
          <li class="done">
            <span class="p-ico2" style="top: -2px"></span>
            <a href="javascript:void(0)" @click="gotoDetail(item.postId)" class="ng-binding">
              {{item.title}}
            </a>
            <span class="time ng-binding">{{item.publishTime|dateformat}}</span>
          </li>
        </ul>
        <el-pagination
          @current-change="handleCurrentChange"
          :current-page="page"
          :page-size="size"
          layout="total, prev, pager, next"
          class="m-pages"
          :total="total">
        </el-pagination>
      </div>

    </div>

  </div>
</template>


<script>
    import {httpServer} from "@/components/httpServer/httpServer.js";
    import {parseTime} from "@/utils/index.js";
  export default {
    name: 'cert',
    data() {
      return {
        page: 1, //初始页
        size: 10, //    每页的数据
        type:'通知',
        isPost:false,
        info:{},
        list: [],
        total: 0,
        listLoading: true
      }
    },
    filters:{
      dateformat(val){
        return parseTime( +new Date(val), '{y}-{m}-{d}')
      }
    },
    beforeMount() {
      this.getList()
    },
    watch: {
      type(res) {
        this.currentPage = 1
        this.getList()
      }
    },
    methods: {
      getList() {
        this.listLoading = true
        let page = this.page
        let type= this.type
        httpServer("Course.getPostList", {page,type }).then( ({data, code}) => {
          let { total, list } = data
          if (!list) list = [];
          this.list = list.map(v => {
            this.$set(v, 'edit', false)
            return v
          })
          this.total = total || 0;
          this.listLoading = false
        })
      },
      gotoDetail(postId) {
        httpServer("Course.getPostInfo", {postId}).then(({
          data,
          code
        }) => {
          this.info = data
          this.isPost = true
          this.listLoading = false
        })
      },
      handleCurrentChange: function(currentPage) {
        this.page = currentPage;
        this.getList()
      }
    }
  }
</script>

<style>
    @import url("./index.css");
    @import url("../../../assets/css/m-account.css");
    @import url("../../../assets/css/m-notice.css");
</style>