合并

src/layout/common/foot.vue

@@ -0,0 +1,50 @@
+<template>
+  <div id="foot">
+    <div class="down">
+      <p>版权所有：吉林省技术算中心</p>
+      <p>
+        <span>技术支持：长春福瑞科技有限公司</span>
+        &nbsp;&nbsp;&nbsp;&nbsp;
+        <span>邮编：130000</span>
+        &nbsp;&nbsp;&nbsp;&nbsp;
+        <span>传真：239823982</span>
+      </p>
+      <p>
+        <span>地址：吉林省长春市朝阳区前进大街1244号</span>
+        &nbsp;&nbsp;&nbsp;&nbsp;
+        <span>电话：0134-1234567</span>
+        &nbsp;&nbsp;&nbsp;&nbsp;
+        <span>邮箱：123456@163.com</span>
+      </p>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'foot',
+  props: {},
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.down {
+  float: left;
+  width: 100%;
+  height: 120px;
+  text-align: left;
+  padding: 15px 0 0 0;
+  // background: #032f4f;
+}
+.down p {
+  font-size: 14px;
+  color: #868f9e;
+  font-family: '微软雅黑';
+  padding: 0 200px;
+}
+</style>

src/layout/common/lianjie.vue

@@ -0,0 +1,49 @@
+<template>
+  <div id="jianjie">
+    <el-col :span="24">
+      <el-col :span="4" class="titles"> 友情链接</el-col>
+      <el-col :span="5" v-for="(item, index) in linklist" :key="index" class="info"
+        ><el-image :src="item.src" style="width:245px;height:50px"> </el-image
+      ></el-col>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'jianjie',
+  props: {},
+  components: {},
+  data: () => ({
+    linklist: [
+      { src: require('@/assets/zz.jpg') },
+      { src: require('@/assets/23.jpg') },
+      { src: require('@/assets/zz.jpg') },
+      { src: require('@/assets/zz.jpg') },
+    ],
+  }),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.titles {
+  width: 130px;
+  height: 100px;
+  line-height: 100px;
+  text-align: center;
+  font-size: 22px;
+  font-weight: bold;
+  color: #2c3250;
+}
+
+.info {
+  height: 100px;
+  line-height: 100px;
+  text-align: center;
+  padding: 26px 0 0 0;
+  overflow: hidden;
+}
+</style>

src/layout/common/newmenu.vue

@@ -2,7 +2,7 @@
   <div id="newmenu">
     <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
       <el-menu-item index="1">新闻动态</el-menu-item>
-      <el-menu-item index="2">成果展示</el-menu-item>
+      <el-menu-item index="2" @click="result">成果展示</el-menu-item>
       <el-menu-item index="3">计算服务</el-menu-item>
       <el-menu-item index="4">交流活动</el-menu-item>
       <el-menu-item index="5" @click="toPartisan">党建学院</el-menu-item>
@@ -26,6 +26,10 @@ export default {
     toPartisan() {
       this.$router.push({ path: '/partisan/index' });
     },
+
+    result() {
+      this.$router.push({ path: '/result/index' });
+    },
   },
 };
 </script>
@@ -68,21 +72,40 @@ export default {
 }
 
 /deep/.el-menu-item:hover {
-  background: #2152994f !important;
-
+  background: #215299 !important;
   color: #fff !important;
   border: none;
   font-size: 22px !important;
+  border-right: 2px solid #76bdfe;
+}
+
+/deep/.el-menu--horizontal > .el-menu-item:first-child.is-active {
+  background: #215299;
+  border: none;
+  border-right: 2px solid #76bdfe;
+  color: #fff;
+}
+
+/deep/.el-menu--horizontal > .el-menu-item:last-child.is-active {
+  background: #215299;
+  border: none;
+  color: #fff;
 }
 
 /deep/.el-menu--horizontal > .el-menu-item.is-active {
   background: #215299;
   border: none;
   color: #fff;
+  border-right: 2px solid #76bdfe;
+  // border-left: 2px solid #76bdfe;
 }
 
 /deep/.el-menu.el-menu--horizontal {
   border-bottom: none;
-  background: #2152994f;
+  background: none;
+}
+
+/deep/.el-menu--horizontal > .el-menu-item {
+  border-bottom: none;
 }
 </style>

src/layout/common/top.vue

@@ -29,17 +29,31 @@
 </template>
 
 <script>
+import moment from 'moment';
 export default {
   name: 'logo',
-  props: { date: null, week: null },
+  props: {},
   components: {},
   data: () => ({
     src: require('@/assets/logo.png'),
     newsrc: require('@/assets/123.jpg'),
+    date: '',
+    week: '',
   }),
-  created() {},
+  created() {
+    this.searchdate();
+  },
   computed: {},
   methods: {
+    searchdate() {
+      let dates = moment().format('YYYY-MM-DD ');
+      let week = moment().format('d');
+      console.log(week);
+      this.week = week;
+      this.date = dates;
+      console.log(dates);
+    },
+
     handleSelect() {},
   },
 };

src/layout/index/context.vue

@@ -0,0 +1,90 @@
+<template>
+  <div id="right">
+    <el-col :span="24" class="maintoplefttitle">
+      <div style="padding:10px 0 0 0;border-bottom: 1px dashed #ccc;">
+        <span>|</span><span>通知公告</span><span><i class="el-icon-more"></i></span>
+      </div>
+    </el-col>
+    <el-col :span="24">
+      <el-col :span="24" class="leftcontext" v-for="(item, index) in infolist" :key="index">
+        <el-col :span="21" class="title"> <span>.</span>{{ item.title }} </el-col>
+        <el-col :span="3" class="date">{{ item.date }}</el-col>
+      </el-col>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'context',
+  props: {
+    infolist: null,
+  },
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.context {
+  height: 300px;
+  background-color: #fff;
+  width: 595px;
+}
+
+.context .leftcontext {
+  padding: 0 20px 0 20px;
+}
+
+.main .context .maintoplefttitle {
+  padding: 20px;
+  // border-bottom: 1px dashed #ccc;
+}
+.main .context .maintoplefttitle span:first-child {
+  font-weight: 1000;
+  padding: 10px 5px 0 0px;
+  font-size: 20px;
+  color: #005293;
+}
+
+.main .context .maintoplefttitle span:nth-child(2) {
+  font-size: 20px;
+  color: #005293;
+  padding: 0 10px 0 0;
+}
+.main .context .maintoplefttitle span:nth-child(3) {
+  font-size: 20px;
+  color: #005293;
+  float: right;
+}
+
+.maintopright .leftcontext {
+  padding: 0 20px 0 20px;
+  font-size: 16px;
+}
+
+.maintopright .leftcontext p {
+  margin: 0;
+  padding: 0;
+}
+
+.maintopright .leftcontext title span:first-child {
+  font-weight: 1000;
+  padding: 5px;
+}
+
+.title {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  height: 38px;
+}
+
+.date {
+  float: right;
+  color: #777777;
+}
+</style>

src/layout/index/contextbetween.vue

@@ -0,0 +1,92 @@
+<template>
+  <div id="right">
+    <el-col :span="24" class="maintoplefttitle">
+      <div style="padding:10px 0 0 0;border-bottom: 1px dashed #ccc;">
+        <span>|</span><span>科级合作</span><span><i class="el-icon-more"></i></span>
+      </div>
+    </el-col>
+    <el-col :span="24">
+      <el-col :span="24" class="leftcontext" v-for="(item, index) in servicelist" :key="index">
+        <el-col :span="20" class="title"> <span>.</span>{{ item.title }} </el-col>
+        <el-col :span="4" class="date">{{ item.date }}</el-col>
+      </el-col>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'context',
+  props: {
+    servicelist: null,
+  },
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.between {
+  height: 300px;
+  background-color: #fff;
+
+  padding: 0 10px 0 10px;
+}
+
+.between .leftcontext {
+  padding: 0 20px 0 20px;
+}
+
+.main .between .maintoplefttitle {
+  padding: 20px;
+  // border-bottom: 1px dashed #ccc;
+}
+.main .between .maintoplefttitle span:first-child {
+  font-weight: 1000;
+  padding: 10px 5px 0 0px;
+  font-size: 20px;
+  color: #005293;
+}
+
+.main .between .maintoplefttitle span:nth-child(2) {
+  font-size: 20px;
+  color: #005293;
+  padding: 0 10px 0 0;
+}
+.main .between .maintoplefttitle span:nth-child(3) {
+  font-size: 20px;
+  color: #005293;
+  float: right;
+}
+
+.maintopright .leftcontext {
+  padding: 0 20px 0 20px;
+  font-size: 16px;
+}
+
+.maintopright .leftcontext p {
+  margin: 0;
+  padding: 0;
+}
+
+.maintopright .leftcontext title span:first-child {
+  font-weight: 1000;
+  padding: 5px;
+}
+
+.title {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  height: 38px;
+}
+
+.date {
+  float: right;
+  color: #777777;
+  text-indent: 11px;
+}
+</style>

src/layout/index/contextright.vue

@@ -0,0 +1,90 @@
+<template>
+  <div id="right">
+    <el-col :span="24" class="maintoplefttitle">
+      <div style="padding:10px 0 0 0;border-bottom: 1px dashed #ccc;">
+        <span>|</span><span>技术问答</span><span><i class="el-icon-more"></i></span>
+      </div>
+    </el-col>
+    <el-col :span="24">
+      <el-col :span="24" class="leftcontext" v-for="(item, index) in jishulsit" :key="index">
+        <el-col :span="21" class="title"> <span>.</span>{{ item.title }} </el-col>
+        <el-col :span="3" class="date">{{ item.date }}</el-col>
+      </el-col>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'context',
+  props: {
+    jishulsit: null,
+  },
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.context {
+  height: 300px;
+  background-color: #fff;
+  width: 595px;
+}
+
+.context .leftcontext {
+  padding: 0 20px 0 20px;
+}
+
+.main .context .maintoplefttitle {
+  padding: 20px;
+  // border-bottom: 1px dashed #ccc;
+}
+.main .context .maintoplefttitle span:first-child {
+  font-weight: 1000;
+  padding: 10px 5px 0 0px;
+  font-size: 20px;
+  color: #005293;
+}
+
+.main .context .maintoplefttitle span:nth-child(2) {
+  font-size: 20px;
+  color: #005293;
+  padding: 0 10px 0 0;
+}
+.main .context .maintoplefttitle span:nth-child(3) {
+  font-size: 20px;
+  color: #005293;
+  float: right;
+}
+
+.maintopright .leftcontext {
+  padding: 0 20px 0 20px;
+  font-size: 16px;
+}
+
+.maintopright .leftcontext p {
+  margin: 0;
+  padding: 0;
+}
+
+.maintopright .leftcontext title span:first-child {
+  font-weight: 1000;
+  padding: 5px;
+}
+
+.title {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  height: 38px;
+}
+
+.date {
+  float: right;
+  color: #777777;
+}
+</style>

src/layout/index/right.vue

@@ -7,10 +7,8 @@
     </el-col>
     <el-col :span="24">
       <el-col :span="24" class="leftcontext" v-for="(item, index) in list" :key="index">
-        <div>
-          <span>.</span><span>{{ item.title }}</span>
-        </div>
-        <div></div>
+        <el-col :span="20" class="title"> <span>.</span>{{ item.title }} </el-col>
+        <el-col :span="4" class="date">{{ item.date }}</el-col>
       </el-col>
     </el-col>
   </div>
@@ -71,18 +69,20 @@ export default {
   padding: 0;
 }
 
-.maintopright .leftcontext p span:first-child {
+.maintopright .leftcontext title span:first-child {
   font-weight: 1000;
   padding: 5px;
 }
 
-.maintopright .leftcontext p span:nth-child(2) {
-  width: 449px;
-  display: inline-flex;
-  height: 27px;
-  line-height: 27px;
+.title {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+  height: 38px;
+}
+
+.date {
+  float: right;
+  color: #777777;
 }
 </style>

src/layout/result/left.vue

@@ -0,0 +1,64 @@
+<template>
+  <div id="fenlei">
+    <el-col class="swfl">
+      <el-image style="width:22px;height:22px;margin:0 5px -5px 0;" :src="src"></el-image>
+      <span>中心科研</span>
+    </el-col>
+    <el-col>
+      <el-menu default-active="1" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" text-color="#215299" active-text-color="#215299">
+        <el-menu-item index="1" v-for="(item, index) in liebiaoList" :key="index"
+          ><span slot="title" @click="clickUrl()">{{ item.title }}</span></el-menu-item
+        >
+      </el-menu>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'fenlei',
+  props: {},
+  components: {},
+  data: () => ({
+    src: require('@/assets/achieveCenter.png'),
+    liebiaoList: [{ title: '平台建设' }, { title: '展示成果' }, { title: '知识交流' }, { title: 'xxxx' }],
+  }),
+  created() {},
+  computed: {},
+  methods: {
+    clickUrl() {
+      this.$router.push({ path: '/shuju/shujulist' });
+    },
+    handleOpen(key, keyPath) {
+      console.log(key, keyPath);
+    },
+    handleClose(key, keyPath) {
+      console.log(key, keyPath);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.swfl {
+  height: 60px;
+  width: 250px;
+  line-height: 60px;
+  background-color: #22529a;
+  text-align: center;
+}
+.swfl span {
+  font-size: 22px;
+  color: #ffffff;
+}
+/deep/.el-menu-item {
+  height: 60px;
+  text-align: center;
+  line-height: 60px;
+  border-bottom: 1px dashed;
+  font-size: 22px;
+}
+/deep/.el-menu-item:last-child {
+  border-bottom: none;
+}
+</style>

src/layout/result/leftunder.vue

@@ -0,0 +1,64 @@
+<template>
+  <div id="fenlei">
+    <el-col class="swfl">
+      <el-image style="width:22px;height:22px;margin:0 5px -5px 0;" :src="src"></el-image>
+      <span>对外合作</span>
+    </el-col>
+    <el-col>
+      <el-menu default-active="1" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" text-color="#215299" active-text-color="#215299">
+        <el-menu-item index="1" v-for="(item, index) in liebiaoList" :key="index"
+          ><span slot="title" @click="clickUrl()">{{ item.title }}</span></el-menu-item
+        >
+      </el-menu>
+    </el-col>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'fenlei',
+  props: {},
+  components: {},
+  data: () => ({
+    src: require('@/assets/achieveCenter.png'),
+    liebiaoList: [{ title: '超算联盟' }, { title: '国家网格' }, { title: '教学中心' }, { title: '创业基地' }, { title: '软件中心' }, { title: '交流互动' }],
+  }),
+  created() {},
+  computed: {},
+  methods: {
+    clickUrl() {
+      this.$router.push({ path: '/shuju/shujulist' });
+    },
+    handleOpen(key, keyPath) {
+      console.log(key, keyPath);
+    },
+    handleClose(key, keyPath) {
+      console.log(key, keyPath);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.swfl {
+  height: 60px;
+  width: 250px;
+  line-height: 60px;
+  background-color: #22529a;
+  text-align: center;
+}
+.swfl span {
+  font-size: 22px;
+  color: #ffffff;
+}
+/deep/.el-menu-item {
+  height: 60px;
+  text-align: center;
+  line-height: 60px;
+  border-bottom: 1px dashed;
+  font-size: 22px;
+}
+/deep/.el-menu-item:last-child {
+  border-bottom: none;
+}
+</style>

src/layout/result/right.vue

@@ -0,0 +1,19 @@
+<template>
+  <div id="right">
+    <p>right</p>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'right',
+  props: {},
+  components: {},
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped></style>

src/router/index.js

@@ -9,6 +9,12 @@ const routes = [
     name: '',
     component: () => import('../views/index.vue'),
   },
+  //成果展示
+  {
+    path: '/result/index',
+    name: '成果展示',
+    component: () => import('../views/result/index.vue'),
+  },
   {
     path: '/partisan/index',
     name: '党建学苑',
@@ -20,6 +26,12 @@ const routes = [
     meta: { title: '新闻动态', subSite: true },
     component: () => import('../views/news/index.vue'),
   },
+  // 新闻动态列表+详情
+  {
+    path: '/news/listDetail',
+    meta: { title: '新闻详情', subSite: true },
+    component: () => import('../views/news/listDetail.vue'),
+  },
 ];
 
 const router = new VueRouter({

src/views/index.vue

@@ -2,7 +2,7 @@
   <div id="index">
     <el-row>
       <div class="w_1200">
-        <top :date="date" :week="week"></top>
+        <top></top>
 
         <el-col :span="24" class="menu">
           <div class="w_1200">
@@ -17,9 +17,23 @@
             <el-col :span="12" class="maintopright">
               <right :list="list"></right>
             </el-col>
+
+            <el-col :span="8" class="context">
+              <context :infolist="infolist"></context>
+            </el-col>
+            <el-col :span="8" class="between">
+              <contextbetween :servicelist="servicelist"></contextbetween>
+            </el-col>
+            <el-col :span="8" class="context">
+              <contextright :jishulsit="jishulsit"></contextright>
+            </el-col>
+
+            <el-col :span="24" class="lianjie">
+              <lianjie></lianjie>
+            </el-col>
           </el-col>
         </el-col>
-        <el-col :span="24" class="foot"> </el-col>
+        <el-col :span="24" class="foot"> <foot></foot> </el-col>
       </div>
     </el-row>
   </div>
@@ -30,7 +44,11 @@ import top from '@/layout/common/top.vue';
 import newmenu from '@/layout/common/newmenu.vue';
 import left from '@/layout/index/left.vue';
 import right from '@/layout/index/right.vue';
-import moment from 'moment';
+import context from '@/layout/index/context.vue';
+import contextbetween from '@/layout/index/contextbetween.vue';
+import contextright from '@/layout/index/contextright.vue';
+import lianjie from '@/layout/common/lianjie.vue';
+import foot from '@/layout/common/foot.vue';
 export default {
   name: 'index',
   props: {},
@@ -39,32 +57,64 @@ export default {
     newmenu,
     left,
     right,
+    context,
+    contextbetween,
+    contextright,
+    lianjie,
+    foot,
   },
   data: () => ({
     week: '',
     date: '',
+    servicelist: [
+      {
+        title:
+          '运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态',
+        date: '03-04',
+      },
+      {
+        title: '6条数据',
+        date: '03-04',
+      },
+    ],
+    jishulsit: [
+      {
+        title:
+          '运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态',
+        date: '03-04',
+      },
+      {
+        title: '6条数据',
+        date: '03-04',
+      },
+    ],
+    infolist: [
+      {
+        title:
+          '运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态',
+        date: '03-04',
+      },
+      {
+        title: '6条数据',
+        date: '03-04',
+      },
+    ],
     list: [
       {
         title:
           '运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态运行动态',
         date: '2018-03-04',
       },
+
+      {
+        title: '6条数据',
+        date: '2018-03-04',
+      },
     ],
   }),
-  created() {
-    this.searchdate();
-  },
+  created() {},
   computed: {},
-  methods: {
-    searchdate() {
-      let dates = moment().format('YYYY-MM-DD ');
-      let week = moment().format('d');
-      console.log(week);
-      this.week = week;
-      this.date = dates;
-      console.log(dates);
-    },
-  },
+  methods: {},
 };
 </script>
 
@@ -74,10 +124,14 @@ export default {
   margin: 0 auto;
 }
 
+/deep/ body {
+  margin: 0;
+  overflow: hidden;
+}
 .main {
-  height: 740px;
+  height: 730px;
   overflow: hidden;
-  margin: 10px 0;
+  margin: 10px 0 0 0;
 }
 
 .maintopleft {
@@ -87,28 +141,6 @@ export default {
   width: 595px;
 }
 
-.main .maintopleft .maintoplefttitle {
-  padding: 20px;
-  // border-bottom: 1px dashed #ccc;
-}
-.main .maintopleft .maintoplefttitle span:first-child {
-  font-weight: 1000;
-  padding: 10px 5px 0 0px;
-  font-size: 20px;
-  color: #005293;
-}
-
-.main .maintopleft .maintoplefttitle span:nth-child(2) {
-  font-size: 20px;
-  color: #005293;
-  padding: 0 10px 0 0;
-}
-.main .maintopleft .maintoplefttitle span:nth-child(3) {
-  font-size: 20px;
-  color: #005293;
-  float: right;
-}
-
 .maintopleft .leftcontext {
   padding: 0 20px 0 20px;
   font-size: 16px;
@@ -118,46 +150,29 @@ export default {
   height: 300px;
   background-color: #fff;
   width: 595px;
+  overflow: hidden;
 }
 
-.maintopright .leftcontext {
-  padding: 0 20px 0 20px;
-}
-
-.main .maintopright .maintoplefttitle {
-  padding: 20px;
-  // border-bottom: 1px dashed #ccc;
-}
-.main .maintopright .maintoplefttitle span:first-child {
-  font-weight: 1000;
-  padding: 10px 5px 0 0px;
-  font-size: 20px;
-  color: #005293;
-}
-
-.main .maintopright .maintoplefttitle span:nth-child(2) {
-  font-size: 20px;
-  color: #005293;
-  padding: 0 10px 0 0;
-}
-.main .maintopright .maintoplefttitle span:nth-child(3) {
-  font-size: 20px;
-  color: #005293;
-  float: right;
+.context {
+  height: 300px;
+  background-color: #fff;
+  margin: 10px 0 0 0;
+  width: 400px;
 }
 
-.maintopright .leftcontext {
-  padding: 0 20px 0 20px;
-  font-size: 16px;
+.between {
+  height: 300px;
+  background-color: #fff;
+  margin: 10px 10px 0 10px;
+  width: 380px;
 }
 
-.maintopright .leftcontext p {
-  margin: 0;
-  padding: 0;
+.main .lianjie {
+  height: 100px;
+  background-color: #fff;
+  margin: 10px 0 0 0;
 }
-
-.maintopright .leftcontext p span:first-child {
-  font-weight: 1000;
-  padding: 5px;
+.foot {
+  height: 135px;
 }
 </style>

src/views/news/listDetail.vue

@@ -0,0 +1,95 @@
+<template>
+  <div id="listDetail">
+    <el-row>
+      <el-col :span="24" class="style">
+        <el-col :span="24" class="top">
+          头部
+        </el-col>
+        <el-col :span="24" class="banner">
+          <div class="w_1200">
+            logo
+          </div>
+        </el-col>
+        <el-col :span="24" class="menu">
+          <div class="w_1200">
+            菜单
+          </div>
+        </el-col>
+        <el-col :span="24" class="main">
+          <div class="w_1200">
+            <el-col :span="5" class="left">
+              左侧列表
+            </el-col>
+            <el-col :span="18" class="right">
+              右侧详情
+            </el-col>
+          </div>
+        </el-col>
+        <el-col :span="24" class="foot">
+          <div class="w_1200">
+            底部
+          </div>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'listDetail',
+  props: {},
+  components: {},
+  data: function() {
+    return {};
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  width: 1200px;
+  margin: 0 auto;
+}
+.style {
+  .top {
+    height: 40px;
+  }
+  .banner {
+    height: 220px;
+  }
+  .menu {
+    height: 70px;
+    margin: 0 0 10px 0;
+  }
+  .main {
+    min-height: 600px;
+    margin: 0 0 10px 0;
+    .left {
+      min-height: 600px;
+      background: #fff;
+      margin: 0 10px 0 0;
+    }
+    .right {
+      width: 78%;
+      min-height: 600px;
+      background: #fff;
+    }
+  }
+  .foot {
+    height: 120px;
+  }
+}
+</style>

src/views/result/index.vue

@@ -0,0 +1,74 @@
+<template>
+  <div id="partisan">
+    <el-row>
+      <div class="w_1200">
+        <top></top>
+        <div class="w_1200">
+          <newmenu></newmenu>
+        </div>
+        <el-col :span="24" class="main">
+          <el-col :span="5" class="left">
+            <el-col :span="24" class="leftone">
+              <left></left>
+            </el-col>
+            <el-col :span="24" class="lefttwo">
+              <leftunder> </leftunder>
+            </el-col>
+          </el-col>
+          <el-col :span="19" class="context">
+            <right></right>
+          </el-col>
+        </el-col>
+      </div>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import top from '@/layout/common/top.vue';
+import newmenu from '@/layout/common/newmenu.vue';
+import left from '@/layout/result/left.vue';
+import right from '@/layout/result/right.vue';
+import leftunder from '@/layout/result/leftunder.vue';
+
+export default {
+  name: 'partisan',
+  props: {},
+  components: { top, newmenu, left, right, leftunder },
+  data: () => ({}),
+  created() {},
+  computed: {},
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+.w_1200 {
+  width: 1200px;
+  margin: 0 auto;
+}
+.main {
+  height: 740px;
+  overflow: hidden;
+  margin: 10px 0;
+}
+
+.main .left {
+  height: 600px;
+}
+
+.main .left .leftone {
+  height: 300px;
+  background-color: #fff;
+}
+
+.main .left .lefttwo {
+  height: 300px;
+  background-color: #fff;
+  margin: 10px 0 0 0;
+}
+
+.main .context {
+  min-height: 610px;
+}
+</style>