Skip to content

M
mallapp
Commit 5eecc271 authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent a38ab5d0
Hide whitespace changes
Inline Side-by-side
Showing with 662 additions and 735 deletions
components/goods/goodsku.vue
View file @ 5eecc271
...@@ -16,8 +16,7 @@ ...@@ -16,8 +16,7 @@
</view> </view>
</view> </view>
</view> </view>
<scroll-view scroll-y class="sku-box" <scroll-view scroll-y class="sku-box" :style="{'max-height':x.isdateformat==1?'400px':'300px'}">
:style="{'max-height':x.isdateformat==1?'400px':'300px'}">
<view class="sku-item" v-for="(x, i) in g.attr_groups" :key="i" v-if="x.isdateformat==0"> <view class="sku-item" v-for="(x, i) in g.attr_groups" :key="i" v-if="x.isdateformat==0">
<view class="sku-title">{{ x.attr_group_name }} </view> <view class="sku-title">{{ x.attr_group_name }} </view>
<view> <view>
...@@ -31,7 +30,7 @@ ...@@ -31,7 +30,7 @@
</view> </view>
</view> </view>
</view> </view>
<view class="sku-item" v-for="(x, i) in g.attr_groups" v-if="x.isdateformat==1"> <!-- <view class="sku-item" v-for="(x, i) in g.attr_groups" v-if="x.isdateformat==1">
<view class="sku-title">{{ x.attr_group_name }} </view> <view class="sku-title">{{ x.attr_group_name }} </view>
<view> <view>
<view class="sku-chi" :style="{ <view class="sku-chi" :style="{
...@@ -43,15 +42,12 @@ ...@@ -43,15 +42,12 @@
<text class="val">{{ y.attr_name }}</text> <text class="val">{{ y.attr_name }}</text>
</view> </view>
</view> </view>
</view> </view> -->
<view class="sku-item" v-for="(x, i) in g.attr_groups" v-if="x.isdateformat==1"> <view class="sku-item" v-for="(x, i) in g.attr_groups" v-if="x.isdateformat==1">
<!--x.isdateformat=1 改成日历模式 --> <!--x.isdateformat=1 改成日历模式 -->
<view class="sku-title">{{ x.attr_group_name }} </view> <view class="sku-title">{{ x.attr_group_name }} </view>
<view> <view>
<calendar @finish="chosenDateResult" <calendar @finish="chosenDateResult" :defaultDate="x.attr_list[0].attr_name" :immediately="true" :priceList="x.attr_list"></calendar>
:defaultDate="x.attr_list[0].attr_name"
:immediately="true"
:priceList="x.attr_list"></calendar>
</view> </view>
</view> </view>
</scroll-view> </scroll-view>
...@@ -250,11 +246,10 @@ ...@@ -250,11 +246,10 @@
}, },
methods: { methods: {
chosenDateResult(result) { chosenDateResult(result) {
console.log(result,'---') for (let index = 0; index < this.g.attr_groups.length; index++) {
for(let index=0;index<this.g.attr_groups.length;index++){ for (let j = 0; j < this.g.attr_groups[index].attr_list.length; j++) {
for(let j=0;j<this.g.attr_groups[index].attr_list.length;j++){ if (this.g.attr_groups[index].attr_list[j].attr_name == result.start) {
if(this.g.attr_groups[index].attr_list[j].attr_name==result.start){ this.clickSkuItemHandler(j, index)
this.clickSkuItemHandler(j,index)
} }
} }
} }
...@@ -420,8 +415,6 @@ ...@@ -420,8 +415,6 @@
} }
}); });
} }
if (unchosen != '') { if (unchosen != '') {
this.sku = unchosen; this.sku = unchosen;
this.skuObj = null; this.skuObj = null;
...@@ -493,15 +486,13 @@ ...@@ -493,15 +486,13 @@
} }
}); });
} }
console.log("priceSign", priceSign);
console.log("sign", sign);
if (this.g.attr_groups && this.g.attr_groups.length > 0) { if (this.g.attr_groups && this.g.attr_groups.length > 0) {
this.g.attr_groups.forEach((x, index) => { this.g.attr_groups.forEach((x, index) => {
if (x.isdateformat == 1) { if (x.isdateformat == 1) {
if (x.attr_list && x.attr_list.length > 0) { if (x.attr_list && x.attr_list.length > 0) {
x.attr_list.forEach((subItem,subIndex) => { x.attr_list.forEach((subItem, subIndex) => {
var newSign = (subIndex + 1) + ":" + priceSign; var newSign = (subIndex + 1) + ":" + priceSign;
console.log("subItem",subItem);
if (this.g.attr && this.g.attr.length) { if (this.g.attr && this.g.attr.length) {
this.g.attr.forEach(y => { this.g.attr.forEach(y => {
if (y.sign_id == newSign) { if (y.sign_id == newSign) {
...@@ -512,13 +503,10 @@ ...@@ -512,13 +503,10 @@
} }
}) })
} }
console.log("x", x)
} }
}); });
} }
console.log("this.g.attr_groups", this.g.attr_groups) console.log("this.g.attr_groups", this.g.attr_groups)
if (this.g.attr && this.g.attr.length) { if (this.g.attr && this.g.attr.length) {
this.g.attr.forEach(x => { this.g.attr.forEach(x => {
if (x.sign_id == sign) { if (x.sign_id == sign) {
...@@ -526,12 +514,9 @@ ...@@ -526,12 +514,9 @@
} }
}); });
} }
if (this.skuObj != null) { if (this.skuObj != null) {
this.goodimage = this.skuObj.pic_url || this.g.cover_pic; this.goodimage = this.skuObj.pic_url || this.g.cover_pic;
this.goodprice = (parseFloat(this.skuObj.price) * parseFloat(this.gc)).toFixed(2); this.goodprice = (parseFloat(this.skuObj.price) * parseFloat(this.gc)).toFixed(2);
console.log("this.goodprice2", this.goodprice);
this.goodamount = this.skuObj.stock; this.goodamount = this.skuObj.stock;
} }
}, },
......
components/goods/sign/index.vue
View file @ 5eecc271
<template> <template>
<view class="contentBox"> <view class="contentBox">
<scroll-view <scroll-view :scroll-y="true" style="height: 100%; flex: 1; box-sizing: border-box">
:scroll-y="true" <view class="header">
style="height: 100%; flex: 1; box-sizing: border-box" <view class="tabsBox" style="margin-bottom: 20rpx;">
> <view v-for="(item,index) in d" class="fontw100" :class="[active==item.Id?'active':'']" :style="{'color':active==item.Id?mainColor:''}"
<view class="header"> @click="changeHandler(item.Id)">
<view class="tabsBox" style="margin-bottom: 20rpx;"> <view>{{item.Name}}</view>
<view v-for="(item,index) in d" <text class="fontw100" :style="{'color':mainColor}">￥{{item.minprices}}
class="fontw100" <text>起</text>
:class="[active==item.Id?'active':'']" </text>
:style="{'color':active==item.Id?mainColor:''}" <view class="tabsLine" :style="{'background':active==item.Id?mainColor:''}"></view>
@click="changeHandler(item.Id)"> </view>
<view>{{item.Name}}</view> </view>
<text class="fontw100" :style="{'color':mainColor}">￥{{item.minprices}} <view class="week">
<text>起</text> <view>日</view>
</text> <view>一</view>
<view class="tabsLine" :style="{'background':active==item.Id?mainColor:''}"></view> <view>二</view>
</view> <view>三</view>
</view> <view>四</view>
<view class="week"> <view>五</view>
<view>日</view> <view>六</view>
<view>一</view> </view>
<view>二</view> </view>
<view>三</view> <view class="section">
<view>四</view> <view v-for="(res, line) in resDate" class="item" :key="line">
<view>五</view> <template v-if="activeMonth.Month==res.month">
<view>六</view> <!-- <view class="year">{{ res.year }}年{{ res.month }}月</view> -->
</view> <view class="day">
</view> <view v-for="week in res.oneDayWeek" class="day-list" :style="{ width: (dayWidth - 10) / 7 + 'px' }"></view>
<view class="section"> <view @tap="selectDay(line, index, (line + 1).toString() + index)" v-for="(item, index) in res.day" :key="index"
<view v-for="(res, line) in resDate" class="item" :key="line"> class="day-list" :class="[
<template v-if="activeMonth.Month==res.month">
<!-- <view class="year">{{ res.year }}年{{ res.month }}月</view> -->
<view class="day">
<view
v-for="week in res.oneDayWeek"
class="day-list"
:style="{ width: (dayWidth - 10) / 7 + 'px' }"
></view>
<view
@tap="selectDay(line, index, (line + 1).toString() + index)"
v-for="(item, index) in res.day"
:key="index"
class="day-list"
:class="[
line == start[0] && index == start[1] line == start[0] && index == start[1]
? 'bg-orange select-style' ? 'bg-orange select-style'
: '', : '',
...@@ -80,7 +66,7 @@ ...@@ -80,7 +66,7 @@
? 'not-sub' ? 'not-sub'
: '', : '',
]" ]"
:style="{ :style="{
width: (dayWidth - 10) / 7 + 'px', width: (dayWidth - 10) / 7 + 'px',
borderRadius: borderRadius:
line == end[0] && index == end[1] ? '0px 6px 6px 0px' : '', line == end[0] && index == end[1] ? '0px 6px 6px 0px' : '',
...@@ -88,705 +74,661 @@ ...@@ -88,705 +74,661 @@
line == end[0] && index == end[1] ? '#111' : '', line == end[0] && index == end[1] ? '#111' : '',
color: line == end[0] && index == end[1] ? '#FFFFFF' : '', color: line == end[0] && index == end[1] ? '#FFFFFF' : '',
background: line == start[0] && index == start[1]?mainColor:'' background: line == start[0] && index == start[1]?mainColor:''
}" }">
> <view style="padding-top: 2px; padding-bottom: 2px">{{
<view style="padding-top: 2px; padding-bottom: 2px">{{
item item
}}</view> }}</view>
<!-- <view class="select-style" v-if="line == start[0] && index == start[1]">最早</view> <view style="font-size: 12px; padding-bottom: 3px" v-if="priceStauts.length > 0">
<view class="select-style" v-if="line == end[0] && index == end[1]">最晚</view> --> <view v-if="priceStauts[line][index] > 0">￥{{ priceStauts[line][index] }}</view>
<view <view v-if="priceStauts[line][index] < 0">售罄</view>
style="font-size: 12px; padding-bottom: 3px" </view>
v-if="priceStauts.length > 0" </view>
</view>
> </template>
<view v-if="priceStauts[line][index] > 0" </view>
>￥{{ priceStauts[line][index] }}</view </view>
> </scroll-view>
<view v-if="priceStauts[line][index] < 0">售罄</view> <view class="submit" v-if="!immediately">
</view> <button class="sub-btn" :disabled="!isSub" @click="submit">
</view> <text v-if="isSub">确定</text>
</view> <text v-if="!isSub">选择出行时间</text>
</template> </button>
</view> </view>
</view> </view>
</scroll-view>
<view class="submit" v-if="!immediately">
<button class="sub-btn" :disabled="!isSub" @click="submit">
<text v-if="isSub">确定</text>
<text v-if="!isSub">选择出行时间</text>
</button>
</view>
</view>
</template> </template>
<script> <script>
//引入节假日的数据，也可以用后台返回去渲染 //引入节假日的数据，也可以用后台返回去渲染
import json from "./day.js"; import json from "./day.js";
export default {
export default { props: {
props: { priceList: {
priceList: { type: Array,
type: Array, default: [],
default: [], },
}, defaultDate: {
defaultDate: { type: String,
type: String, default: "",
default: "", },
}, title: {
title: { type: String,
type: String, default: "选择日期",
default: "选择日期", },
}, immediately: {
immediately: { type: Boolean,
type: Boolean, default: false,
default: false, },
}, },
}, computed: {
computed: { //房间是否能预订
//房间是否能预订 isSub() {
isSub() { return this.start.length == 2;
return this.start.length == 2; },
}, //计算日历里的节假日
//计算日历里的节假日 resDate() {
resDate() { if (this.date.length == 0) return;
if (this.date.length == 0) return; for (var i = 0; i < this.date.length; i++) {
for (var j = 0; j < this.festival.length; j++) {
for (var i = 0; i < this.date.length; i++) { if (
for (var j = 0; j < this.festival.length; j++) { this.festival[j].year == this.date[i].year &&
if ( this.festival[j].month == this.date[i].month
this.festival[j].year == this.date[i].year && ) {
this.festival[j].month == this.date[i].month for (var k = 0; k < this.festival[j].festival.length; k++) {
) { if (
for (var k = 0; k < this.festival[j].festival.length; k++) { this.date[i].day.indexOf(this.festival[j].festival[k].day) != -1
if ( ) {
this.date[i].day.indexOf(this.festival[j].festival[k].day) != -1 this.date[i].day[
) { this.date[i].day.indexOf(this.festival[j].festival[k].day)
this.date[i].day[ ] = this.festival[j].festival[k].name;
this.date[i].day.indexOf(this.festival[j].festival[k].day) }
] = this.festival[j].festival[k].name; }
} }
} }
} }
} return this.date;
} },
},
return this.date; data() {
}, return {
}, d: [],
data() { mainColor: "",
return { active: 0,
d: [ activeMonth: null,
// {Id:1,Name:'2月'} out: 0,
], festival: json, //节假日
mainColor: "", type: "-", //日期分隔符
active: 0, date: [], //日期数组对象
activeMonth: null, dayWidth: 0, //日期的宽度
out: 0, nowDay: 0, //当前时间的日
festival: json, //节假日 start: [], //入住时间
type: "-", //日期分隔符 count: 6, //显示月的数量
date: [], //日期数组对象 startDay: "", //入住日期
dayWidth: 0, //日期的宽度 startWeek: "", //入住时间的周几
nowDay: 0, //当前时间的日 end: [], //离开时间
start: [], //入住时间
count: 6, //显示月的数量 day: 0, //多少晚
startDay: "", //入住日期 priceStauts: [], //价格状态
startWeek: "", //入住时间的周几 lastNot: [0, 10], //前置的无房操作
end: [], //离开时间 userDefaultDate: "",
endDay: "", //离开日期 };
endWeek: "", //离开时间的周几 },
day: 0, //多少晚 mounted() {
priceStauts: [], //价格状态 this.userDefaultDate = this.defaultDate;
lastNot: [0, 10], //前置的无房操作 uni.getSystemInfo({
userDefaultDate: "", success: (res) => {
}; this.dayWidth = res.windowWidth - 20;
}, },
mounted() { });
this.userDefaultDate = this.defaultDate; this.setDate();
uni.getSystemInfo({ const Dates = new Date()
success: (res) => { var dateTime = new Date();
this.dayWidth = res.windowWidth-20; dateTime = dateTime.setDate(dateTime.getDate() + 1);
}, this.nowDay = new Date(dateTime).getDate();
}); if (this.userDefaultDate != "") {
this.start = this.setDefaultDate(this.userDefaultDate);
this.setDate(); }
const Dates = new Date() this.priceStauts = this.initPrice();
var dateTime = new Date(); this.mainColor = this.$uiConfig.mainColor;
dateTime = dateTime.setDate(dateTime.getDate() + 1); let ThisYearMonth = ''
this.nowDay = new Date(dateTime).getDate(); for (let i = 0; i < 4; i++) {
if (this.userDefaultDate != "") { let Year = Dates.getFullYear()
this.start = this.setDefaultDate(this.userDefaultDate); let Month = Dates.getMonth() + (i + 1)
} if (ThisYearMonth && ThisYearMonth == 12) {
this.priceStauts = this.initPrice(); Year = Dates.getFullYear() + 1
}
this.mainColor = this.$uiConfig.mainColor; if (Month == 12) ThisYearMonth = Month
let ThisYearMonth = '' let obj = {
for(let i=0;i<4;i++){ Id: i,
let Year = Dates.getFullYear() Year,
let Month = Dates.getMonth()+(i+1) Month,
if(ThisYearMonth&&ThisYearMonth==12){ Name: Month + '月',
Year = Dates.getFullYear()+1 prices: [],
} minprices: 0,
if(Month==12) ThisYearMonth = Month }
let obj = { this.d.push(obj)
Id: i, }
Year, for (let i = 0; i < this.priceList.length; i++) {
Month, let datas = this.priceList[i].attr_name.split('-')
Name: Month+'月', for (let j = 0; j < this.d.length; j++) {
prices:[], let m = this.d[j].Month > 9 ? this.d[j].Month : '0' + this.d[j].Month
minprices: 0, if (datas[1] == m) {
} this.d[j].prices.push(this.priceList[i].newPrice)
this.d.push(obj) }
} }
for(let i = 0;i<this.priceList.length;i++){ }
let datas = this.priceList[i].attr_name.split('-') this.d.forEach(x => {
for(let j = 0;j<this.d.length;j++){ x.minprices = Math.min.apply(null, x.prices)
let m = this.d[j].Month>9?this.d[j].Month:'0'+this.d[j].Month })
if(datas[1]==m){ this.activeMonth = this.d[0]
this.d[j].prices.push(this.priceList[i].newPrice) // #ifdef MP-ALIPAY
} uni.setNavigationBarTitle({
} title: "",
} });
this.d.forEach(x=>{ // #endif
x.minprices = Math.min.apply(null,x.prices) },
})
this.activeMonth = this.d[0] watch: {
// #ifdef MP-ALIPAY defaultDate(newVal) {
uni.setNavigationBarTitle({ this.userDefaultDate = newVal;
title: "", if (this.userDefaultDate != "") {
}); this.start = this.setDefaultDate(this.userDefaultDate);
// #endif }
}, this.priceStauts = this.initPrice();
},
watch: { //入住日期
defaultDate(newVal) { start(newVal) {
this.userDefaultDate = newVal; if (this.start.length > 0) {
if (this.userDefaultDate != "") { this.startDay =
this.start = this.setDefaultDate(this.userDefaultDate); this.setMonth(newVal[0]) +
} this.isFestival(newVal[0], newVal[1]) +
this.priceStauts = this.initPrice(); "日";
}, this.startWeek = this.getWeek(
//入住日期 this.date[newVal[0]].year +
start(newVal) { "/" +
if (this.start.length > 0) { this.date[newVal[0]].month +
this.startDay = "/" +
this.setMonth(newVal[0]) + this.isFestival(newVal[0], newVal[1])
this.isFestival(newVal[0], newVal[1]) + );
"日"; }
this.startWeek = this.getWeek(
this.date[newVal[0]].year + if (this.priceStauts.length > 0) {
"/" + console.log(this.lastNot);
this.date[newVal[0]].month + for (var i = newVal[0]; i < this.priceStauts.length; i++) {
"/" + if (i == newVal[0]) {
this.isFestival(newVal[0], newVal[1]) for (var j = newVal[1]; j < this.priceStauts[i].length; j++) {
); if (this.priceStauts[i][j] == -1) {
} this.lastNot = [i, j];
console.log(this.lastNot);
if (this.priceStauts.length > 0) { return;
console.log(this.lastNot); }
for (var i = newVal[0]; i < this.priceStauts.length; i++) { }
if (i == newVal[0]) { } else {
for (var j = newVal[1]; j < this.priceStauts[i].length; j++) { for (var j = 0; j < this.priceStauts[i].length; j++) {
if (this.priceStauts[i][j] == -1) { if (this.priceStauts[i][j] == -1) {
this.lastNot = [i, j]; this.lastNot = [i, j];
console.log(this.lastNot); console.log(this.lastNot);
return; return;
} }
} }
} else { }
for (var j = 0; j < this.priceStauts[i].length; j++) { }
if (this.priceStauts[i][j] == -1) { //清空
this.lastNot = [i, j]; this.lastNot = [];
console.log(this.lastNot); }
return; },
} priceList(newVal) {
} this.priceStauts = this.initPrice();
} }
} },
//清空 methods: {
this.lastNot = []; changeHandler(i) {
} this.active = i;
}, this.$emit('getMonth')
}, this.activeMonth = this.d.find(x => {
methods: { return x.Id == i
changeHandler(i) { })
console.log(i) },
this.active = i; initPrice() {
this.$emit('getMonth') //年份
this.activeMonth = this.d.find(x=>{ var year = new Date().getFullYear();
return x.Id == i let data = [];
}) //月份
var month = new Date().getMonth();
}, for (let i = 0; i < this.count; i++) {
initPrice() { var days = [];
//年份 var week = 0;
var year = new Date().getFullYear(); for (var j = 0; j < new Date(year, month + 1, 0).getDate(); j++) {
let data = []; let isexsit = false;
//月份 this.priceList.forEach((x) => {
var month = new Date().getMonth(); let m = month + 1 > 9 ? month + 1 : "0" + (month + 1);
for (let i = 0; i < this.count; i++) { let d = j + 1 > 9 ? j + 1 : "0" + (j + 1);
var days = []; if (x.attr_name == `${year}-${m}-${d}`) {
var week = 0; isexsit = true;
for (var j = 0; j < new Date(year, month + 1, 0).getDate(); j++) { if (x.newStock > 0) {
let isexsit = false; days.push(x.newPrice);
this.priceList.forEach((x) => { } else {
days.push(-1);
let m = month + 1 > 9 ? month + 1 : "0" + (month + 1); }
let d = j + 1 > 9 ? j + 1 : "0" + (j + 1); }
if (x.attr_name == `${year}-${m}-${d}`) { });
isexsit = true; if (!isexsit) {
if (x.newStock > 0) { days.push(0);
days.push(x.newPrice); }
} else { }
days.push(-1); data.push(days);
} if (month == 11) {
} year += 1;
}); month = 0;
if (!isexsit) { } else {
days.push(0); month++;
} }
} }
data.push(days); return data;
if (month == 11) { },
year += 1; //月份补零
month = 0; setMonth(dateIndex) {
} else { let month = this.date[dateIndex].month;
month++; if (month < 10) {
} month = "0" + month;
} }
return month + "月";
return data; },
}, //如果是节假日名称则返回选择的日期天数
//月份补零 isFestival(line, index, push = false) {
setMonth(dateIndex) { var date = this.date[line].day[index];
let month = this.date[dateIndex].month; if (isNaN(date)) {
if (month < 10) { var newIndex = this.date[line].day.indexOf(date) + 1;
month = "0" + month; if (push) return newIndex;
} return newIndex < 10 ? "0" + newIndex : newIndex;
return month + "月"; } else {
}, if (push) return date;
//如果是节假日名称则返回选择的日期天数 return date < 10 ? "0" + date : date;
isFestival(line, index, push = false) { }
var date = this.date[line].day[index]; },
//获取今天明天的日期
if (isNaN(date)) { getDefaultDate(AddDayCount) {
var newIndex = this.date[line].day.indexOf(date) + 1; var dd = new Date();
if (push) return newIndex; dd.setDate(dd.getDate() + AddDayCount); //获取AddDayCount天后的日期
return newIndex < 10 ? "0" + newIndex : newIndex; var year = dd.getFullYear();
} else { var mon = dd.getMonth() + 1; //获取当前月份的日期
if (push) return date; var day = dd.getDate();
return date < 10 ? "0" + date : date; return year + "-" + mon + "-" + day;
} },
}, //设置入住时间 如果没有传值则根据默认值设置
//获取今天明天的日期 setDefaultDate(data) {
getDefaultDate(AddDayCount) { var arr = [0, parseInt(this.nowDay - 1)];
var dd = new Date(); var start = data.indexOf("-") != -1 ? data.split("-") : data.split("/");
dd.setDate(dd.getDate() + AddDayCount); //获取AddDayCount天后的日期 var year = new Date().getFullYear();
var year = dd.getFullYear(); var month = new Date().getMonth() + 1;
var mon = dd.getMonth() + 1; //获取当前月份的日期 for (var i = 0; i < this.date.length; i++) {
var day = dd.getDate(); if (this.date[i].year == start[0] && this.date[i].month == start[1]) {
return year + "-" + mon + "-" + day; if (year == start[0] && month == start[1] && start[2] < this.nowDay) {
}, arr = [i, parseInt(this.nowDay - 1)];
//设置入住时间 如果没有传值则根据默认值设置 } else {
setDefaultDate(data) { arr = [i, parseInt(start[2] - 1)];
var arr = [0, parseInt(this.nowDay - 1)]; }
break;
var start = data.indexOf("-") != -1 ? data.split("-") : data.split("/"); }
}
var year = new Date().getFullYear(); return arr;
},
var month = new Date().getMonth() + 1; //计算天数
getDay(date1, date2) {
for (var i = 0; i < this.date.length; i++) { //获得天数
if (this.date[i].year == start[0] && this.date[i].month == start[1]) { //date1：开始日期，date2结束日期
if (year == start[0] && month == start[1] && start[2] < this.nowDay) { var a1 = Date.parse(new Date(date1));
arr = [i, parseInt(this.nowDay - 1)]; var a2 = Date.parse(new Date(date2));
} else { var day = parseInt((a2 - a1) / (1000 * 60 * 60 * 24)); //核心：时间戳相减，然后除以天数
arr = [i, parseInt(start[2] - 1)]; return day;
} },
break; //计算周几
} getWeek(date) {
} var weekDay = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
return arr; var myDate = new Date(Date.parse(date));
}, return weekDay[myDate.getDay()];
//清空 },
reset() { //选择入住离开
this.start = []; selectDay(line, index) {
this.end = []; if (this.priceStauts[line][index] == 0) {
this.day = 0; uni.showToast({
}, title: "抱歉，此日期没有报价哦",
//补零操作 icon: "none",
setPull(day) { });
if (day < 10) { } else if (this.priceStauts[line][index] == -1) {
day = "0" + day; uni.showToast({
} title: "该团期已售罄",
return day; icon: "none",
}, });
//计算天数 } else {
getDay(date1, date2) { this.start = [line, index];
//获得天数 }
//date1：开始日期，date2结束日期 if (this.priceStauts[line][index] && this.immediately) {
var a1 = Date.parse(new Date(date1)); this.submit();
var a2 = Date.parse(new Date(date2)); }
var day = parseInt((a2 - a1) / (1000 * 60 * 60 * 24)); //核心：时间戳相减，然后除以天数 },
return day; //设置日历
}, setDate() {
//计算周几 //年份
getWeek(date) { var year = new Date().getFullYear();
var weekDay = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"]; //月份
var myDate = new Date(Date.parse(date)); var month = new Date().getMonth();
return weekDay[myDate.getDay()]; for (let i = 0; i < this.count; i++) {
}, var day = [];
var week = 0;
//选择入住离开 for (var j = 0; j < new Date(year, month + 1, 0).getDate(); j++) {
selectDay(line, index) { day.push(j + 1);
if (this.priceStauts[line][index] == 0) { }
uni.showToast({ this.date.push({
title: "抱歉，此日期没有报价哦", year: year,
icon: "none", month: month + 1,
}); day: day,
} else if (this.priceStauts[line][index] == -1) { oneDayWeek: new Date(
uni.showToast({ Date.parse(year + "/" + (month + 1) + "/" + "01")
title: "该团期已售罄", ).getDay(),
icon: "none", });
}); if (month == 11) {
} else { year += 1;
this.start = [line, index]; month = 0;
} } else {
month++;
if (this.priceStauts[line][index]&&this.immediately) { }
this.submit(); }
} return this.date;
}, },
//设置日历 //确定入住离店事件提交
setDate() { submit() {
//年份 let m = this.activeMonth.Month > 9 ? this.activeMonth.Month : '0' + this.activeMonth.Month; //this.date[0].month>9?this.date[0].month:'0'+this.date[0].month;
var year = new Date().getFullYear(); let d = this.isFestival(this.start[0], this.start[1], true);
d = d > 9 ? d : "0" + d;
//月份 var obj = {
var month = new Date().getMonth(); startWeek: this.startWeek,
console.log("执行了..."); start: this.date[this.start[0]].year + this.type + m + this.type + d,
for (let i = 0; i < this.count; i++) { startDay: m + "-" + d,
var day = []; };
var week = 0; let tempPrice = {};
for (var j = 0; j < new Date(year, month + 1, 0).getDate(); j++) { this.priceList.forEach((x, i) => {
day.push(j + 1); if (obj.start == x.startDate) {
} obj.priceObj = i;
}
this.date.push({ });
year: year, this.$emit("finish", obj);
month: month + 1, },
day: day, },
oneDayWeek: new Date( };
Date.parse(year + "/" + (month + 1) + "/" + "01")
).getDay(),
});
if (month == 11) {
year += 1;
month = 0;
} else {
month++;
}
}
return this.date;
},
//关闭
close() {
uni.navigateBack({
delta: 1,
});
},
//确定入住离店事件提交
submit() {
let m = this.activeMonth.Month>9?this.activeMonth.Month:'0'+this.activeMonth.Month;//this.date[0].month>9?this.date[0].month:'0'+this.date[0].month;
let d = this.isFestival(this.start[0], this.start[1], true);
d = d > 9 ? d : "0" + d;
var obj = {
startWeek: this.startWeek,
start: this.date[this.start[0]].year + this.type + m + this.type + d,
startDay: m + "-" + d,
};
let tempPrice = {};
this.priceList.forEach((x, i) => {
if (obj.start == x.startDate) {
obj.priceObj = i;
}
});
this.$emit("finish", obj);
},
},
};
</script> </script>
<style> <style>
.fontw100{ .fontw100 {
font-weight: 100; font-weight: 100;
} }
.tabsBox{
display: flex; .tabsBox {
} display: flex;
.tabsBox view{ }
width: auto;
display: flex; .tabsBox view {
flex-direction: column; width: auto;
position: relative; display: flex;
margin-right: 60rpx; flex-direction: column;
width: 100%; position: relative;
text-align: center; margin-right: 60rpx;
} width: 100%;
.tabsBox view.active .tabsLine{ text-align: center;
width: 100%; }
position: absolute;
bottom: -4px; .tabsBox view.active .tabsLine {
left: 0; width: 100%;
right: 0; position: absolute;
height: 3px; bottom: -4px;
border-radius: 2px; left: 0;
} right: 0;
.tabsBox view text{ height: 3px;
width: 100%; border-radius: 2px;
font-size: 13px; }
}
/**确认按钮**/ .tabsBox view text {
.submit { width: 100%;
width: 100%; font-size: 13px;
}
background: white;
position: fixed; /**确认按钮**/
bottom: 0upx; .submit {
width: 100%;
height: auto;
} background: white;
position: fixed;
.sub-btn { bottom: 0upx;
height: auto;
border-radius: 10upx; height: auto;
background: #111; }
color: white;
} .sub-btn {
height: auto;
.contentBox { border-radius: 10upx;
height: 100%; background: #111;
margin-top: 10px; color: white;
/* z-index: 999; */ }
}
.contentBox {
/**不能预订**/ height: 100%;
margin-top: 10px;
/* 入住离开时间的color */ /* z-index: 999; */
.bg-orange { }
/* background: #111111 !important; */
border-radius: 6px !important; /**不能预订**/
}
/* 入住离开时间的color */
.bg-higlt-orange { .bg-orange {
background-color: #fff; /* background: #111111 !important; */
} border-radius: 6px !important;
}
/* 节假日的日期样式 */
.is-festival { .bg-higlt-orange {
font-size: 22rpx !important; background-color: #fff;
color: #000 !important; }
}
/* 节假日的日期样式 */
/** 非节假日的日期样式**/ .is-festival {
.not-festival { font-size: 22rpx !important;
font-size: 18upx; color: #000 !important;
color: white; }
}
/** 非节假日的日期样式**/
/***入住离开时间的日历样式*/ .not-festival {
font-size: 18upx;
.not-sub { color: white;
color: #222222; }
background: #dddddd;
} /***入住离开时间的日历样式*/
.select-out-item { .not-sub {
background: #ffffff; color: #222222;
} background: #dddddd;
}
.select-style {
color: white !important; .select-out-item {
font-size: 20rpx !important; background: #ffffff;
/* font-size: 20upx; */ }
/* padding-top: 4upx; */
} .select-style {
color: white !important;
.time-out { font-size: 20rpx !important;
/* text-decoration: line-through; */ /* font-size: 20upx; */
color: #ccc !important; /* padding-top: 4upx; */
} }
/** .time-out {
/* text-decoration: line-through; */
color: #ccc !important;
}
/**
* 点击日期的样式 * 点击日期的样式
*/ */
.bg { .bg {
background: orange; background: orange;
} }
/** /**
* 日期部分 * 日期部分
*/ */
.section { .section {
width: 100%; width: 100%;
/* padding-bottom: 150upx; */ /* padding-bottom: 150upx; */
height: auto; height: auto;
padding-top: 16rpx; padding-top: 16rpx;
background-color: #f1f4f6; background-color: #f1f4f6;
} }
.section > .item > .year { .section>.item>.year {
text-align: center; text-align: center;
height: 50rpx; height: 50rpx;
font-weight: bold; font-weight: bold;
/* padding-left:30upx; /* padding-left:30upx;
padding-right: 30upx; */ padding-right: 30upx; */
font-size: 24rpx; font-size: 24rpx;
line-height: 50rpx; line-height: 50rpx;
color: #1b1d1e; color: #1b1d1e;
} }
.section > .item > .day { .section>.item>.day {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
text-align: center; text-align: center;
margin-left: 5px; margin-left: 5px;
margin-right: 5px; margin-right: 5px;
} }
.section > .item > .day > .day-list { .section>.item>.day>.day-list {
/* margin-top: 30upx; /* margin-top: 30upx;
margin-bottom: 30upx; margin-bottom: 30upx;
min-height: 100upx; min-height: 100upx;
max-height: 180upx; */ max-height: 180upx; */
margin-top: 10upx; margin-top: 10upx;
margin-bottom: 10upx; margin-bottom: 10upx;
min-height: 60upx; min-height: 60upx;
max-height: 100upx; max-height: 100upx;
display: flex; display: flex;
font-size: 26rpx; font-size: 26rpx;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
color: #1b1d1e; color: #1b1d1e;
} }
/** /**
* 头部固定 * 头部固定
*/ */
.header { .header {
position: relative; position: relative;
top: 0; top: 0;
width: 100%; width: 100%;
/* height: 400upx; */ /* height: 400upx; */
background: white; background: white;
box-shadow: 0px 10rpx 30rpx 0px rgba(36, 36, 36, 0.06); box-shadow: 0px 10rpx 30rpx 0px rgba(36, 36, 36, 0.06);
} }
.bar { .bar {
width: 100%; width: 100%;
height: var(--status-bar-height); height: var(--status-bar-height);
background: #222222; background: #222222;
} }
/** /**
* 关闭清空 * 关闭清空
*/ */
.set { .set {
height: 100upx; height: 100upx;
padding-left: 30upx; padding-left: 30upx;
padding-right: 30upx; padding-right: 30upx;
align-items: center; align-items: center;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
/** /**
* 入住离开时间 * 入住离开时间
*/ */
.in-and-out { .in-and-out {
height: 210upx; height: 210upx;
padding-left: 30upx; padding-left: 30upx;
padding-right: 30upx; padding-right: 30upx;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
} }
/** /**
* 入住离开的view * 入住离开的view
*/ */
.in-and-out > .item { .in-and-out>.item {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100upx; height: 100upx;
} }
/** /**
* 未选择入离时间时的文字样式 * 未选择入离时间时的文字样式
*/ */
.in-and-out > .text { .in-and-out>.text {
margin-top: 100upx; margin-top: 100upx;
font-weight: bold; font-weight: bold;
font-size: 36upx; font-size: 36upx;
color: #c0c0c0; color: #c0c0c0;
} }
/** /**
* 一共选择了多少晚的样式 * 一共选择了多少晚的样式
*/ */
.in-and-out > .item > .count-border { .in-and-out>.item>.count-border {
width: 200upx; width: 200upx;
font-size: 28upx; font-size: 28upx;
height: 40upx; height: 40upx;
margin-top: 48upx; margin-top: 48upx;
text-align: center; text-align: center;
} }
.gray { .gray {
color: #c0c0c0; color: #c0c0c0;
border-bottom: 1px solid #c0c0c0; border-bottom: 1px solid #c0c0c0;
} }
.orange { .orange {
color: orange; color: orange;
border-bottom: 1px solid orange; border-bottom: 1px solid orange;
} }
/** /**
* 共多少晚 * 共多少晚
*/ */
.in-and-out > .item > .count-border > .count { .in-and-out>.item>.count-border>.count {
font-size: 10px; font-size: 10px;
} }
/** /**
* 周一到周日 * 周一到周日
*/ */
.week { .week {
/* height: 70upx; */ /* height: 70upx; */
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding-left: 25px; padding-left: 25px;
padding-right: 25px; padding-right: 25px;
padding-top: 10rpx; padding-top: 10rpx;
padding-bottom: 10rpx; padding-bottom: 10rpx;
font-size: 24rpx; font-size: 24rpx;
color: #1b1d1e; color: #1b1d1e;
/* background: #eee; */ /* background: #eee; */
margin-bottom: 16rpx; margin-bottom: 16rpx;
} }
.isa { .isa {
color: red; color: red;
} }
.isa2 { .isa2 {
color: red; color: red;
} }
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment