10-19

src/components/leftNav/LeftNav.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="wrapper">
 		<div class="left-nav" :style="{height: navHeight}">
-			<div class="nav-title">善行共参与</div>
+			<div class="nav-title">{{topTitle}}</div>
 			<div class="nav-item" v-for="item in navList" :key="item.id"
 				:class="{'action': currentUrl.indexOf(item.path) !== -1 }" @click="navTo(item.path)">
 				<div class="item-name">
@@ -40,6 +40,10 @@
 			navList: {
 				type: Array,
 				default: []
+			},
+			topTitle: {
+				type: String,
+				default: '善行共参与'
 			}
 		},
 		computed: {
@@ -59,19 +63,19 @@
 						title = '爱心捐赠'
 						break;
 					case '/donation/organDonation':
-						title = '我要捐献器官'
+						title = '遗体及器官捐献'
 						break;
 					case '/join/rescue':
-						title = '我要成为救护员'
+						title = '救护员报名'
 						break;
 					case '/join/member':
-						title = '我要成为会员'
+						title = '会员入会登记'
 						break
 					case '/join/volunteer':
-						title = '我要成为志愿者'
+						title = '志愿者报名'
 						break
 					case '/join/train':
-						title = '报名普及培训'
+						title = '救护员培训报名'
 						break
 					case '/about/chineseRedCross':
 						title = '关于中国红十字会'
@@ -115,6 +119,78 @@
 					case '/regulations':
 						title = '政策法规'
 						break
+					case '/knowledge/rescue/list':
+						title = '救护培训'
+						break
+					case '/knowledge/rescue/detail':
+						title = '救护培训'
+						break
+					case '/knowledge/cells/detail':
+						title = '造血干细胞'
+						break
+					case '/knowledge/cells/list':
+						title = '造血干细胞'
+						break
+					case '/knowledge/bloodDonation/list':
+						title = '无偿献血'
+						break
+					case '/knowledge/bloodDonation/detail':
+						title = '无偿献血'
+						break
+					case '/newContent/jlx/detail':
+						title = '江陵县红会'
+						break
+					case '/newContent/jlx/list':
+						title = '江陵县红会'
+						break
+					case '/newContent/jzq/list':
+						title = '荆州区红会'
+						break
+					case '/newContent/jzq/detail':
+						title = '荆州区红会'
+						break
+					case '/newContent/szs/list':
+						title = '松滋市红会'
+						break
+					case '/newContent/szs/detail':
+						title = '松滋市红会'
+						break
+					case '/newContent/sss/list':
+						title = '石首市红会'
+						break
+					case '/newContent/sss/detail':
+						title = '石首市红会'
+						break
+					case '/newContent/jls/list':
+						title = '监利县红会'
+						break
+					case '/newContent/jls/detail':
+						title = '监利县红会'
+						break
+					case '/newContent/ssq/list':
+						title = '沙市区红会'
+						break
+					case '/newContent/ssq/detail':
+						title = '沙市区市红会'
+						break
+					case '/newContent/hhs/list':
+						title = '洪湖市红会'
+						break
+					case '/newContent/hhs/detail':
+						title = '洪湖市红会'
+						break
+					case '/directories/list':
+						title = '造血干细胞捐献名录'
+						break
+					case '/directories/detail':
+						title = '造血干细胞捐献名录'
+						break
+					case '/organs/detail':
+						title = '器官/遗体捐献名录'
+						break
+					case '/organs/list':
+						title = '器官/遗体捐献名录'
+						break
 					default:
 						title = ''
 				}
@@ -128,6 +204,7 @@
 		},
 		methods: {
 			navTo(path) {
+				console.log(path,'dddddddddddddddd')
 				let currentUrl = this.$route.path
 				if (currentUrl === path) {
 					return
@@ -208,7 +285,7 @@
 
 		.title {
 			border: 2px #d82020 solid;
-			width: 156px;
+			width: 180px;
 			height: 50px;
 			line-height: 50px;
 			text-align: center;

src/components/navBar/NavBar.vue

@@ -1,115 +1,121 @@
 <template>
-  <div>
-    <div class="top-bar">
-      <div class="bar-item" v-for="( item, index ) in navList" :key="index" @click="navClick(item.path,index)" :class="{'action':currentUrl.indexOf(item.path) !=-1}">
-        <img :src="item.imgUrl" alt="" />
-        <div>{{item.title}}</div>
-      </div>
-    </div>
-  </div>
+	<div>
+		<div class="top-bar">
+			<div class="bar-item" v-for="( item, index ) in navList" :key="index" @click="navClick(item.path,index)"
+				:class="{'action':currentUrl.indexOf(item.path) !=-1}">
+				<!-- <img :src="item.imgUrl" alt="" /> -->
+				<div>{{item.title}}</div>
+			</div>
+		</div>
+	</div>
 </template>
 
 <script>
-export default {
-  data() {
-    return {
-		navList: [
-			{
-				path: '/home',
-				title: '首页',
-				imgUrl: require('@/assets/img/n1.png')
-			},
-			{
-				path: '/join',
-				title: '我要参与',
-				imgUrl: require('@/assets/img/n4.png'),
-			},
-			{
-				path: '/loveList',
-				title: '爱心榜',
-				imgUrl: require('@/assets/img/n3.png'),
-			},
-			{
-				path: '/help',
-				title: '我要求助',
-				imgUrl: require('@/assets/img/n2.png'),
-			},
-			{
-				path: '/directories',
-				title: '捐献名录',
-				imgUrl: require('@/assets/img/n7.png'),
-			},
-			// {
-			// 	path: '/donation',
-			// 	title: '捐赠平台',
-			// 	imgUrl: require('@/assets/img/n2.png'),
-			// },
-			{
-				path: '/about',
-				title: '关于我们',
-				imgUrl: require('@/assets/img/n5.png'),
-			},
-			{
-				path: '/concat',
-				title: '联系我们',
-				imgUrl: require('@/assets/img/n6.png'),
+	export default {
+		data() {
+			return {
+				navList: [{
+						path: '/home',
+						title: '首页',
+						imgUrl: require('@/assets/img/n1.png')
+					},
+					{
+						path: '/introduce',
+						title: '组织介绍',
+						imgUrl: require('@/assets/img/n1.png')
+					},
+					{
+						path: '/law',
+						title: '政策法规',
+						imgUrl: require('@/assets/img/n1.png')
+
+					},
+
+					{
+						path: '/cause',
+						title: '红十字事业',
+						imgUrl: require('@/assets/img/n1.png')
+					},
+					{
+						path: '/help',
+						title: '救助项目',
+						imgUrl: require('@/assets/img/n2.png'),
+					},
+					{
+						path: '/join',
+						title: '公众参与',
+						imgUrl: require('@/assets/img/n4.png'),
+					},
+					{
+						path: '/knowledge',
+						title: '知识库',
+						imgUrl: require('@/assets/img/n4.png'),
+
+					},
+					{
+						path: '/concat',
+						title: '联系我们',
+						imgUrl: require('@/assets/img/n5.png'),
+					},
+				],
+				currentIndex: 0
+			};
+		},
+		computed: {
+			currentUrl() {
+				return this.$route.path
+			}
+		},
+		methods: {
+			navClick(url, index) {
+				let currentUrl = this.$route.path
+				if (currentUrl === url) {
+					return
+				} else {
+					this.currentIndex = index
+					this.$router.push(url)
+				}
+
+
 			}
-		],
-		currentIndex: 0
+		}
 	};
-  },
-  computed: {
-	  currentUrl() {
-		  return this.$route.path
-	  }
-  },
-  methods: {
-	  navClick(url,index) {
-		  let currentUrl = this.$route.path
-		  if(currentUrl === url) {
-			  return 
-		  }else {
-			 this.currentIndex = index
-			 this.$router.push(url) 
-		  }
-		  
-		  
-	  }
-  }
-};
 </script>
 
 <style lang="scss" scoped>
-.top-bar {
-  width: 1200px;
-  height: 60px;
-  margin: 0 auto;
-  display: flex;
-  background-color: #d82020;
-  font-size: 18px;
-  font-family: PingFang SC;
-  font-weight: bold;
-  color: #ffffff;
-  letter-spacing:3px;
-  margin-bottom: 24px;
-  .bar-item {
-	flex-grow: 1;
-    height: 60px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    font-family: PingFang SC;
-	font-size: 18px;
-	cursor:pointer;
-    img {
-      width: 20px;
-      height: 20px;
-      // background-color: #fff;
-      margin-right: 6px;
-    }
-  }
-  .action {
-  	background-color: #c2191c;
-  }
-}
-</style>
+	.top-bar {
+		width: 1200px;
+		height: 60px;
+		margin: 0 auto;
+		display: flex;
+		background-color: #d82020;
+		font-size: 18px;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #ffffff;
+		letter-spacing: 3px;
+		margin-bottom: 24px;
+
+		.bar-item {
+			flex-grow: 1;
+			height: 60px;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			font-family: PingFang SC;
+			font-size: 18px;
+			cursor: pointer;
+
+			img {
+				width: 20px;
+				height: 20px;
+				// background-color: #fff;
+				margin-right: 6px;
+			}
+		}
+
+		.action {
+			background-color: #c2191c;
+		}
+	}
+</style>

src/request/api.js

@@ -91,4 +91,19 @@ export function getArticleList(data,id) {
 		method: 'get',
 		params: data
 	});
+}
+
+export function getList(data,id) {
+	return request({
+		url: '/api/article/list/' + id,
+		method: 'get',
+		params: data
+	});
+}
+export function getCateList(data) {
+	return request({
+		url: '/api/article/category/list',
+		method: 'get',
+		params: data
+	});
 }

src/router.js

@@ -4,13 +4,6 @@ import Router from 'vue-router'
 const routerPush = Router.prototype.push  
 
 Router.prototype.push = function push(location) {
- 
-  // if(typeof(location)=="string"){
-  //   var Separator = "&";
-  //   if(location.indexOf('?')==-1) { Separator='?'; }
-  //   location = location + Separator + "random=" + Math.random();
-  // }
-
   return routerPush.call(this, location).catch(error => error)
 }
 
@@ -125,40 +118,30 @@ export default new Router({
 		meta: {
 			title: '关于我们'
 		},
-		// children: [
-		// 	{
-		// 		path: 'redCrossMovement',
-		// 		neme: 'redCrossMovement',
-		// 		component: () => import('./views/about/RedCrossMovement.vue'),
-		// 		meta: {
-		// 			title: '关于红十字会运动'
-		// 		}
-		// 	},
-		// 	{
-		// 		path: 'chineseRedCross',
-		// 		neme: 'chineseRedCross',
-		// 		component: () => import('./views/about/ChineseRedCross.vue'),
-		// 		meta: {
-		// 			title: '关于中国红十字会'
-		// 		}
-		// 	},
-		// 	{
-		// 		path: 'redCrossLaw',
-		// 		neme: 'redCrossLaw',
-		// 		component: () => import('./views/about/redCrossLaw.vue'),
-		// 		meta: {
-		// 			title: '中国红十字会法'
-		// 		}
-		// 	},
-		// 	{
-		// 		path: 'matrix',
-		// 		neme: 'matrix',
-		// 		component: () => import('./views/about/matrix.vue'),
-		// 		meta: {
-		// 			title: '微信矩阵'
-		// 		}
-		// 	},
-		// ]
+	},
+	{
+		path: '/introduce',
+		name: 'introduce',
+		component: () => import('./views/Introduce.vue'),
+		meta: {
+			title: '组织介绍'
+		},
+	},
+	{
+		path: '/law',
+		name: 'law',
+		component: () => import('./views/Law.vue'),
+		meta: {
+			title: '政策法规'
+		},
+	},
+	{
+		path: '/cause',
+		name: 'cause',
+		component: () => import('./views/Cause.vue'),
+		meta: {
+			title: '政策法规'
+		},
 	},
 	{
 		path: '/concat',
@@ -168,6 +151,298 @@ export default new Router({
 			title: '联系我们'
 		}
 	},
+	{
+		path: '/knowledge',
+		name: 'Knowledge',
+		component: () => import('./views/Knowledge.vue'),
+		meta: {
+			title: '知识库'
+		},
+		redirect: '/knowledge/rescue',
+		children: [
+			{
+				path: 'rescue',
+				name: 'rescue',
+				component: () => import('./views/knowledge/Rescue.vue'),
+				meta: {
+					title: '救护培训'
+				},
+				redirect: '/knowledge/rescue/list',
+				children: [
+					{
+						path: 'list',
+						name: 'rescueList',
+						component: () => import('./views/knowledge/rescue/List.vue'),
+						meta: {
+							title: '救护培训'
+						}
+					},
+					{
+						path: 'detail',
+						name: 'rescuedetail',
+						component: () => import('./views/knowledge/rescue/Detail.vue'),
+						meta: {
+							title: '救护培训'
+						}
+					}
+				]
+			},
+			{
+				path: 'cells',
+				name: 'cells',
+				component: () => import('./views/knowledge/Cells.vue'),
+				meta: {
+					title: '造血干细胞'
+				},
+				redirect: '/knowledge/cells/list',
+				children: [
+					{
+						path: 'list',
+						name: 'cellsList',
+						component: () => import('./views/knowledge/cells/List.vue'),
+						meta: {
+							title: '造血干细胞'
+						}
+					},
+					{
+						path: 'detail',
+						name: 'cellsdetail',
+						component: () => import('./views/knowledge/cells/Detail.vue'),
+						meta: {
+							title: '造血干细胞'
+						}
+					}
+				]
+			},
+			{
+				path: 'bloodDonation',
+				name: 'bloodDonation',
+				component: () => import('./views/knowledge/BloodDonation.vue'),
+				meta: {
+					title: '无偿献血'
+				},
+				redirect: '/knowledge/bloodDonation/list',
+				children: [
+					{
+						path: 'list',
+						name: 'bloodDonationList',
+						component: () => import('./views/knowledge/bloodDonation/List.vue'),
+						meta: {
+							title: '无偿献血'
+						}
+					},
+					{
+						path: 'detail',
+						name: 'bloodDonationdetail',
+						component: () => import('./views/knowledge/bloodDonation/Detail.vue'),
+						meta: {
+							title: '无偿献血'
+						}
+					}
+				]
+			}
+		]
+	},
+	{
+		path: '/newContent',
+		name: 'newContent',
+		component: () => import('./views/NewContent.vue'),
+		meta: {
+			title: '县市区红会动态'
+		},
+		redirect: '/newContent/jlx',
+		children: [
+			{
+				path: 'jlx',
+				name: 'jlx',
+				component: () => import('./views/newContent/Jlx.vue'),
+				meta: {
+					title: '江陵县红会动态'
+				},
+				redirect: '/newContent/jlx/list',
+				children: [
+					{
+						path: 'list',
+						name: 'jlxList',
+						component: () => import('./views/newContent/jlx/List.vue'),
+						meta: {
+							title: '江陵县红会动态'
+						}
+					},
+					{
+						path: 'detail',
+						name: 'jlxdetail',
+						component: () => import('./views/newContent/jlx/Detail.vue'),
+						meta: {
+							title: '江陵县红会动态'
+						}
+					}
+				]
+			},
+			{
+				path: 'sss',
+				name: 'sss',
+				component: () => import('./views/newContent/Sss.vue'),
+				meta: {
+					title: '石首市红会动态'
+				},
+				redirect: '/newContent/sss/list',
+				children: [
+					{
+						path: 'list',
+						name: 'cellsList',
+						component: () => import('./views/newContent/sss/List.vue'),
+						meta: {
+							title: '石首市红会动态'
+						}
+					},
+					{
+						path: 'detail',
+						name: 'cellsdetail',
+						component: () => import('./views/newContent/sss/Detail.vue'),
+						meta: {
+							title: '石首市红会动态'
+						}
+					}
+				]
+			},
+			{
+				path: 'hhs',
+				name: 'hhs',
+				component: () => import('./views/newContent/Hhs.vue'),
+				meta: {
+					title: '洪湖市红会动态'
+				},
+				redirect: '/newContent/hhs/list',
+				children: [
+					{
+						path: 'list',
+						name: 'hhsList',
+						component: () => import('./views/newContent/hhs/List.vue'),
+						meta: {
+							title: '洪湖市红会动态'
+						}
+					},
+					{
+						path: 'detail',
+						name: 'hhsdetail',
+						component: () => import('./views/newContent/hhs/Detail.vue'),
+						meta: {
+							title: '洪湖市红会动态'
+						}
+					}
+				]
+			},
+			{
+				path: 'jzq',
+				name: 'jzq',
+				component: () => import('./views/newContent/Jzq.vue'),
+				meta: {
+					title: '荆州区红会动态'
+				},
+				redirect: '/newContent/jzq/list',
+				children: [
+					{
+						path: 'list',
+						name: 'jzqList',
+						component: () => import('./views/newContent/jzq/List.vue'),
+						meta: {
+							title: '荆州区红会动态'
+						}
+					},
+					{
+						path: 'detail',
+						name: 'jzqdetail',
+						component: () => import('./views/newContent/jzq/Detail.vue'),
+						meta: {
+							title: '荆州区红会动态'
+						}
+					}
+				]
+			},
+			{
+				path: 'ssq',
+				name: 'ssq',
+				component: () => import('./views/newContent/Ssq.vue'),
+				meta: {
+					title: '沙市区红会动态'
+				},
+				redirect: '/newContent/ssq/list',
+				children: [
+					{
+						path: 'list',
+						name: 'ssqList',
+						component: () => import('./views/newContent/ssq/List.vue'),
+						meta: {
+							title: '沙市区红会动态'
+						}
+					},
+					{
+						path: 'detail',
+						name: 'ssqdetail',
+						component: () => import('./views/newContent/ssq/Detail.vue'),
+						meta: {
+							title: '沙市区红会动态'
+						}
+					}
+				]
+			},
+			{
+				path: 'szs',
+				name: 'szs',
+				component: () => import('./views/newContent/Szs.vue'),
+				meta: {
+					title: '松滋市红会动态'
+				},
+				redirect: '/newContent/szs/list',
+				children: [
+					{
+						path: 'list',
+						name: 'szsList',
+						component: () => import('./views/newContent/szs/List.vue'),
+						meta: {
+							title: '松滋市红会动态'
+						}
+					},
+					{
+						path: 'detail',
+						name: 'szsdetail',
+						component: () => import('./views/newContent/szs/Detail.vue'),
+						meta: {
+							title: '松滋市红会动态'
+						}
+					}
+				]
+			},
+			{
+				path: 'jls',
+				name: 'jls',
+				component: () => import('./views/newContent/Jls.vue'),
+				meta: {
+					title: '松滋市红会动态'
+				},
+				redirect: '/newContent/jls/list',
+				children: [
+					{
+						path: 'list',
+						name: 'jlsList',
+						component: () => import('./views/newContent/jls/List.vue'),
+						meta: {
+							title: '松滋市红会动态'
+						}
+					},
+					{
+						path: 'detail',
+						name: 'jlsdetail',
+						component: () => import('./views/newContent/jls/Detail.vue'),
+						meta: {
+							title: '松滋市红会动态'
+						}
+					}
+				]
+			}
+		]
+	},
 	{
 		path: '/popularScience',
 		name: 'popularScience',
@@ -308,7 +583,7 @@ export default new Router({
 		name: 'directories',
 		component: () => import('./views/Directories.vue'),
 		meta: {
-			title: '我要求助'
+			title: '造血干细胞捐献名录'
 		},
 		redirect: '/directories/list',
 		children: [
@@ -317,7 +592,7 @@ export default new Router({
 				name: 'directoriesList',
 				component: () => import('./views/directories/List.vue'),
 				meta: {
-					title: '我要求助'
+					title: '造血干细胞捐献名录'
 				}
 			},
 			{
@@ -325,7 +600,34 @@ export default new Router({
 				name: 'directoriesdetail',
 				component: () => import('./views/directories/Detail.vue'),
 				meta: {
-					title: '我要求助'
+					title: '造血干细胞捐献名录'
+				}
+			}
+		]
+	},
+	{
+		path: '/organs',
+		name: 'organs',
+		component: () => import('./views/Organs.vue'),
+		meta: {
+			title: '器官/遗体捐献名录'
+		},
+		redirect: '/organs/list',
+		children: [
+			{
+				path: 'list',
+				name: 'organsList',
+				component: () => import('./views/organs/List.vue'),
+				meta: {
+					title: '器官/遗体捐献名录'
+				}
+			},
+			{
+				path: 'detail',
+				name: 'organsdetail',
+				component: () => import('./views/organs/Detail.vue'),
+				meta: {
+					title: '器官/遗体捐献名录'
 				}
 			}
 		]

src/views/Cause.vue

@@ -0,0 +1,170 @@
+<template>
+	<div class="about">
+		<div class="wrapper">
+			<div class="left-nav" :style="{height: navHeight}">
+				<div class="nav-title">红十字事业</div>
+				<div class="nav-item" v-for="item in navList" :key="item.uid" :class="{'action': currentIndex == item.uid }" @click="navClick(item.uid)">
+					<!-- :class="{'action': currentUrl.indexOf(item.path) !== -1 }"> -->
+					<div class="item-name">
+						{{item.name}}
+					</div>
+					<div class="item-icon">
+						>
+					</div>
+				</div>
+			</div>
+			<div class="right-content">
+				<!-- <div class="title moren" v-if="isShow">
+					{{rightTitle}}
+				</div> -->
+				<div style="padding: 35px 50px 35px 50px;" class="line">
+					<div class="new-detail">
+						<div class="content" v-html="content"></div>
+					</div>
+				</div>
+		
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+import LeftNav from '../components/leftNav/LeftNav.vue';
+import { details, getArticleList } from '../request/api.js';
+export default {
+	components: {
+		LeftNav
+	},
+	data() {
+		return {
+			content: '',
+			currentIndex: '',
+			rightTitle: '',
+			navList: [],
+		};
+	},
+	computed: {
+		navHeight() {
+			return this.navList.length * 51 + 52 + 'px'
+		},
+	},
+	mounted() {
+		this.getList()
+	},
+	methods:{
+		getList() {
+			let that = this
+			getArticleList({},46).then(({data}) => {
+				console.log(data)
+				let arr = data.list.reverse()
+				arr.forEach(item => {
+					let obj = {}
+					obj.name = item.title
+					obj.uid = item.id
+					that.navList.push(obj)
+					console.log(that.navList,'55555')
+				})
+				this.navClick(arr[0].id)
+			}).catch( err => {
+				console.log(err)
+			})
+		},
+		navClick(id) {
+			this.currentIndex = id
+			details({},id).then(({data})=> {
+				this.content = data.content
+			})
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+	.wrapper {
+		width: 1200px;
+		display: flex;
+		justify-content: space-between;
+	
+	}
+	
+	.left-nav {
+		width: 265px;
+		// height: 154px;
+		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+	
+		.nav-title {
+			height: 52px;
+			background-color: #d82020;
+			line-height: 52px;
+			text-align: center;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #FFFFFF;
+			letter-spacing: 3px;
+			cursor: default;
+		}
+	
+		.nav-item {
+			cursor: pointer;
+			border-top: 1px #fcfbfb solid;
+			display: flex;
+			height: 50px;
+			background-color: #f2eeef;
+			justify-content: space-between;
+			line-height: 50px;
+			padding: 0 37px 0 26px;
+	
+			.item-name {
+				font-size: 16px;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #333333;
+				letter-spacing: 1px
+			}
+	
+			.item-icon {
+				font-size: 16px;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #999999;
+			}
+		}
+	
+		.action {
+			background-color: #f7dfdf;
+		}
+	}
+	
+	.right-content {
+		width: 915px;
+		min-height: 706px;
+		border-top: 2px solid #D82020;
+		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+	
+		.title {
+			border: 2px #d82020 solid;
+			width: 156px;
+			height: 50px;
+			line-height: 50px;
+			text-align: center;
+			background: #D82020;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #FFFFFF;
+			position: relative;
+			top: -2px;
+		}
+	
+		.action {
+			background: #FFFFFF;
+			color: #D82020;
+		}
+	}
+	
+	.line {
+		line-height: 1.5;
+	}
+</style>
+

src/views/Directories.vue

@@ -1,14 +1,8 @@
 <template>
-	<div class="regulations">
-		<div class="right-content">
-			<div class="title moren">
-				捐献名录
-			</div>
-			<div style="padding: 35px 50px 35px 50px;" class="line">
-				<router-view></router-view>
-			</div>
-			
-		</div>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'捐献名录'">
+			<router-view></router-view>
+		</left-nav>
 	</div>
 </template>
 
@@ -21,35 +15,11 @@
 		},
 		data() {
 			return {
-				navList: [{ index: 0, name: '红色新闻', path: '/news' }, { index: 1, name: '信息公示', path: '/publicity' },{index: 2, name: '政策法规', path: '/regulations'}],
+				navList: [{ index: 0, name: '造血干细胞捐献名录', path: '/directories' }, { index: 1, name: '器官/遗体捐献名录', path: '/organs' }],
 			};
 		}
 	};
 </script>
 
-<style scoped lang="scss">
-	.right-content {
-		width: 1200px;
-		min-height: 706px;
-		border-top: 2px solid #D82020;
-		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
-		.title {
-			border: 2px #d82020 solid;
-			width: 156px;
-			height: 50px;
-			line-height: 50px;
-			text-align: center;
-			background: #D82020;
-			font-size: 18px;
-			font-family: PingFang SC;
-			font-weight: bold;
-			color: #FFFFFF;
-			position: relative;
-			top: -2px;
-		}
-		.action {
-			background: #FFFFFF;
-			color: #D82020;
-		}
-	}
-</style>
+<style>
+</style>

src/views/Donation.vue

@@ -17,13 +17,14 @@
 		data() {
 			return {
 				navList: [
-					{ index: 0, name: '我要捐款', path: '/donation/contribution' },
-					{ index: 1, name: '我要器官捐献', path: '/donation/organDonation' },
-					{ index: 2, name: '我要造血干细胞捐献', path: '/donation/Hpc' },
-					{ index: 3, name: '我要登记救护员', path: '/join/rescue' },
-					{ index: 4, name: '我要登记个人会员', path: '/join/member' },
-					{ index: 5, name: '我要登记志愿者', path: '/join/volunteer' },
-					{ index: 6, name: '我要报名普及培训', path: '/join/train' },
+					{ index: 0, name: '爱心捐赠', path: '/donation/contribution' },
+					{ index: 1, name: '遗体及器官捐献', path: '/donation/organDonation' },
+					{ index: 2, name: '造血干细胞捐献', path: '/donation/Hpc' },
+					// { index: 3, name: '加入就在身边志愿者', path: '/join/rescue' },
+					{ index: 3, name: '会员入会登记', path: '/join/member' },
+					{ index: 4, name: '志愿者报名', path: '/join/volunteer' },
+					{ index: 5, name: '救护员培训报名', path: '/join/train' },
+					{ index: 6, name: '加入就在身边志愿者', path: '/join/rescue' },
 				],
 				rightTitle: '爱心捐赠',
 				currentIndex: 0

src/views/Help.vue

@@ -2,7 +2,7 @@
 	<div class="regulations">
 		<div class="right-content">
 			<div class="title moren">
-				我要求助
+				救助项目
 			</div>
 			<div style="padding: 35px 50px 35px 50px;" class="line">
 				<router-view></router-view>

src/views/Home.vue

@@ -2,18 +2,25 @@
 	<div class="home">
 		<div class="home-swiper">
 			<el-carousel height="484px" :interval="4000" v-if="swiperList">
-				<el-carousel-item v-for="(item, index) in swiperList" :key="index"><el-image :src="item" alt="" class="swiper-img" /></el-carousel-item>
+				<el-carousel-item v-for="(item, index) in swiperList" :key="index">
+					<el-image :src="item" alt="" class="swiper-img" />
+				</el-carousel-item>
 			</el-carousel>
 		</div>
 		<div class="news-wrapper">
-			<div class="new-pic" @click="navTo('/news/detail?id=' + showNew.id)">
-				<img :src="showNew.img" />
-				<div class="title clamp hand">{{ showNew.title }}</div>
+			<div class="new-pic">
+				<el-carousel :interval="4000" height="320px" indicator-position="none">
+					<el-carousel-item v-for="(item, index) in redNews.slice(0,3)" :key="index">
+						<img :src="item.image_input[0]" @click="navTo('/news/datatile?id='+ item.id)" />
+						<div class="title clamp hand">{{ item.title }}</div>
+					</el-carousel-item>
+				</el-carousel>
 			</div>
 			<div class="news">
 				<item-title title="红会新闻" :topath="'/news'"></item-title>
 				<div class="item-wrapper">
-					<div class="new-item hand" v-for="item in redNews" :key="item.id" @click="navTo('/news/detail?id=' + item.id)">
+					<div class="new-item hand" v-for="item in redNews" :key="item.id"
+						@click="navTo('/news/detail?id=' + item.id)">
 						<div class="title clamp ">
 							<span></span>
 							{{ item.title }}
@@ -23,13 +30,13 @@
 				</div>
 			</div>
 		</div>
-
 		<div class="home-body">
 			<div class="body-left moren">
 				<div class="red-new">
 					<item-title title="信息公示" :topath="'/publicity'"></item-title>
 					<div class="item-wrapper">
-						<div class="new-item hand" v-for="item in openNews" :key="item.id" @click="navTo('/publicity/detail?id=' + item.id)">
+						<div class="new-item hand" v-for="item in openNews" :key="item.id"
+							@click="navTo('/publicity/detail?id=' + item.id)">
 							<div class="title clamp ">
 								<span></span>
 								{{ item.title }}
@@ -38,10 +45,22 @@
 						</div>
 					</div>
 				</div>
+				<div class="join">
+					<item-title title="公众参与" :topath="'/donation'"></item-title>
+					<div class="join-main">
+						<div class="join-item" v-for="item in miniNavList" @click="navTo(item.path)" :key="item.title">
+							<div class="logo hand"><img :src="item.image" /></div>
+							<div class="title hand">{{ item.title }}</div>
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="body-right">
 				<div class="new-open">
-					<item-title title="政策法规" :topath="'/regulations'"></item-title>
+					<item-title title="县市区红会动态" :topath="'/newContent'"></item-title>
 					<div class="item-wrapper">
-						<div class="new-item hand" v-for="item in regulationList" :key="item.id" @click="navTo('/regulations/detail?id=' + item.id)">
+						<div class="new-item hand" v-for="item in xsqList" :key="item.id"
+							@click="navTo('/newContent/jlx/detail?id=' + item.id)">
 							<div class="title clamp">
 								<span></span>
 								{{ item.title }}
@@ -50,16 +69,8 @@
 						</div>
 					</div>
 				</div>
-			</div>
-			<div class="body-right">
-				<div class="join">
-					<item-title title="公众参与" :topath="'/donation'"></item-title>
-					<div class="join-main">
-						<div class="join-item" v-for="item in miniNavList" @click="navTo(item.path)" :key="item.title">
-							<div class="logo hand"><img :src="item.image" /></div>
-							<div class="title hand">{{ item.title }}</div>
-						</div>
-					</div>
+				<div class="loadmore" @click="lookm()">
+					<img src="../assets/img/lookm.png">
 				</div>
 				<div class="list">
 					<item-title title="爱心榜" :topath="'/loveList'"></item-title>
@@ -67,19 +78,19 @@
 						<div>捐献时间</div>
 						<div>捐献者</div>
 						<div>捐献金额</div>
-						<div>捐献意向</div>
+						<!-- <div>捐献意向</div> -->
 					</div>
-					
+
 					<div class="table-empty" v-if="jxList.length == 0">暂无更多捐赠数据</div>
-					<template  v-else>
+					<template v-else>
 						<div class="list-item flex" v-for="(item, index) in jxList" :key="index">
 							<div class="clamp">{{ item.time }}</div>
 							<div class="clamp">{{ item.donate_er }}</div>
 							<div class="clamp">{{ item.money }}</div>
-							<div class="clamp">{{ item.intention }}</div>
+							<!-- <div class="clamp">{{ item.intention }}</div> -->
 						</div>
 					</template>
-					
+
 				</div>
 			</div>
 		</div>
@@ -102,564 +113,717 @@
 </template>
 
 <script>
-import ItemTitle from './homeChild/ItemTitle.vue';
-
-import { loadIndexs, splist, loveList, friendList, newsList, openList, banner, regulationList } from '../request/api.js';
-export default {
-	components: {
-		ItemTitle
-	},
-	data() {
-		return {
-			miniNavList: [
-				{
-					path: '/donation/contribution',
-					title: '爱心捐款',
-					image: require('@/assets/img/i1.png')
-				},
-				{
-					path: '/donation/organDonation',
-					title: '器官捐献',
-					image: require('@/assets/img/i2.png')
-				},
-				{
-					path: '/donation/Hpc',
-					title: '造血干细胞捐献',
-					image: require('@/assets/img/i3.png')
-				},
-				{
-					path: '/join/rescue',
-					title: '救护员登记',
-					image: require('@/assets/img/i4.png')
-				},
-				{
-					path: '/join/member',
-					title: '个人会员登记',
-					image: require('@/assets/img/i5.png')
-				},
-				{
-					path: '/join/volunteer',
-					title: '志愿者登记',
-					image: require('@/assets/img/i6.png')
-				},
-				{
-					path: '/join/train',
-					title: '普及培训报名',
-					image: require('@/assets/img/i7.png')
-				},
-				{
-					path: '/popularScience/list',
-					title: '红会科普',
-					image: require('@/assets/img/i8.png')
-				}
-			],
-			swiperList: [],
-			// jxList: [],
-			spList: [],
-			imgList: [],
-			friendList: [],
-			redNews: [],
-			openNews: [],
-			regulationList: [],
-			moreJxList: [],
-			timer: null
-		};
-	},
-	filters: {
-		getTime(val) {
-			let date = new Date(val * 1000);
-			let Y = date.getFullYear();
-			let M = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
-			let D = date.getDate() < 10 ? '0' + date.getDay() : date.getDate();
-			return Y + '.' + M + '.' + D;
-		},
-		time(val) {
-				
-			if(val) {
-				let arr = val.split(' ');
-				let str = arr[0];
-				str = str.replace(/-/g, '.');
-				return str;
-			}
-			return 
-			
-		}
-	},
-	computed: {
-		jxList() {
-			return this.moreJxList.slice(0, 3);
-		},
-		showNew() {
-			let obj = this;
-			if (obj.redNews[0]) {
-				let data = {
-					id: obj.redNews[0].id,
-					img: obj.redNews[0].image_input[0],
-					title: obj.redNews[0].title
-				};
-				return data;
-			}
+	import ItemTitle from './homeChild/ItemTitle.vue';
 
-			return {};
-		}
-	},
-	created() {
-		this.getSwiperList();
-		this.getIndex();
-		this.getFirstAidList();
-		this.getJxList();
-		this.getNewsList();
-		this.getOpenList(), this.getRegulationList();
-	},
-	methods: {
-		navTo(url) {
-			this.$router.push(url);
+	import {
+		loadIndexs,
+		splist,
+		loveList,
+		friendList,
+		newsList,
+		openList,
+		banner,
+		regulationList,
+		getList
+	} from '../request/api.js';
+	export default {
+		components: {
+			ItemTitle
 		},
-		getIndex() {
-			loadIndexs().then(({ data }) => {
-				this.friendList = data.friend_link;
-				this.imgList = data.picture_list;
-				// this.swiperList = data.banner
-			});
-		},
-		getFirstAidList() {
-			splist({
-				page: 1,
-				limit: 5
-			}).then(({ data }) => {
-				this.spList = data.list;
-			});
-		},
-		getJxList() {
-			let obj = this;
-			let data = {
-				page: 1,
-				limit: 20
-			};
-			loveList(data).then(res => {
-				obj.moreJxList = res.data.list.map(item => {
-					if (item.intention === '') {
-						item.intention = '非定向捐款';
+		data() {
+			return {
+				miniNavList: [{
+						path: '/donation/contribution',
+						title: '爱心捐款',
+						image: require('@/assets/img/i1.png')
+					},
+					{
+						path: '/donation/organDonation',
+						title: '遗体及器官捐献',
+						image: require('@/assets/img/i2.png')
+					},
+					{
+						path: '/donation/Hpc',
+						title: '造血干细胞捐献',
+						image: require('@/assets/img/i3.png')
+					},
+					{
+						path: '/join/rescue',
+						title: '加入就在身边',
+						image: require('@/assets/img/i4.png')
+					},
+					{
+						path: '/join/member',
+						title: '会员入会登记',
+						image: require('@/assets/img/i5.png')
+					},
+					{
+						path: '/join/volunteer',
+						title: '志愿者报名',
+						image: require('@/assets/img/i6.png')
+					},
+					{
+						path: '/join/train',
+						title: '救护员培训报名',
+						image: require('@/assets/img/i7.png')
+					},
+					{
+						path: '/popularScience/list',
+						title: '红会科普',
+						image: require('@/assets/img/i8.png')
 					}
-					let date = new Date(item.add_time * 1000);
-					let Y = date.getFullYear();
-					let M = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
-					let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
-					item.time = Y + '/' + M + '/' + D;
-					return item;
-				});
-				obj.gundong();
-			});
+				],
+				swiperList: [],
+				// jxList: [],
+				spList: [],
+				imgList: [],
+				friendList: [],
+				redNews: [],
+				openNews: [],
+				regulationList: [],
+				moreJxList: [],
+				timer: null,
+				xsqList: [],
+			};
 		},
-		gundong() {
-			let obj = this;
-			obj.timer = setTimeout(() => {
-				obj.moreJxList.push(obj.moreJxList.shift());
-				// console.log(obj.moreJxList)
-				obj.gundong();
-			}, 2000);
+		filters: {
+			getTime(val) {
+				let date = new Date(val * 1000);
+				let Y = date.getFullYear();
+				let M = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
+				let D = date.getDate() < 10 ? '0' + date.getDay() : date.getDate();
+				return Y + '.' + M + '.' + D;
+			},
+			time(val) {
+
+				if (val) {
+					let arr = val.split(' ');
+					let str = arr[0];
+					str = str.replace(/-/g, '.');
+					return str;
+				}
+				return
+
+			}
 		},
-		getNewsList() {
-			let obj = this;
-			newsList({
-				page: 1,
-				limit: 9
-			}).then(res => {
-				obj.redNews = res.data.list.sort(this.compare('id'));
-			});
+		computed: {
+			jxList() {
+				return this.moreJxList.slice(0, 3);
+			},
+			showNew() {
+				let obj = this;
+				if (obj.redNews[0]) {
+					let data = {
+						id: obj.redNews[0].id,
+						img: obj.redNews[0].image_input[0],
+						title: obj.redNews[0].title
+					};
+					return data;
+				}
+
+				return {};
+			}
 		},
-		getOpenList() {
-			let obj = this;
-			openList({
-				page: 1,
-				limit: 9
-			}).then(res => {
-				obj.openNews = res.data.list.sort(this.compare('id'));
-				// console.log(obj.openNews)
-			});
+		created() {
+			this.getSwiperList();
+			this.getIndex();
+			this.getFirstAidList();
+			this.getJxList();
+			this.getNewsList();
+			this.getOpenList();
+			this.getRegulationList();
+			this.getXsqList()
 		},
-		getSwiperList() {
-			let obj = this;
-			banner().then(res => {
-				let list = res.data.list.map(item => {
-					return item.image_input[0];
+		methods: {
+			getXsqList() {
+				getList({
+					page: 1,
+					limit: 6
+				},53).then( ({data}) => {
+					this.xsqList = data.list
+				})
+			},
+			lookm() {
+				// console.log('newCenter')
+				this.navTo('/directories')
+			},
+			navTo(url) {
+				this.$router.push(url);
+			},
+			getIndex() {
+				loadIndexs().then(({
+					data
+				}) => {
+					this.friendList = data.friend_link;
+					this.imgList = data.picture_list;
+					// this.swiperList = data.banner
 				});
-				obj.swiperList = list;
-			});
-		},
-		getRegulationList() {
-			let obj = this;
-			regulationList({
-				page: 1,
-				limit: 6
-			}).then(res => {
-				obj.regulationList = res.data.list.sort(this.compare('id'));
-			});
-		},
-		compare(attribute) {
-			return function(obj1, obj2) {
-				var val1 = obj1[attribute];
-				var val2 = obj2[attribute];
-				if (val1 < val2) {
-					return 1;
-				} else if (val1 > val2) {
-					return -1;
-				} else {
-					return 0;
+			},
+			getFirstAidList() {
+				splist({
+					page: 1,
+					limit: 5
+				}).then(({
+					data
+				}) => {
+					this.spList = data.list;
+				});
+			},
+			getJxList() {
+				let obj = this;
+				let data = {
+					page: 1,
+					limit: 20
+				};
+				loveList(data).then(res => {
+					obj.moreJxList = res.data.list.map(item => {
+						if (item.intention === '') {
+							item.intention = '非定向捐款';
+						}
+						let date = new Date(item.add_time * 1000);
+						let Y = date.getFullYear();
+						let M = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() +
+							1;
+						let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
+						item.time = Y + '/' + M + '/' + D;
+						return item;
+					});
+					obj.gundong();
+				});
+			},
+			gundong() {
+				let obj = this;
+				obj.timer = setTimeout(() => {
+					obj.moreJxList.push(obj.moreJxList.shift());
+					// console.log(obj.moreJxList)
+					obj.gundong();
+				}, 2000);
+			},
+			getNewsList() {
+				let obj = this;
+				newsList({
+					page: 1,
+					limit: 9
+				}).then(res => {
+					obj.redNews = res.data.list.sort(this.compare('id'));
+				});
+			},
+			getOpenList() {
+				let obj = this;
+				openList({
+					page: 1,
+					limit: 9
+				}).then(res => {
+					obj.openNews = res.data.list.sort(this.compare('id'));
+					// console.log(obj.openNews)
+				});
+			},
+			getSwiperList() {
+				let obj = this;
+				banner().then(res => {
+					let list = res.data.list.map(item => {
+						return item.image_input[0];
+					});
+					obj.swiperList = list;
+				});
+			},
+			getRegulationList() {
+				let obj = this;
+				regulationList({
+					page: 1,
+					limit: 6
+				}).then(res => {
+					obj.regulationList = res.data.list.sort(this.compare('id'));
+				});
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
 				}
 			}
 		}
-	}
-};
+	};
 </script>
 
 <style lang="scss" spcode>
-.home-swiper {
-	width: 1200px;
-	height: 484px;
-	// background: pink;
-	margin: -20px auto 24px;
-	el-carousel {
+	.home-swiper {
 		width: 1200px;
-		el-carousel-item {
+		height: 484px;
+		// background: pink;
+		margin: -20px auto 24px;
+
+		el-carousel {
 			width: 1200px;
-			height: 484px;
+
+			el-carousel-item {
+				width: 1200px;
+				height: 484px;
+			}
+		}
+
+		.swiper-img {
+			width: 100%;
+			height: 100%;
 		}
 	}
-	.swiper-img {
-		width: 100%;
-		height: 100%;
-	}
-}
-.news-wrapper {
-	width: 1200px;
-	display: flex;
-	justify-content: space-between;
-	margin: 24px auto;
-	.new-pic {
-		width: 521px;
-		height: 344px;
-		// background-color: #ffff00;
-		position: relative;
-		img {
+
+	.news-wrapper {
+		width: 1200px;
+		display: flex;
+		justify-content: space-between;
+		margin: 24px auto;
+
+		.new-pic {
 			width: 521px;
 			height: 344px;
+			// background-color: #ffff00;
+			position: relative;
+
+			img {
+				width: 521px;
+				height: 344px;
+			}
+
+			.title {
+				width: 481px;
+				height: 55px;
+				padding-left: 20px;
+				padding-right: 20px;
+				background: #262626;
+				opacity: 0.8;
+				line-height: 55px;
+				font-size: 24px;
+				font-family: inpinheiti;
+				font-weight: 400;
+				color: #ffffff;
+				position: absolute;
+				bottom: 0;
+			}
 		}
-		.title {
-			width: 481px;
-			height: 55px;
-			padding-left: 20px;
-			padding-right: 20px;
-			background: #262626;
-			opacity: 0.8;
-			line-height: 55px;
-			font-size: 24px;
-			font-family: inpinheiti;
-			font-weight: 400;
-			color: #ffffff;
-			position: absolute;
-			bottom: 0;
-		}
-	}
-	.news {
-		width: 659px;
-		height: 344px;
-		background: #ffffff;
-		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
-	}
-}
-.home-body {
-	width: 1200px;
-	margin: 24px auto;
-	display: flex;
-	justify-content: space-between;
-	.body-left {
-		.red-new {
-			width: 588px;
+
+		.news {
+			width: 659px;
 			height: 344px;
 			background: #ffffff;
 			box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
-			margin-bottom: 24px;
-			// padding: 20px 15px 0 13px;
-		}
-		.new-open {
-			// padding: 20px 15px 0 13px;
-			width: 588px;
-			height: 262px;
-			background: #ffffff;
-			box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
 		}
-		.item-wrapper {
-			padding: 20px 15px 0 13px;
+	}
+
+	.home-body {
+		width: 1200px;
+		margin: 24px auto;
+
+		// display: flex;
+		// justify-content: space-between;
+		.body-left {
+			width: 1200px;
+			display: flex;
+			justify-content: space-between;
+
+			.join {
+				width: 588px;
+				height: 344px;
+				background: #ffffff;
+				box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+				margin-bottom: 24px;
+
+				.join-main {
+					padding-left: 46px;
+					padding-top: 15px;
+					display: flex;
+					flex-wrap: wrap;
+
+					.join-item {
+						display: flex;
+						flex-direction: column;
+						justify-content: center;
+						align-items: center;
+						margin-right: 28px;
+						margin-bottom: 14px;
+						font-size: 14px;
+						font-family: PingFang SC;
+						font-weight: bold;
+						color: #323131;
+						line-height: 1;
+
+						.logo {
+							width: 103px;
+							height: 103px;
+							border: 1px solid #dadada;
+							border-radius: 10px;
+							display: flex;
+							justify-content: center;
+							align-items: center;
+
+							img {
+								width: 50px;
+								height: 50px;
+							}
+						}
+
+						.title {
+							padding-top: 10px;
+						}
+					}
+				}
+			}
+
+			.red-new {
+				width: 588px;
+				height: 344px;
+				background: #ffffff;
+				box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+				margin-bottom: 24px;
+				// padding: 20px 15px 0 13px;
+			}
+
+			.new-open {
+				// padding: 20px 15px 0 13px;
+				width: 500px;
+				height: 262px;
+				background: #ffffff;
+				box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+			}
+
+			.item-wrapper {
+				padding: 20px 15px 0 13px;
+
+				.new-item {
+					display: flex;
+					justify-content: space-between;
+					margin-bottom: 17px;
+
+					&:hover {
+						span {
+							background: red;
+						}
+
+						.title {
+							color: red;
+						}
+
+						.time {
+							color: red;
+						}
+					}
 
-			.new-item {
-				display: flex;
-				justify-content: space-between;
-				margin-bottom: 17px;
-				&:hover {
 					span {
-						background: red;
+						display: inline-block;
+						width: 8px;
+						height: 8px;
+						background: #d8d8d8;
+						// border-radius: 50%;
+						transform: rotate(45deg);
+						margin-right: 8px;
 					}
+
 					.title {
-						color: red;
+						width: 400px;
+						height: 14px;
+						font-size: 14px;
+						font-family: PingFang SC;
+						font-weight: bold;
+						color: #101010;
+
+						&:hover {
+							color: red;
+						}
 					}
+
 					.time {
-						color: red;
-					}
-				}
-				span {
-					display: inline-block;
-					width: 8px;
-					height: 8px;
-					background: #d8d8d8;
-					// border-radius: 50%;
-					transform: rotate(45deg);
-					margin-right: 8px;
-				}
-				.title {
-					width: 400px;
-					height: 14px;
-					font-size: 14px;
-					font-family: PingFang SC;
-					font-weight: bold;
-					color: #101010;
-					&:hover {
-						color: red;
+						font-size: 14px;
+						font-family: PingFang SC;
+						font-weight: 500;
+						color: #999999;
 					}
 				}
-				.time {
-					font-size: 14px;
-					font-family: PingFang SC;
-					font-weight: 500;
-					color: #999999;
-				}
 			}
 		}
-	}
-	.body-right {
-		.join {
-			width: 588px;
-			height: 344px;
-			background: #ffffff;
-			box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
-			margin-bottom: 24px;
-			.join-main {
-				padding-left: 46px;
-				padding-top: 15px;
-				display: flex;
-				flex-wrap: wrap;
-				.join-item {
+
+		.body-right {
+			display: flex;
+			justify-content: space-between;
+
+			.loadmore {
+				width: 350px;
+				// background-color: red;
+				img {
+					width: 100%;
+					height: 100%;
+				}
+			}
+
+			.new-open {
+				// padding: 20px 15px 0 13px;
+				width: 450px;
+				height: 262px;
+				background: #ffffff;
+				box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+			}
+
+			.join {
+				width: 588px;
+				height: 344px;
+				background: #ffffff;
+				box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+				margin-bottom: 24px;
+
+				.join-main {
+					padding-left: 46px;
+					padding-top: 15px;
 					display: flex;
-					flex-direction: column;
-					justify-content: center;
-					align-items: center;
-					margin-right: 28px;
-					margin-bottom: 14px;
-					font-size: 14px;
-					font-family: PingFang SC;
-					font-weight: bold;
-					color: #323131;
-					line-height: 1;
-					.logo {
-						width: 103px;
-						height: 103px;
-						border: 1px solid #dadada;
-						border-radius: 10px;
+					flex-wrap: wrap;
+
+					.join-item {
 						display: flex;
+						flex-direction: column;
 						justify-content: center;
 						align-items: center;
-						img {
-							width: 50px;
-							height: 50px;
+						margin-right: 28px;
+						margin-bottom: 14px;
+						font-size: 14px;
+						font-family: PingFang SC;
+						font-weight: bold;
+						color: #323131;
+						line-height: 1;
+
+						.logo {
+							width: 103px;
+							height: 103px;
+							border: 1px solid #dadada;
+							border-radius: 10px;
+							display: flex;
+							justify-content: center;
+							align-items: center;
+
+							img {
+								width: 50px;
+								height: 50px;
+							}
+						}
+
+						.title {
+							padding-top: 10px;
 						}
-					}
-					.title {
-						padding-top: 10px;
 					}
 				}
 			}
-		}
-		.list {
-			width: 588px;
-			height: 262px;
-			background: #ffffff;
-			box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
-			.list-item {
-				display: flex;
-				border-bottom: 1px solid #f2f2f2;
-				&:last-of-type {
-					border-bottom: none;
+
+			.list {
+				width: 350px;
+				height: 262px;
+				background: #ffffff;
+				box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+
+				.list-item {
+					display: flex;
+					border-bottom: 1px solid #f2f2f2;
+
+					&:last-of-type {
+						border-bottom: none;
+					}
+
+					div {
+						width: 33.3%;
+						height: 55px;
+						line-height: 55px;
+						text-align: center;
+						font-size: 17px;
+						font-family: PingFang SC;
+						font-weight: 500;
+						color: #666666;
+					}
 				}
-				div {
-					width: 25%;
-					height: 55px;
-					line-height: 55px;
-					text-align: center;
+
+				.list-title {
+					display: flex;
+					padding-top: 6px;
+
+					div {
+						width: 33.3%;
+						font-size: 17px;
+						font-family: PingFang SC;
+						font-weight: bold;
+						color: #bf3333;
+						text-align: center;
+						line-height: 57px;
+						height: 57px;
+						border-bottom: 1px solid #f2f2f2;
+					}
+				}
+
+				.is-leaf {
 					font-size: 17px;
 					font-family: PingFang SC;
-					font-weight: 500;
-					color: #666666;
+					font-weight: bold;
+					color: #d82020 !important;
+					text-align: center;
+					// line-height: 54px;
+					height: 54px;
 				}
-			}
-			.list-title {
-				display: flex;
-				padding-top: 6px;
-				div {
-					width: 25%;
+
+				.el-table__row>td {
 					font-size: 17px;
 					font-family: PingFang SC;
 					font-weight: bold;
-					color: #bf3333;
+					color: #101010;
 					text-align: center;
-					line-height: 57px;
-					height: 57px;
-					border-bottom: 1px solid #f2f2f2;
-				}
-			}
-			.is-leaf {
-				font-size: 17px;
-				font-family: PingFang SC;
-				font-weight: bold;
-				color: #d82020 !important;
-				text-align: center;
-				// line-height: 54px;
-				height: 54px;
-			}
-			.el-table__row > td {
-				font-size: 17px;
-				font-family: PingFang SC;
-				font-weight: bold;
-				color: #101010;
-				text-align: center;
-				height: 55px;
-				.cell {
-					overflow: hidden;
-					text-overflow: ellipsis;
-					white-space: nowrap;
-					display: block;
+					height: 55px;
+
+					.cell {
+						overflow: hidden;
+						text-overflow: ellipsis;
+						white-space: nowrap;
+						display: block;
+					}
 				}
 			}
 		}
 	}
-}
-.show-live {
-	display: block;
-	width: 1200px;
-	height: 160px;
-	margin: 24px auto;
-	// background-color: #cbb385;
-}
-.show-pic {
-	width: 1200px;
-	// height: 192px;
-	background: #ffffff;
-	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
-	margin: 24px auto;
-	.imgs-wrapper {
-		padding: 14px 12px;
-		.imgs {
-			width: 1176px;
-			// height: 124px;
-			display: flex;
-			flex-wrap: nowrap;
-			overflow: auto hidden;
-			img {
-				width: 186px;
-				height: 124px;
-				margin-right: 12px;
+
+	.show-live {
+		display: block;
+		width: 1200px;
+		height: 160px;
+		margin: 24px auto;
+		// background-color: #cbb385;
+	}
+
+	.show-pic {
+		width: 1200px;
+		// height: 192px;
+		background: #ffffff;
+		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+		margin: 24px auto;
+
+		.imgs-wrapper {
+			padding: 14px 12px;
+
+			.imgs {
+				width: 1176px;
+				// height: 124px;
+				display: flex;
+				flex-wrap: nowrap;
+				overflow: auto hidden;
+
+				img {
+					width: 186px;
+					height: 124px;
+					margin-right: 12px;
+				}
 			}
 		}
 	}
-}
-.friends {
-	width: 1200px;
-	// height: 96px;
-	background: #ffffff;
-	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
-	margin: 24px auto;
-	.friend-list-wrapper {
-		padding: 20px 28px 10px 28px;
-		display: flex;
-		flex-wrap: wrap;
-		.friend-item {
-			font-size: 14px;
-			font-family: PingFang SC;
-			font-weight: bold;
-			color: #323131;
-			margin-left: 51px;
-			margin-bottom: 15px;
-			.item-a {
+
+	.friends {
+		width: 1200px;
+		// height: 96px;
+		background: #ffffff;
+		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+		margin: 24px auto;
+
+		.friend-list-wrapper {
+			padding: 20px 28px 10px 28px;
+			display: flex;
+			flex-wrap: wrap;
+
+			.friend-item {
+				font-size: 14px;
+				font-family: PingFang SC;
+				font-weight: bold;
 				color: #323131;
+				margin-left: 51px;
+				margin-bottom: 15px;
+
+				.item-a {
+					color: #323131;
+				}
 			}
 		}
 	}
-}
-.el-carousel__button {
-	width: 16px;
-	height: 16px;
-	border-radius: 50%;
-}
-
-.is-active {
+
 	.el-carousel__button {
-		background-color: #d82020 !important;
+		width: 16px;
+		height: 16px;
+		border-radius: 50%;
 	}
-}
-.item-wrapper {
-	padding: 20px 15px 0 13px;
 
-	.new-item {
-		display: flex;
-		justify-content: space-between;
-		margin-bottom: 17px;
-		&:hover {
+	.is-active {
+		.el-carousel__button {
+			background-color: #d82020 !important;
+		}
+	}
+
+	.item-wrapper {
+		padding: 20px 15px 0 13px;
+
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			margin-bottom: 17px;
+
+			&:hover {
+				span {
+					background: red;
+				}
+
+				.title {
+					color: red;
+				}
+
+				.time {
+					color: red;
+				}
+			}
+
 			span {
-				background: red;
+				display: inline-block;
+				width: 8px;
+				height: 8px;
+				background: #d8d8d8;
+				// border-radius: 50%;
+				transform: rotate(45deg);
+				margin-right: 8px;
 			}
+
 			.title {
-				color: red;
+				width: 400px;
+				height: 14px;
+				font-size: 14px;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #101010;
+				// &:hover {
+				// 	color: red;
+				// }
 			}
+
 			.time {
-				color: red;
+				font-size: 14px;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #999999;
 			}
 		}
-		span {
-			display: inline-block;
-			width: 8px;
-			height: 8px;
-			background: #d8d8d8;
-			// border-radius: 50%;
-			transform: rotate(45deg);
-			margin-right: 8px;
-		}
-		.title {
-			width: 400px;
-			height: 14px;
-			font-size: 14px;
-			font-family: PingFang SC;
-			font-weight: bold;
-			color: #101010;
-			// &:hover {
-			// 	color: red;
-			// }
-		}
-		.time {
-			font-size: 14px;
-			font-family: PingFang SC;
-			font-weight: 500;
-			color: #999999;
-		}
 	}
-}
-.table-empty {
-	// width: 100%;
-	text-align: center;
-	// border: 2px solid #f2f2f2;
-	font-size: 16px;
-	line-height: 36px;
-	font-family: PingFang SC;
-	// font-weight: bold;
-	border-top: none;
-	color: #999;
-}
+
+	.table-empty {
+		// width: 100%;
+		text-align: center;
+		// border: 2px solid #f2f2f2;
+		font-size: 16px;
+		line-height: 36px;
+		font-family: PingFang SC;
+		// font-weight: bold;
+		border-top: none;
+		color: #999;
+	}
 </style>

src/views/Introduce.vue

@@ -0,0 +1,170 @@
+<template>
+	<div class="about">
+		<div class="wrapper">
+			<div class="left-nav" :style="{height: navHeight}">
+				<div class="nav-title">组织介绍</div>
+				<div class="nav-item" v-for="item in navList" :key="item.uid" :class="{'action': currentIndex == item.uid }" @click="navClick(item.uid)">
+					<!-- :class="{'action': currentUrl.indexOf(item.path) !== -1 }"> -->
+					<div class="item-name">
+						{{item.name}}
+					</div>
+					<div class="item-icon">
+						>
+					</div>
+				</div>
+			</div>
+			<div class="right-content">
+				<!-- <div class="title moren" v-if="isShow">
+					{{rightTitle}}
+				</div> -->
+				<div style="padding: 35px 50px 35px 50px;" class="line">
+					<div class="new-detail">
+						<div class="content" v-html="content"></div>
+					</div>
+				</div>
+		
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+import LeftNav from '../components/leftNav/LeftNav.vue';
+import { details, getArticleList } from '../request/api.js';
+export default {
+	components: {
+		LeftNav
+	},
+	data() {
+		return {
+			content: '',
+			currentIndex: '',
+			rightTitle: '',
+			navList: [],
+		};
+	},
+	computed: {
+		navHeight() {
+			return this.navList.length * 51 + 52 + 'px'
+		},
+	},
+	mounted() {
+		this.getList()
+	},
+	methods:{
+		getList() {
+			let that = this
+			getArticleList({},43).then(({data}) => {
+				console.log(data)
+				let arr = data.list.reverse()
+				arr.forEach(item => {
+					let obj = {}
+					obj.name = item.title
+					obj.uid = item.id
+					that.navList.push(obj)
+					console.log(that.navList,'55555')
+				})
+				this.navClick(arr[0].id)
+			}).catch( err => {
+				console.log(err)
+			})
+		},
+		navClick(id) {
+			this.currentIndex = id
+			details({},id).then(({data})=> {
+				this.content = data.content
+			})
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+	.wrapper {
+		width: 1200px;
+		display: flex;
+		justify-content: space-between;
+	
+	}
+	
+	.left-nav {
+		width: 265px;
+		// height: 154px;
+		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+	
+		.nav-title {
+			height: 52px;
+			background-color: #d82020;
+			line-height: 52px;
+			text-align: center;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #FFFFFF;
+			letter-spacing: 3px;
+			cursor: default;
+		}
+	
+		.nav-item {
+			cursor: pointer;
+			border-top: 1px #fcfbfb solid;
+			display: flex;
+			height: 50px;
+			background-color: #f2eeef;
+			justify-content: space-between;
+			line-height: 50px;
+			padding: 0 37px 0 26px;
+	
+			.item-name {
+				font-size: 16px;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #333333;
+				letter-spacing: 1px
+			}
+	
+			.item-icon {
+				font-size: 16px;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #999999;
+			}
+		}
+	
+		.action {
+			background-color: #f7dfdf;
+		}
+	}
+	
+	.right-content {
+		width: 915px;
+		min-height: 706px;
+		border-top: 2px solid #D82020;
+		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+	
+		.title {
+			border: 2px #d82020 solid;
+			width: 156px;
+			height: 50px;
+			line-height: 50px;
+			text-align: center;
+			background: #D82020;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #FFFFFF;
+			position: relative;
+			top: -2px;
+		}
+	
+		.action {
+			background: #FFFFFF;
+			color: #D82020;
+		}
+	}
+	
+	.line {
+		line-height: 1.5;
+	}
+</style>
+

src/views/Join.vue

@@ -15,15 +15,16 @@
 		data() {
 			return {
 				navList: [
-					{ index: 0, name: '我要捐款', path: '/donation/contribution' },
-					{ index: 1, name: '我要器官捐献', path: '/donation/organDonation' },
-					{ index: 2, name: '我要造血干细胞捐献', path: '/donation/Hpc' },
-					{ index: 3, name: '我要登记救护员', path: '/join/rescue' },
-					{ index: 4, name: '我要登记个人会员', path: '/join/member' },
-					{ index: 5, name: '我要登记志愿者', path: '/join/volunteer' },
-					{ index: 6, name: '我要报名普及培训', path: '/join/train' },
+					{ index: 0, name: '爱心捐赠', path: '/donation/contribution' },
+					{ index: 1, name: '遗体及器官捐献', path: '/donation/organDonation' },
+					{ index: 2, name: '造血干细胞捐献', path: '/donation/Hpc' },
+					// { index: 3, name: '加入就在身边志愿者', path: '/join/rescue' },
+					{ index: 3, name: '会员入会登记', path: '/join/member' },
+					{ index: 4, name: '志愿者报名', path: '/join/volunteer' },
+					{ index: 5, name: '救护员培训报名', path: '/join/train' },
+					{ index: 6, name: '加入就在身边志愿者', path: '/join/rescue' },
 				],
-				rightTitle: '我要登记志愿者',
+				rightTitle: '志愿者报名',
 			}
 		}
 	}

src/views/Knowledge.vue

@@ -0,0 +1,35 @@
+<template>
+	<div class="news">
+			<router-view></router-view>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{
+					index: 0,
+					name: '救护培训',
+					path: '/rescue'
+				}, {
+					index: 1,
+					name: '造血干细胞',
+					path: '/publicity'
+				}, {
+					index: 1,
+					name: '无偿献血',
+					path: '/publicity'
+				}],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/Law.vue

@@ -0,0 +1,172 @@
+<template>
+	<div class="about">
+		<div class="wrapper">
+			<div class="left-nav" :style="{height: navHeight}">
+				<div class="nav-title">政策法规</div>
+				<div class="nav-item" v-for="item in navList" :key="item.uid" :class="{'action': currentIndex == item.uid }" @click="navClick(item.uid)">
+					<div class="item-name">
+						{{item.name}}
+					</div>
+					<div class="item-icon">
+						>
+					</div>
+				</div>
+			</div>
+			<div class="right-content">
+				<div style="padding: 35px 50px 35px 50px;" class="line">
+					<div class="new-detail">
+						<div class="content" v-html="content"></div>
+					</div>
+				</div>
+		
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+import LeftNav from '../components/leftNav/LeftNav.vue';
+import { details, getArticleList } from '../request/api.js';
+export default {
+	components: {
+		LeftNav
+	},
+	data() {
+		return {
+			content: '',
+			currentIndex: '',
+			rightTitle: '',
+			navList: [
+				// { index: 0, name: '关于中国红十字会', path: '/about/chineseRedCross' },
+				// { index: 1, name: '中国红十字会法', path: '/about/redCrossLaw' },
+				// { index: 2, name: '关于红十字运动', path: '/about/redCrossMovement' },
+				// // 第十届监事会监事长名单
+				// { index: 3, name: '第十届监事会监事长名单', path: '/about/matrix' },
+			],
+		};
+	},
+	computed: {
+		navHeight() {
+			return this.navList.length * 51 + 52 + 'px'
+		},
+	},
+	mounted() {
+		this.getList()
+	},
+	methods:{
+		getList() {
+			let that = this
+			getArticleList({},10).then(({data}) => {
+				console.log(data)
+				let arr = data.list.reverse()
+				arr.forEach(item => {
+					let obj = {}
+					obj.name = item.title
+					obj.uid = item.id
+					that.navList.push(obj)
+					console.log(that.navList,'55555')
+				})
+				this.navClick(arr[0].id)
+			}).catch( err => {
+				console.log(err)
+			})
+		},
+		navClick(id) {
+			this.currentIndex = id
+			details({},id).then(({data})=> {
+				this.content = data.content
+			})
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+	.wrapper {
+		width: 1200px;
+		display: flex;
+		justify-content: space-between;
+	
+	}
+	
+	.left-nav {
+		width: 265px;
+		// height: 154px;
+		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+	
+		.nav-title {
+			height: 52px;
+			background-color: #d82020;
+			line-height: 52px;
+			text-align: center;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #FFFFFF;
+			letter-spacing: 3px;
+			cursor: default;
+		}
+	
+		.nav-item {
+			cursor: pointer;
+			border-top: 1px #fcfbfb solid;
+			display: flex;
+			height: 50px;
+			background-color: #f2eeef;
+			justify-content: space-between;
+			line-height: 50px;
+			padding: 0 37px 0 26px;
+	
+			.item-name {
+				font-size: 16px;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #333333;
+				letter-spacing: 1px
+			}
+	
+			.item-icon {
+				font-size: 16px;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #999999;
+			}
+		}
+	
+		.action {
+			background-color: #f7dfdf;
+		}
+	}
+	
+	.right-content {
+		width: 915px;
+		min-height: 706px;
+		border-top: 2px solid #D82020;
+		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+	
+		.title {
+			border: 2px #d82020 solid;
+			width: 156px;
+			height: 50px;
+			line-height: 50px;
+			text-align: center;
+			background: #D82020;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: bold;
+			color: #FFFFFF;
+			position: relative;
+			top: -2px;
+		}
+	
+		.action {
+			background: #FFFFFF;
+			color: #D82020;
+		}
+	}
+	
+	.line {
+		line-height: 1.5;
+	}
+</style>
+

src/views/LoveList.vue

@@ -1,18 +1,18 @@
 <template>
 	<div class="love-list">
 		<div class="list-title flex">
-			<div style="width: 154px">捐献时间</div>
-			<div  style="width: 409px">捐献者</div>
-			<div  style="width: 140px">捐献金额</div>
-			<div  style="width: 356px">捐献意向</div>
-			<div  style="width: 133px">备注</div>
+			<div style="width: 350px">捐献时间</div>
+			<div  style="width: 500px">捐献者</div>
+			<div  style="width: 350px">捐献金额</div>
+			<!-- <div  style="width: 356px">捐献意向</div>
+			<div  style="width: 133px">备注</div> -->
 		</div>
 		<div class="list-item flex" v-for="(item, index) in tableData" :key="index">
-			<div class="clamp"  style="width: 154px">{{item.time}}</div>
-			<div class="clamp"  style="width: 409px">{{item.donate_er}}</div>
-			<div class="clamp" style="width: 140px">{{item.money}}</div>
-			<div class="clamp" style="width: 356px">{{item.intention}}</div>
-			<div class="clamp" style="width: 133px">{{item.mask}}</div>
+			<div class="clamp"  style="width: 350px">{{item.release_time}}</div>
+			<div class="clamp"  style="width: 500px">{{item.title}}</div>
+			<div class="clamp" style="width: 350px">{{item.synopsis}}</div>
+			<!-- <div class="clamp" style="width: 356px">{{item.intention}}</div>
+			<div class="clamp" style="width: 133px">{{item.mask}}</div> -->
 		</div>
 		<div class="table-empty" v-if="tableData.length == 0">
 			暂无更多捐赠数据
@@ -22,12 +22,12 @@
 </template>
 
 <script>
-	import { loveList } from '../request/api.js'
+	import { loveList,getList } from '../request/api.js'
 export default {
 	data() {
 		return {
 			tableData: [],
-			total: 100,
+			total: 0,
 			page:1,
 			limit: 14
 		};
@@ -47,20 +47,24 @@ export default {
 				page: obj.page,
 				limit: obj.limit
 			}
-			loveList(data).then( res => {
-				obj.tableData = res.data.list.map(item => {
-					if(item.intention === ''){
-						item.intention = '非定向捐款'
-					}
-					let date = new Date(item.add_time*1000)
-					let Y = date.getFullYear()
-					let M = date.getMonth()+1 < 10 ? '0' + (date.getMonth()+1) : date.getMonth() + 1;
-					let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
-					item.time = Y + '/' + M + '/' + D
-					return item
-				})
-				obj.total = res.data.count
+			getList(data,62).then( ({data}) => {
+				console.log(data)
+				this.tableData = data.list
 			})
+			// loveList(data).then( res => {
+			// 	obj.tableData = res.data.list.map(item => {
+			// 		if(item.intention === ''){
+			// 			item.intention = '非定向捐款'
+			// 		}
+			// 		let date = new Date(item.add_time*1000)
+			// 		let Y = date.getFullYear()
+			// 		let M = date.getMonth()+1 < 10 ? '0' + (date.getMonth()+1) : date.getMonth() + 1;
+			// 		let D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
+			// 		item.time = Y + '/' + M + '/' + D
+			// 		return item
+			// 	})
+			// 	obj.total = res.data.count
+			// })
 		}
 	}
 };

src/views/NewContent.vue

@@ -0,0 +1,22 @@
+<template>
+	<div class="news">
+			<router-view></router-view>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/News.vue

@@ -1,6 +1,6 @@
 <template>
 	<div class="news">
-		<left-nav :navList="navList">
+		<left-nav :navList="navList" :topTitle="'红会新闻'">
 			<router-view></router-view>
 		</left-nav>
 	</div>
@@ -15,8 +15,7 @@
 		},
 		data() {
 			return {
-				navList: [{ index: 0, name: '红色新闻', path: '/news' }, { index: 1, name: '信息公示', path: '/publicity' }, {index: 2, name: '政策法规', path: '/regulations'}],
-				// radio: '1'
+				navList: [{ index: 0, name: '红会新闻', path: '/news' }, { index: 1, name: '信息公示', path: '/publicity' }],
 			};
 		}
 	};

src/views/Organs.vue

@@ -0,0 +1,25 @@
+<template>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'捐献名录'">
+			<router-view></router-view>
+		</left-nav>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../components/leftNav/LeftNav.vue';
+	
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{ index: 0, name: '造血干细胞捐献名录', path: '/directories' }, { index: 1, name: '器官/遗体捐献名录', path: '/organs' }],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/Publicity.vue

@@ -1,6 +1,6 @@
 <template>
 	<div class="publicity">
-		<left-nav :navList="navList">
+		<left-nav :navList="navList" :topTitle="'信息公示'">
 			<router-view></router-view>
 		</left-nav>
 	</div>
@@ -15,7 +15,7 @@
 		},
 		data() {
 			return {
-				navList: [{ index: 0, name: '红色新闻', path: '/news' }, { index: 1, name: '信息公示', path: '/publicity' },{index: 2, name: '政策法规', path: '/regulations'}],
+				navList: [{ index: 0, name: '红色新闻', path: '/news' }, { index: 1, name: '信息公示', path: '/publicity' }],
 			};
 		}
 	};

src/views/Regulations.vue

@@ -15,7 +15,6 @@
 		},
 		data() {
 			return {
-				navList: [{ index: 0, name: '红色新闻', path: '/news' }, { index: 1, name: '信息公示', path: '/publicity' },{index: 2, name: '政策法规', path: '/regulations'}],
 				// radio: '1'
 			};
 		}

src/views/directories/List.vue

@@ -3,72 +3,82 @@
 		<div class="empty" v-if="newList.length == 0">
 			暂无数据
 		</div>
-		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/directories/detail?id='+ item.id)">
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/news/detail?id='+ item.id)">
 			<div class="title clamp">
 				<span class="title-icon"></span>
 				{{ item.title }}
 			</div>
 			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
 		</div>
-		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页" @current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
 	</div>
 </template>
 
 <script>
-import { loadIndexs, splist, loveList, friendList , newsList, openList , regulationList, getDirectoriesList } from '../../request/api.js';
-export default {
-	data() {
-		return {
-			newList: [],
-			total: 0,
-			page: 1,
-			limit: 15
-		};
-	},
-	filters: {
-		time(val) {
-			let arr = val.split(' ')
-			let str = arr[0]
-			str = str.replace(/-/g, '.')
-			return str
-		}
-	},
-	created() {
-		this.getList()
-	},
-	methods:{
-		navTo(url) {
-			this.$router.push(url);
+	import {
+		loadIndexs,
+		splist,
+		loveList,
+		friendList,
+		newsList,
+		openList,
+		getList
+	} from '../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
 		},
-		currentChange(e) {
-			this.page = e
-			this.getList()
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
 		},
-		getList() {
-			let obj = this
-			getDirectoriesList({
-				page: obj.page,
-				limit: obj.limit
-			}).then(res => {
-				obj.newList = res.data.list.sort(this.compare('id'))
-				obj.total = res.data.count
-			})
+		created() {
+			this.getList()
 		},
-		compare(attribute) {
-			return function(obj1, obj2) {
-				var val1 = obj1[attribute];
-				var val2 = obj2[attribute];
-				if (val1 < val2) {
-					return 1;
-				} else if (val1 > val2) {
-					return -1;
-				} else {
-					return 0;
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},60).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					// var newArrayData=res.data.list.sort(compare('Id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
 				}
 			}
 		}
-	}
-};
+	};
 </script>
 
 <style lang="scss" scoped>
@@ -78,41 +88,47 @@ export default {
 		height: 400px;
 		line-height: 400px;
 	}
-.new-list {
-	// padding: 0px 72px 0 40px;
-	.new-item {
-		display: flex;
-		justify-content: space-between;
-		font-size: 18px;
-		font-family: PingFang SC;
-		font-weight: 500;
-		color: #666666;
-		height: 40px;
-		border-bottom: 1px solid #E5E5E5;
-		line-height: 40px;
-		&:hover {
-			color: red;
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
 			.title {
+				width: 500px;
+
 				.title-icon {
-					border-left-color: red;
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
 				}
 			}
 		}
-		.title {
-			width: 800px;
-			.title-icon {
-				display: inline-block;
-				width: 0;
-				height: 0;
-				width: 0;
-				height: 0;
-				border-top: 6px solid transparent;
-				border-left: 8px solid #d2d2d2;
-				border-bottom: 6px solid transparent;
-			}
-		}
 	}
-}
+
 	/deep/ .el-pagination {
 		margin-top: 50px;
 		text-align: center;

src/views/homeChild/ItemTitle.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="item-title">
+  <div class="item-title" style="display: flex; justify-content: space-between;">
     <div class="title moren">{{title}}</div>
     <div class="more hand" v-if="isShow === '1'" @click="loadMore" >【查看更多】</div>
   </div>
@@ -42,7 +42,8 @@ export default {
     font-family: PingFang SC;
     font-weight: bold;
     color: #ffffff;
-    width: 120px;
+    min-width: 120px;
+	padding: 0 20px;
     height: 38px;
     line-height: 40px;
     background-color: #d82020;

src/views/knowledge/BloodDonation.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'知识库'">
+			<router-view></router-view>
+		</left-nav>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{
+					index: 0,
+					name: '救护培训',
+					path: '/knowledge/rescue'
+				}, {
+					index: 1,
+					name: '造血干细胞',
+					path: '/knowledge/cells'
+				}, {
+					index: 1,
+					name: '无偿献血',
+					path: '/knowledge/bloodDonation'
+				}],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/knowledge/Cells.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'知识库'">
+			<router-view></router-view>
+		</left-nav>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{
+					index: 0,
+					name: '救护培训',
+					path: '/knowledge/rescue'
+				}, {
+					index: 1,
+					name: '造血干细胞',
+					path: '/knowledge/cells'
+				}, {
+					index: 1,
+					name: '无偿献血',
+					path: '/knowledge/bloodDonation'
+				}],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/knowledge/Rescue.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'知识库'">
+			<router-view></router-view>
+		</left-nav>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{
+					index: 0,
+					name: '救护培训',
+					path: '/knowledge/rescue'
+				}, {
+					index: 1,
+					name: '造血干细胞',
+					path: '/knowledge/cells'
+				}, {
+					index: 1,
+					name: '无偿献血',
+					path: '/knowledge/bloodDonation'
+				}],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/knowledge/bloodDonation/Detail.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="new-detail">
+		<dcontent :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { details } from '../../../request/api.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				details({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/knowledge/bloodDonation/List.vue

@@ -0,0 +1,120 @@
+<template>
+	<div class="new-list">
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/knowledge/bloodDonation/detail?id='+ item.id)">
+			<div class="title clamp">
+				<span class="title-icon"></span>
+				{{ item.title }}
+			</div>
+			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
+		</div>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+	</div>
+</template>
+
+<script>
+	import {
+		getList
+	} from '../../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
+		},
+		created() {
+			this.getList()
+		},
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},50).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
+			.title {
+				width: 500px;
+
+				.title-icon {
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
+				}
+			}
+		}
+	}
+
+	/deep/ .el-pagination {
+		margin-top: 50px;
+		text-align: center;
+	}
+</style>

src/views/knowledge/cells/Detail.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="new-detail">
+		<dcontent :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { details } from '../../../request/api.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				details({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/knowledge/cells/List.vue

@@ -0,0 +1,120 @@
+<template>
+	<div class="new-list">
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/knowledge/cells/detail?id='+ item.id)">
+			<div class="title clamp">
+				<span class="title-icon"></span>
+				{{ item.title }}
+			</div>
+			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
+		</div>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+	</div>
+</template>
+
+<script>
+	import {
+		getList
+	} from '../../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
+		},
+		created() {
+			this.getList()
+		},
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},49).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
+			.title {
+				width: 500px;
+
+				.title-icon {
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
+				}
+			}
+		}
+	}
+
+	/deep/ .el-pagination {
+		margin-top: 50px;
+		text-align: center;
+	}
+</style>

src/views/knowledge/rescue/Detail.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="new-detail">
+		<dcontent :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { details } from '../../../request/api.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				details({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/knowledge/rescue/List.vue

@@ -0,0 +1,120 @@
+<template>
+	<div class="new-list">
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/knowledge/rescue/detail?id='+ item.id)">
+			<div class="title clamp">
+				<span class="title-icon"></span>
+				{{ item.title }}
+			</div>
+			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
+		</div>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+	</div>
+</template>
+
+<script>
+	import {
+		getList
+	} from '../../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
+		},
+		created() {
+			this.getList()
+		},
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},48).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
+			.title {
+				width: 500px;
+
+				.title-icon {
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
+				}
+			}
+		}
+	}
+
+	/deep/ .el-pagination {
+		margin-top: 50px;
+		text-align: center;
+	}
+</style>

src/views/newContent/Hhs.vue

@@ -0,0 +1,58 @@
+<template>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'县市区红会动态'">
+			<router-view></router-view>
+		</left-nav>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{
+					index: 0,
+					name: '江陵县红会',
+					path: '/newContent/jlx'
+				}, {
+					index: 1,
+					name: '石首市红会',
+					path: '/newContent/sss'
+				}, {
+					index: 2,
+					name: '洪湖市红会',
+					path: '/newContent/hhs'
+				},
+				{
+					index: 3,
+					name: '荆州区红会',
+					path: '/newContent/jzq'
+				},
+				{
+					index: 4,
+					name: '沙市区红会',
+					path: '/newContent/ssq'
+				},
+				{
+					index: 5,
+					name: '松滋市红会',
+					path: '/newContent/szs'
+				},
+				{
+					index: 6,
+					name: '监利县红会',
+					path: '/newContent/jls'
+				},
+			],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/newContent/Jls.vue

@@ -0,0 +1,58 @@
+<template>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'县市区红会动态'">
+			<router-view></router-view>
+		</left-nav>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{
+					index: 0,
+					name: '江陵县红会',
+					path: '/newContent/jlx'
+				}, {
+					index: 1,
+					name: '石首市红会',
+					path: '/newContent/sss'
+				}, {
+					index: 2,
+					name: '洪湖市红会',
+					path: '/newContent/hhs'
+				},
+				{
+					index: 3,
+					name: '荆州区红会',
+					path: '/newContent/jzq'
+				},
+				{
+					index: 4,
+					name: '沙市区红会',
+					path: '/newContent/ssq'
+				},
+				{
+					index: 5,
+					name: '松滋市红会',
+					path: '/newContent/szs'
+				},
+				{
+					index: 6,
+					name: '监利县红会',
+					path: '/newContent/jls'
+				},
+			],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/newContent/Jlx.vue

@@ -0,0 +1,58 @@
+<template>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'县市区红会动态'">
+			<router-view></router-view>
+		</left-nav>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{
+					index: 0,
+					name: '江陵县红会',
+					path: '/newContent/jlx'
+				}, {
+					index: 1,
+					name: '石首市红会',
+					path: '/newContent/sss'
+				}, {
+					index: 2,
+					name: '洪湖市红会',
+					path: '/newContent/hhs'
+				},
+				{
+					index: 3,
+					name: '荆州区红会',
+					path: '/newContent/jzq'
+				},
+				{
+					index: 4,
+					name: '沙市区红会',
+					path: '/newContent/ssq'
+				},
+				{
+					index: 5,
+					name: '松滋市红会',
+					path: '/newContent/szs'
+				},
+				{
+					index: 6,
+					name: '监利县红会',
+					path: '/newContent/jls'
+				},
+			],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/newContent/Jzq.vue

@@ -0,0 +1,58 @@
+<template>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'县市区红会动态'">
+			<router-view></router-view>
+		</left-nav>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{
+					index: 0,
+					name: '江陵县红会',
+					path: '/newContent/jlx'
+				}, {
+					index: 1,
+					name: '石首市红会',
+					path: '/newContent/sss'
+				}, {
+					index: 2,
+					name: '洪湖市红会',
+					path: '/newContent/hhs'
+				},
+				{
+					index: 3,
+					name: '荆州区红会',
+					path: '/newContent/jzq'
+				},
+				{
+					index: 4,
+					name: '沙市区红会',
+					path: '/newContent/ssq'
+				},
+				{
+					index: 5,
+					name: '松滋市红会',
+					path: '/newContent/szs'
+				},
+				{
+					index: 6,
+					name: '监利县红会',
+					path: '/newContent/jls'
+				},
+			],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/newContent/Ssq.vue

@@ -0,0 +1,58 @@
+<template>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'县市区红会动态'">
+			<router-view></router-view>
+		</left-nav>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{
+					index: 0,
+					name: '江陵县红会',
+					path: '/newContent/jlx'
+				}, {
+					index: 1,
+					name: '石首市红会',
+					path: '/newContent/sss'
+				}, {
+					index: 2,
+					name: '洪湖市红会',
+					path: '/newContent/hhs'
+				},
+				{
+					index: 3,
+					name: '荆州区红会',
+					path: '/newContent/jzq'
+				},
+				{
+					index: 4,
+					name: '沙市区红会',
+					path: '/newContent/ssq'
+				},
+				{
+					index: 5,
+					name: '松滋市红会',
+					path: '/newContent/szs'
+				},
+				{
+					index: 6,
+					name: '监利县红会',
+					path: '/newContent/jls'
+				},
+			],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/newContent/Sss.vue

@@ -0,0 +1,58 @@
+<template>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'县市区红会动态'">
+			<router-view></router-view>
+		</left-nav>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{
+					index: 0,
+					name: '江陵县红会',
+					path: '/newContent/jlx'
+				}, {
+					index: 1,
+					name: '石首市红会',
+					path: '/newContent/sss'
+				}, {
+					index: 2,
+					name: '洪湖市红会',
+					path: '/newContent/hhs'
+				},
+				{
+					index: 3,
+					name: '荆州区红会',
+					path: '/newContent/jzq'
+				},
+				{
+					index: 4,
+					name: '沙市区红会',
+					path: '/newContent/ssq'
+				},
+				{
+					index: 5,
+					name: '松滋市红会',
+					path: '/newContent/szs'
+				},
+				{
+					index: 6,
+					name: '监利县红会',
+					path: '/newContent/jls'
+				},
+			],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/newContent/Szs.vue

@@ -0,0 +1,58 @@
+<template>
+	<div class="news">
+		<left-nav :navList="navList" :topTitle="'县市区红会动态'">
+			<router-view></router-view>
+		</left-nav>
+	</div>
+</template>
+
+<script>
+	import LeftNav from '../../components/leftNav/LeftNav.vue';
+
+	export default {
+		components: {
+			LeftNav
+		},
+		data() {
+			return {
+				navList: [{
+					index: 0,
+					name: '江陵县红会',
+					path: '/newContent/jlx'
+				}, {
+					index: 1,
+					name: '石首市红会',
+					path: '/newContent/sss'
+				}, {
+					index: 2,
+					name: '洪湖市红会',
+					path: '/newContent/hhs'
+				},
+				{
+					index: 3,
+					name: '荆州区红会',
+					path: '/newContent/jzq'
+				},
+				{
+					index: 4,
+					name: '沙市区红会',
+					path: '/newContent/ssq'
+				},
+				{
+					index: 5,
+					name: '松滋市红会',
+					path: '/newContent/szs'
+				},
+				{
+					index: 6,
+					name: '监利县红会',
+					path: '/newContent/jls'
+				},
+			],
+			};
+		}
+	};
+</script>
+
+<style>
+</style>

src/views/newContent/hhs/Detail.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="new-detail">
+		<dcontent :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { details } from '../../../request/api.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				details({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/newContent/hhs/List.vue

@@ -0,0 +1,120 @@
+<template>
+	<div class="new-list">
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/newContent/hhs/detail?id='+ item.id)">
+			<div class="title clamp">
+				<span class="title-icon"></span>
+				{{ item.title }}
+			</div>
+			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
+		</div>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+	</div>
+</template>
+
+<script>
+	import {
+		getList
+	} from '../../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
+		},
+		created() {
+			this.getList()
+		},
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},55).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
+			.title {
+				width: 500px;
+
+				.title-icon {
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
+				}
+			}
+		}
+	}
+
+	/deep/ .el-pagination {
+		margin-top: 50px;
+		text-align: center;
+	}
+</style>

src/views/newContent/jls/Detail.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="new-detail">
+		<dcontent :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { details } from '../../../request/api.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				details({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/newContent/jls/List.vue

@@ -0,0 +1,120 @@
+<template>
+	<div class="new-list">
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/newContent/jls/detail?id='+ item.id)">
+			<div class="title clamp">
+				<span class="title-icon"></span>
+				{{ item.title }}
+			</div>
+			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
+		</div>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+	</div>
+</template>
+
+<script>
+	import {
+		getList
+	} from '../../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
+		},
+		created() {
+			this.getList()
+		},
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},59).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
+			.title {
+				width: 500px;
+
+				.title-icon {
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
+				}
+			}
+		}
+	}
+
+	/deep/ .el-pagination {
+		margin-top: 50px;
+		text-align: center;
+	}
+</style>

src/views/newContent/jlx/Detail.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="new-detail">
+		<dcontent :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { details } from '../../../request/api.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				details({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/newContent/jlx/List.vue

@@ -0,0 +1,120 @@
+<template>
+	<div class="new-list">
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/newContent/jlx/detail?id='+ item.id)">
+			<div class="title clamp">
+				<span class="title-icon"></span>
+				{{ item.title }}
+			</div>
+			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
+		</div>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+	</div>
+</template>
+
+<script>
+	import {
+		getList
+	} from '../../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
+		},
+		created() {
+			this.getList()
+		},
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},53).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
+			.title {
+				width: 500px;
+
+				.title-icon {
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
+				}
+			}
+		}
+	}
+
+	/deep/ .el-pagination {
+		margin-top: 50px;
+		text-align: center;
+	}
+</style>

src/views/newContent/jzq/Detail.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="new-detail">
+		<dcontent :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { details } from '../../../request/api.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				details({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/newContent/jzq/List.vue

@@ -0,0 +1,120 @@
+<template>
+	<div class="new-list">
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/newContent/jzq/detail?id='+ item.id)">
+			<div class="title clamp">
+				<span class="title-icon"></span>
+				{{ item.title }}
+			</div>
+			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
+		</div>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+	</div>
+</template>
+
+<script>
+	import {
+		getList
+	} from '../../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
+		},
+		created() {
+			this.getList()
+		},
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},56).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
+			.title {
+				width: 500px;
+
+				.title-icon {
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
+				}
+			}
+		}
+	}
+
+	/deep/ .el-pagination {
+		margin-top: 50px;
+		text-align: center;
+	}
+</style>

src/views/newContent/ssq/Detail.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="new-detail">
+		<dcontent :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { details } from '../../../request/api.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				details({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/newContent/ssq/List.vue

@@ -0,0 +1,120 @@
+<template>
+	<div class="new-list">
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/newContent/ssq/detail?id='+ item.id)">
+			<div class="title clamp">
+				<span class="title-icon"></span>
+				{{ item.title }}
+			</div>
+			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
+		</div>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+	</div>
+</template>
+
+<script>
+	import {
+		getList
+	} from '../../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
+		},
+		created() {
+			this.getList()
+		},
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},57).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
+			.title {
+				width: 500px;
+
+				.title-icon {
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
+				}
+			}
+		}
+	}
+
+	/deep/ .el-pagination {
+		margin-top: 50px;
+		text-align: center;
+	}
+</style>

src/views/newContent/sss/Detail.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="new-detail">
+		<dcontent :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { details } from '../../../request/api.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				details({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/newContent/sss/List.vue

@@ -0,0 +1,120 @@
+<template>
+	<div class="new-list">
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/newContent/sss/detail?id='+ item.id)">
+			<div class="title clamp">
+				<span class="title-icon"></span>
+				{{ item.title }}
+			</div>
+			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
+		</div>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+	</div>
+</template>
+
+<script>
+	import {
+		getList
+	} from '../../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
+		},
+		created() {
+			this.getList()
+		},
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},54).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
+			.title {
+				width: 500px;
+
+				.title-icon {
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
+				}
+			}
+		}
+	}
+
+	/deep/ .el-pagination {
+		margin-top: 50px;
+		text-align: center;
+	}
+</style>

src/views/newContent/szs/Detail.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="new-detail">
+		<dcontent :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { details } from '../../../request/api.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				details({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/newContent/szs/List.vue

@@ -0,0 +1,120 @@
+<template>
+	<div class="new-list">
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/newContent/szs/detail?id='+ item.id)">
+			<div class="title clamp">
+				<span class="title-icon"></span>
+				{{ item.title }}
+			</div>
+			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
+		</div>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+	</div>
+</template>
+
+<script>
+	import {
+		getList
+	} from '../../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
+		},
+		created() {
+			this.getList()
+		},
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},58).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
+			.title {
+				width: 500px;
+
+				.title-icon {
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
+				}
+			}
+		}
+	}
+
+	/deep/ .el-pagination {
+		margin-top: 50px;
+		text-align: center;
+	}
+</style>

src/views/organs/Detail.vue

@@ -0,0 +1,37 @@
+<template>
+	<div class="new-detail">
+		<dcontent :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { details } from '../../request/api.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				details({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

src/views/organs/List.vue

@@ -0,0 +1,136 @@
+<template>
+	<div class="new-list">
+		<div class="empty" v-if="newList.length == 0">
+			暂无数据
+		</div>
+		<div class="new-item  hand" v-for="item in newList" :key="item.id" @click="navTo('/news/detail?id='+ item.id)">
+			<div class="title clamp">
+				<span class="title-icon"></span>
+				{{ item.title }}
+			</div>
+			<div class="time">{{ item.release_time?item.release_time:item.add_time | time }}</div>
+		</div>
+		<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页"
+			@current-change="currentChange" :page-size="15" hide-on-single-page></el-pagination>
+	</div>
+</template>
+
+<script>
+	import {
+		loadIndexs,
+		splist,
+		loveList,
+		friendList,
+		newsList,
+		openList,
+		getList
+	} from '../../request/api.js';
+	export default {
+		data() {
+			return {
+				newList: [],
+				total: 0,
+				page: 1,
+				limit: 15
+			};
+		},
+		filters: {
+			time(val) {
+				let arr = val.split(' ')
+				let str = arr[0]
+				str = str.replace(/-/g, '.')
+				return str
+			}
+		},
+		created() {
+			this.getList()
+		},
+		methods: {
+			navTo(url) {
+				this.$router.push(url);
+			},
+			currentChange(e) {
+				this.page = e
+				this.getList()
+			},
+			getList() {
+				let obj = this
+				getList({
+					page: obj.page,
+					limit: obj.limit
+				},61).then(res => {
+					obj.newList = res.data.list.sort(this.compare('id'))
+					// var newArrayData=res.data.list.sort(compare('Id'))
+					obj.total = res.data.count
+				})
+			},
+			compare(attribute) {
+				return function(obj1, obj2) {
+					var val1 = obj1[attribute];
+					var val2 = obj2[attribute];
+					if (val1 < val2) {
+						return 1;
+					} else if (val1 > val2) {
+						return -1;
+					} else {
+						return 0;
+					}
+				}
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.empty {
+		text-align: center;
+		color: #999;
+		height: 400px;
+		line-height: 400px;
+	}
+	.new-list {
+
+		// padding: 0px 72px 0 40px;
+		.new-item {
+			display: flex;
+			justify-content: space-between;
+			font-size: 18px;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #666666;
+			height: 40px;
+			border-bottom: 1px solid #E5E5E5;
+			line-height: 40px;
+
+			&:hover {
+				color: red;
+
+				.title {
+					.title-icon {
+						border-left-color: red;
+					}
+				}
+			}
+
+			.title {
+				width: 500px;
+
+				.title-icon {
+					display: inline-block;
+					width: 0;
+					height: 0;
+					width: 0;
+					height: 0;
+					border-top: 6px solid transparent;
+					border-left: 8px solid #d2d2d2;
+					border-bottom: 6px solid transparent;
+				}
+			}
+		}
+	}
+
+	/deep/ .el-pagination {
+		margin-top: 50px;
+		text-align: center;
+	}
+</style>