<template>
  <div class="news">
    <banner/>
    <div class="container">
      <div class="news-navs">
        <navs/>
      </div>
      <div class="news-content">
        <detail/>
      </div>
    </div>
  </div>
</template>

<script>
  import {Navs, Detail, Banner} from '@/components/news'
  export default {
    name: 'NewsDetail',
    layout: 'town',
    fetch ({store, route}) {
      return Promise.all([
        store.dispatch('loadNewsDetail', {id: route.params.id})
      ])
    },
    components: {
      Navs,
      Detail,
      Banner
    }
  }
</script>

<style scoped type="text/scss" lang="scss">
  .news{
    background: #f4f4f4;
    padding-bottom:60px;
    .news-navs{
      float:left;
      width:240px;
      min-height:280px;
      background: #fff;
    }
    .news-content{
      background: #fff;
      margin-left:260px;
      min-height:300px;
    }
  }
</style>
