Merge pull request #119 from 13192350024/master

#82 第4次实验
hzuapps · Nov 1, 2017 · 330aa22 · 330aa22
2 parents 81a0839 + 6407201
commit 330aa22
Show file tree

Hide file tree

Showing 23 changed files with 732 additions and 0 deletions.
diff --git a/1517010101/final/app.js b/1517010101/final/app.js
@@ -0,0 +1,36 @@
+//app.js
+App({
+  onLaunch: function () {
+    //调用API从本地缓存中获取数据
+    var logs = wx.getStorageSync('logs') || []
+    logs.unshift(Date.now())
+    wx.setStorageSync('logs', logs)
+  },
+  onShow: function(){
+    console.log('onShow');
+  },
+  onHide: function(){
+    console.log('onHide');
+  },
+  getUserInfo:function(cb){
+    var that = this;
+    if(this.globalData.userInfo){
+      typeof cb == "function" && cb(this.globalData.userInfo)
+    }else{
+      //调用登录接口
+      wx.login({
+        success: function () {
+          wx.getUserInfo({
+            success: function (res) {
+              that.globalData.userInfo = res.userInfo;
+              typeof cb == "function" && cb(that.globalData.userInfo)
+            }
+          })
+        }
+      });
+    }
+  },
+  globalData:{
+    userInfo:null
+  }
+})
diff --git a/1517010101/final/app.json b/1517010101/final/app.json
@@ -0,0 +1,13 @@
+{
+  "pages":[
+    "pages/index/index",
+    "pages/components/dishes/dishes"
+  ],
+  "window":{
+    "backgroundColor":"#f4f4f4",
+    "backgroundTextStyle":"light",
+    "navigationBarBackgroundColor": "orange",
+    "navigationBarTitleText": "美食汇微菜单",
+    "navigationBarTextStyle":"white"
+  }
+}
diff --git a/1517010101/final/app.wxss b/1517010101/final/app.wxss
@@ -0,0 +1,19 @@
+/**app.wxss**/
+.container {
+  height: 100%;
+  box-sizing: border-box;
+  background-color: #f4f4f4;
+}
+
+.flex-wrap{
+	display: flex;
+}
+.flex-item{
+	flex: 1;
+}
+.flex-wrap.flex-direction-col{
+	flex-direction: column;
+}
+.flex-wrap.flex-direction-row{
+	flex-direction: row;
+}
diff --git a/1517010101/final/pages/components/dishes/dishes.js b/1517010101/final/pages/components/dishes/dishes.js
@@ -0,0 +1,133 @@
+var app = getApp()
+Page({
+	data: {
+		hidden:false,
+		curNav:1,
+		curIndex:0,
+		cart:[],
+		cartTotal:0,
+		navList:[
+			{
+				id:1,
+				name:'热销菜品'
+			},
+			{
+				id:2,
+				name:'热菜'
+			},
+			{
+				id:3,
+				name:'凉菜'
+			},
+			{
+				id:4,
+				name:'套餐'
+			}
+		],
+		dishesList:[
+			[
+				{
+					name:"红烧肉",
+					price:38,
+					num:1,
+					id:1
+				},
+				{
+					name:"宫保鸡丁",
+					price:58,
+					num:1,
+					id:29
+				},
+				{
+					name:"水煮鱼",
+					price:88,
+					num:1,
+					id:2
+				}
+			],
+			[
+				{
+					name:"小炒日本豆腐",
+					price:18,
+					num:1,
+					id:3
+				},
+				{
+					name:"烤鱼",
+					price:58,
+					num:1,
+					id:4
+				}
+			],
+			[
+				{
+					name:"大拌菜",
+					price:18,
+					num:1,
+					id:5
+				},
+				{
+					name:"川北凉粉",
+					price:8,
+					num:1,
+					id:6
+				}
+			],
+			[]
+		],
+		dishes:[]
+	},
+	loadingChange () {
+		setTimeout(() => {
+			this.setData({
+				hidden:true
+			})
+		},2000)
+	},
+	selectNav (event) {
+		let id = event.target.dataset.id,
+			index = parseInt(event.target.dataset.index);
+			self = this;
+		this.setData({
+			curNav:id,
+			curIndex:index
+		})
+	},
+	// 选择菜品
+	selectDish (event) {
+		let dish = event.currentTarget.dataset.dish;
+		let flag = true;
+		let	cart = this.data.cart;
+
+		if(cart.length > 0){
+			cart.forEach(function(item,index){
+				if(item == dish){
+					cart.splice(index,1);
+					flag = false;
+				}
+			})
+		}
+		if(flag) cart.push(dish);
+		this.setData({
+			cartTotal:cart.length
+		})
+		this.setStatus(dish)
+	},
+	setStatus (dishId) {
+		let dishes = this.data.dishesList;
+		for (let dish of dishes){
+			dish.forEach((item) => {
+				if(item.id == dishId){
+					item.status = !item.status || false
+				}
+			})
+		}
+
+		this.setData({
+			dishesList:this.data.dishesList
+		})
+	},
+	onLoad () {
+		this.loadingChange()
+	}
+})
diff --git a/1517010101/final/pages/components/dishes/dishes.json b/1517010101/final/pages/components/dishes/dishes.json
@@ -0,0 +1,3 @@
+{
+    "navigationBarTitleText": "堂食-点菜"
+}
diff --git a/1517010101/final/pages/components/dishes/dishes.wxml b/1517010101/final/pages/components/dishes/dishes.wxml
@@ -0,0 +1,30 @@
+<view class="container flex-wrap flex-direction-row">
+	<!-- left aside -->
+	<view class="aside flex-wrap flex-direction-col">
+		<block wx:for="{{navList}}">
+			<text class="type-nav {{curNav == item.id ? 'selected' : ''}}" bindtap="selectNav" data-index="{{index}}" data-id="{{item.id}}">{{item.name}}</text>
+		</block>
+	</view>
+
+	<!-- content -->
+	<view class="content flex-item">
+		<block wx:for="{{dishesList[curIndex]}}">
+			<view class="dish flex-wrap flex-direction-row" catchtap="selectDish" data-dish="{{item.id}}">
+				<view class="flex-item">
+					<text class="title">{{item.name}}</text>
+					<p>￥{{item.price}}</p>
+				</view>
+				<view class="add-btn"><icon type="{{item.status ? 'success' : 'circle'}}" color="orange" size="30"></icon></view>
+			</view>
+		</block>
+
+	</view>
+
+</view>
+
+<!-- cart -->
+<view class="cart">
+	<text class="total">购物车：{{cartTotal}}</text>
+</view>
+
+<loading hidden="{{hidden}}">玩命加载中…</loading>
diff --git a/1517010101/final/pages/components/dishes/dishes.wxss b/1517010101/final/pages/components/dishes/dishes.wxss
@@ -0,0 +1,49 @@
+.aside{
+	width:4rem;
+	border-right: 1px solid #ddd;
+	font-size: .85rem;
+}
+.type-nav{
+	position: relative;
+	padding:.7rem .3rem;
+	text-align: center;
+	border-bottom: 1px solid #ddd;
+	z-index: 10;
+}
+.type-nav.selected{
+	margin-right: -1px;
+	padding-left::-1px;
+	color: #333;
+	background-color: #fff;
+}
+.content{
+	background-color: #fff;
+}
+
+.dish{
+	margin-left: 1rem;
+	padding: 1rem;
+	border-bottom: 1px solid #ddd;
+}
+.dish .title{
+	display: block;
+	font-size: 1rem;
+}
+.dish p{
+	color: orange;
+	font-size: .75rem;
+}
+.dish .add-btn{
+	width: 3rem;
+	text-align: right;
+}
+
+.cart{
+	display: block;
+	position: fixed;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	padding: 1rem;
+	background: #ddd;
+}
diff --git a/1517010101/final/pages/index/index.js b/1517010101/final/pages/index/index.js
@@ -0,0 +1,48 @@
+//index.js
+//获取应用实例
+var app = getApp()
+Page({
+  data: {
+    imgUrls: [
+      'http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg',
+      'http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg',
+      'http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg'
+    ],
+    indicatorDots: true,
+    autoplay: true,
+    interval: 3000,
+    duration: 1000,
+    navItems:[
+      {
+        name:'堂食',
+        url:'dishes'
+      },
+      {
+        name:'外卖',
+        url:'take',
+        isSplot:true
+      },
+      {
+        name:'外带',
+        url:'out'
+      },
+      {
+        name:'订单',
+        url:'bill'
+      },
+      {
+        name:'帐单',
+        url:'bill',
+        isSplot:true
+      },
+      {
+        name:'报表',
+        url:'bill'
+      }
+    ]
+  },
+  onLoad: function () {
+    console.log('onLoad')
+  }
+
+})
diff --git a/1517010101/final/pages/index/index.wxml b/1517010101/final/pages/index/index.wxml
@@ -0,0 +1,23 @@
+<!--index.wxml-->
+<view class="container flex-wrap flex-direction-col">
+  <view class="my-swiper">
+      <swiper indicator-dots="{{indicatorDots}}"
+    autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">
+    <block wx:for="{{imgUrls}}">
+      <swiper-item>
+        <image src="{{item}}" class="slide-image" height="150"/>
+      </swiper-item>
+    </block>
+  </swiper>
+  </view>
+
+    <!-- 分类导航 -->
+  <view class="nav-block wrap">
+    <block wx:for="{{navItems}}"> 
+      <view class="wrap-item {{item.isSplot ? 'exp' : ''}}">  
+        <navigator url="../components/{{item.url}}/{{item.url}}" hover-class="navigator-hover">{{item.name}}</navigator>
+      </view>
+    </block>
+  </view>
+
+</view>
diff --git a/1517010101/final/pages/index/index.wxss b/1517010101/final/pages/index/index.wxss
@@ -0,0 +1,23 @@
+/**index.wxss**/
+.my-swiper image{
+  width: 100%;
+}
+
+.wrap{
+	display: inline-block;
+	margin-top: .8rem;
+}
+.wrap-item{
+	display: inline-block;
+	width: 33%;
+	height: 6rem;
+	line-height: 6rem;
+	border-bottom: 1px solid #ddd;
+	background-color: #fff;
+	text-align: center;
+}
+ /*不支持 :nth-child(2);*/
+.wrap-item.exp{
+	border: 1px solid #ddd;
+	border-top: 0;
+}