需求页面基本完成

master
许宏杰 3 years ago
parent c7e5ab645a
commit ea34afc967

@ -15,7 +15,8 @@
"pages/store/index",
"pages/yuding/index",
"pages/confirmyd/index",
"pages/dingdan/index"
"pages/dingdan/index",
"pages/dingdanInfo/index"
],
"requiredPrivateInfos": [
"getLocation",
@ -69,7 +70,8 @@
"van-calendar": "@vant/weapp/calendar/index",
"van-button": "@vant/weapp/button/index",
"tabBar":"navBar/index",
"my-navBar":"/navBar/index"
"my-navBar":"/navBar/index",
"van-share-sheet": "@vant/weapp/share-sheet/index"
},
"sitemapLocation": "sitemap.json"
}

@ -39,6 +39,14 @@ Page({
})
console.log(e)
},
onClick(){
this.setData({
yingdi:false,
})
wx.setNavigationBarTitle({
title: "营地列表",
});
},
showYd(){
this.setData({
yingdi:true,

@ -50,7 +50,7 @@
</view>
<view class="yingdi-search">
<van-search value="{{ value }}" placeholder="请输入搜索关键词" use-action-slot bind:change="onChange" bind:search="onSearch" custom-class="input-css">
<view slot="action" bind:tap="onClick" class="yi-search">搜索</view>
<view slot="action" bind:tap="onClick" class="yi-search">完成</view>
</van-search>
</view>
</view>

@ -22,13 +22,18 @@ Page({
active:parseInt(options.tabsIndex)
})
},
clickItem(){
wx.navigateTo({
url: '/pages/dingdanInfo/index',
})
},
goBack(){
wx.navigateBack()
},
clickTabs(e){
let index = e.currentTarget.dataset.index
this.setData({
navTabsIndex:index
navTabsIndex:index,
})
},
/**

@ -14,7 +14,7 @@
<van-tabs active="{{ active }}" color="#446C4C" swipeable line-width="30px" line-height="4px">
<van-tab title="{{item}}" wx:for="{{activeList}}" wx:key="index">
<view class="er-tabs-list">
<view class="er-tabs-item">
<view class="er-tabs-item" bindtap="clickItem">
<view class="er-item-top">
<view class="item-icon">
<image src="http://img.xizhihk.com/IlRpxMTY2MTA5MjAwMDE1MyMxNzAjanBn.jpg" mode="aspectFill"></image>

@ -0,0 +1,66 @@
// pages/dingdanInfo/index.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})

@ -0,0 +1,6 @@
{
"usingComponents": {
"van-field": "@vant/weapp/field/index"
},
"navigationBarTitleText": "订单详情"
}

@ -0,0 +1,52 @@
<!--pages/dingdanInfo/index.wxml-->
<view class="top">
<view class="dingdan-result">
<view class="result-title">已取消</view>
<view class="result-subtitle">用户超时未支付,订单自动取消</view>
</view>
<view class="dingdan-item-data">
<view class="item-data-iamge">
<image src="http://img.xizhihk.com/IlRpxMTY2MTA5MjAwMDE1MyMxNzAjanBn.jpg" mode="aspectFill"></image>
</view>
<view class="item-data-text">
<view class="data-text-title">六角天幕</view>
<view class="data-text-subtitle">2022-8-23</view>
</view>
<view class="item-data-price">
<view class="price-zj">
<text>¥</text>
<text>980.00</text>
</view>
<view class="price-beishu">×1</view>
</view>
</view>
<view class="jiesuan">
<text>总价:</text>
<text>¥</text>
<text>980.00</text>
</view>
</view>
<view class="middle">
<view class="info-title">入住详情</view>
<view class="info-data">
<van-cell-group >
<van-field input-class="input-boxed" value="许先生" label="姓名" readonly border="{{ false }}" />
<van-field input-class="input-boxed" value="1593719××××" label="手机号" readonly border="{{ false }}" />
<van-field input-class="input-boxed" value="记录第一次露营" label="订单备注" readonly border="{{ false }}" />
</van-cell-group>
</view>
</view>
<view class="bottom">
<view class="info-title">订单详情</view>
<view class="info-data dingdan">
<van-cell-group >
<van-field input-class="input-boxed" value="123456789987456123" label="订单编号" readonly border="{{ false }}" />
<van-field input-class="input-boxed" value="2022-08-23 15:30" label="下单时间" readonly border="{{ false }}" />
<van-field input-class="input-boxed" value="2022-08-23 16:08" label="取消时间" readonly border="{{ false }}" />
<van-field input-class="input-boxed" value="¥980.00" label="总价" readonly border="{{ false }}" />
<van-field input-class="input-boxed" value="¥980.00" label="实价" readonly border="{{ false }}" />
</van-cell-group>
</view>
</view>

@ -0,0 +1,127 @@
/* pages/dingdanInfo/index.wxss */
page{
background: #F6F6F6;
box-sizing: border-box;
padding: 30rpx 20rpx;
}
.top{
width: 100%;
min-height: 300rpx;
background: #fff;
border-radius: 8rpx;
box-sizing: border-box;
padding: 20rpx;
}
.middle,.bottom{
margin-top: 30rpx;
}
.info-title{
font-size: 28rpx;
color: #333;
font-weight: 400;
font-family: "Alibaba-PuHuiTi-Medium.otf";
margin-bottom: 10rpx;
}
.info-data{
width: 100%;
min-height: 150rpx;
background: #fff;
border-radius: 8rpx;
box-sizing: border-box;
padding: 6rpx;
}
.dingdan{
min-height: 250rpx;
}
.dingdan-result{
box-sizing: border-box;
border-bottom: 1px solid rgb(238, 236, 236);
}
.result-title{
font-size: 40rpx;
color: #446C4C;
font-family: "Alibaba-PuHuiTi-Medium.otf";
font-weight: 500;
}
.result-subtitle{
margin: 10rpx 0;
font-size: 22rpx;
color: #999;
font-size: 400;
}
.dingdan-item-data{
display: flex;
margin-top: 20rpx;
}
.item-data-iamge{
width: 130rpx;
height: 90rpx;
overflow: hidden;
}
.item-data-iamge image{
height: 100%;
width: 100%;
display: block;
}
.item-data-text{
flex: 1;
box-sizing: border-box;
padding-left: 20rpx;
}
.data-text-title{
font-size: 26rpx;
font-family: "Alibaba-PuHuiTi-Regular.otf";
color: #333;
font-weight: 500;
}
.data-text-subtitle{
font-size: 22rpx;
color: #999;
font-weight: 400;
}
.price-zj{
color: #999;
}
.price-zj text:nth-child(1){
font-size: 20rpx;
}
.price-zj text:nth-child(2){
font-size: 26rpx;
}
.price-beishu{
text-align: right;
font-size: 20rpx;
color: #999;
}
.jiesuan{
text-align: right;
margin-top: 10rpx;
}
.jiesuan text:nth-child(1){
color: #333;
font-family: "Alibaba-PuHuiTi-Regular.otf";
font-size: 24rpx;
}
.jiesuan text:nth-child(2){
font-size: 20rpx;
color: #446C4C;
}
.jiesuan text:nth-child(3){
font-size: 32rpx;
color: #446C4C;
}
.van-cell {
padding: 10rpx 30rpx !important;
}
.van-field__label{
font-size: 26rpx !important;
color: #999 !important;
font-family: "Alibaba-PuHuiTi-Regular.otf" !important;
}
.input-boxed{
color:#333;
font-size: 24rpx;
border: 1px solid;
}

@ -28,7 +28,13 @@ Page({
{name:'周五',day:'8-26',state:0,stateTitle:'雷阵雨'},
{name:'周六',day:'8-27',state:0,stateTitle:'大雨'},
{name:'周日',day:'8-28',state:0,stateTitle:'中雨'},
]
],
options: [
{ name: '微信', icon: 'http://www.jichuanglanhai.com/demo/js-yingdi/images/wx.png', openType: 'share' },
{ name: '朋友圈', icon: 'http://www.jichuanglanhai.com/demo/js-yingdi/images/pengyou.png' },
{ name: '复制链接', icon: 'http://www.jichuanglanhai.com/demo/js-yingdi/images/lianjie.png' },
{ name: '生成分享图', icon: 'http://www.jichuanglanhai.com/demo/js-yingdi/images/tu.png' },
],
},
/**
@ -49,6 +55,10 @@ Page({
popupShow:true
})
},
onSelect(event) {
Toast(event.detail.name);
this.onClose();
},
//关闭分享面板
onClose(){
this.setData({

@ -261,7 +261,14 @@
</view>
<!-- 分享弹出层 -->
<van-popup show="{{ popupShow }}" position="bottom" bind:close="onClose" custom-class="popup-custom">
<van-share-sheet
show="{{ popupShow }}"
title="立即分享给好友"
options="{{ options }}"
bind:select="onSelect"
bind:close="onClose"
/>
<!-- <van-popup show="{{ popupShow }}" position="bottom" bind:close="onClose" custom-class="popup-custom">
<view class="popup-title">分享至</view>
<view class="popup-btn-box">
<view class="popup-item">
@ -292,7 +299,7 @@
<view class="popup-close-btn">
<button class="close-buttom" bindtap="onClose">取消</button>
</view>
</van-popup>
</van-popup> -->
<!-- 天气弹出层 -->
<van-popup show="{{ weatherShow }}" position="bottom" custom-class="weather-popup-custom" bind:close="weatherClose">
<view class="weather-popup">

@ -106,6 +106,13 @@
"query": "",
"launchMode": "default",
"scene": null
},
{
"name": "",
"pathName": "pages/dingdanInfo/index",
"query": "",
"launchMode": "default",
"scene": null
}
]
}

Loading…
Cancel
Save