@ -0,0 +1,67 @@ |
|||||||
|
<template> |
||||||
|
<view style="display: flex;flex-direction: row;height: 27px;"> |
||||||
|
<view class="food-control"> |
||||||
|
<view class="cont" style="margin-top: 2px;" @click="decreaseCart(food)" v-show="food.count>0"> |
||||||
|
<image src="../qianzhu-KFC/static/imgs/reduce.png" mode="" style="width: 22px;height: 22px;"></image> |
||||||
|
</view> |
||||||
|
<!-- <text style="padding: 0 4px;" v-show="food.count>0">{{food.count}}</text> --> |
||||||
|
<input type="number" maxlength="3" |
||||||
|
style="margin: 0 2px;width: 36px;padding: 0 1px;border-radius: 3px;" v-show="food.count>0" |
||||||
|
v-model="food.count" @input="inputCart(food)"/> |
||||||
|
</view> |
||||||
|
<view style="flex: 1;margin-top: 2px; " class="cont" @click="addCart(food)"> |
||||||
|
<image src="../qianzhu-KFC/static/imgs/plus.png" style="width: 22px;height: 22px;color: #CCCCCC;" mode=""></image> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
// import Vue from 'vue' |
||||||
|
export default { |
||||||
|
props: { |
||||||
|
food: { |
||||||
|
type: Object, |
||||||
|
} |
||||||
|
}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
}; |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
addCart: function(item) { |
||||||
|
this.$emit('add',item) |
||||||
|
}, |
||||||
|
decreaseCart(item) { |
||||||
|
this.$emit('dec',item) |
||||||
|
}, |
||||||
|
inputCart(item) { |
||||||
|
this.fcount = item.count |
||||||
|
if (item.count >= 999) { |
||||||
|
uni.showToast({ |
||||||
|
title: "该宝贝不能购买更多了~" |
||||||
|
}) |
||||||
|
return false; |
||||||
|
} else { |
||||||
|
this.$emit('input', item) |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
.food-control { |
||||||
|
display: flex; |
||||||
|
flex: 1; |
||||||
|
justify-content: space-around; |
||||||
|
} |
||||||
|
|
||||||
|
.cont { |
||||||
|
width: 22px; |
||||||
|
height: 22px; |
||||||
|
box-sizing: border-box; |
||||||
|
border-radius: 50%; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,124 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<view class="width100 height120 headsbg backcorfff" @click="jumpupadess('add')"> |
||||||
|
<view class="height20"></view> |
||||||
|
<view class="width100 fotct font18 fcor666">自助餐厅,不支持外卖</view> |
||||||
|
<image src="../static/imgs/buffstu.png" mode="widthFix" class="width100"></image> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="input-box mart20 width90"> |
||||||
|
<input placeholder="请输入关键字搜索" placeholder-style="color:#c0c0c0;" /> |
||||||
|
<view class="icon search"></view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="mart20 width80 alijusstart fotct marb20"> |
||||||
|
<view class="width50 fcor333 font16" :class="collection == 1?'colorc8':'fcor333'" @click="changestu(1)">附近餐厅 |
||||||
|
<text class="bufbtn" :class="collection == 1?'backgrdc8':'backcor33'">97</text> |
||||||
|
</view> |
||||||
|
<view class="width50 fcor333 font16" :class="collection == 2?'colorc8':'fcor333'" @click="changestu(2)"> |
||||||
|
收藏的餐厅 |
||||||
|
<text class="bufbtn" :class="collection == 2?'backgrdc8':'backcor33'">0</text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="mart10 width90 height90 borderrs backcorfff" v-for="(item,index) in kcfShopList" :key="index" |
||||||
|
@click="jumpmenulist()"> |
||||||
|
<view class="paddtop10 width90 alijusstart"> |
||||||
|
<view class="width80p font16 fcor333 fontwig6">时代天街</view> |
||||||
|
<view class="width20 fotrt"> |
||||||
|
<!-- <image mode="widthFix" class="icon20" src="../static/imgs/nocollection.png"></image> --> |
||||||
|
<image mode="widthFix" class="icon20" src="../static/imgs/collection.png"></image> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="width90 mart5 font12 fcor999">前门西大街正阳市场1号楼中部</view> |
||||||
|
<view class="width90 mart5 alijusstart"> |
||||||
|
<image class="icon15" src="../static/imgs/location.png" mode="widthFix"></image> |
||||||
|
<text class="margle font14 fcor666">0.2km</text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
collection: 1, //是否收藏 |
||||||
|
kcfShopList: [1, 2, 3, 4, 5, 6, 7, 8, 9] //肯德基列表 |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//更换状态 |
||||||
|
changestu(item) { |
||||||
|
this.collection = item; |
||||||
|
}, |
||||||
|
//跳转菜单 |
||||||
|
jumpmenulist() { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../menu-list/menu-list' |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
page { |
||||||
|
background-color: #f0f0f0; |
||||||
|
} |
||||||
|
|
||||||
|
.headsbg { |
||||||
|
border-radius: 0 0 30px 30px; |
||||||
|
} |
||||||
|
|
||||||
|
.colorc8 { |
||||||
|
color: #c82b1f; |
||||||
|
} |
||||||
|
|
||||||
|
.backgrdc8 { |
||||||
|
background-color: #c82b1f; |
||||||
|
} |
||||||
|
|
||||||
|
.borderrs { |
||||||
|
border-radius: 10px; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
.bufbtn { |
||||||
|
padding-left: 7px; |
||||||
|
padding-right: 7px; |
||||||
|
padding-top: 1px; |
||||||
|
padding-bottom: 1px; |
||||||
|
font-size: 12px; |
||||||
|
color: #ffffff; |
||||||
|
border-radius: 15px; |
||||||
|
} |
||||||
|
|
||||||
|
.input-box { |
||||||
|
height: 70rpx; |
||||||
|
background-color: #ffffff; |
||||||
|
border-radius: 30rpx; |
||||||
|
position: relative; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
.icon { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
position: absolute; |
||||||
|
top: 0; |
||||||
|
right: 0; |
||||||
|
width: 60upx; |
||||||
|
height: 60upx; |
||||||
|
font-size: 34upx; |
||||||
|
color: #c0c0c0; |
||||||
|
} |
||||||
|
|
||||||
|
input { |
||||||
|
padding-left: 28upx; |
||||||
|
height: 28upx; |
||||||
|
font-size: 28upx; |
||||||
|
width: 100%; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,125 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<view class="width100 height120 headsbg backcorfff fotct"> |
||||||
|
<view class="height20"></view> |
||||||
|
<view class="width100 font18 fcor666">时代天街</view> |
||||||
|
<image src="../static/imgs/location.png" mode="widthFix" class="icon20 mart5"></image> |
||||||
|
<view class="width100 mart5 font12 fcor666">时代天街时代天街时代天街时代天街</view> |
||||||
|
</view> |
||||||
|
<view class="width96 mart20 colorc3 font12 fotct"> |
||||||
|
注:约5分钟后取餐,请尽快到餐厅取餐哦 |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="concont width94 mart10 backcorfff"> |
||||||
|
<view class="width94 paddtop10 font14"> |
||||||
|
餐品详情 |
||||||
|
</view> |
||||||
|
<view class="width100 bor-botm1 mart10 marb10"></view> |
||||||
|
<view class="width100"> |
||||||
|
<view class="width100 alijusstart mart10 bor-botm1" v-for="(item,index) in orderList" :key="index"> |
||||||
|
<view class="width30"> |
||||||
|
<image src="../static/imgs/kfc2.png" mode="widthFix" class="width100"></image> |
||||||
|
</view> |
||||||
|
<view class="width40 font13 fcor666">香辣鸡腿堡</view> |
||||||
|
<view class="width10 font12 fcor999">x1</view> |
||||||
|
<view class="width20"> |
||||||
|
<view class="width100 fcor333 font12">¥<text class="fontwig6 font16">16.8</text></view> |
||||||
|
<view class="width100 fcor999 font12" style="text-decoration: line-through;">¥17.8</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="width90 fotrt height50 font13 fcor999"> |
||||||
|
共 <text class="fcor333 fontwig6" style="margin: 0px 5px;"> 1 </text> 件 小计: <text |
||||||
|
class="font16 colorc3 fontwig6 margle"> ¥16.8</text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="concont width94 mart10 backcorfff"> |
||||||
|
<view class="width94 alijusstart paddtop10 font14 fcor666"> |
||||||
|
<view class="width50">联系电话</view> |
||||||
|
<view class="width50 fotrt">15583658692</view> |
||||||
|
</view> |
||||||
|
<view class="width94 font12 fcor999 mart5 paddbotm10">经用于接收取餐码,请正确填写</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="concont width94 mart20 backcorfff marb100"> |
||||||
|
<view class="width94 paddtop10 font14 fcor333 fontwig6"> |
||||||
|
就餐方式 |
||||||
|
</view> |
||||||
|
<view class="width94 mart20 paddbotm20 alijusstart"> |
||||||
|
<view class="takemode height30 alijus fcor999" :class="sttypeid == 1?'aftermode':''" @click="changedissr(1)"> |
||||||
|
<image src="../static/imgs/menu3.png" mode="widthFix" class="icon20"></image> |
||||||
|
<view class="font14 margle10">店内就餐</view> |
||||||
|
</view> |
||||||
|
<view class="takemode height30 alijus fcor999" style="margin-left: 4%;" :class="sttypeid == 2?'aftermode':''" @click="changedissr(2)"> |
||||||
|
<image src="../static/imgs/menu2.png" mode="widthFix" class="icon20"></image> |
||||||
|
<view class="font14 margle10">打包带走</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
|
||||||
|
<view class="footbtn width100 height50 backcor33"> |
||||||
|
<view class="width94 alijusstart"> |
||||||
|
<view class="width70 fcorfff"> |
||||||
|
合计: ¥<text class="font16 fontwig6" style="margin: 0px 6px;">16.8</text> <text class="font12">已省 ¥1.7</text> |
||||||
|
</view> |
||||||
|
<view class="width30 fotrt"> |
||||||
|
<view class="btnpay fotct font13 fcorfff">去支付</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
orderList: [1, 2, 3, 4, 5], |
||||||
|
sttypeid:1 |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//选择方式 |
||||||
|
changedissr(item){ |
||||||
|
this.sttypeid = item; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
page { |
||||||
|
background-color: #f0f0f0; |
||||||
|
} |
||||||
|
|
||||||
|
.headsbg { |
||||||
|
border-radius: 0 0 30px 30px; |
||||||
|
} |
||||||
|
|
||||||
|
.concont { |
||||||
|
border-radius: 12px; |
||||||
|
} |
||||||
|
|
||||||
|
.footbtn{ |
||||||
|
bottom: 0px; |
||||||
|
position: fixed; |
||||||
|
} |
||||||
|
.btnpay{ |
||||||
|
width: 90px; |
||||||
|
background-color: #c72a20; |
||||||
|
border-radius: 22px; |
||||||
|
height: 36px; |
||||||
|
line-height: 36px; |
||||||
|
} |
||||||
|
.takemode{ |
||||||
|
width: 48%; |
||||||
|
border-radius: 5px; |
||||||
|
border: 1px solid #999999; |
||||||
|
} |
||||||
|
.aftermode{ |
||||||
|
background-color: #faf1f1; |
||||||
|
color: #c72a20; |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,824 @@ |
|||||||
|
<template> |
||||||
|
<view class="content"> |
||||||
|
<!-- <view class="width100 height85 backcorfff heads"> |
||||||
|
<view class="paddtop10 width90 alijusstart"> |
||||||
|
<view class="width80p font16 fcor333 fontwig6"> |
||||||
|
<image mode="widthFix" class="icon15 marRight10" src="../static/imgs/shop.png"></image>时代天街 |
||||||
|
</view> |
||||||
|
<view class="width20 fotrt"> |
||||||
|
<image mode="widthFix" class="icon20" src="../static/imgs/nocollection.png"></image> |
||||||
|
<image mode="widthFix" class="icon20" src="../static/imgs/collection.png"></image> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="width90 mart5 font12 fcor999">前门西大街正阳市场1号楼中部</view> |
||||||
|
</view> --> |
||||||
|
|
||||||
|
<scroll-view scroll-y class="left-aside"> |
||||||
|
<view v-for="item in flist" :key="item.id" class="f-item" :class="{active: item.id === currentId}" |
||||||
|
@click="tabtap(item)"> |
||||||
|
<view class="width100 fotct"> |
||||||
|
<image src="../static/imgs/menu1.png" mode="widthFix" class="icon45"></image> |
||||||
|
</view> |
||||||
|
<view class="width100" style="margin-top: -30px;"> |
||||||
|
{{item.name}} |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</scroll-view> |
||||||
|
|
||||||
|
<scroll-view scroll-with-animation scroll-y class="right-aside" @scroll="asideScroll" |
||||||
|
:scroll-top="tabScrollTop"> |
||||||
|
<view v-for="item in slist" :key="item.id" :id="'main-'+item.id"> |
||||||
|
<view class="s-item width90"> |
||||||
|
<text class="promotion_mixg1 backcor99" style="margin-right: -3px;"></text> |
||||||
|
<text class="promotion_mixg1 backcor66" style="margin-right: -3px;"></text> |
||||||
|
<text class="promotion_mixg1 backcor33 marglerig"></text> |
||||||
|
{{item.name}} |
||||||
|
</view> |
||||||
|
<view @click="navToList(item.id, titem.id)" v-if="titem.pid === item.id" class="t-list mart10" |
||||||
|
v-for="titem in tlist" :id="'main-'+item.id" :key="titem.id"> |
||||||
|
<view class="paddtop10 width94 font16 fcor333 fotrt fontwig6 text2"> |
||||||
|
香辣鸡腿堡 |
||||||
|
</view> |
||||||
|
<view class="width94 alijun mart5"> |
||||||
|
<view class="width60"> |
||||||
|
<image src="../static/imgs/prod1.png" mode="widthFix" class="width100"></image> |
||||||
|
</view> |
||||||
|
<view class="width40 fotrt"> |
||||||
|
<view class="width100 font12 colorc3">¥<text class="font18 fontwig6 margle">16.8</text> |
||||||
|
</view> |
||||||
|
<view class="width100 font14 mart5 colorc3">已减¥1.7元</view> |
||||||
|
<view class="width100 font14 mart5 fcor999" style="text-decoration: line-through;">原价¥18.5 |
||||||
|
</view> |
||||||
|
<view class="mart10 icon-click fotrt"> |
||||||
|
<image class="btn-reduce" mode="widthFix" src="../static/imgs/reduce.png"></image> |
||||||
|
<view class="num">1</view> |
||||||
|
<image class="btn-plus" mode="widthFix" src="../static/imgs/plus.png"></image> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</scroll-view> |
||||||
|
<shopcart :goods="goods" @add="addCart" @dec="decreaseCart" @input="inputCart" @delAll="delAll"></shopcart> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import shopcart from '../../components/shopcart.vue'; |
||||||
|
export default { |
||||||
|
components: { |
||||||
|
shopcart |
||||||
|
}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
sizeCalcState: false, |
||||||
|
tabScrollTop: 0, |
||||||
|
currentId: 1, |
||||||
|
flist: [], |
||||||
|
slist: [], |
||||||
|
tlist: [], |
||||||
|
goods: [{ |
||||||
|
"name": "热销", |
||||||
|
"foods": [{ |
||||||
|
|
||||||
|
"name": "南瓜粥", |
||||||
|
"price": 9.22, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:大米,南瓜", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/nanguaz.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "小米粥", |
||||||
|
"price": 9.8, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:小米", |
||||||
|
"sellCount": 239, |
||||||
|
"count": 1, |
||||||
|
"img": '../../static/xiaomi.jpg' |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "油条", |
||||||
|
"price": 1.88, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:油条", |
||||||
|
"sellCount": 229, |
||||||
|
"count": 1, |
||||||
|
"img": '../../static/youtiao.jpg' |
||||||
|
|
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "折扣", |
||||||
|
"foods": [{ |
||||||
|
"name": "油条1只", |
||||||
|
"price": 1.88, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:油条", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/youtiao.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "艇仔粥", |
||||||
|
"price": 9.9, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:瘦肉,干贝,花生等", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/tingzaiz.jpg' |
||||||
|
|
||||||
|
}], |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "套餐", |
||||||
|
"foods": [{ |
||||||
|
"name": "油条2只", |
||||||
|
"price": 1.88, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:油条", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/youtiao.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "艇仔粥2", |
||||||
|
"price": 9.9, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:瘦肉,干贝,花生等", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/tingzaiz.jpg' |
||||||
|
|
||||||
|
}], |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "套餐2", |
||||||
|
"foods": [{ |
||||||
|
"name": "油条3只", |
||||||
|
"price": 1.88, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:油条", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/youtiao.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "艇仔粥3", |
||||||
|
"price": 9.9, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:瘦肉,干贝,花生等", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/tingzaiz.jpg' |
||||||
|
|
||||||
|
}], |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "热销2", |
||||||
|
"foods": [{ |
||||||
|
"name": "南瓜粥1", |
||||||
|
"price": 9.22, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:大米,南瓜", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/nanguaz.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "小米粥1", |
||||||
|
"price": 9.8, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:小米", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/xiaomi.jpg' |
||||||
|
|
||||||
|
}] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "折扣2", |
||||||
|
"foods": [{ |
||||||
|
"name": "油条4只", |
||||||
|
"price": 1.88, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:油条", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/youtiao.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "艇仔粥4", |
||||||
|
"price": 9.9, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:瘦肉,干贝,花生等", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/tingzaiz.jpg' |
||||||
|
|
||||||
|
}], |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "套餐3", |
||||||
|
"foods": [{ |
||||||
|
"name": "油条5只", |
||||||
|
"price": 1.88, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:油条", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/youtiao.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "艇仔粥5", |
||||||
|
"price": 9.9, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:瘦肉,干贝,花生等", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/tingzaiz.jpg' |
||||||
|
|
||||||
|
}], |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "套餐4", |
||||||
|
"foods": [{ |
||||||
|
"name": "油条6只", |
||||||
|
"price": 1.81, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:油条", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/youtiao.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "艇仔粥6", |
||||||
|
"price": 9.91, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:瘦肉,干贝,花生等", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/tingzaiz.jpg' |
||||||
|
|
||||||
|
}], |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "热销3", |
||||||
|
"foods": [{ |
||||||
|
"name": "南瓜粥3", |
||||||
|
"price": 9.21, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:大米,南瓜", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/nanguaz.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "小米粥3", |
||||||
|
"price": 9.78, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:小米", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/xiaomi.jpg' |
||||||
|
|
||||||
|
}] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "折扣3", |
||||||
|
"foods": [{ |
||||||
|
"name": "油条7只", |
||||||
|
"price": 1.88, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:油条", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/youtiao.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "艇仔粥7", |
||||||
|
"price": 9.9, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:瘦肉,干贝,花生等", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/tingzaiz.jpg' |
||||||
|
|
||||||
|
}], |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "套餐6", |
||||||
|
"foods": [{ |
||||||
|
"name": "油条8只", |
||||||
|
"price": 1.88, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:油条", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/youtiao.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "艇仔粥8", |
||||||
|
"price": 9.9, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:瘦肉,干贝,花生等", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/tingzaiz.jpg' |
||||||
|
|
||||||
|
}], |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "套餐7", |
||||||
|
"foods": [{ |
||||||
|
"name": "油条9只", |
||||||
|
"price": 1.88, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:油条", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/youtiao.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "艇仔粥9", |
||||||
|
"price": 9.9, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:瘦肉,干贝,花生等", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/tingzaiz.jpg' |
||||||
|
|
||||||
|
}], |
||||||
|
|
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "热销4", |
||||||
|
"foods": [{ |
||||||
|
"name": "南瓜粥4", |
||||||
|
"price": 9.22, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:大米,南瓜", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/nanguaz.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "小米粥4", |
||||||
|
"price": 9.8, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:小米", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/xiaomi.jpg' |
||||||
|
|
||||||
|
}] |
||||||
|
}, |
||||||
|
{ |
||||||
|
"name": "折扣4", |
||||||
|
"foods": [{ |
||||||
|
"name": "油条10只", |
||||||
|
"price": 1.88, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:油条", |
||||||
|
"sellCount": 229, |
||||||
|
"img": '../../static/youtiao.jpg' |
||||||
|
|
||||||
|
}, { |
||||||
|
"name": "艇仔粥10", |
||||||
|
"price": 9.9, |
||||||
|
"oldPrice": "", |
||||||
|
"description": "食材:瘦肉,干贝,花生等", |
||||||
|
"sellCount": 239, |
||||||
|
"img": '../../static/tingzaiz.jpg' |
||||||
|
|
||||||
|
}], |
||||||
|
|
||||||
|
}, |
||||||
|
|
||||||
|
], |
||||||
|
cateList: [{ |
||||||
|
id: 1, |
||||||
|
name: '手机数码' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 2, |
||||||
|
name: '礼品鲜花' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 3, |
||||||
|
name: '男装女装' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 4, |
||||||
|
name: '母婴用品' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 5, |
||||||
|
pid: 1, |
||||||
|
name: '手机通讯' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 6, |
||||||
|
pid: 1, |
||||||
|
name: '运营商' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 8, |
||||||
|
pid: 5, |
||||||
|
name: '全面屏手机', |
||||||
|
picture: '/static/temp/cate2.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 9, |
||||||
|
pid: 5, |
||||||
|
name: '游戏手机', |
||||||
|
picture: '/static/temp/cate3.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 10, |
||||||
|
pid: 5, |
||||||
|
name: '老人机', |
||||||
|
picture: '/static/temp/cate1.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 11, |
||||||
|
pid: 5, |
||||||
|
name: '拍照手机', |
||||||
|
picture: '/static/temp/cate4.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 12, |
||||||
|
pid: 5, |
||||||
|
name: '女性手机', |
||||||
|
picture: '/static/temp/cate5.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 14, |
||||||
|
pid: 6, |
||||||
|
name: '合约机', |
||||||
|
picture: '/static/temp/cate1.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 15, |
||||||
|
pid: 6, |
||||||
|
name: '选好卡', |
||||||
|
picture: '/static/temp/cate4.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 16, |
||||||
|
pid: 6, |
||||||
|
name: '办套餐', |
||||||
|
picture: '/static/temp/cate5.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 17, |
||||||
|
pid: 2, |
||||||
|
name: '礼品', |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 18, |
||||||
|
pid: 2, |
||||||
|
name: '鲜花', |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 19, |
||||||
|
pid: 17, |
||||||
|
name: '公益摆件', |
||||||
|
picture: '/static/temp/cate7.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 20, |
||||||
|
pid: 17, |
||||||
|
name: '创意礼品', |
||||||
|
picture: '/static/temp/cate8.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 21, |
||||||
|
pid: 18, |
||||||
|
name: '鲜花', |
||||||
|
picture: '/static/temp/cate9.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 22, |
||||||
|
pid: 18, |
||||||
|
name: '每周一花', |
||||||
|
picture: '/static/temp/cate10.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 23, |
||||||
|
pid: 18, |
||||||
|
name: '卡通花束', |
||||||
|
picture: '/static/temp/cate11.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 24, |
||||||
|
pid: 18, |
||||||
|
name: '永生花', |
||||||
|
picture: '/static/temp/cate12.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 25, |
||||||
|
pid: 3, |
||||||
|
name: '男装' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 26, |
||||||
|
pid: 3, |
||||||
|
name: '女装' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 27, |
||||||
|
pid: 25, |
||||||
|
name: '男士T恤', |
||||||
|
picture: '/static/temp/cate13.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 28, |
||||||
|
pid: 25, |
||||||
|
name: '男士外套', |
||||||
|
picture: '/static/temp/cate14.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 29, |
||||||
|
pid: 26, |
||||||
|
name: '裙装', |
||||||
|
picture: '/static/temp/cate15.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 30, |
||||||
|
pid: 26, |
||||||
|
name: 'T恤', |
||||||
|
picture: '/static/temp/cate16.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 31, |
||||||
|
pid: 26, |
||||||
|
name: '上装', |
||||||
|
picture: '/static/temp/cate15.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 32, |
||||||
|
pid: 26, |
||||||
|
name: '下装', |
||||||
|
picture: '/static/temp/cate16.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 33, |
||||||
|
pid: 4, |
||||||
|
name: '奶粉', |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 34, |
||||||
|
pid: 4, |
||||||
|
name: '营养辅食', |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 35, |
||||||
|
pid: 4, |
||||||
|
name: '童装', |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 39, |
||||||
|
pid: 4, |
||||||
|
name: '喂养用品', |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 36, |
||||||
|
pid: 33, |
||||||
|
name: '有机奶粉', |
||||||
|
picture: '/static/temp/cate17.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 37, |
||||||
|
pid: 34, |
||||||
|
name: '果泥/果汁', |
||||||
|
picture: '/static/temp/cate18.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 39, |
||||||
|
pid: 34, |
||||||
|
name: '面条/粥', |
||||||
|
picture: '/static/temp/cate20.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 42, |
||||||
|
pid: 35, |
||||||
|
name: '婴童衣橱', |
||||||
|
picture: '/static/temp/cate19.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 43, |
||||||
|
pid: 39, |
||||||
|
name: '吸奶器', |
||||||
|
picture: '/static/temp/cate21.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 44, |
||||||
|
pid: 39, |
||||||
|
name: '儿童餐具', |
||||||
|
picture: '/static/temp/cate22.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 45, |
||||||
|
pid: 39, |
||||||
|
name: '牙胶安抚', |
||||||
|
picture: '/static/temp/cate23.jpg' |
||||||
|
}, |
||||||
|
{ |
||||||
|
id: 46, |
||||||
|
pid: 39, |
||||||
|
name: '围兜', |
||||||
|
picture: '/static/temp/cate24.jpg' |
||||||
|
}, |
||||||
|
] |
||||||
|
|
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad() { |
||||||
|
this.loadData(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
async loadData() { |
||||||
|
let list = await this.cateList; |
||||||
|
list.forEach(item => { |
||||||
|
if (!item.pid) { |
||||||
|
this.flist.push(item); //pid为父级id, 没有pid或者pid=0是一级分类 |
||||||
|
} else if (!item.picture) { |
||||||
|
this.slist.push(item); //没有图的是2级分类 |
||||||
|
} else { |
||||||
|
this.tlist.push(item); //3级分类 |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
//一级分类点击 |
||||||
|
tabtap(item) { |
||||||
|
if (!this.sizeCalcState) { |
||||||
|
this.calcSize(); |
||||||
|
} |
||||||
|
|
||||||
|
this.currentId = item.id; |
||||||
|
let index = this.slist.findIndex(sitem => sitem.pid == item.id); |
||||||
|
this.tabScrollTop = this.slist[index].top; |
||||||
|
}, |
||||||
|
//右侧栏滚动 |
||||||
|
asideScroll(e) { |
||||||
|
if (!this.sizeCalcState) { |
||||||
|
this.calcSize(); |
||||||
|
} |
||||||
|
let scrollTop = e.detail.scrollTop; |
||||||
|
let tabs = this.slist.filter(item => item.top <= scrollTop).reverse(); |
||||||
|
if (tabs.length > 0) { |
||||||
|
this.currentId = tabs[0].pid; |
||||||
|
} |
||||||
|
}, |
||||||
|
//计算右侧栏每个tab的高度等信息 |
||||||
|
calcSize() { |
||||||
|
let h = 0; |
||||||
|
this.slist.forEach(item => { |
||||||
|
let view = uni.createSelectorQuery().select("#main-" + item.id); |
||||||
|
view.fields({ |
||||||
|
size: true |
||||||
|
}, data => { |
||||||
|
item.top = h; |
||||||
|
h += data.height; |
||||||
|
item.bottom = h; |
||||||
|
}).exec(); |
||||||
|
}) |
||||||
|
this.sizeCalcState = true; |
||||||
|
}, |
||||||
|
addCart(item) { |
||||||
|
|
||||||
|
}, |
||||||
|
decreaseCart(item) { |
||||||
|
|
||||||
|
}, |
||||||
|
inputCart(item) {}, |
||||||
|
// 清空购物车 |
||||||
|
delAll() { |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
page, |
||||||
|
.content { |
||||||
|
height: 100%; |
||||||
|
background-color: #f8f8f8; |
||||||
|
} |
||||||
|
|
||||||
|
.content { |
||||||
|
display: flex; |
||||||
|
bottom: 55px; |
||||||
|
} |
||||||
|
|
||||||
|
.heads { |
||||||
|
position: absolute; |
||||||
|
} |
||||||
|
|
||||||
|
.icon20 { |
||||||
|
width: 20px; |
||||||
|
} |
||||||
|
|
||||||
|
.icon15 { |
||||||
|
width: 15px; |
||||||
|
} |
||||||
|
|
||||||
|
.icon45 { |
||||||
|
width: 45px; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
.left-aside { |
||||||
|
flex-shrink: 0; |
||||||
|
width: 80px; |
||||||
|
height: 100%; |
||||||
|
// margin-top: 85px; |
||||||
|
background-color: #fff; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
.f-item { |
||||||
|
display: grid; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
width: 100%; |
||||||
|
height: 180upx; |
||||||
|
padding: 10px 0px; |
||||||
|
font-size: 24upx; |
||||||
|
color: #666666; |
||||||
|
position: relative; |
||||||
|
|
||||||
|
&.active { |
||||||
|
background: #f8f8f8; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.right-aside { |
||||||
|
flex: 1; |
||||||
|
overflow: hidden; |
||||||
|
// margin-top: 85px; |
||||||
|
padding-left: 20upx; |
||||||
|
} |
||||||
|
|
||||||
|
.s-item { |
||||||
|
justify-content: flex-end; |
||||||
|
align-items: center; |
||||||
|
display: flex; |
||||||
|
height: 70upx; |
||||||
|
padding-top: 8upx; |
||||||
|
font-size: 28upx; |
||||||
|
color: #333333; |
||||||
|
|
||||||
|
.promotion_mixg1 { |
||||||
|
width: 12px; |
||||||
|
height: 2px; |
||||||
|
border-radius: 18px; |
||||||
|
transform: rotate(125deg); |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.t-list { |
||||||
|
width: 96%; |
||||||
|
border-radius: 15px; |
||||||
|
background: #fff; |
||||||
|
|
||||||
|
&:after { |
||||||
|
content: ''; |
||||||
|
flex: 99; |
||||||
|
height: 0; |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.icon-click { |
||||||
|
position: absolute; |
||||||
|
height: 28px; |
||||||
|
right: 6%; |
||||||
|
} |
||||||
|
|
||||||
|
.btn-reduce { |
||||||
|
position: absolute; |
||||||
|
left: 0px; |
||||||
|
top: 0; |
||||||
|
width: 28px; |
||||||
|
height: 28px; |
||||||
|
z-index: 1; |
||||||
|
|
||||||
|
} |
||||||
|
|
||||||
|
.btn-plus { |
||||||
|
position: absolute; |
||||||
|
right: 0px; |
||||||
|
top: 0; |
||||||
|
width: 28px; |
||||||
|
height: 28px; |
||||||
|
z-index: 1; |
||||||
|
} |
||||||
|
|
||||||
|
.num { |
||||||
|
padding: 0px 35px; |
||||||
|
height: 28px; |
||||||
|
line-height: 28px; |
||||||
|
font-weight: 600; |
||||||
|
color: #fff; |
||||||
|
background: #d90209; |
||||||
|
border-radius: 18px; |
||||||
|
} |
||||||
|
|
||||||
|
.footbtn { |
||||||
|
height: 50px; |
||||||
|
background-color: #000000; |
||||||
|
display: flex; |
||||||
|
bottom: 0px; |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,156 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<view class="width100 height220 headsbg backcorfff fotct"> |
||||||
|
<view class="height20"></view> |
||||||
|
<view class="headstu"></view> |
||||||
|
<view class="width100 font18 colorc72 mart5">待支付</view> |
||||||
|
<view class="width100 font14 fcor666 mart5">若超时未支付,订单将自动取消</view> |
||||||
|
<view class="stubtn mart15">立即支付</view> |
||||||
|
</view> |
||||||
|
<!-- <view class="width96 mart20 colorc3 font12 fotct"> |
||||||
|
注:约5分钟后取餐,请尽快到餐厅取餐哦 |
||||||
|
</view> --> |
||||||
|
|
||||||
|
<view class="concont width94 mart10 backcorfff"> |
||||||
|
<view class="width94 paddtop10 font14"> |
||||||
|
餐品明细 |
||||||
|
</view> |
||||||
|
<view class="width100 bor-botm1 mart10 marb10"></view> |
||||||
|
<view class="width100"> |
||||||
|
<view class="width100 alijusstart mart10 bor-botm1" v-for="(item,index) in orderList" :key="index"> |
||||||
|
<view class="width30"> |
||||||
|
<image src="../static/imgs/kfc2.png" mode="widthFix" class="width100"></image> |
||||||
|
</view> |
||||||
|
<view class="width40 font13 fcor666">香辣鸡腿堡</view> |
||||||
|
<view class="width10 font12 fcor999">x1</view> |
||||||
|
<view class="width20"> |
||||||
|
<view class="width100 fcor333 font12">¥<text class="fontwig6 font16">16.8</text></view> |
||||||
|
<view class="width100 fcor999 font12" style="text-decoration: line-through;">¥17.8</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="width90 fotrt height50 font13 fcor999"> |
||||||
|
共 <text class="fcor333 fontwig6" style="margin: 0px 5px;"> 1 </text> 件 小计: <text |
||||||
|
class="font16 colorc3 fontwig6 margle"> ¥16.8</text> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="concont width94 mart10 backcorfff marb30"> |
||||||
|
<view class="width94 alijusstart paddtop10 font14 fcor666"> |
||||||
|
订单信息 |
||||||
|
</view> |
||||||
|
<view class="width94 alijusstart mart20 font14 fcor666"> |
||||||
|
<view class="width30">取餐门店</view> |
||||||
|
<view class="width70 fotrt">时代天街时代天街时代天街时代天街</view> |
||||||
|
</view> |
||||||
|
<view class="width94 alijusstart mart20 font14 fcor666"> |
||||||
|
<view class="width30">订单号</view> |
||||||
|
<view class="width70 fotrt">2901012002828228288482828</view> |
||||||
|
</view> |
||||||
|
<view class="width94 alijusstart mart20 font14 fcor666"> |
||||||
|
<view class="width30">就餐方式</view> |
||||||
|
<view class="width70 fotrt">店内就餐</view> |
||||||
|
</view> |
||||||
|
<view class="width94 alijusstart mart20 font14 fcor666"> |
||||||
|
<view class="width30">支付方式</view> |
||||||
|
<view class="width70 fotrt">未支付</view> |
||||||
|
</view> |
||||||
|
<view class="width94 alijusstart mart20 font14 fcor666"> |
||||||
|
<view class="width30">联系方式</view> |
||||||
|
<view class="width70 fotrt">15583253627</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="width94 alijusend mart20 font14 fcor666 paddbotm20"> |
||||||
|
<view class="canbtn height30 marRight20">取消订单</view> |
||||||
|
<view class="canbtn height30">联系客服</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
orderList: [1], |
||||||
|
sttypeid: 1 |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//选择方式 |
||||||
|
changedissr(item) { |
||||||
|
this.sttypeid = item; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
page { |
||||||
|
background-color: #f0f0f0; |
||||||
|
} |
||||||
|
|
||||||
|
.headstu { |
||||||
|
width: 80px; |
||||||
|
height: 80px; |
||||||
|
border-radius: 50%; |
||||||
|
background-color: #faf1f1; |
||||||
|
color: #c72a20; |
||||||
|
margin-left: 40%; |
||||||
|
border: 1px solid #c72a20; |
||||||
|
} |
||||||
|
|
||||||
|
.stubtn { |
||||||
|
background-color: #c72a20; |
||||||
|
width: 30%; |
||||||
|
height: 35px; |
||||||
|
line-height: 35px; |
||||||
|
border-radius: 25px; |
||||||
|
color: #ffffff; |
||||||
|
margin-left: 35%; |
||||||
|
} |
||||||
|
|
||||||
|
.colorc72 { |
||||||
|
color: #c72a20; |
||||||
|
} |
||||||
|
|
||||||
|
.headsbg { |
||||||
|
border-radius: 0 0 30px 30px; |
||||||
|
} |
||||||
|
|
||||||
|
.concont { |
||||||
|
border-radius: 12px; |
||||||
|
} |
||||||
|
|
||||||
|
.footbtn { |
||||||
|
bottom: 0px; |
||||||
|
position: fixed; |
||||||
|
} |
||||||
|
|
||||||
|
.btnpay { |
||||||
|
width: 90px; |
||||||
|
background-color: #c72a20; |
||||||
|
border-radius: 22px; |
||||||
|
height: 36px; |
||||||
|
line-height: 36px; |
||||||
|
} |
||||||
|
|
||||||
|
.takemode { |
||||||
|
width: 48%; |
||||||
|
border-radius: 5px; |
||||||
|
border: 1px solid #999999; |
||||||
|
} |
||||||
|
|
||||||
|
.aftermode { |
||||||
|
background-color: #faf1f1; |
||||||
|
color: #c72a20; |
||||||
|
} |
||||||
|
|
||||||
|
.canbtn { |
||||||
|
border: 1px solid #313131; |
||||||
|
color: #333333; |
||||||
|
width: 80px; |
||||||
|
border-radius: 25px; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
</style> |
After Width: | Height: | Size: 53 KiB |
After Width: | Height: | Size: 1.5 KiB |
After Width: | Height: | Size: 2.0 KiB |
After Width: | Height: | Size: 2.6 KiB |
After Width: | Height: | Size: 5.6 KiB |
After Width: | Height: | Size: 2.7 KiB |
After Width: | Height: | Size: 4.0 KiB |
After Width: | Height: | Size: 2.5 KiB |
After Width: | Height: | Size: 2.9 KiB |
After Width: | Height: | Size: 45 KiB |
After Width: | Height: | Size: 2.7 KiB |
After Width: | Height: | Size: 1.6 KiB |
@ -0,0 +1,169 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<view class="username"> |
||||||
|
<view class="namecont">代理商名称</view> |
||||||
|
<input placeholder="请输入代理商名称" v-model="agentname" type="text" |
||||||
|
placeholder-style="color: #bfbfbf;font-size:14px;padding-top:2px;" /> |
||||||
|
</view> |
||||||
|
<view class="username"> |
||||||
|
<view class="namecont">手机号</view> |
||||||
|
<input placeholder="请输入手机号" v-model="agentphone" type="number" |
||||||
|
placeholder-style="color: #bfbfbf;font-size:14px;padding-top:2px;" /> |
||||||
|
</view> |
||||||
|
<view class="username"> |
||||||
|
<view class="namecont">所在地址</view> |
||||||
|
<input placeholder="请输入所在地址" v-model="agentaddress" type="text" |
||||||
|
placeholder-style="color: #bfbfbf;font-size:14px;padding-top:2px;" /> |
||||||
|
</view> |
||||||
|
<view class="btn mart50" @click="addgent()">提 交</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { |
||||||
|
insertChildAgent |
||||||
|
} from '../../Utils/Api.js'; |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
agentname: '', //名称 |
||||||
|
agentphone: '', //电话 |
||||||
|
agentaddress: '' //地址 |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//添加代理商 |
||||||
|
addgent() { |
||||||
|
let that = this; |
||||||
|
if (that.agentname == '') { |
||||||
|
uni.showToast({ |
||||||
|
title: '请填写代理商名称', |
||||||
|
icon: "none", |
||||||
|
duration: 2000 |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (that.agentphone == '') { |
||||||
|
uni.showToast({ |
||||||
|
title: '请填写手机号', |
||||||
|
icon: "none", |
||||||
|
duration: 2000 |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (that.agentaddress == '') { |
||||||
|
uni.showToast({ |
||||||
|
title: '请填写所在地址', |
||||||
|
icon: "none", |
||||||
|
duration: 2000 |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
uni.showModal({ |
||||||
|
title: '添加代理商', |
||||||
|
content: '确认信息是否正确。', |
||||||
|
success: function(res) { |
||||||
|
if (res.confirm) { |
||||||
|
uni.showLoading({ |
||||||
|
title: '添加中' |
||||||
|
}) |
||||||
|
let datas = { |
||||||
|
"agentName": that.agentname, |
||||||
|
"agentPhone": that.agentphone, |
||||||
|
"agentAddress": that.agentaddress |
||||||
|
} |
||||||
|
insertChildAgent(datas).then(res => { |
||||||
|
uni.hideLoading(); |
||||||
|
if (res.return_code == '000000') { |
||||||
|
uni.showToast({ |
||||||
|
title: '添加成功', |
||||||
|
icon: 'none', |
||||||
|
duration: 2000, |
||||||
|
success() { |
||||||
|
setTimeout(() => { |
||||||
|
uni.navigateBack({}) |
||||||
|
}, 1500); |
||||||
|
} |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
duration: 2000, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
.username { |
||||||
|
width: calc(100% - 90upx); |
||||||
|
height: 100upx; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
background-color: rgba($color: #ffffff, $alpha: 0.1); |
||||||
|
border-bottom: 1px solid #f6f6f6; |
||||||
|
padding: 8upx 45upx; |
||||||
|
|
||||||
|
input { |
||||||
|
width: 70%; |
||||||
|
height: 50upx; |
||||||
|
font-size: 16px; |
||||||
|
color: #333333; |
||||||
|
font-weight: blod; |
||||||
|
} |
||||||
|
|
||||||
|
.get-code { |
||||||
|
position: absolute; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
right: 7px; |
||||||
|
z-index: 3; |
||||||
|
border: 1px solid #bfbfbf; |
||||||
|
width: 25%; |
||||||
|
padding: 3px 5px; |
||||||
|
border-radius: 22px; |
||||||
|
|
||||||
|
&:after { |
||||||
|
content: " "; |
||||||
|
width: 1upx; |
||||||
|
height: 50upx; |
||||||
|
position: absolute; |
||||||
|
z-index: 3; |
||||||
|
margin-right: 100%; |
||||||
|
left: 0; |
||||||
|
top: 20upx; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.namecont { |
||||||
|
color: #666666; |
||||||
|
width: 28%; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.btn { |
||||||
|
bottom: 0px; |
||||||
|
position: absolute; |
||||||
|
color: #FFFFFF; |
||||||
|
background-color: #0083f5; |
||||||
|
width: 90%; |
||||||
|
margin-left: 5%; |
||||||
|
margin-top: 80rpx; |
||||||
|
margin-bottom: 50rpx; |
||||||
|
height: 90rpx; |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
align-items: center; |
||||||
|
border-radius: 45rpx; |
||||||
|
font-size: 40rpx; |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,71 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<view class="alijusstart fotct font14 height40p backcor9 fcor333"> |
||||||
|
<view class="width40">卡券名称</view> |
||||||
|
<view class="width20">销售价格</view> |
||||||
|
<view class="width20">库存数量</view> |
||||||
|
<view class="width20">销售数量</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view v-if="agtcardlist == '' " class="mart60 fotct font14 fcor666"> |
||||||
|
<image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image> |
||||||
|
</view> |
||||||
|
<view class="width96 alijusstart fotct font14 height45 fcor666 mart5 bor-botm1 marb5" :key="index" |
||||||
|
v-for="(item,index) in agtcardlist" @click="jumpcarddes(item.id)"> |
||||||
|
<view class="width40">{{item.couponName}}</view> |
||||||
|
<view class="width20">{{item.salesPrice}}元</view> |
||||||
|
<view class="width20">{{item.stockCount}}</view> |
||||||
|
<view class="width20">{{item.salesCount}}</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { |
||||||
|
getCouponByAgent |
||||||
|
} from '../../Utils/Api.js'; |
||||||
|
let app = getApp(); |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
imgadres: 'noorder.png', |
||||||
|
imagewxUrl: app.globalData.imageWxImg, |
||||||
|
agtcardlist: [], |
||||||
|
agentid: '' |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(options) { |
||||||
|
this.agentid = options.agid; |
||||||
|
this.getCouponByAgent(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//查询卡列表 |
||||||
|
getCouponByAgent() { |
||||||
|
uni.showLoading({ |
||||||
|
title: '加载中...' |
||||||
|
}) |
||||||
|
let datas = { |
||||||
|
agentId: this.agentid, |
||||||
|
pageNum: 1, |
||||||
|
pageSize: 999 |
||||||
|
} |
||||||
|
getCouponByAgent(datas).then(res => { |
||||||
|
uni.hideLoading(); |
||||||
|
if (res.return_code == '000000') { |
||||||
|
this.agtcardlist = res.return_data.list; |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
//跳转分发记录 |
||||||
|
jumpcarddes(item) { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../agentcardsDetails/agentcardsDetails?couponAgentId='+item |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
|
||||||
|
</style> |
@ -0,0 +1,189 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<view class="username paddtop10"> |
||||||
|
<view class="namecont">卡券选择</view> |
||||||
|
<picker mode="selector" style="width: 74%;" :range="cardList" range-key="couponName" @change="changeUserCard"> |
||||||
|
<view class="date text1" style="padding: 0 25rpx;">{{typeName}}</view> |
||||||
|
</picker> |
||||||
|
<image class="flright" style="width: 15px;height: 15px;" src="../../static/img/downj.png"></image> |
||||||
|
</view> |
||||||
|
<view class="username"> |
||||||
|
<view class="namecont">库存数量</view> |
||||||
|
<input v-model="stockCount" type="number" disabled="true" |
||||||
|
placeholder-style="color: #bfbfbf;font-size:14px;padding-top:2px;" /> |
||||||
|
</view> |
||||||
|
<view class="username"> |
||||||
|
<view class="namecont">分配数量</view> |
||||||
|
<input placeholder="请输入分配数量" v-model="cardnums" type="number" |
||||||
|
placeholder-style="color: #bfbfbf;font-size:14px;padding-top:2px;" /> |
||||||
|
</view> |
||||||
|
<view class="btn mart50" @click="assignCouponChildAgent()">分 发</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { |
||||||
|
getCouponByAgent, |
||||||
|
assignCouponChildAgent |
||||||
|
} from '../../Utils/Api.js'; |
||||||
|
let app = getApp(); |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
cardnums: '', //数量 |
||||||
|
cardList: [], // 卡列表 |
||||||
|
typeName: '', // 卡名称 |
||||||
|
stockCount:'', // 库存数量 |
||||||
|
type: '' ,//区分类型 |
||||||
|
agentid: ''//分发代理商id |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(options) { |
||||||
|
this.agentid = options.agentid; |
||||||
|
this.getCouponByAgent(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//查询卡列表 |
||||||
|
getCouponByAgent() { |
||||||
|
uni.showLoading({ |
||||||
|
title: '加载中...' |
||||||
|
}) |
||||||
|
let datas = { |
||||||
|
agentId: app.globalData.bresthighAgent.id, |
||||||
|
pageNum: 1, |
||||||
|
pageSize: 999 |
||||||
|
} |
||||||
|
getCouponByAgent(datas).then(res => { |
||||||
|
uni.hideLoading(); |
||||||
|
if (res.return_code == '000000') { |
||||||
|
this.cardList = res.return_data.list; |
||||||
|
this.type = res.return_data.list[0].id; |
||||||
|
this.stockCount = res.return_data.list[0].stockCount; |
||||||
|
this.typeName = res.return_data.list[0].couponName; |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
//选择卡类型 |
||||||
|
changeUserCard(e) { |
||||||
|
this.type = this.cardList[e.target.value].id; |
||||||
|
this.stockCount = this.cardList[e.target.value].stockCount; |
||||||
|
this.typeName = this.cardList[e.target.value].couponName; |
||||||
|
}, |
||||||
|
//分配卡券 |
||||||
|
assignCouponChildAgent() { |
||||||
|
let that = this; |
||||||
|
if (that.cardnums == '') { |
||||||
|
uni.showToast({ |
||||||
|
title: '请填写分发数量', |
||||||
|
icon: "none", |
||||||
|
duration: 2000 |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
uni.showModal({ |
||||||
|
title: '分发卡券', |
||||||
|
content: '确认分发数量、卡券是否正确!', |
||||||
|
success: function(res) { |
||||||
|
if (res.confirm) { |
||||||
|
uni.showLoading({ |
||||||
|
title: '添加中' |
||||||
|
}) |
||||||
|
let datas = { |
||||||
|
"couponAgentRelId": that.type, |
||||||
|
"agentId": that.agentid, |
||||||
|
"stockCount": that.cardnums |
||||||
|
} |
||||||
|
assignCouponChildAgent(datas).then(res => { |
||||||
|
uni.hideLoading(); |
||||||
|
if (res.return_code == '000000') { |
||||||
|
uni.showToast({ |
||||||
|
title: '分发成功', |
||||||
|
icon: 'none', |
||||||
|
duration: 2000, |
||||||
|
success() { |
||||||
|
setTimeout(() => { |
||||||
|
uni.navigateBack({}) |
||||||
|
}, 1500); |
||||||
|
} |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
duration: 2000, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
.username { |
||||||
|
width: calc(100% - 90upx); |
||||||
|
height: 100upx; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
background-color: rgba($color: #ffffff, $alpha: 0.1); |
||||||
|
border-bottom: 1px solid #f6f6f6; |
||||||
|
padding: 8upx 45upx; |
||||||
|
|
||||||
|
input { |
||||||
|
width: 50%; |
||||||
|
height: 50upx; |
||||||
|
font-size: 16px; |
||||||
|
color: #333333; |
||||||
|
font-weight: blod; |
||||||
|
} |
||||||
|
|
||||||
|
.get-code { |
||||||
|
position: absolute; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
justify-content: center; |
||||||
|
right: 7px; |
||||||
|
z-index: 3; |
||||||
|
border: 1px solid #bfbfbf; |
||||||
|
width: 25%; |
||||||
|
padding: 3px 5px; |
||||||
|
border-radius: 22px; |
||||||
|
|
||||||
|
&:after { |
||||||
|
content: " "; |
||||||
|
width: 1upx; |
||||||
|
height: 50upx; |
||||||
|
position: absolute; |
||||||
|
z-index: 3; |
||||||
|
margin-right: 100%; |
||||||
|
left: 0; |
||||||
|
top: 20upx; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.namecont { |
||||||
|
color: #666666; |
||||||
|
width: 35%; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.btn { |
||||||
|
bottom: 0px; |
||||||
|
position: absolute; |
||||||
|
color: #FFFFFF; |
||||||
|
background-color: #0083f5; |
||||||
|
width: 90%; |
||||||
|
margin-left: 5%; |
||||||
|
margin-top: 80rpx; |
||||||
|
margin-bottom: 50rpx; |
||||||
|
height: 90rpx; |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
align-items: center; |
||||||
|
border-radius: 45rpx; |
||||||
|
font-size: 40rpx; |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,82 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<view class="alijusstart fotct font14 height40p backcor9 fcor333"> |
||||||
|
<view class="width40">卡券名称</view> |
||||||
|
<view class="width20">分发数量</view> |
||||||
|
<view class="width40">分发时间</view> |
||||||
|
</view> |
||||||
|
<view v-if="couponcardlistdes == '' " class="mart60 fotct font14 fcor666"> |
||||||
|
<image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image> |
||||||
|
</view> |
||||||
|
<view class="width96 alijusstart fotct font14 height45 fcor666 mart5 bor-botm1 marb5" :key="index" |
||||||
|
v-for="(item,index) in couponcardlistdes"> |
||||||
|
<view class="width40">{{item.couponName}}</view> |
||||||
|
<view class="width20">{{item.stockCount}}</view> |
||||||
|
<view class="width40">{{item.createTime | timeFormat('yyyy-mm-dd')}} |
||||||
|
{{item.createTime | timeFormat('hh:mm')}} </view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { |
||||||
|
getRecordByCouponAgentId |
||||||
|
} from '../../Utils/Api.js'; |
||||||
|
let app = getApp(); |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
couponcardlistdes: [], |
||||||
|
couponAgentId: '', |
||||||
|
imgadres: 'noorder.png', |
||||||
|
imagewxUrl: app.globalData.imageWxImg, |
||||||
|
pageNum: 1, |
||||||
|
pageSize: 10, |
||||||
|
isNoMoreData: false |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(options) { |
||||||
|
this.couponAgentId = options.couponAgentId; |
||||||
|
this.getRecordByCouponAgentId(); |
||||||
|
}, |
||||||
|
onReachBottom() { |
||||||
|
this.getRecordByCouponAgentId(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//查询卡列表 |
||||||
|
getRecordByCouponAgentId() { |
||||||
|
uni.showLoading({ |
||||||
|
title: '加载中...' |
||||||
|
}) |
||||||
|
if (this.isNoMoreData) { |
||||||
|
uni.hideLoading() |
||||||
|
return false; |
||||||
|
} |
||||||
|
let pagenum = this.pageNum; |
||||||
|
let datas = { |
||||||
|
couponAgentId: this.couponAgentId, |
||||||
|
pageNum: pagenum, |
||||||
|
pageSize: this.pageSize |
||||||
|
} |
||||||
|
getRecordByCouponAgentId(datas).then(res => { |
||||||
|
if (res.return_code == '000000' && res.return_data.list != '') { |
||||||
|
uni.hideLoading(); |
||||||
|
this.isNoMoreData = res.return_data.list.length == this.pageSize ? false : true; |
||||||
|
this.couponcardlistdes = this.couponcardlistdes.concat(res.return_data.list); |
||||||
|
if (res.return_data.total == (this.pageNum * this.pageSize)) { |
||||||
|
this.isNoMoreData = true; |
||||||
|
} |
||||||
|
this.pageNum = res.return_data.list.length == this.pageSize ? ++pagenum : pagenum; |
||||||
|
} else { |
||||||
|
this.couponcardlistdes = []; |
||||||
|
uni.hideLoading() |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
|
||||||
|
</style> |
@ -0,0 +1,42 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<image class="width35 imgs mart30" mode="widthFix" v-for="(item,index) in agents" :src="item.imgs" :key="index" |
||||||
|
@click="jumppage(item.url)"></image> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
agents: [{ |
||||||
|
title: '代理商管理', |
||||||
|
imgs: '../static/agent1.png', |
||||||
|
url: '../agentmanage/agentmanage' |
||||||
|
}, { |
||||||
|
title: '分发卡券', |
||||||
|
imgs: '../static/agent2.png', |
||||||
|
url: '/pages/user/minePromotion/minePromotion' |
||||||
|
}, { |
||||||
|
title: '修改密码', |
||||||
|
imgs: '../static/agent3.png', |
||||||
|
url: '/pages/login/resetpasswd' |
||||||
|
}] |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//跳转页面 |
||||||
|
jumppage(item) { |
||||||
|
uni.navigateTo({ |
||||||
|
url: item |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="less"> |
||||||
|
.imgs { |
||||||
|
margin-left: 10%; |
||||||
|
} |
||||||
|
</style> |
@ -0,0 +1,181 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<view v-if="agentList == '' " class="mart60 fotct font14 fcor666"> |
||||||
|
<image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image> |
||||||
|
</view> |
||||||
|
<view class="list width90 mart15" v-for="(item, index) in agentList" :key="index" @click="jumpcardlist(item.id)"> |
||||||
|
<view class="address-box width90 paddtop15 font16 fcor333"> |
||||||
|
{{item.agentName}} |
||||||
|
</view> |
||||||
|
<view class="width90 mart10 font14 fcor999"> |
||||||
|
{{item.agentPhone}} |
||||||
|
</view> |
||||||
|
<view class="width90 mart10 bor-botm1"></view> |
||||||
|
<view class="alijusend width90 mart10 paddbotm10"> |
||||||
|
<view class="btnsstu backcorf06" @click.stop="jumpcardff(item.id)">分发</view> |
||||||
|
<view class="btnsstu backcolor41" @click.stop="jumpcardlist(item.id)">查看 |
||||||
|
</view> |
||||||
|
<view class="btnsstu backcolorred" v-if="item.status == 1" @click.stop="changeAgentStatus(item.id,0)">禁用 |
||||||
|
</view> |
||||||
|
<view class="btnsstu backcor99" v-if="item.status == 0" @click.stop="changeAgentStatus(item.id,1)">解除 |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<image src='../static/add.png' mode="widthFix" class="h5xfimg" @click="jumpaddagent()"></image> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { |
||||||
|
getChildAgentList, |
||||||
|
changeAgentStatus |
||||||
|
} from '../../Utils/Api.js'; |
||||||
|
let app = getApp(); |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
agentList: [], |
||||||
|
imgadres: 'noorder.png', |
||||||
|
imagewxUrl: app.globalData.imageWxImg, |
||||||
|
pageNum: 1, |
||||||
|
pageSize: 10, |
||||||
|
isNoMoreData: false |
||||||
|
} |
||||||
|
}, |
||||||
|
onShow() { |
||||||
|
this.isNoMoreData = false; |
||||||
|
this.agentList = []; |
||||||
|
this.getChildAgentList(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//跳转详情 |
||||||
|
jumpcardlist(item) { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../agentCardList/agentCardList?agid='+item |
||||||
|
}) |
||||||
|
}, |
||||||
|
//添加代理商 |
||||||
|
jumpaddagent() { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../addAgent/addAgent' |
||||||
|
}) |
||||||
|
}, |
||||||
|
//分发 |
||||||
|
jumpcardff(item) { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../agentDistribution/agentDistribution?agentid='+item |
||||||
|
}) |
||||||
|
}, |
||||||
|
onReachBottom() { |
||||||
|
this.getChildAgentList(); |
||||||
|
}, |
||||||
|
//查询列表 |
||||||
|
getChildAgentList() { |
||||||
|
uni.showLoading({ |
||||||
|
title: '加载中...' |
||||||
|
}) |
||||||
|
if (this.isNoMoreData) { |
||||||
|
uni.hideLoading() |
||||||
|
return false; |
||||||
|
} |
||||||
|
let pagenum = this.pageNum; |
||||||
|
let datas = { |
||||||
|
agentId: app.globalData.bresthighAgent.id, |
||||||
|
pageNum: pagenum, |
||||||
|
pageSize: this.pageSize |
||||||
|
} |
||||||
|
getChildAgentList(datas).then(res => { |
||||||
|
if (res.return_code == '000000' && res.return_data.list != '') { |
||||||
|
uni.hideLoading(); |
||||||
|
this.isNoMoreData = res.return_data.list.length == this.pageSize ? false : true; |
||||||
|
this.agentList = this.agentList.concat(res.return_data.list); |
||||||
|
if (res.return_data.total == (this.pageNum * this.pageSize)) { |
||||||
|
this.isNoMoreData = true; |
||||||
|
} |
||||||
|
this.pageNum = res.return_data.list.length == this.pageSize ? ++pagenum : pagenum; |
||||||
|
} else { |
||||||
|
this.agentList = []; |
||||||
|
uni.hideLoading() |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
//禁用 |
||||||
|
changeAgentStatus(item,item1) { |
||||||
|
let that = this; |
||||||
|
uni.showModal({ |
||||||
|
title: '修改状态', |
||||||
|
content: '确认解除或者禁用代理商?', |
||||||
|
success: function(res) { |
||||||
|
if (res.confirm) { |
||||||
|
uni.showLoading({ |
||||||
|
title: '操作中...' |
||||||
|
}) |
||||||
|
let datas = { |
||||||
|
"agentId": item, |
||||||
|
"status": item1 |
||||||
|
} |
||||||
|
changeAgentStatus(datas).then(res => { |
||||||
|
uni.hideLoading(); |
||||||
|
if (res.return_code == '000000') { |
||||||
|
uni.showToast({ |
||||||
|
title: '操作成功', |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
that.pageNum = 1; |
||||||
|
that.isNoMoreData = false; |
||||||
|
that.agentList = []; |
||||||
|
that.getChildAgentList(); |
||||||
|
return; |
||||||
|
} |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
duration: 2000, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="less"> |
||||||
|
page { |
||||||
|
background-color: #f0f0f0; |
||||||
|
} |
||||||
|
|
||||||
|
.list { |
||||||
|
border-radius: 10px; |
||||||
|
align-items: center; |
||||||
|
background: #fff; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.address-box { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
|
||||||
|
.h5xfimg { |
||||||
|
width: 100rpx; |
||||||
|
bottom: 120rpx; |
||||||
|
position: fixed; |
||||||
|
right: 40rpx; |
||||||
|
} |
||||||
|
|
||||||
|
.btnsstu { |
||||||
|
width: 70px; |
||||||
|
height: 30px; |
||||||
|
line-height: 30px; |
||||||
|
color: #ffffff; |
||||||
|
font-size: 14px; |
||||||
|
text-align: center; |
||||||
|
border-radius: 10px; |
||||||
|
margin-right: 10px; |
||||||
|
} |
||||||
|
</style> |
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
After Width: | Height: | Size: 6.2 KiB |
After Width: | Height: | Size: 7.7 KiB |
After Width: | Height: | Size: 10 KiB |