Skip to content

J
jz_Travel
Commit c10f4a9c authored by 罗超's avatar 罗超
Browse files
Options

1

parent 82e02052
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 2318 additions and 0 deletions
pages/ticketCoupons/buyNotice.vue 0 → 100644
View file @ c10f4a9c
<template>
<view style="height: 100vh; overflow: hidden;width:100vw;">
<scroll-view scroll-y="true" style="width: 100%;height: 100%;" @scroll="scroll">
<view style="height: 700rpx;position: relative;z-index: 1;" :style="{'opacity':(100-boxOption)+'%'}">
<view @click="goback" :style="[titleStyle,{opacity:'100% !important'}]" style="position: fixed;top: 0;left: 0;z-index: 9; padding-left: 6rpx;">
<u-icon name="arrow-left" size="44" color="#000" style="margin-top: 22rpx;"></u-icon>
</view>
<image class="banner-img" :src="imgBaseUrl+details.AllPicList[0].TagPicList[0].Path" mode="aspectFit" @click="goUrl"></image>
</view>
<view class="ticket-title" :style="[titleStyleFix]">
<view @click="goback">
<u-icon name="arrow-left" size="44"></u-icon>
</view>
<view style="flex: 1;margin-left: 30rpx; text-align: left;'background-color':'#000'">{{details.Name}}</view>
</view>
<view class="notice-box">
<view class="base-info">
<image class="left" :src="imgBaseUrl+details.AllPicList[0].TagPicList[0].Path" mode="aspectFit" ></image>
<view class="right">
<view class="name">
{{details.Name}}
</view>
<view class="evaluate">
<u-rate size="24rpx" inactive-color="#FFF" :current="details.ScoreNum" active-icon="star" disabled active-color="#F8632F"></u-rate>
<view class="rate">
{{details.ScoreNum}}
<text v-if="details.ScoreNum===1||details.ScoreNum===2||details.ScoreNum===3||details.ScoreNum===4||details.ScoreNum===5">.0</text>
</view>
<view class="comment">
128人评论
<u-icon name="arrow-right" color="#6E6E6E" size="24rpx"></u-icon>
</view>
</view>
<view class="sell">
已售1000票
</view>
</view>
</view>
<view class="detail-info">
<view class="ticket-title">
购买须知
<text class="ticket-title-bg"></text>
</view>
<view class="detail-info-item">
<view class="item-name">
可订时间
</view>
<view class="item-desc">
可订今日
</view>
</view>
<view class="detail-info-item">
<view class="item-name">
出票速度
</view>
<view class="item-desc">
平均2秒出票
</view>
</view>
<view class="detail-info-item">
<view class="item-name">
无需换票
</view>
<view class="item-desc">
无需换票，持【身份证】直接进入
</view>
</view>
<!-- 退票政策 -->
<view class="method">
<view class="method-title">
<!-- <image src="" mode=""></image> -->
<view class="">
</view>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
</template>
<script>
let timer
export default {
components: {
},
data() {
return {
ID: 0,
details: {},
typeList: [{
Id: 0,
Name: '视频'
}, {
Id: 1,
Name: '图片'
}],
boxOption: 0,
navsOption: 0,
titleStyle: {},
titleStyleFix:{},
active: 0,
mainColor: '',
controls: false, //显示默认控件
videoContext: '',
checkTicketNavIndex: 1,
imgBaseUrl: ""
}
},
onLoad(options) {
let that = this
if (options && options.id) {
this.ID = options.id
this.Date=options.Date
this.getDetail()
}
this.imgBaseUrl = "http://192.168.20.214:8130"
uni.getSystemInfo({
success(res) {
that.titleStyle = {
height: "45px",
paddingTop: `${res.statusBarHeight}px`,
opacity: "0%"
};
that.titleStyleFix = {
height: "45px",
position: 'fixed',
top: '0',
left: '0',
paddingTop: `${res.statusBarHeight}px`,
'background-color': '#f6f6f6',
opacity: "0%"
}
},
});
this.mainColor = this.$uiConfig.mainColor;
},
methods: {
goUrl() {
uni.navigateTo({
url: "/pages/ticketCoupons/imgList?id=" + this.ID,
})
},
//获取详情
getDetail() {
this.request2({
url: '/api/AppletDining/GetTicketCouponsDetails',
data: {
ID: this.ID,
buyDate:this.Date
}
},
res => {
if (res.resultCode == 1) {
res.data.ScenicSpotTag = res.data.ScenicSpotTag.split(',')
res.data.GeographicTag = res.data.GeographicTag.split(',')
this.details = res.data;
console.log(this.details)
if (res.data.VideoUrl == '') {
this.active = 1
};
this.details.imgs = []
// this.details.BannerList.forEach(x=>{
// let obj= {
// name:x
// }
// this.details.imgs.push(obj)
// })
}
}
);
},
changeHandler(i) {
this.active = i;
},
previewImage(i) {
console.log(i)
uni.previewImage({
urls: this.details.BannerList,
current: i,
longPressActions: {
itemList: ["发送给朋友", "保存图片", "收藏"],
success: function(data) {},
fail: function(err) {
console.log(err.errMsg);
},
},
});
},
scroll(e) {
this.boxOption = Math.floor((e.detail.scrollTop - 50) / 1.5);
this.titleStyle.opacity = ((e.detail.scrollTop - 100) < 0 ? 0 : Math.floor(e.detail.scrollTop - 100)) +
"%";
this.tooltipShow = false
this.titleStyleFix.opacity = ((e.detail.scrollTop - 100) < 0 ? 0 : Math.floor(e.detail.scrollTop - 100)) +
"%";
this.$forceUpdate()
},
goback() {
uni.navigateBack({
delta: 1,
});
},
}
}
</script>
<style lang="scss" scoped>
.banner-img {
width: 750rpx;
height: 700rpx;
background-color: #f6f6f6;
}
.ticket-title {
line-height: 45px !important;
font-size: 16px;
text-align: center;
position: fixed;
left: 0;
top: 0;
width: 100%;
color: #111;
box-sizing: content-box;
z-index: 5;
display: flex;
align-items: center;
background-color: #f6f6f6;
padding-left: 6rpx;
}
.notice-box {
border-radius: 40rpx 40rpx 0rpx 0rpx;
padding: 45rpx 45rpx 0 45rpx;
background-color: #FFFFFF;
height: 900rpx;
position: relative;
top: -100rpx;
z-index: 10;
.base-info{
// height: 175rpx;
display: flex;
padding-bottom: 35rpx;
border-bottom: 1rpx solid #E7E7E7;
.left{
width: 130rpx;
height: 130rpx;
border-radius: 20rpx;
}
.right{
margin-left: 50rpx;
.name{
font-size: 34rpx;
font-family: PingFang SC;
font-weight: bold;
color: #1B1D1E;
margin-bottom: 20rpx;
}
.evaluate{
margin-bottom:20rpx;
display: flex;
align-items: center;
.rate{
margin: 0 10rpx;
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
color: #6E6E6E;
}
.comment{
display: flex;
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
color: #6E6E6E;
}
}
.sell{
width: 150rpx;
height: 40rpx;
background-color: #ECF1F4;
border-radius: 4rpx;
font-size: 22rpx;
font-family: PingFang SC;
font-weight: 500;
color: #111111;
text-align: center;
line-height: 40rpx;
}
}
}
.detail-info{
.ticket-title {
// width: 70rpx;
height: 50rpx;
font-size: 34rpx;
font-family: PingFang SC;
font-weight: bold;
color: #1F1F1F;
background-color: transparent;
// line-height: 44rpx;
position: relative;
margin: 40rpx 0;
.ticket-title-bg {
width: 70rpx;
height: 10rpx;
background-color: #DFBE6E;
border-radius: 4px;
position: absolute;
left: 0;
bottom: 6rpx;
z-index: 1;
opacity: 0.6;
}
}
.detail-info-item{
display: flex;
margin-bottom: 30rpx;
.item-name{
width: 120rpx;
height: 40rpx;
background-color: #111111;
border-radius: 4rpx;
font-size: 24rpx;
font-family: PingFang SC;
font-weight: bold;
color: #DFBE6E;
margin-right: 45rpx;
text-align: center;
line-height: 40rpx;
}
.item-desc{
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 800;
color: #111111;
}
}
.method{
width: 660rpx;
height: 225rpx;
background-color: #DFBE6E;
opacity: 0.1;
border-radius: 4rpx;
}
}
}
</style>
pages/ticketCoupons/components/njzz-calendar/njzz-calendar.vue 0 → 100644
View file @ c10f4a9c
This diff is collapsed.
pages/ticketCoupons/components/uni-calendar/calendar.js 0 → 100644
View file @ c10f4a9c
This diff is collapsed.
pages/ticketCoupons/components/uni-calendar/uni-calendar-item.vue 0 → 100644
View file @ c10f4a9c
<template>
<view class="uni-calendar-item__weeks-box" :class="{
'uni-calendar-item--disable':weeks.disable,
'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
'uni-calendar-item--checked':(calendar.fullDate === weeks.fullDate && !weeks.isDay) ,
'uni-calendar-item--before-checked':weeks.beforeMultiple,
'uni-calendar-item--multiple': weeks.multiple,
'uni-calendar-item--after-checked':weeks.afterMultiple,
}"
@click="choiceDate(weeks)">
<view class="uni-calendar-item__weeks-box-item">
<text v-if="selected&&weeks.extraInfo" class="uni-calendar-item__weeks-box-circle"></text>
<text class="uni-calendar-item__weeks-box-text" :class="{
'uni-calendar-item--isDay-text': weeks.isDay,
'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
'uni-calendar-item--before-checked':weeks.beforeMultiple,
'uni-calendar-item--multiple': weeks.multiple,
'uni-calendar-item--after-checked':weeks.afterMultiple,
'uni-calendar-item--disable':weeks.disable,
}">{{weeks.date}}</text>
<text v-if="!lunar&&!weeks.extraInfo && weeks.isDay" class="uni-calendar-item__weeks-lunar-text" :class="{
'uni-calendar-item--isDay-text':weeks.isDay,
'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
'uni-calendar-item--before-checked':weeks.beforeMultiple,
'uni-calendar-item--multiple': weeks.multiple,
'uni-calendar-item--after-checked':weeks.afterMultiple,
}">今天</text>
<text v-if="lunar&&!weeks.extraInfo" class="uni-calendar-item__weeks-lunar-text" :class="{
'uni-calendar-item--isDay-text':weeks.isDay,
'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
'uni-calendar-item--before-checked':weeks.beforeMultiple,
'uni-calendar-item--multiple': weeks.multiple,
'uni-calendar-item--after-checked':weeks.afterMultiple,
'uni-calendar-item--disable':weeks.disable,
}">{{weeks.isDay?'今天': (weeks.lunar.IDayCn === '初一'?weeks.lunar.IMonthCn:weeks.lunar.IDayCn)}}</text>
<text v-if="weeks.extraInfo&&weeks.extraInfo.info" class="uni-calendar-item__weeks-lunar-text" :class="{
'uni-calendar-item--extra':weeks.extraInfo.info,
'uni-calendar-item--isDay-text':weeks.isDay,
'uni-calendar-item--isDay':calendar.fullDate === weeks.fullDate && weeks.isDay,
'uni-calendar-item--checked':calendar.fullDate === weeks.fullDate && !weeks.isDay,
'uni-calendar-item--before-checked':weeks.beforeMultiple,
'uni-calendar-item--multiple': weeks.multiple,
'uni-calendar-item--after-checked':weeks.afterMultiple,
'uni-calendar-item--disable':weeks.disable,
}">{{weeks.extraInfo.info}}</text>
</view>
</view>
</template>
<script>
export default {
props: {
weeks: {
type: Object,
default () {
return {}
}
},
calendar: {
type: Object,
default: () => {
return {}
}
},
selected: {
type: Array,
default: () => {
return []
}
},
lunar: {
type: Boolean,
default: false
}
},
methods: {
choiceDate(weeks) {
this.$emit('change', weeks)
}
}
}
</script>
<style lang="scss" scoped>
.uni-calendar-item__weeks-box {
flex: 1;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
justify-content: center;
align-items: center;
}
.uni-calendar-item__weeks-box-text {
font-size: $uni-font-size-base;
color: $uni-text-color;
}
.uni-calendar-item__weeks-lunar-text {
font-size: $uni-font-size-sm;
color: $uni-text-color;
}
.uni-calendar-item__weeks-box-item {
position: relative;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: column;
justify-content: center;
align-items: center;
width: 100rpx;
height: 100rpx;
}
.uni-calendar-item__weeks-box-circle {
position: absolute;
top: 5px;
right: 5px;
width: 8px;
height: 8px;
border-radius: 8px;
background-color: $uni-color-error;
}
.uni-calendar-item--disable {
background-color: rgba(249, 249, 249, $uni-opacity-disabled);
color: $uni-text-color-disable;
}
.uni-calendar-item--isDay-text {
color: $uni-color-primary;
}
.uni-calendar-item--isDay {
background-color: $uni-color-primary;
opacity: 0.8;
color: #fff;
}
.uni-calendar-item--extra {
color: $uni-color-error;
opacity: 0.8;
}
.uni-calendar-item--checked {
background-color: $uni-color-primary;
color: #fff;
opacity: 0.8;
}
.uni-calendar-item--multiple {
background-color: $uni-color-primary;
color: #fff;
opacity: 0.8;
}
.uni-calendar-item--before-checked {
background-color: #ff5a5f;
color: #fff;
}
.uni-calendar-item--after-checked {
background-color: #ff5a5f;
color: #fff;
}
</style>
pages/ticketCoupons/components/uni-calendar/uni-calendar.vue 0 → 100644
View file @ c10f4a9c
This diff is collapsed.
pages/ticketCoupons/components/uni-calendar/util.js 0 → 100644
View file @ c10f4a9c
import CALENDAR from './calendar.js'
class Calendar {
constructor({
date,
selected,
startDate,
endDate,
range
} = {}) {
// 当前日期
this.date = this.getDate(new Date()) // 当前初入日期
// 打点信息
this.selected = selected || [];
// 范围开始
this.startDate = startDate
// 范围结束
this.endDate = endDate
this.range = range
// 多选状态
this.cleanMultipleStatus()
// 每周日期
this.weeks = {}
// this._getWeek(this.date.fullDate)
}
/**
* 设置日期
* @param {Object} date
*/
setDate(date) {
this.selectDate = this.getDate(date)
this._getWeek(this.selectDate.fullDate)
}
/**
* 清理多选状态
*/
cleanMultipleStatus() {
this.multipleStatus = {
before: '',
after: '',
data: []
}
}
/**
* 重置开始日期
*/
resetSatrtDate(startDate) {
// 范围开始
this.startDate = startDate
}
/**
* 重置结束日期
*/
resetEndDate(endDate) {
// 范围结束
this.endDate = endDate
}
/**
* 获取任意时间
*/
getDate(date, AddDayCount = 0, str = 'day') {
if (!date) {
date = new Date()
}
if (typeof date !== 'object') {
date = date.replace(/-/g, '/')
}
const dd = new Date(date)
switch (str) {
case 'day':
dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期
break
case 'month':
if (dd.getDate() === 31) {
dd.setDate(dd.getDate() + AddDayCount)
} else {
dd.setMonth(dd.getMonth() + AddDayCount) // 获取AddDayCount天后的日期
}
break
case 'year':
dd.setFullYear(dd.getFullYear() + AddDayCount) // 获取AddDayCount天后的日期
break
}
const y = dd.getFullYear()
const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期，不足10补0
const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号，不足10补0
return {
fullDate: y + '-' + m + '-' + d,
year: y,
month: m,
date: d,
day: dd.getDay()
}
}
/**
* 获取上月剩余天数
*/
_getLastMonthDays(firstDay, full) {
let dateArr = []
for (let i = firstDay; i > 0; i--) {
const beforeDate = new Date(full.year, full.month - 1, -i + 1).getDate()
dateArr.push({
date: beforeDate,
month: full.month - 1,
lunar: this.getlunar(full.year, full.month - 1, beforeDate),
disable: true
})
}
return dateArr
}
/**
* 获取本月天数
*/
_currentMonthDys(dateData, full) {
let dateArr = []
let fullDate = this.date.fullDate
for (let i = 1; i <= dateData; i++) {
let isinfo = false
let nowDate = full.year + '-' + (full.month < 10 ?
full.month : full.month) + '-' + (i < 10 ?
'0' + i : i)
// 是否今天
let isDay = fullDate === nowDate
// 获取打点信息
let info = this.selected && this.selected.find((item) => {
if (this.dateEqual(nowDate, item.date)) {
return item
}
})
// 日期禁用
let disableBefore = true
let disableAfter = true
if (this.startDate) {
let dateCompBefore = this.dateCompare(this.startDate, fullDate)
disableBefore = this.dateCompare(dateCompBefore ? this.startDate : fullDate, nowDate)
}
if (this.endDate) {
let dateCompAfter = this.dateCompare(fullDate, this.endDate)
disableAfter = this.dateCompare(nowDate, dateCompAfter ? this.endDate : fullDate)
}
let multiples = this.multipleStatus.data
let checked = false
let multiplesStatus = -1
if (this.range) {
if (multiples) {
multiplesStatus = multiples.findIndex((item) => {
return this.dateEqual(item, nowDate)
})
}
if (multiplesStatus !== -1) {
checked = true
}
}
let data = {
fullDate: nowDate,
year: full.year,
date: i,
multiple: this.range ? checked : false,
beforeMultiple: this.dateEqual(this.multipleStatus.before, nowDate),
afterMultiple: this.dateEqual(this.multipleStatus.after, nowDate),
month: full.month,
lunar: this.getlunar(full.year, full.month, i),
disable: !disableBefore || !disableAfter,
isDay
}
if (info) {
data.extraInfo = info
}
dateArr.push(data)
}
return dateArr
}
/**
* 获取下月天数
*/
_getNextMonthDays(surplus, full) {
let dateArr = []
for (let i = 1; i < surplus + 1; i++) {
dateArr.push({
date: i,
month: Number(full.month) + 1,
lunar: this.getlunar(full.year, Number(full.month) + 1, i),
disable: true
})
}
return dateArr
}
/**
* 获取当前日期详情
* @param {Object} date
*/
getInfo(date) {
if (!date) {
date = new Date()
}
const dateInfo = this.canlender.find(item => item.fullDate === this.getDate(date).fullDate)
return dateInfo
}
/**
* 比较时间大小
*/
dateCompare(startDate, endDate) {
// 计算截止时间
startDate = new Date(startDate.replace('-', '/').replace('-', '/'))
// 计算详细项的截止时间
endDate = new Date(endDate.replace('-', '/').replace('-', '/'))
if (startDate <= endDate) {
return true
} else {
return false
}
}
/**
* 比较时间是否相等
*/
dateEqual(before, after) {
// 计算截止时间
before = new Date(before.replace('-', '/').replace('-', '/'))
// 计算详细项的截止时间
after = new Date(after.replace('-', '/').replace('-', '/'))
if (before.getTime() - after.getTime() === 0) {
return true
} else {
return false
}
}
/**
* 获取日期范围内所有日期
* @param {Object} begin
* @param {Object} end
*/
geDateAll(begin, end) {
var arr = []
var ab = begin.split('-')
var ae = end.split('-')
var db = new Date()
db.setFullYear(ab[0], ab[1] - 1, ab[2])
var de = new Date()
de.setFullYear(ae[0], ae[1] - 1, ae[2])
var unixDb = db.getTime() - 24 * 60 * 60 * 1000
var unixDe = de.getTime() - 24 * 60 * 60 * 1000
for (var k = unixDb; k <= unixDe;) {
k = k + 24 * 60 * 60 * 1000
arr.push(this.getDate(new Date(parseInt(k))).fullDate)
}
return arr
}
/**
* 计算阴历日期显示
*/
getlunar(year, month, date) {
return CALENDAR.solar2lunar(year, month, date)
}
/**
* 设置打点
*/
setSelectInfo(data, value) {
this.selected = value
this._getWeek(data)
}
/**
* 获取多选状态
*/
setMultiple(fullDate) {
let {
before,
after
} = this.multipleStatus
if (!this.range) return
if (before && after) {
this.multipleStatus.before = ''
this.multipleStatus.after = ''
this.multipleStatus.data = []
} else {
if (!before) {
this.multipleStatus.before = fullDate
} else {
this.multipleStatus.after = fullDate
if (this.dateCompare(this.multipleStatus.before, this.multipleStatus.after)) {
this.multipleStatus.data = this.geDateAll(this.multipleStatus.before, this.multipleStatus.after);
} else {
this.multipleStatus.data = this.geDateAll(this.multipleStatus.after, this.multipleStatus.before);
}
}
}
this._getWeek(fullDate)
}
/**
* 获取每周数据
* @param {Object} dateData
*/
_getWeek(dateData) {
const {
fullDate,
year,
month,
date,
day
} = this.getDate(dateData)
let firstDay = new Date(year, month - 1, 1).getDay()
let currentDay = new Date(year, month, 0).getDate()
let dates = {
lastMonthDays: this._getLastMonthDays(firstDay, this.getDate(dateData)), // 上个月末尾几天
currentMonthDys: this._currentMonthDys(currentDay, this.getDate(dateData)), // 本月天数
nextMonthDays: [], // 下个月开始几天
weeks: []
}
let canlender = []
const surplus = 42 - (dates.lastMonthDays.length + dates.currentMonthDys.length)
dates.nextMonthDays = this._getNextMonthDays(surplus, this.getDate(dateData))
canlender = canlender.concat(dates.lastMonthDays, dates.currentMonthDys, dates.nextMonthDays)
let weeks = {}
// 拼接数组 上个月开始几天 + 本月天数+ 下个月开始几天
for (let i = 0; i < canlender.length; i++) {
if (i % 7 === 0) {
weeks[parseInt(i / 7)] = new Array(7)
}
weeks[parseInt(i / 7)][i % 7] = canlender[i]
}
this.canlender = canlender
this.weeks = weeks
}
//静态方法
// static init(date) {
// if (!this.instance) {
// this.instance = new Calendar(date);
// }
// return this.instance;
// }
}
export default Calendar
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