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

待成团页

master
tianyi 1 month ago
parent
da0b8e4b1d
commit
c67fd989d2
1 changed files with 264 additions and 2 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 266
      package1/order/pendGroup.vue

266
package1/order/pendGroup.vue
View File

@ -1,12 +1,274 @@
<template>
<!-- 拼团待成团页 -->
<view class="page1">
<view class="title">
<view class="title-sreach">
<view class="back-btn" @tap="back" :style="{'top': menuButtonInfo.top +'px'}">
<uni-icons type="left" size="28"></uni-icons>
</view>
</view>
</view>
<view class="box1">
<view class="ziqu-xuanfu">
外卖配送
</view>
<view style="width: 100%;line-height: 35px;font-size: 14px;font-weight: 700;">
竹仔园牛仔农庄(第六分店)
</view>
<view style="display: flex;padding: 10px;background: #eee;border-radius: 10px;">
<view class="goods-img">
<img src="/static/images/img/shangpintu.png" alt="">
</view>
<view class="goods-content">
<view class="goods-name">
牛仔农庄(医专店)
</view>
<view class="goods-content-center">
<view>
打分；不要啦
</view>
</view>
<view class="goods-content-bottom">
<view style="width: 45%;">
X1
</view>
<view class="pintuan-left-price">
￥90.00
<view
style="background: rgba(255, 57, 57, 0.2);padding: 0px 6px;border-radius: 10px;margin-left: 10px;">
<text>拼团</text>
<text style="color: red;">￥59.9</text>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="box1" style="position: absolute;top: 400px;left: 2.5%;">
<view class="kaituan1">
<view class="kaituan1-title">
差1人即可成团
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/21b403bd13414ce79ad73cf1c8e3de98.png" alt="" style="width: 60px;height: 11px;position: absolute;bottom: 0;right: 15px;" />
</view>
<view class="kaituan1-title1">
快呼唤小伙伴参加吧！
</view>
</view>
<view class="kaituan2">
<view class="kaituan22">
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/801c569079da4540990c1cc634186fdd.png" alt="" style="width: 45px;height: 45px;border-radius: 45px;margin: 0 auto;display: block;" />
</view>
<view class="kaituan22">
<view class="weipincheng">
+
</view>
</view>
<view class="kaituan22">
<view class="weipincheng">
+
</view>
</view>
</view>
<view class="kaituan3">
剩余<text style="font-size: 16px;font-weight: 700;padding: 0 10px;color: red;">23:59:23</text>结束
</view>
<view class="kaituan4">
分享至微信 <uni-icons type="weixin" size="15"></uni-icons>
</view>
<view class="kaituan5">
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/c1f1b45c98fa4db1a1e5f98b3a0573c2.png" alt="" style="width: 260px;height: 75px;margin: 0 auto;display: block;" />
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
menuButtonInfo: {}
}
},
onLoad(option) {
},
onShow() {
this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
},
methods: {
back() {
uni.navigateBack()
}
}
}
</script>
<style>
<style lang="scss">
page {
width: 100%;
height: 100%;
font-size: 24rpx;
background: #F5F8F5;
color: #00231C;
}
.page1 {
width: 100%;
height: 100%;
font-size: 24rpx;
position: relative;
}
.title {
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/69c894452e924bedbb5a24bf978f47c7.png') no-repeat;
width: 100%;
height: 30%;
background-size: 100%;
}
.title-sreach {
width: 100%;
display: flex;
height: 200rpx;
position: relative;
}
.back-btn {
position: absolute;
bottom: 0;
left: 0;
}
.box1 {
width: 95%;
margin: 0 auto 10px;
background: #fff;
border-radius: 10px;
padding: 10px;
position: absolute;top: 225px;left: 2.5%;
}
.goods-img {
width: 160rpx;
height: 160rpx;
position: relative;
img {
width: 100%;
background-size: 100%;
height: 100%;
}
}
.goods-content {
flex: 1;
padding-left: 20rpx;
}
.goods-name {
font-size: 32rpx;
font-weight: 900;
}
.goods-content-center {
display: flex;
margin: 16rpx 0;
color: #777;
}
.pintuan-left-price {
width: 55%;
text-align: right;
font-weight: 700;
color: #000;
display: flex;
}
.goods-content-bottom {
display: flex;
line-height: 28px;
color: #777;
}
.ziqu-xuanfu {
position: absolute;
top: 0;
right: 0;
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
font-weight: 700;
font-size: 10px;
height: 28px;
width: 60px;
text-align: center;
line-height: 28px;
}
.weipincheng {
width: 45px;
height: 45px;
background: #a6ffea;
border-radius: 45px;
text-align: center;
font-size: 60rpx;
font-weight: 700;
margin-left: -6rpx;
z-index: 97;
color: #02fbdd;
border: 1px solid #a6ffea;
line-height: 40px;
margin: 0 auto;
}
.kaituan1{
display: flex;
height: 35px;
font-size: 22px;
font-weight: 700;
margin-top: 10px;
}
.kaituan1-title{
position: relative;
margin-left: 10px;
}
.kaituan1-title1{
font-size: 12px;
background: rgba(224, 255, 222, 0.65);
border: 1px solid rgba(166, 255, 234, 1);
border-radius: 10px;
height: 22px;
line-height: 19px;
width: 140px;
text-align: center;
margin: 5px 0 0 10px;
}
.kaituan2{
display: flex;
width: 90%;
margin: 20px auto;
}
.kaituan22{
flex: 1;
}
.kaituan3{
height: 40px;
line-height: 40px;
text-align: center;
color: #777;
}
.kaituan4{
width: 95%;
height: 50px;
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
border-radius: 50px;
text-align: center;
line-height: 50px;
font-size: 15px;
font-weight: 700;
margin: 10px auto;
}
.kaituan5{
margin: 40px 0 20px;
}
</style>
Write Preview
Loading…
Cancel
Save