hz-zhhq-app/pages/order-form/order-details.vue

88 lines
1.9 KiB
Vue

<template>
<view class="">
<view class="main">
<view class="top">
<text>{{item.dining_room_id == '1' ? '西单食堂' : '银座食堂'}}</text>
<text class="status" v-if='item.order_status == 1'>预定成功</text>
<text class="status" v-if='item.order_status == 0'>已取消</text>
</view>
<view class="middle">
<view class="uni-list">
<view class="uni-list-cell-left image" v-for="(item1, index) in item.orderDetails" :key="item1.id">
<image style="width: 100%;" mode="widthFix" :src="item1.picture" />
<text>{{item1.foods_name}}</text>
</view>
</view>
<button @click='cancel(item)' v-if='item.order_status == 1' v-cloak>取消订单</button>
</view>
<view class="bottom">
<view class="evaluate" v-if='item.order_status != 1'>
<button class="ev" @click='evDining(item)' >食堂评价</button>
<button class="ev" @click='evFood(item)' >菜品评价</button>
</view>
</view>
</view>
<view class="main">
<view class="top">
<view><text></text>订单信息</text></view>
<text class="">下单时间</text>
<text class="status">{{item.order_time}}</text>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
item:{
id:'11',
dining_room_id : 1,
order_status : 1,
orderDetails : [
{
id: '111',
picture : '../../static/food/33.jpg',
foods_name : '肉'
}
],
order_time : '2019-12-13 12:30'
}
}
},
methods: {
cancel : function(){
alert('取消成功');
}
}
}
</script>
<style>
.main{
border-radius: 10rpx;
border: #B2B2B2 1rpx solid;
margin:20rpx;
background: white;
}
.middle{
padding: 5rpx;
}
.image {
width: 20%;
float:left;
}
.status {
/* color: #0066CC; */
float: right;
}
text {
font-size: 35rpx;
}
.ev{
width: 50%;
float: left;
}
</style>