소스 검색

[增加拼团超时页面]

tags/富茂链客4.1.0
meo 6 년 전
부모
커밋
682d910e22
5개의 변경된 파일339개의 추가작업 그리고 0개의 파일을 삭제
  1. +1
    -0
      app.json
  2. +71
    -0
      pages/spellTimeout/index.js
  3. +5
    -0
      pages/spellTimeout/index.json
  4. +64
    -0
      pages/spellTimeout/index.wxml
  5. +198
    -0
      pages/spellTimeout/index.wxss

+ 1
- 0
app.json 파일 보기

@@ -1,5 +1,6 @@
{
"pages": [
"pages/spellTimeout/index",
"pages/spellDetail/index",
"pages/index/index",
"pages/spellGroup/mySpellGroup/index",


+ 71
- 0
pages/spellTimeout/index.js 파일 보기

@@ -0,0 +1,71 @@
// pages/spellDetail/index.js
var config = require("../../config/config.js");
const Http = require("../../utils/HttpBasics");
const imgurl = require("../../utils/imgurl");
Page({

/**
* 页面的初始数据
*/
data: {
tuanzhang: imgurl.tuanzhang.url,
spellBg: imgurl.spellBg.url,
position: imgurl.position.url,
},

/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {

},

/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {

},

/**
* 生命周期函数--监听页面显示
*/
onShow: function () {

},

/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {

},

/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {

},

/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {

},

/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {

},

/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {

}
})

+ 5
- 0
pages/spellTimeout/index.json 파일 보기

@@ -0,0 +1,5 @@
{
"navigationBarTitleText": "拼团详情",
"usingComponents": {},
"navigationBarBackgroundColor": "#F13C42"
}

+ 64
- 0
pages/spellTimeout/index.wxml 파일 보기

@@ -0,0 +1,64 @@
<!--pages/spellDetail/index.wxml-->
<view class='container'>
<view class='detail'>
<view class='detail-top'>
<view class='detail-top01'>
<image src='{{spellBg}}'></image>
</view>
<view class='detail-top02'>
<view class='title'>100元拼团券</view>
<view class='des'>是打发士大夫撒旦</view>
</view>
<view class='detail-top03'>
<view class='detail-p-name'>拼团价</view>
<view class='detail-p-price'>19.00元</view>
</view>
</view>
<view class='detail-bottom'></view>
</view>
<view class='status'>
<view class='status-top'>
<view class='p-status'>好友的拼团已完成</view>
</view>
<view class='status-center'>
<view class='status-lists'>
<view class='tuanzhang touxiangitems'>
<view class='touxiang'>
<image src='{{spellBg}}'></image>
</view>
<view class='tuan-icon'>
<image src='{{tuanzhang}}'></image>
</view>
</view>
<view class='tuanzhang touxiangitems'>
<view class='touxiang'>
<image src='{{spellBg}}'></image>
</view>
</view>
<view class='tuanzhang touxiangitems'>
<view class='touxiang'>
<image src='{{spellBg}}'></image>
</view>
</view>
<view class='tuanzhang touxiangitems'>
<view class='touxiang'>
<image src='{{spellBg}}'></image>
</view>
</view>
</view>
</view>
<!-- 按钮 -->
<view class='button'>
<button>发起拼团</button>
<button>更多拼团商品</button>
</view>
<view class='status-bottom'>
<view class='position-icon'>
<image src='{{position}}'></image>
</view>
<view class='position'>广场地址:北京市朝阳区东三环中路123号</view>
</view>
</view>
<view class='order'></view>
<view class='edit'></view>
</view>

+ 198
- 0
pages/spellTimeout/index.wxss 파일 보기

@@ -0,0 +1,198 @@
button::after{ border: none; }
page {
height: auto;
overflow: auto;
background: #f89132;
background-image: url('https://s3.cn-northwest-1.amazonaws.com.cn/iformall-net/cimg/spelldetail-bg.png');
background-size: cover;
background-repeat: no-repeat;
}
.status{
width: 690rpx;
padding:25px 0 0;
margin: 24rpx auto 0;
box-sizing: border-box;
background:rgba(255,255,255,1);
border-radius:15rpx;
}
.status-top{
width: 100%;
height: 75rpx;
box-sizing: border-box;
/* overflow: hidden; */
}
.p-status{
font-size:36rpx;
text-align: center;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(119,160,70,1);
line-height: 75rpx;
}
.p-time{
float: right;
font-size:26rpx;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(243,69,58,1);
width: 38rpx;
height: 30rpx;
margin-top: 22rpx;
background:rgba(252,220,221,1);
border-radius:10rpx;
line-height: 30rpx;
text-align: center;
margin: 22rpx 6rpx;
}
.p-mao{
float: right;
font-size:26rpx;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(243,69,58,1);
line-height: 75rpx;
}
.p-text{
float: right;
font-size:26rpx;
font-family:PingFang-SC-Regular;
font-weight:400;
color:rgba(51,51,51,1);
line-height:75rpx;
}
.status-center{
width: 100%;
overflow: hidden;
padding: 20rpx 0;
text-align: center;
}
.tuanzhang{
display: inline-block;
width: 80rpx;
height: 80rpx;
position: relative;
}
.touxiangitems{
margin: 20rpx;
}
.touxiang{
width: 80rpx;
height: 80rpx;
border-radius: 40rpx;
overflow: hidden;
}
.no-touxiang{
width: 80rpx;
height: 80rpx;
overflow: hidden;
background:rgba(252,220,221,1);
border:1rpx solid rgba(243,69,58,1);
border-radius:50%;
box-sizing: border-box;
line-height: 78rpx;
text-align: center;
font-size:32rpx;
font-family:PingFang-SC-Regular;
font-weight:400;
color:rgba(243,69,58,1);
}
.touxiang image{
width: 80rpx;
height: 80rpx;
}
.tuan-icon{
position: absolute;
bottom: 20rpx;
left: 8rpx;
width: 64rpx;
height: 27rpx;
}
.tuan-icon image{
width: 64rpx;
height: 27rpx;
}
.status-bottom{
height: 72rpx;
padding: 0 20rpx;
overflow: hidden;
background:rgba(254,243,232,1);
border-radius:0px 0px 15rpx 15rpx;
}
.position-icon{
width: 38rpx;
float: left;
}
.position-icon image{
width: 27rpx;
height: 37rpx;
margin-top: 17rpx;
}
.position{
font-size:28rpx;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(51,51,51,1);
line-height: 72rpx;
}
.detail{
width: 690rpx;
padding:0 28rpx;
margin: 30rpx auto 0;
box-sizing: border-box;
background:rgba(255,255,255,1);
border-radius:15rpx;
}
.detail-top{
width: 100%;
height: auto;
overflow: hidden;
}
.detail-top01{
float: left;
width: 180rpx;
}
.detail-top01 image{
width: 180rpx;
height: 180rpx;
margin-top: 33rpx;
}
.detail-top02{
width: 208rpx;
float: left;
margin-left: 16rpx;
}
.title{
font-size:30rpx;
font-family:PingFang-SC-Bold;
font-weight:bold;
color:rgba(51,51,51,1);
line-height:44rpx;
margin-top: 30rpx;
}
.des{
font-size:26rpx;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(134,134,134,1);
line-height:40rpx;
}
.detail-top03{
float: left;
}
.button button:nth-of-type(1){
width:520rpx;
height:95rpx;
margin: 30rpx auto 38rpx;
background:linear-gradient(90deg,rgba(248,85,45,1) 0%,rgba(241,60,66,1) 0%,rgba(248,86,46,1) 100%);
border-radius:47rpx;
color: #fff;
}
.button button:nth-of-type(2){
width:520rpx;
height:95rpx;
background:rgba(255,255,255,1);
border:1rpx solid rgba(190,190,190,1);
border-radius:47rpx;
color:#333333;
margin-bottom: 50rpx;
}

불러오는 중...
취소
저장