添加抽屉列表图标和底部导航图标

components/drawer/threeLineDrawer.vue

@@ -7,7 +7,18 @@
 					<image src="../../static/picture/fengji.png" style="width: 100%;height: 200px;"></image>
 				</view>
 		        <uni-list>
-		        	<uni-list-item :title="item" v-for="(item,index) in drawerList" :key="index" />		        	
+					<view class="list">
+										
+						<view class="item" v-for="(item,index) in drawerList" :key="index">
+							<view class="itemIcon">
+								<view class="icon text-black" :class="['cuIcon-' + inconList[index]]" style="font-size: 20px;margin-top: 10px;margin-left: 20px;">
+								</view>
+							</view>	
+							<uni-list-item :title="item" style="margin-left: 40px;"/>
+						</view>
+						
+					</view>
+		        			        	
 		        </uni-list>
 				<view class="cu-bar tabbar bg-white">
 					<view class="action">
@@ -42,14 +53,16 @@
 			return{
 				drawerIsShow:false,
 				drawerList:[],
-				width:250
+				width:250,
+				inconList:[]
 			}
 		},
 		methods:{
-			openDrawer:function(drawerList,width){
+			openDrawer:function(width,drawerList,inconList){
 				this.drawerIsShow=true;
 				this.drawerList=drawerList;
 				this.width=width;
+				this.inconList=inconList;
 			},
 			closeDrawer:function(){
 				this.drawerIsShow=false;
@@ -76,4 +89,20 @@
 		line-height: 28px;
 		font-size: 15px;
 	}
+	.list{
+		width: 100%;
+		height: 100%;
+	}
+	.item{
+		width: 100%;
+		height: 100%;
+		float: right;
+		margin-right: 10px;
+		/* border-bottom: 1px solid black; */
+	}
+	.itemIcon{
+		width: 20px;
+		height: 20px;
+		float: left;
+	}
 </style>

pages.json

@@ -42,31 +42,31 @@
 	    "color": "#DEDFE3",
 	    "selectedColor": "white",
 	    "borderStyle": "black",
-	    "backgroundColor": "#062E5E",
+	    "backgroundColor": "#004C90",
 	    "list": [{
 	        "pagePath": "pages/index/Index",
-/* 	        "iconPath": "static/logo1.png",
-	        "selectedIconPath": "static/logo.png", */
+	        "iconPath": "static/picture/indexGray.png",
+	        "selectedIconPath": "static/picture/index.png",
 	        "text": "监视"
 	    }, {
 	        "pagePath": "pages/analysis/Analysis",
-/* 	        "iconPath": "static/logo1.png",
-	        "selectedIconPath": "static/logo.png", */
+	        "iconPath": "static/picture/analysisGray.png",
+	        "selectedIconPath": "static/picture/analysis.png",
 	        "text": "分析"
 	    }, {
 	        "pagePath": "pages/forecast/Forecast",
-/* 	        "iconPath": "static/logo1.png",
-	        "selectedIconPath": "static/logo.png", */
+	        "iconPath": "static/picture/forecastGray.png",
+	        "selectedIconPath": "static/picture/forecast.png",
 	        "text": "预测"
 	    }, {
 	        "pagePath": "pages/task/Task",
-/* 	        "iconPath": "static/logo1.png",
-	        "selectedIconPath": "static/logo.png", */
+	        "iconPath": "static/picture/taskGray.png",
+	        "selectedIconPath": "static/picture/task.png",
 	        "text": "任务"
 	    },{
 	        "pagePath": "pages/mine/Mine",
-/* 	        "iconPath": "static/logo1.png",
-	        "selectedIconPath": "static/logo.png", */
+	        "iconPath": "static/picture/mineGray.png",
+	        "selectedIconPath": "static/picture/mine.png",
 	        "text": "我"
 	    }]
 	}

pages/index/Index.vue

@@ -2,7 +2,7 @@
 	<view class="content">
 		<view class="top">
 			<view class="threeLine" @tap="openDrawer">
-				<image src="../../static/picture/threeLine.png" style="width: 30px;height: 30px;margin-top: 10px;margin-left: 10px;"></image>
+				<image src="../../static/picture/fourLine.png" style="width: 30px;height: 30px;margin-top: 10px;margin-left: 10px;"></image>
 			</view>
 			<view class="text">
 				<view class="notice">
@@ -32,12 +32,14 @@ export default {
 	data:function(){
 		return{
 			badge: 22,
-			drawerList:["状态监视","矩阵监视","风场监视","人员监视"]
+			drawerList:["状态监视","矩阵监视","风场监视","人员监视"],
+			inconList:["form","favor","question","edit"]
+			
 		}
 	},
 	methods:{
 		openDrawer:function(){
-			this.$refs.drawer.openDrawer(this.drawerList,250);
+			this.$refs.drawer.openDrawer(250,this.drawerList,this.inconList);
 		},
 		closeDrawer:function(){
 			this.drawerIsShow=false;
@@ -53,7 +55,7 @@ page {
 	width: 100%;
 	height: 140upx;
 	padding-top: 40upx;
-	background-color: #062e5e;
+	background-color: #004C90;
 }
 .threeLine {
 	width: 50px;