Commit b1cde49dcbe038b6d2985c7f333cd141c6f9e54e

Authored by vking
1 parent c38fe96b

blue ui other

// components/2.0/reserve/card.js
import util from '../../../utils/util';
import RS from '../../../utils/reserveStatus'
Component({
/**
* 组件的属性列表
*/
properties: {
detail:Object,
seller:Object,
},
/**
* 组件的初始数据
*/
data: {
},
attached(){
//this.init()
},
observers: {
'detail': function() {
this.init()
},
},
/**
* 组件的方法列表
*/
methods: {
init(){
let detail=this.data.detail
if(!detail) return;
detail.tables=[]
detail.room_demand.some(t=>{
detail.tables.push([t.name])
})
detail.ddateStr=util.unixtoTime(detail.ddate,'MM月DD日,`DAY/周WW`')
console.log('detail.init',detail)
this.setData({
reserve:detail,
})
}
}
})
... ...
{
"component": true,
"usingComponents": {}
}
\ No newline at end of file
... ...
<!--components/2.0/reserve/card.wxml-->
<wxs src="../../../utils/util.wxs" module="util" />
<view class="view margin-lr margin-top-sm solid radius padding padding-bottom-lg bg-white text-black" style="box-shadow: 0px 0px 20rpx 0px #EEF0F2;">
<view class="view flex padding-bottom solid-bottom align-center">
<view class="view round margin-right-sm"
style="width: 60rpx;height: 60rpx; background-image: url('{{seller.seller_image}}');">
</view>
<view class="view text-cut flex-treble">
<view class="view text-lg text-cut Medium">{{seller.sellername}}</view>
</view>
<view class="view margin-left-sm text-blue text-lg Medium">
<image src="http://nosqn.colorcun.com/detail/x%20%2815%29.png" style="width:28rpx;height: 30rpx;"></image>
</view>
</view>
<view class="view margin-top">
<view class="view flex align-center" style="margin-bottom: 44rpx;">
<view class="view flex-sub bg-white Medium">预订时间</view>
<view class="view flex-treble text-bold" style="font-size: 36rpx;">
<view class="value">{{reserve.ddateStr}},{{util.reserveTimeSpace(reserve.section)}}</view>
</view>
</view>
<view class="view flex align-center">
<view class="view flex-sub bg-white Medium" style="min-width: 140rpx;">包间类型</view>
<view class="view flex-treble text-bold text-cut" style="font-size: 36rpx;">
{{util.replace(reserve.tables,',',',')}}
</view>
</view>
</view>
</view>
... ...
/* components/2.0/reserve/card.wxss */
@import "../../../colorui/main.wxss";
... ...
... ... @@ -3,7 +3,7 @@ import App from '../../utils/api';
Page({
data:{
remark:'',
buttonbottom:60
buttonbottom:20
},
onLoad(opt){
this.setData({
... ... @@ -40,7 +40,7 @@ Page({
console.log(e,'blur')
this.setData({
remark:this.remark,
buttonbottom:60
buttonbottom:20
})
},
getlabellist(){
... ... @@ -60,7 +60,7 @@ Page({
getboardheight(e){
if(e.detail.height==0){
this.setData({
buttonbottom:30
buttonbottom:20
})
}else{
this.setData({
... ...
<layout>
<page loading="1">
<nav>备注</nav>
<view class="contain" style="height: minheight+'px';overflow-y: scroll;">
<view class="bg-gray textarea-cover">
<textarea placeholder="请输入您的特殊要求,我们会尽量安排" placeholder-class="gray-font font28r" class="black-font font28r" value="{{remark}}" maxlength="25" show-confirm-bar="{{false}}" auto-focus bindinput="inputremark" bindblur="inputblur" adjust-position cursor-spacing="130" bindkeyboardheightchange="getboardheight"></textarea>
<view class="gray-font font24r flex-rr" style="padding-top: 20rpx;">最多输入25个字</view>
<view class="bg_white textarea-cover">
<textarea placeholder="请输入您的要求,我们会尽量安排" placeholder-class="gray-font font28r" class="black-font font28r" value="{{remark}}" maxlength="25" show-confirm-bar="{{false}}" auto-focus bindinput="inputremark" bindblur="inputblur" adjust-position cursor-spacing="130" bindkeyboardheightchange="getboardheight"></textarea>
<view class="gray-font font28r flex-rr" style="padding-top: 20rpx;">{{remark.length}}/25</view>
</view>
<view class="label">
<view class="gray-font font28r">快捷标签</view>
<view class="gray-font font30r">快捷标签</view>
<view class="label-list flex-rs">
<block wx:for="{{labellist}}">
<view class="black-font font28r label-single bg-gray" data-name="{{item.remark}}" bindtap="selectlabel">{{item.remark}}</view>
... ... @@ -14,5 +14,5 @@
</view>
</view>
</view>
<view class="save-button white-font flex-cc font32r" bindtap="save" style="bottom:{{buttonbottom}}px;">保存</view>
</layout>
<view class="save-button white-font flex-cc font32r Semibold" bindtap="save" style="bottom:{{buttonbottom}}px;">保存</view>
</page>
... ...
page{
background: #F9F9F9;
}
.contain{
width:100%;
padding:10rpx 0 180rpx;
}
.textarea-cover{
width: 690rpx;
width: calc(100% - 80rpx);
padding: 20rpx 40rpx;
box-sizing: border-box;
border-radius: 16rpx;
overflow: hidden;
margin: 0 auto 40rpx;
margin: 0 auto 60rpx;
}
textarea,input{
width: 100%;
... ... @@ -20,24 +23,30 @@ input{
}
.label{
width: 100%;
padding:0 10rpx 0 30rpx;
padding:0 10rpx 0 40rpx;
box-sizing: border-box;
}
.label-list{
margin-top: 40rpx;
}
.label-single{
padding:5rpx 20rpx;
line-height: 40rpx;
margin-right: 20rpx;
margin-top: 20rpx;
border-radius:4rpx;
height: 64rpx;
background: #F1F1F1;
border-radius: 32rpx;
line-height: 64rpx;
margin-right: 30rpx;
margin-bottom: 20rpx;
padding: 0 30rpx;
}
.save-button{
width: 690rpx;
height: 80rpx;
background: #C0A369;
width: calc(100% - 80rpx);
height: 84rpx;
background: linear-gradient(90deg, #3BBFF5 0%, #57A0FF 100%);
border-radius: 42rpx;
margin: 0 auto;
position: fixed;
left:0;
right:0;
bottom:60rpx;
bottom:40rpx;
/* transition: bottom .05s ease; */
}
\ No newline at end of file
... ...
... ... @@ -2,7 +2,7 @@
"usingComponents": {
"nav":"/components/nav/nav",
"formids":"/components/formids/formids",
"card":"/components/seller-card/seller-card",
"card":"/components/2.0/reserve/card-review",
"phone":"/components/userinfo/getphone",
"subscribe":"/components/userinfo/subscribe"
}
... ...
<!--pages/reserve/submit.wxml-->
<layout>
<nav hasBack>预订详情</nav>
<view class="pages bg_white" style="padding-bottom: {{paddingBottom}}px;">
<card hasShowStatus hasAddress="{{false}}" bindevent="cardEvent"
hasOnlineReserve
<page loading="1">
<nav hasBack>预订详情</nav>
<card bindclick="editorReserve"
seller="{{seller}}" detail="{{detail}}">
<view slot="opt" class="back flex-rr">
<formids
id="userinfo-share-{{detail.id}}"
bindclick="editorReserve">
<view class="opt-button" wx:if="{{seller}}">修改</view>
</formids>
</view>
</card>
<view class="userinfo">
<view class="userinfo-title flex-lr" catchtap="selectconcat">
<view class="flex-ll">
<image src="../image/concat.jpg" class="concat-icon"></image>
<view class="black-font font36r" style="font-size:36rpx;">选择联系人</view>
</view>
<view class="click-cover">
<image src="../image/click-icon.png"></image>
</view>
</view>
<view class="item flex-lr">
<view class="item-label">姓名</view>
<view class="Medium flex-rr">
<input class="name input" placeholder="请填写用餐人姓名"
<view class="view margin bg-white padding-lr text-df text-666666 userinfo">
<view class="view flex align-center justify-between solid-bottom" style="height: 100rpx;">
<view>填写信息</view>
<view class="text-blue" catchtap="selectconcat">选择预订人</view>
</view>
<view class="view flex align-center justify-between " style="height: 100rpx;">
<image src="http://nosqn.colorcun.com/detail/x%20%2816%29.png" style="width: 40rpx;height: 40rpx;"></image>
<view class="view flex-treble flex align-center margin-left-sm solid-bottom" style="height: 100rpx;">
<input class="name flex-treble" placeholder="请填写预订人姓名"
bindinput="changeInput"
data-key="name"
value="{{user.name}}"
bindkeyboardheightchange="keyboardheightchange"
adjust-position="{{false}}"
bindkeyboardheightchange="keyboardheightchange"
adjust-position="{{false}}"
placeholder-class="input-pl" maxlength="10"/>
<view class="flex-rr switch">
<view
bindtap="changeInput"
data-key="sex"
data-val="1"
class="switch-item {{user.sex==1?'checked':''}}">先生</view>
<view
bindtap="changeInput"
data-key="sex"
data-val="2"
class="switch-item {{user.sex==2?'checked':''}}">女士</view>
<view
bindtap="changeInput"
data-key="sex"
data-val="3"
class="switch-item {{user.sex==3?'checked':''}}">公司</view>
<view class="flex text-30 sex">
<view bindtap="changeInput"
data-key="sex"
data-val="1"
class="switch-item text-bold {{user.sex==1?'checked':''}}">先生</view>
<view bindtap="changeInput"
data-key="sex"
data-val="2"
class="text-bold margin-left-sm {{user.sex==2?'checked':''}}">女士</view>
<view bindtap="changeInput"
data-key="sex"
data-val="3"
class="text-bold margin-left-sm {{user.sex==3?'checked':''}}">公司</view>
</view>
</view>
</view>
<view class="item flex-lr">
<view class="item-label">手机</view>
<view class="Medium flex-lr">
<input class="phone input" placeholder="请填写联系方式"
<view class="view flex align-center justify-between " style="height: 100rpx;">
<image src="http://nosqn.colorcun.com/detail/x%20%2817%29.png" style="width: 40rpx;height: 40rpx;"></image>
<view class="view flex-treble flex align-center margin-left-sm solid-bottom" style="height: 100rpx;">
<input class="phone flex-treble" placeholder="请填写联系方式"
bindinput="changeInput"
data-key="phone"
type="number"
value="{{user.phone}}"
adjust-position="{{false}}"
adjust-position="{{false}}"
placeholder-class="input-pl" maxlength="11"/>
<view class="flex-rr">
<!-- 一键获取 -->
<phone bindgetphone="getphone">
<view class="smooth white-font get-phone flex-vc" style="font-size:28rpx;">一键录入</view>
</phone>
<view class="flex text-30">
<!--
<phone bindgetphone="getphone">
<view class="smooth white-font get-phone flex-vc" style="font-size:28rpx;">一键录入</view>
</phone>
-->
</view>
</view>
</view>
<view class="view flex align-center justify-between" style="height: 100rpx;">
<image src="http://nosqn.colorcun.com/detail/x%20%2818%29.png" style="width: 40rpx;height: 40rpx;"></image>
<view bindtap="toremark" class="view flex-treble flex align-center margin-left-sm {{user.remark?'text-black':''}}">
{{user.remark && user.remark!='' ? user.remark : '您的备注,我们会尽量安排'}}
</view>
</view>
</view>
<view class="item flex-lr">
<view class="item-label" style="margin-left:30rpx;">备注</view>
<view class="Medium flex-rr" bindtap="toremark">
<!-- <input class="cusdem input" placeholder="您的特殊要求,我们会尽量安排(20字)"
bindinput="changeInput"
bindblur="keyboardheightchange"
bindconfirm="keyboardheightchange"
adjust-position="{{false}}"
data-key="remark"
value="{{user.remark}}"
placeholder-class="input-pl" maxlength="25"/> -->
<view class="cusdem input {{user.remark && user.remark!='' ? 'black-font' : 'gray-font'}} font-more" data-key="remark" style="width: 496rpx;">{{user.remark && user.remark!='' ? user.remark : '您的特殊要求,我们会尽量安排'}}</view>
<view class="click-cover" style="padding-right:30rpx;">
<image src="../image/click-icon.png"></image>
</view>
</view>
</view>
<subscribe ids="{{[0,1]}}" bindevent="saved">
<view class="share-but">提交预订</view>
<view class="view share-but bg-blue-blue round margin-lr-lg flex align-center justify-center">
<view class="txt-36-h text-bold">提交预订</view>
</view>
</subscribe>
</view>
</layout>
\ No newline at end of file
</page>
\ No newline at end of file
... ...
/* pages/reserve/submit.wxss */
@import "../../colorui/main.wxss";
page{
background-color: #F9F9F9;
}
.userinfo{
background: #FFFFFF;
box-shadow: 0px 0px 30rpx 0px #E5E5E5;
border-radius: 20rpx;
}
.sex .checked{
position: relative;
color:var(--blue);
}
.sex .checked:after{
width: 24rpx;
height: 14rpx;
background-size: 100% 100%;
background-image: url("http://nosqn.colorcun.com/detail/x%20%281%29.png");
position: absolute;
content: "";
bottom:-18rpx;
left:calc(50% - 12rpx);
}
.share-but{
position: fixed;
bottom: 40rpx;
height: 84rpx;
width: calc(100% - 80rpx);
}
/*
.pages{
padding: 30rpx;
width: calc(100% - 60rpx);
... ... @@ -111,4 +141,5 @@
}
.cusdem{
width:100%;
}
\ No newline at end of file
}
*/
\ No newline at end of file
... ...
... ... @@ -755,6 +755,12 @@
"pathName": "pages/reserve/reserve",
"query": "id=1&activeTab=reserve&_date=2020-02-16&_pnum=6",
"scene": null
},
{
"name": "pages/reserve/remark",
"pathName": "pages/reserve/remark",
"query": "remark=远离卫生间,尽量安静,尽量靠窗",
"scene": null
}
]
}
... ...
... ... @@ -103,6 +103,7 @@ module.exports = {
return ['','满减','满赠','折扣','代金券'][parseInt(typeId)]||'会员价';
},
replace:function(str,find,rep=''){
return str.toString().replace(find,rep);
if(!str) return ""
return (str.toString()).replace(find,rep);
}
};
\ No newline at end of file
... ...