<template>
    <div class="latest">
        <p>
            <span class="title">最新动态</span>
            <span class="more" @click="jump('ZdynamicList')">更多>></span>
        </p>
        <div class="content">
            <div v-for="item of val" @click="jump('ZnewsPage')">
                <p class="name" :title="item.name">{{item.name}}</p>
                <p class="other">
                    <span class="time">{{item.time}}</span>
                    <span class="person" :title="item.person">发布机构：{{item.person}}</span>
                </p>
                <hr>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    data () {
        return {
            val:
                [
                    {
                        name: '市民政局领导到秀水中专调研与考察老年健康与护理实训基地',
                        time: '2019-04-17 09:24:20',
                        person: '嘉兴市秀水经济信息专修学院'
                    },
                    {
                        name: '校政企深度合作 产学研有机融合',
                        time: '2019-09-01 12:23:44',
                        person: '重庆科创职业学院'
                    },
                    {
                        name: '我校与四川省农业机械研究设计院签订战略合作协议',
                        time: '2019-12-23 16:15:33',
                        person: '成都大学'
                    },
                    {
                        name: '镇江润州区与河海大学探索共建“政企校”党建共同体 ',
                        time: '2019-11-20 18:39：23',
                        person: '润州发布'
                    },
                    {
                        name: '“政企校”人才培养战略合作签约仪式在固安举行',
                        time: '2019-02-02 19:14:29',
                        person: '长城网'
                    },
                    {
                        name: '3D打印“政企校”共建创新基地在我校正式落成',
                        time: '2019-01-08 12:02:02',
                        person: '重庆化工职业学院'
                    }
                ]

        }
    },
    created() {
    },
    mounted(){
    },
    methods: {
        jump(path) {
            this.$router.push({name: path});
        }
    },
    components: {
    },
    watch: {
    }
}
</script>
<style scoped>
    .latest{
        margin: 40px 40px 0 40px;
        background: #ffffff;
        height: 520px;
        overflow: hidden;
    }
    .latest>p{
        padding: 30px 30px 20px 30px;
        position: relative;
    }
    .latest .title{
        font-size: 20px;
        color: #233b6e;
        cursor: default;
    }
    .latest .more{
        font-size: 14px;
        color: #666;
        position: absolute;
        right: 30px;
        cursor: pointer;
    }
    .latest .content{
        height: 450px;
        padding: 0 30px 0 30px;
    }
    .latest .content>div{
        cursor: pointer;
    }
    .latest .content .name{
        font-size: 16px;
        color: #4877e6;
        margin-top: 15px;
        text-overflow:ellipsis;
        white-space:nowrap;
        overflow: hidden;
    }
    .latest .content .other{
        font-size: 14px;
        color: #808080;
        margin: 5px 0 8px 0;
        position: relative;
    }
    .latest .content .person{
        position: absolute;
        right: 0px;
        display: inline-block;
        width: 180px;
        overflow: hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
</style>
