<template>
    <div class="policy">
      <h3>考试政策<em>/Examination policy</em></h3>
      <div class="row">
        <router-link :to="{path: '/detail', query: {contentId: firstPolicy.contentId}}" tag="div" class="first" :title="firstPolicy.title">
          <img :src="newsUrl + 'route/file/download/true/' + firstPolicy.coverPhotos" alt="">
          <p>{{ firstPolicy.title }}</p>
        </router-link>
        <div class="list">
          <ul>
            <router-link v-for="(item,idx) in policyList" :key="idx" :to="{path: '/detail', query: {contentId: item.contentId}}" tag="li" :title="item.title">
              <div class="date">
                <span>{{ item.publishDate }}</span>
                <p>{{ item.year }}</p>
              </div>
              <div class="news">
                <div class="news-title">{{ item.title }}</div>
                <p>{{ item.summary }}</p>
              </div>
            </router-link>
          </ul>
        </div>
      </div>
    </div>
</template>

<script>
import url from '@/assets/public/url'
export default {
    name: 'Policy',
    components: {},
    props: {
      policyList: Array,
      firstPolicy: Object
    },
    data () {
        return {
          newsUrl: url.signUrl,
        }
    },
    methods: {},
    mounted: function () {}
}
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
.policy
  width 1200px
  margin 0 auto 45px
  h3
    font-size 24px
    color #005aa5
    font-weight normal
    margin-bottom 20px
    em
      font-size 16px
      color #999
      margin-left 10px
  .row
    overflow hidden
    .first
      float left
      width 590px
      height 345px
      cursor pointer
      position relative
      p
        position absolute
        left 0
        right 0
        bottom 0
        padding 0 10px
        height 35px
        line-height 35px
        background rgba(0,0,0,0.6)
        font-size 16px
        color #fff
        white-space nowrap
        overflow hidden
        text-overflow ellipsis
      img
        width 100%
        height 100%
    .list
      float right
      width 545px
      ul
        li
          padding-bottom 25px
          border-bottom 1px dashed #dcdcdc
          margin-bottom 25px
          overflow hidden
          cursor pointer
          &:last-child
            margin-bottom 0
            padding-bottom 0
            border none
          &:hover
            .news-title
              color #005aa5 !important
          .date
            width 80px
            height 80px
            padding 20px 10px
            background #4184dd
            box-sizing border-box
            font-size 20px
            color #fff
            text-align center
            float left
            p
              font-size 16px
              text-align left
          .news
            float left
            margin-left 25px
            width 400px
            .news-title
              font-size 16px
              color #333
              white-space nowrap
              overflow hidden
              text-overflow ellipsis
              margin-bottom 10px
            p
              display -webkit-box
              overflow hidden
              -webkit-line-clamp 2
              -webkit-box-orient vertical
              font-size 14px
              color #999
</style>
