xt / xcx-book · Commits

Go to a project

Commit 745062f0c83809bd18f1e1fba97137acd5c8da25

Authored by wangfan
1 parent a36ce92e
build: skipped

快速预定

Inline Side-by-side
Showing 4 changed files with 162 additions and 153 deletions
@@ -249,4 +249,20 @@ image{ @@ -249,4 +249,20 @@ image{
249 bottom: 0; 249 bottom: 0;
250 left: 0; 250 left: 0;
251 z-index: 9999; 251 z-index: 9999;
  252 +}
  253 +.flex-tb{
  254 + display: flex;
  255 + display: -webkit-flex;
  256 + justify-content: space-between;
  257 + align-items:flex-start;
  258 + flex-direction: column ;
  259 + -webkit-flex-direction: column ;
  260 +}
  261 +.flex-bl{
  262 + display: flex;
  263 + display: -webkit-flex;
  264 + justify-content: flex-end;
  265 + align-items:flex-start;
  266 + flex-direction: column ;
  267 + -webkit-flex-direction: column ;
252 } 268 }
@@ -3,115 +3,118 @@ import util from '../../../utils/util'; @@ -3,115 +3,118 @@ import util from '../../../utils/util';
3 import App from '../../../utils/api'; 3 import App from '../../../utils/api';
4 const {regeneratorRuntime} = global 4 const {regeneratorRuntime} = global
5 Component({ 5 Component({
6 - /**  
7 - * 组件的属性列表  
8 - */  
9 - properties: {  
10 - item: {  
11 - type: Object, // 类型（必填），目前接受的类型包括：String, Number, Boolean, Object, Array, null（表示任意类型）  
12 - },  
13 - sellerid:{  
14 - type:Number  
15 - },  
16 - orderid:{  
17 - type:Number  
18 - },  
19 - fromSoucre:{  
20 - type:Number,  
21 - value:0  
22 - },  
23 - request_uri:{  
24 - type:Boolean,  
25 - value:false,  
26 - },  
27 - hasListModel:{  
28 - type:Boolean,  
29 - value:false,  
30 - },  
31 - identity:{  
32 - type:String,  
33 - value:'',  
34 - }, 6 + /**
  7 + * 组件的属性列表
  8 + */
  9 + properties: {
  10 + item: {
  11 + type: Object, // 类型（必填），目前接受的类型包括：String, Number, Boolean, Object, Array, null（表示任意类型）
35 }, 12 },
  13 + sellerid: {
  14 + type: Number
  15 + },
  16 + orderid: {
  17 + type: Number
  18 + },
  19 + fromSoucre: {
  20 + type: Number,
  21 + value: 0
  22 + },
  23 + request_uri: {
  24 + type: Boolean,
  25 + value: false,
  26 + },
  27 + hasListModel: {
  28 + type: Boolean,
  29 + value: false,
  30 + },
  31 + identity: {
  32 + type: String,
  33 + value: '',
  34 + },
  35 + },
36 36
37 - /**  
38 - * 组件的初始数据  
39 - */  
40 - data: {  
41 - item_clear_num:null,  
42 - hasIPhone:false,  
43 - labelIcon:{  
44 - 'https://xt05.colorcun.com/uploads/label/lijie.png':'http://qn.colorcun.com/custom/lite-yd-cook/image/lijian.png',  
45 - }, 37 + /**
  38 + * 组件的初始数据
  39 + */
  40 + data: {
  41 + item_clear_num: null,
  42 + hasIPhone: false,
  43 + labelIcon: {
  44 + 'https://xt05.colorcun.com/uploads/label/lijie.png': '力荐',
  45 + 'https://xt05.colorcun.com/uploads/label/tejia.png': '特价',
  46 + 'https://xt05.colorcun.com/uploads/label/xinpin.png': '新品',
  47 + 'https://xt05.colorcun.com/uploads/label/zhaopai.png': '招牌',
46 }, 48 },
47 - attached () {  
48 - console.log('food-card-ready',this.data.orderid,this.data.fromSoucre)  
49 - let item=this.data.item;  
50 - let item_clear_num;  
51 - if(typeof item.item_clear_num!='undefined'){  
52 - item_clear_num=item.item_clear_num;  
53 - }else{  
54 - item_clear_num=item.clear_num;  
55 - if(item.spec){  
56 - let clear_num=null;  
57 - item.spec.forEach(spec=>{  
58 - if(spec.clear_num==0){  
59 - clear_num=0;  
60 - }else{  
61 - clear_num=null;  
62 - }  
63 - })  
64 - if(clear_num==0){  
65 - item_clear_num=0;  
66 - }  
67 - } 49 + },
  50 + attached () {
  51 + console.log('food-card-ready', this.data.orderid, this.data.fromSoucre)
  52 + let item = this.data.item;
  53 + let item_clear_num;
  54 + if (typeof item.item_clear_num != 'undefined') {
  55 + item_clear_num = item.item_clear_num;
  56 + } else {
  57 + item_clear_num = item.clear_num;
  58 + if (item.spec) {
  59 + let clear_num = null;
  60 + item.spec.forEach(spec => {
  61 + if (spec.clear_num == 0) {
  62 + clear_num = 0;
  63 + } else {
  64 + clear_num = null;
  65 + }
  66 + })
  67 + if (clear_num == 0) {
  68 + item_clear_num = 0;
68 } 69 }
  70 + }
  71 + }
69 72
70 - this.setData({  
71 - item_clear_num:item_clear_num,  
72 - hasIPhone:getApp().system.model.indexOf('iPhone')>-1  
73 - });  
74 - },  
75 - detached(){ 73 + this.setData({
  74 + item_clear_num: item_clear_num,
  75 + hasIPhone: getApp().system.model.indexOf('iPhone') > -1
  76 + });
  77 + },
  78 + detached(){
76 79
  80 + },
  81 + /**
  82 + * 组件的方法列表
  83 + */
  84 + methods: {
  85 + //规格 增加/减少 回调
  86 + foodSpecCallback(e){
  87 + let opt = e.detail;
  88 + console.log('foodSpecCallback', opt);
  89 + if (opt.type == 'specWin') {
  90 + return this.triggerEvent('foodCardCallback', opt);
  91 + }
  92 + let item = this.data.item;
  93 + let oldNum = (item.num || 0);
  94 + item.num = (item.num || 0) + opt.type;
  95 + let rotateFlag = (oldNum == 0 || item.num == 0);
  96 + console.log('num_rotate', rotateFlag);
  97 + this.setData({item: item, rotate_id: rotateFlag ? item.id : ''});
  98 + opt.num = item.num;
  99 + this.triggerEvent('foodCardCallback', opt);
77 }, 100 },
78 - /**  
79 - * 组件的方法列表  
80 - */  
81 - methods: {  
82 - //规格 增加/减少 回调  
83 - foodSpecCallback(e){  
84 - let opt=e.detail;  
85 - console.log('foodSpecCallback',opt);  
86 - if(opt.type=='specWin'){  
87 - return this.triggerEvent('foodCardCallback',opt);  
88 - }  
89 - let item=this.data.item;  
90 - let oldNum=(item.num||0);  
91 - item.num=(item.num||0)+opt.type;  
92 - let rotateFlag=(oldNum==0 || item.num==0);  
93 - console.log('num_rotate',rotateFlag);  
94 - this.setData({item:item,rotate_id:rotateFlag?item.id:''});  
95 - opt.num=item.num;  
96 - this.triggerEvent('foodCardCallback',opt);  
97 - },  
98 101
99 - //清除订单下某菜品所有数量  
100 - delOrderCook:function(){  
101 - this.selectComponent("#foodSpecDel").clean();  
102 - },  
103 - //triggerAdd  
104 - triggerAdd(e){  
105 - console.log('triggerAdd',e)  
106 - if(this.data.item_clear_num==0) return;  
107 - this.selectComponent("#foodSpecAddOne").addCook();  
108 - },  
109 - //viewIMage  
110 - viewImage(){  
111 - wx.previewImage({  
112 - current: this.data.item.image, // 当前显示图片的http链接  
113 - urls: [this.data.item.image], // 需要预览的图片http链接列表  
114 - })  
115 - } 102 + //清除订单下某菜品所有数量
  103 + delOrderCook: function () {
  104 + this.selectComponent("#foodSpecDel").clean();
  105 + },
  106 + //triggerAdd
  107 + triggerAdd(e){
  108 + console.log('triggerAdd', e)
  109 + if (this.data.item_clear_num == 0) return;
  110 + this.selectComponent("#foodSpecAddOne").addCook();
  111 + },
  112 + //viewIMage
  113 + viewImage(){
  114 + wx.previewImage({
  115 + current: this.data.item.image, // 当前显示图片的http链接
  116 + urls: [this.data.item.image], // 需要预览的图片http链接列表
  117 + })
116 } 118 }
  119 + }
117 }) 120 })
1 -<view class="flex-ll-top hasListModel" style="width:100%;"> 1 +<view class="flex-ll hasListModel" style="width:100%;">
2 <view class="avatar"> 2 <view class="avatar">
3 <image mode="aspectFill" lazy-load="true" src="{{item.image}}"/> 3 <image mode="aspectFill" lazy-load="true" src="{{item.image}}"/>
4 </view> 4 </view>
5 - <view class="content"> 5 + <view class="content flex-tb">
6 <view class="name Semibold"> 6 <view class="name Semibold">
7 {{item.name}} 7 {{item.name}}
8 </view> 8 </view>
9 <view class="desc"> 9 <view class="desc">
10 {{item.desc||''}} 10 {{item.desc||''}}
11 </view> 11 </view>
12 - <view class="label"> 12 + <view class="label flex-ll">
13 <block wx:if="{{item.labelList}}"> 13 <block wx:if="{{item.labelList}}">
14 - <view class="menu-ptop-mark">  
15 - <block wx:for="{{item.labelList}}" wx:for-item="son" wx:key="labelList-key">  
16 - <image class="labelListImg" src="{{labelIcon[son.icon]||son.icon}}" mode="aspectFit"></image>  
17 - </block>  
18 - </view> 14 + <block wx:for="{{item.labelList}}" wx:for-item="son" wx:key="labelList-key">
  15 + <view class="labelListImg flex-vc" wx:if="{{labelIcon[son.icon]}}">{{labelIcon[son.icon]}}</view>
  16 + <image class="labelListImg" wx:else="" src="{{son.icon}}" mode="aspectFit"></image>
  17 + </block>
19 </block> 18 </block>
20 </view> 19 </view>
21 - <view class="flex-lr price">  
22 - <view class="flex-ll">  
23 - <view class="rmb">¥</view>  
24 - <view class="money">{{item.spec[0].price>0 ? item.spec[0].price : item.price}}</view>  
25 - </view>  
26 - <view class="opt flex-ll"> 20 + <view class="price">
  21 + ¥ {{item.spec[0].price>0 ? item.spec[0].price : item.price}}
  22 + <view class="opt flex-cc">
27 <block wx:if="{{item_clear_num==0}}"> 23 <block wx:if="{{item_clear_num==0}}">
28 <image 24 <image
29 class="avater" 25 class="avater"
1 -@import '../../app.wxss'; 1 +@import '/app.wxss';
2 .cookWapper{ 2 .cookWapper{
3 border-radius:4px; 3 border-radius:4px;
4 position: relative; 4 position: relative;
@@ -94,22 +94,21 @@ @@ -94,22 +94,21 @@
94 } 94 }
95 95
96 .menu-ptop-mark{ width:100%; height: 13px; padding-top:0; display: flex} 96 .menu-ptop-mark{ width:100%; height: 13px; padding-top:0; display: flex}
97 -.labelListImg{  
98 - width: 50rpx; height: 30rpx; margin-right: 10rpx;  
99 -} 97 +
100 98
101 .hasListModel{ 99 .hasListModel{
102 /*列表模式*/ 100 /*列表模式*/
  101 + height: 160rpx;
  102 + padding: 20rpx 0;
103 } 103 }
104 .hasListModel .avatar{ 104 .hasListModel .avatar{
105 - width: 138rpx;  
106 - min-width: 138rpx;  
107 - height: 140rpx;  
108 - margin-right: 18rpx; 105 + width: 160rpx;
  106 + min-width: 160rpx;
  107 + height: 160rpx;
  108 + margin-right: 20rpx;
109 border-radius: 10rpx; 109 border-radius: 10rpx;
110 overflow: hidden; 110 overflow: hidden;
111 background-color: #D8D8D8; 111 background-color: #D8D8D8;
112 - margin-top: 10rpx;  
113 } 112 }
114 .hasListModel .avatar image{ 113 .hasListModel .avatar image{
115 width: 100%; 114 width: 100%;
@@ -120,18 +119,19 @@ @@ -120,18 +119,19 @@
120 .hasListModel .content{ 119 .hasListModel .content{
121 overflow: hidden; 120 overflow: hidden;
122 width: 100%; 121 width: 100%;
  122 + height: 160rpx;
123 } 123 }
124 .hasListModel .name{ 124 .hasListModel .name{
125 - height: 42rpx;  
126 - line-height:42rpx; 125 + height: 30rpx;
  126 + line-height:30rpx;
127 font-size: 30rpx; 127 font-size: 30rpx;
128 overflow: hidden; 128 overflow: hidden;
129 text-overflow:ellipsis; 129 text-overflow:ellipsis;
130 white-space: nowrap; 130 white-space: nowrap;
131 } 131 }
132 .hasListModel .desc{ 132 .hasListModel .desc{
133 - height: 28rpx;  
134 - line-height:28rpx; 133 + height: 20rpx;
  134 + line-height:20rpx;
135 font-size: 20rpx; 135 font-size: 20rpx;
136 overflow: hidden; 136 overflow: hidden;
137 text-overflow:ellipsis; 137 text-overflow:ellipsis;
@@ -141,36 +141,29 @@ @@ -141,36 +141,29 @@
141 .hasListModel .label{ 141 .hasListModel .label{
142 height: 22rpx; 142 height: 22rpx;
143 line-height:22rpx; 143 line-height:22rpx;
144 - overflow: hidden;  
145 - margin-top: 12rpx;  
146 - margin-bottom: 4rpx; 144 + font-size: 22rpx;
147 } 145 }
148 -.hasListModel .label .menu-ptop-mark,.hasListModel .label .labelListImg{  
149 - height: 100%;  
150 - margin-right: 4rpx; 146 +.labelListImg{
  147 + width: 50rpx;
  148 + height: 22rpx;
  149 + margin-right: 10rpx;
  150 + line-height: 22rpx;
  151 + font-size: 18rpx;
  152 + color:#FEFEFE;
  153 + background: linear-gradient(to right, #C8B16D, #ECD48B);
151 } 154 }
152 .hasListModel .price{ 155 .hasListModel .price{
153 - height: 40rpx;  
154 - overflow: hidden;  
155 - padding:0 10rpx;  
156 - line-height: 40rpx; 156 + height: 28rpx;
157 font-size: 28rpx; 157 font-size: 28rpx;
  158 + line-height: 28rpx;
  159 + position: relative;
  160 + width: 100%;
158 } 161 }
159 -.hasListModel .price .flex-ll-bottom{  
160 - height: 40rpx;  
161 -}  
162 -.hasListModel .price .rmb{  
163 - /*line-height:26rpx;  
164 - height:26rpx;  
165 - font-size: 24rpx;*/  
166 - margin-right: 10rpx;  
167 -}  
168 -.hasListModel .price .money{  
169 - /*height: 30rpx;  
170 - font-size: 28rpx;  
171 - line-height:30rpx;*/ 162 +.hasListModel .price .opt{
  163 + position: absolute;
  164 + right:20rpx;
  165 + top:-12rpx;
172 } 166 }
173 -  
174 .hasListModel .food-clear-content{ 167 .hasListModel .food-clear-content{
175 color:#DA331D; 168 color:#DA331D;
176 background-color: #F4DCD9; 169 background-color: #F4DCD9;
@@ -206,4 +199,5 @@ @@ -206,4 +199,5 @@
206 padding: 0; 199 padding: 0;
207 width: 50rpx; 200 width: 50rpx;
208 overflow: hidden; 201 overflow: hidden;
  202 + text-align: center;
209 } 203 }