root
/
school_uni
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

首页

master
tianyi 1 month ago
parent
f176e74fff
commit
febdc41715
1 changed files with 151 additions and 32 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 179
      pages/index/index.vue

179
pages/index/index.vue
View File

@ -5,21 +5,31 @@
<!-- <map id="map" style="width: 100%; height: 300px;" :latitude="latitude" :longitude="longitude" <!-- <map id="map" style="width: 100%; height: 300px;" :latitude="latitude" :longitude="longitude"
:markers="markers" :polyline="polyline"></map> --> :markers="markers" :polyline="polyline"></map> -->
<view style="position: relative;height: 545rpx;"> <view style="position: relative;height: 545rpx;">
<view style="position: absolute;top: 55px;left: 10px;z-index: 999;">
<view @click="checkArea" v-if="areaName == ''">
点击选择区域
<uni-icons type="right" size="12" style="margin-left: 10rpx;"></uni-icons>
</view>
<view @click="checkArea" v-else>
{{areaName}}
<uni-icons type="right" size="12" style="margin-left: 10rpx;"></uni-icons>
</view>
</view>
<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay" <swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay"
:interval="interval" :duration="duration"> :interval="interval" :duration="duration">
<swiper-item> <swiper-item>
<img src="/static/images/img/toutu.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/eaae29a344a241b3b46e7b91882ca197.png" alt="" />
</swiper-item> </swiper-item>
<swiper-item> <swiper-item>
<img src="/static/images/img/toutu.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/eaae29a344a241b3b46e7b91882ca197.png" alt="" />
</swiper-item> </swiper-item>
<swiper-item> <swiper-item>
<img src="/static/images/img/toutu.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/eaae29a344a241b3b46e7b91882ca197.png" alt="" />
</swiper-item> </swiper-item>
</swiper> </swiper>
<view class="order-msg-box"> <view class="order-msg-box">
<view class="order-msg-left"> <view class="order-msg-left">
<img src="/static/images/img/motuo.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/bf2bb7f80e17428391c407aef769517a.png" alt="" />
</view> </view>
<view class="order-msg-center"> <view class="order-msg-center">
<view style="font-weight: 700;font-size: 30rpx;line-height: 30px;margin-top: 5%;">配送员正在赶往商家 <view style="font-weight: 700;font-size: 30rpx;line-height: 30px;margin-top: 5%;">配送员正在赶往商家
@ -27,42 +37,42 @@
<view style="font-size: 24rpx;">预计<text style="color: red;">12:03-12:30</text>送达</view> <view style="font-size: 24rpx;">预计<text style="color: red;">12:03-12:30</text>送达</view>
</view> </view>
<view class="order-msg-right"> <view class="order-msg-right">
<img src="/static/images/img/chakan.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/579569bfcc954f52baea06f6f11951be.png" alt="" />
</view> </view>
</view> </view>
<view class="menu-box"> <view class="menu-box">
<view class="menu-list"> <view class="menu-list" @tap="goDetail('1')">
<img src="/static/images/img/paotui.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/7690c4f897604fca804ea932bc3c1239.png" alt="" />
<view class="menu-name">跑腿/快递</view> <view class="menu-name">跑腿/快递</view>
</view> </view>
<view class="menu-list" style="position: relative;"> <view class="menu-list" @tap="goDetail('2')" style="position: relative;">
<img src="/static/images/img/pintuan.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/553230c20dea4e5c85f1e396058a7493.png" alt="" />
<img src="/static/images/img/pintuanjiaobiao.png" alt="" <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/1a02b40d853a4cfdb062fff44ec49e6a.png" alt=""
style="position: absolute;top: -16rpx;right: 0;width: 88rpx;height: 36rpx;"> style="position: absolute;top: -16rpx;right: 0;width: 88rpx;height: 36rpx;">
<view class="menu-name">拼团</view> <view class="menu-name">拼团</view>
</view> </view>
<view class="menu-list"> <view class="menu-list" @tap="goDetail('3')">
<img src="/static/images/img/nongchang.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/a2f41e2d45cb4d418d273f6e9ceafff0.png" alt="" />
<view class="menu-name">农场</view> <view class="menu-name">农场</view>
</view> </view>
<view class="menu-list"> <view class="menu-list" @tap="goDetail('4')">
<img src="/static/images/img/niudan.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/41cfb56caff4419b94b69d0f2303b602.png" alt="" />
<view class="menu-name">扭蛋机</view> <view class="menu-name">扭蛋机</view>
</view> </view>
<view class="menu-list"> <view class="menu-list" @tap="goDetail('5')">
<img src="/static/images/img/ie.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/a083b7d159264bbc967034088fa7eb3a.png" alt="" />
<view class="menu-name">ie浏览器</view> <view class="menu-name">ie浏览器</view>
</view> </view>
</view> </view>
<view class="like-box"> <view class="like-box">
<view class="like-title"> <view class="like-title">
<img src="/static/images/img/cainixihuan.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/e0c44bc9b69a46559d3aa4160d3cf4a5.png" alt="" />
</view> </view>
<view class="like-content-box"> <view class="like-content-box">
<view class="like-left"> <view class="like-left">
<view class="like-content-title"> <view class="like-content-title">
<view style="width: 100%;font-weight: 700;">爆品拼团</view> <view style="width: 100%;font-weight: 700;">爆品拼团</view>
<img src="/static/images/img/baopinchaodijia.png" alt="" <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/0eeb2e28f84a43a0aefddd8edb430d73.png" alt=""
style="width: 140rpx;height: 64rpx;position: absolute;top: -16rpx;left: 40%;" /> style="width: 140rpx;height: 64rpx;position: absolute;top: -16rpx;left: 40%;" />
<img src="/static/images/img/yousanjiao.png" alt="" <img src="/static/images/img/yousanjiao.png" alt=""
style="width: 28rpx;height: 28rpx;position: absolute;top: 20rpx;right: 12rpx;"> style="width: 28rpx;height: 28rpx;position: absolute;top: 20rpx;right: 12rpx;">
@ -105,7 +115,7 @@
<view class="like-left"> <view class="like-left">
<view class="like-content-title"> <view class="like-content-title">
<view style="font-weight: 700;">爆品拼团</view> <view style="font-weight: 700;">爆品拼团</view>
<img src="/static/images/img/baopinchaodijia.png" alt="" <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/0eeb2e28f84a43a0aefddd8edb430d73.png" alt=""
style="width: 140rpx;height: 64rpx;position: absolute;top: -16rpx;left: 40%;" /> style="width: 140rpx;height: 64rpx;position: absolute;top: -16rpx;left: 40%;" />
<img src="/static/images/img/yousanjiao.png" alt="" <img src="/static/images/img/yousanjiao.png" alt=""
style="width: 28rpx;height: 28rpx;position: absolute;top: 20rpx;right: 12rpx;"> style="width: 28rpx;height: 28rpx;position: absolute;top: 20rpx;right: 12rpx;">
@ -154,9 +164,14 @@
<text <text
style="position: absolute;top: 0;right: 0;font-size: 36rpx;font-weight: 700;">(31)</text> style="position: absolute;top: 0;right: 0;font-size: 36rpx;font-weight: 700;">(31)</text>
</view> </view>
<view style="font-size: 30rpx;font-weight: 700;margin-left: 60rpx;color: #777;"> <view class="like-title" style="position: relative;width:300rpx;">
代取快递/跑腿 (9) <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/99162216d23a44a8ba81c7cb5249f3b8.png" alt="">
<text
style="position: absolute;top: 0;right: 0;font-size: 36rpx;font-weight: 700;">(9)</text>
</view> </view>
<!-- <view style="font-size: 30rpx;font-weight: 700;margin-left: 60rpx;color: #777;">
代取快递/跑腿 (9)
</view> -->
</view> </view>
<view class="daimai-list"> <view class="daimai-list">
<view class="list-1"> <view class="list-1">
@ -198,7 +213,7 @@
<view class="qu-song"> <view class="qu-song">
<view class="qu-box"> <view class="qu-box">
<view class='qu-tu'> <view class='qu-tu'>
<img src="/static/images/img/quhuo.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/1f77398a73454a6595c12a3c18731599.png" alt="" />
</view> </view>
<view class="qu-text"> <view class="qu-text">
<view class="qu-left"> <view class="qu-left">
@ -211,7 +226,7 @@
</view> </view>
<view class="qu-box" style="margin-top:10rpx;"> <view class="qu-box" style="margin-top:10rpx;">
<view class='qu-tu'> <view class='qu-tu'>
<img src="/static/images/img/shouhuo.png" alt="" /> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/d0764fb4138747769538cf1cafa3b017.png" alt="" />
</view> </view>
<view class="qu-text"> <view class="qu-text">
<view class="qu-left"> <view class="qu-left">
@ -262,17 +277,27 @@
</view> </view>
</view> </view>
<view class="qiangdan-btn"> <view class="qiangdan-btn">
<img src="/static/images/img/qiangdan.png" alt=""> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/1b8b815302a34902ac79a76a469e4ee6.png" alt="">
</view> </view>
</view> </view>
<view class="list-1"> <view class="list-1">
<view class="display:flex;">
<view class="daoda-time"> <view class="daoda-time">
送达时间：02-02 18:02 送达时间：02-02 18:02
</view> </view>
<view class="order-page"> <view class="paotui-title">
<view class="maotou"> <view class="paotui-text">
#<text>021</text> 取件码:1-2-9830
</view>
<view class="paotui-num">
3个
</view> </view>
<view>
<uni-icons type="right" size="12"></uni-icons>
</view>
</view>
</view>
<view class="order-page">
<view class="shangjia"> <view class="shangjia">
<!-- <view class="shangjialogo"> <!-- <view class="shangjialogo">
<img src="/static/images/img/shangjialogo.png" alt="" /> <img src="/static/images/img/shangjialogo.png" alt="" />
@ -368,7 +393,7 @@
</view> </view>
</view> </view>
<view class="qiangdan-btn"> <view class="qiangdan-btn">
<img src="/static/images/img/qiangdan.png" alt=""> <img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/1b8b815302a34902ac79a76a469e4ee6.png" alt="">
</view> </view>
</view> </view>
</view> </view>
@ -386,6 +411,17 @@
<my-center></my-center> <my-center></my-center>
</view> </view>
</view> </view>
<!-- 弹出区域选择 -->
<uni-popup ref="areaPopup" background-color="#fff">
<view class="popup-area-content">
<view class="popup-area-title">
<text>请选择所属区域</text>
</view>
<view class="popup-area-container" v-for="(item,index) in areaList" @tap="onClickArea(item)">
<text style="display: inline-block">{{item.title}}</text>
</view>
</view>
</uni-popup>
<tab-bar :width="width" @tab-index="changeIndex" :currentIndex="currentIndex"></tab-bar> <tab-bar :width="width" @tab-index="changeIndex" :currentIndex="currentIndex"></tab-bar>
</view> </view>
</template> </template>
@ -397,6 +433,7 @@
export default { export default {
data() { data() {
return { return {
areaName:'',
indicatorDots: false, indicatorDots: false,
autoplay: true, autoplay: true,
interval: 4000, interval: 4000,
@ -417,7 +454,8 @@
name: '代取快递/跑腿', name: '代取快递/跑腿',
isCheck: false isCheck: false
}], }],
dataList: [] dataList: [],
areaList:[]
} }
}, },
components: { components: {
@ -439,8 +477,49 @@
that.width = info.screenWidth * 2; that.width = info.screenWidth * 2;
} }
}); });
if(!uni.getStorageSync('area')){
this.checkArea()
console.log("11111")
}else{
let area = JSON.parse(uni.getStorageSync('area'))
this.areaName = area.title
}
}, },
methods: { methods: {
goDetail(type){
let url = ''
switch (type) {
case '1':
url = ''
break;
case '2':
url = '/package1/group/groupBuyList'
break;
case '3':
url = ''
break;
case '4':
url = ''
break;
}
uni.navigateTo({
url: url
})
},
onClickArea(item){
uni.setStorageSync('area',JSON.stringify(item))
this.$refs.areaPopup.close()
},
checkArea(){
this.tui.request("/app/shopArea/getByParentId/0", "get", {}, false, false).then((res) => {
if (res.code == 200) {
this.areaList = res.result
this.$refs.areaPopup.open()
} else {
this.tui.toast(res.message)
}
})
},
// 获取用户位置 // 获取用户位置
getUserLocation() { getUserLocation() {
uni.getLocation({ uni.getLocation({
@ -602,7 +681,7 @@
border-radius: 40rpx; border-radius: 40rpx;
border: 2px solid #A6FFEA; border: 2px solid #A6FFEA;
background: #fff; background: #fff;
z-index: 999; z-index: 99;
position: absolute; position: absolute;
left: 5%; left: 5%;
bottom: 0; bottom: 0;
@ -828,6 +907,7 @@
position: absolute; position: absolute;
top: 10rpx; top: 10rpx;
left: 10rpx; left: 10rpx;
font-weight: 700;
} }
.list-text { .list-text {
@ -1012,4 +1092,43 @@
background-size: 100%; background-size: 100%;
} }
} }
.paotui-title{
display: flex;
flex: 1;
}
.paotui-text{
font-size: 14px;
color: red;
font-weight: bold;
}
.paotui-num{
font-size: 12px;
}
.popup-area-content {
align-items: center;
justify-content: center;
padding: 15px;
width: 500rpx;
height: auto;
background-color: #fff;
}
.popup-area-title {
font-size: 36rpx;
font-weight: bold;
text-align: center;
position: relative;
}
.popup-area-container {
margin-top: 20rpx;
height: 100rpx;
border-radius: 10px;
background: #088FEB;
line-height: 100rpx;
text-align: center;
border-bottom: 1px solid #eee;
border-top: 1px solid #eee;
color: #fff;
}
</style> </style>
Write Preview
Loading…
Cancel
Save