You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

80 lines
2.1 KiB
Vue

<template>
<view>
<form>
<view class="cu-form-group margin-top">
<view class="title">预约项目</view>
<text>{{reseForm.projectName}}</text>
</view>
<view class="cu-form-group margin-top">
<view class="title">项目价格</view>
<text class="text-price text-red">{{reseForm.peojectMoney}}</text>
</view>
<view class="cu-form-group margin-top">
<view class="title">会员信息</view>
<text >{{reseForm.memberInfo}}</text>
</view>
<view class="cu-form-group">
<view class="title">日期选择</view>
<picker mode="date" :value="reseForm.dateDay" start="09:01" end="21:01" @change="TimeChange">
<view class="picker">
{{reseForm.dateDay}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title">时间选择</view>
<picker mode="time" :value="reseForm.dateTime" start="2015-09-01" end="2020-09-01" @change="DateChange">
<view class="picker">
{{reseForm.dateTime}}
</view>
</picker>
</view>
<view class="cu-form-group margin-top">
<view class="title">备注</view>
</view>
<view class="cu-form-group ">
<textarea maxlength="-1" :disabled="reseForm.remark!=null" @input="textareaAInput" placeholder="在这里填写你的备注"></textarea>
</view>
<button class="cu-btn bg-green shadow-blur round lg" style="width: 90%;margin: 50upx 5%;" type="warn">提交预约</button>
</form>
</view>
</template>
<script>
export default {
data() {
return {
reseForm: {
projectName: "精品美容A套餐",
peojectMoney: 188,
memberInfo: '刘乐乐 - 男',
dateTime: "10:00",
dateDay: "2021-04-01",
remark: null,
},
}
},
methods: {
textareaAInput(e) {
this.reseForm.remark = e.detail.value
},
TimeChange(e) {
this.reseForm.dateDay = e.detail.value
},
DateChange(e) {
this.reseForm.dateTime = e.detail.value
},
},
onLoad: function(option) {
if (option.item != undefined) {
const item = JSON.parse(option.item);
this.reservationForm = item
}
},
}
</script>
<style>
</style>