机票时长默认自动计算，可修改
This commit is contained in:
tangxinyue
parent
c6dcc7ab4d
commit
3da8a73f1d
|
|
@ -86,10 +86,10 @@
|
|||
<text class="label">到达机场</text>
|
||||
<input class="input" v-model="ticketsInfo.flightInfo.endAirport" />
|
||||
</view>
|
||||
<!-- <view class="form-item">
|
||||
<view class="form-item">
|
||||
<text class="label">时长</text>
|
||||
<input class="input" v-model="ticketsInfo.flightInfo.duration" placeholder="例: 2时5分" />
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="form-item">
|
||||
<text class="label">机型</text>
|
||||
<input class="input" v-model="ticketsInfo.flightInfo.aircraftType" />
|
||||
|
|
@ -218,7 +218,8 @@
|
|||
<text class="label">等级</text>
|
||||
<view class="input"
|
||||
:style="{ color: !ticketsInfo.ctripOrderInfo.level ? '#999' : '#333' }">
|
||||
{{ getLevelLabel(ticketsInfo.ctripOrderInfo.level) || '请选择等级' }}</view>
|
||||
{{ getLevelLabel(ticketsInfo.ctripOrderInfo.level) || '请选择等级' }}
|
||||
</view>
|
||||
</view>
|
||||
</picker>
|
||||
<view class="tips-container">
|
||||
|
|
@ -255,15 +256,21 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import NavBar from '@/components/nav-bar/nav-bar.vue'
|
||||
import { reactive, toRefs, onMounted } from 'vue';
|
||||
import { onLoad } from '@dcloudio/uni-app';
|
||||
import defualtData from '@/pages/other/air-tickets/commom/defualt.json';
|
||||
import airlineJson from '@/static/json/air-line.json';
|
||||
import NavBar from '@/components/nav-bar/nav-bar.vue'
|
||||
import {
|
||||
reactive,
|
||||
toRefs,
|
||||
onMounted
|
||||
} from 'vue';
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app';
|
||||
import defualtData from '@/pages/other/air-tickets/commom/defualt.json';
|
||||
import airlineJson from '@/static/json/air-line.json';
|
||||
|
||||
const airLineList = airlineJson.airLine;
|
||||
const airLineList = airlineJson.airLine;
|
||||
|
||||
const data = reactive({
|
||||
const data = reactive({
|
||||
ticketsInfo: JSON.parse(JSON.stringify(defualtData)),
|
||||
collapsed: {
|
||||
orderInfo: false,
|
||||
|
|
@ -278,22 +285,25 @@ const data = reactive({
|
|||
offsetY: 0,
|
||||
itemHeight: 0
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
const { ticketsInfo, collapsed, dragInfo } = toRefs(data)
|
||||
const {
|
||||
ticketsInfo,
|
||||
collapsed,
|
||||
dragInfo
|
||||
} = toRefs(data)
|
||||
|
||||
const onAirlineChange = (e) => {
|
||||
const onAirlineChange = (e) => {
|
||||
const index = e.detail.value;
|
||||
const selected = airLineList[index];
|
||||
if (selected) {
|
||||
data.ticketsInfo.flightInfo.airline = selected.name;
|
||||
data.ticketsInfo.flightInfo.airlineCode = selected.code;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//携程会员等级
|
||||
const ctripLevelList = [
|
||||
{
|
||||
//携程会员等级
|
||||
const ctripLevelList = [{
|
||||
label: "白银",
|
||||
value: 1
|
||||
},
|
||||
|
|
@ -309,21 +319,21 @@ const ctripLevelList = [
|
|||
label: "钻石",
|
||||
value: 4
|
||||
}
|
||||
]
|
||||
]
|
||||
|
||||
const onLevelChange = (e) => {
|
||||
const onLevelChange = (e) => {
|
||||
const index = e.detail.value;
|
||||
ticketsInfo.value.ctripOrderInfo.level = ctripLevelList[index].value;
|
||||
}
|
||||
}
|
||||
|
||||
const getLevelLabel = (value) => {
|
||||
const getLevelLabel = (value) => {
|
||||
const item = ctripLevelList.find(i => i.value == value);
|
||||
return item ? item.label : '';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
const addTip = () => {
|
||||
const addTip = () => {
|
||||
if (!ticketsInfo.value.ctripOrderInfo.tips) {
|
||||
ticketsInfo.value.ctripOrderInfo.tips = []
|
||||
}
|
||||
|
|
@ -331,13 +341,13 @@ const addTip = () => {
|
|||
id: Date.now().toString(),
|
||||
content: ''
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const removeTip = (index) => {
|
||||
const removeTip = (index) => {
|
||||
ticketsInfo.value.ctripOrderInfo.tips.splice(index, 1)
|
||||
}
|
||||
}
|
||||
|
||||
const addFliggyTip = () => {
|
||||
const addFliggyTip = () => {
|
||||
if (!ticketsInfo.value.fligggyOrderInfo.tips) {
|
||||
ticketsInfo.value.fligggyOrderInfo.tips = []
|
||||
}
|
||||
|
|
@ -345,16 +355,16 @@ const addFliggyTip = () => {
|
|||
id: Date.now().toString(),
|
||||
content: ''
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const removeFliggyTip = (index) => {
|
||||
const removeFliggyTip = (index) => {
|
||||
ticketsInfo.value.fligggyOrderInfo.tips.splice(index, 1)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Drag Sorting Logic
|
||||
let dragTimer = null
|
||||
const onDragStart = (e, index, type) => {
|
||||
// Drag Sorting Logic
|
||||
let dragTimer = null
|
||||
const onDragStart = (e, index, type) => {
|
||||
const touch = e.touches[0]
|
||||
// Get item height first - assuming fixed height or query first item
|
||||
// Better to query the specific item height
|
||||
|
|
@ -370,9 +380,9 @@ const onDragStart = (e, index, type) => {
|
|||
dragInfo.value.offsetY = 0
|
||||
}
|
||||
}).exec()
|
||||
}
|
||||
}
|
||||
|
||||
const onDragMove = (e) => {
|
||||
const onDragMove = (e) => {
|
||||
if (dragInfo.value.index === -1) return
|
||||
const touch = e.touches[0]
|
||||
const deltaY = touch.clientY - dragInfo.value.startY
|
||||
|
|
@ -409,16 +419,16 @@ const onDragMove = (e) => {
|
|||
dragInfo.value.offsetY = 0
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const onDragEnd = () => {
|
||||
const onDragEnd = () => {
|
||||
dragInfo.value.index = -1
|
||||
dragInfo.value.listType = ''
|
||||
dragInfo.value.offsetY = 0
|
||||
}
|
||||
}
|
||||
|
||||
// 深度合并函数
|
||||
const deepMerge = (target, source) => {
|
||||
// 深度合并函数
|
||||
const deepMerge = (target, source) => {
|
||||
for (const key in source) {
|
||||
if (source[key] && typeof source[key] === 'object' && !Array.isArray(source[key])) {
|
||||
if (!target[key] || typeof target[key] !== 'object') {
|
||||
|
|
@ -430,9 +440,9 @@ const deepMerge = (target, source) => {
|
|||
}
|
||||
}
|
||||
return target;
|
||||
};
|
||||
};
|
||||
|
||||
onLoad((options) => {
|
||||
onLoad((options) => {
|
||||
console.log('options', options)
|
||||
if (options.storageKey) {
|
||||
data.storageKey = options.storageKey
|
||||
|
|
@ -462,13 +472,13 @@ onLoad((options) => {
|
|||
data.ticketsInfo.ctripOrderInfo.tips = []
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
const toggleSection = (key) => {
|
||||
const toggleSection = (key) => {
|
||||
data.collapsed[key] = !data.collapsed[key]
|
||||
}
|
||||
}
|
||||
|
||||
const handleRightButtonClick = () => {
|
||||
const handleRightButtonClick = () => {
|
||||
const orderInfo = data.ticketsInfo.orderInfo;
|
||||
const flightInfo = data.ticketsInfo.flightInfo;
|
||||
|
||||
|
|
@ -499,9 +509,9 @@ const handleRightButtonClick = () => {
|
|||
icon: 'success'
|
||||
})
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
|
||||
const addPassenger = () => {
|
||||
const addPassenger = () => {
|
||||
const lastP = data.ticketsInfo.passengersInfo[data.ticketsInfo.passengersInfo.length - 1]
|
||||
data.ticketsInfo.passengersInfo.push({
|
||||
name: '新乘客',
|
||||
|
|
@ -509,9 +519,9 @@ const addPassenger = () => {
|
|||
idNumber: lastP ? lastP.idNumber : '123123********6352',
|
||||
ticketNo: lastP ? lastP.ticketNo : '12345678901'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const removePassenger = (index) => {
|
||||
const removePassenger = (index) => {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定要删除该乘客吗？',
|
||||
|
|
@ -521,18 +531,18 @@ const removePassenger = (index) => {
|
|||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// Helper to extract YYYY-MM-DD from YYYY-MM-DD HH:mm or similar
|
||||
const getDateFromStr = (str) => {
|
||||
// Helper to extract YYYY-MM-DD from YYYY-MM-DD HH:mm or similar
|
||||
const getDateFromStr = (str) => {
|
||||
if (!str) return ''
|
||||
// Try to match date pattern
|
||||
const dateMatch = str.match(/\d{4}[-.]\d{2}[-.]\d{2}/)
|
||||
if (dateMatch) return dateMatch[0].replace(/\./g, '-')
|
||||
return ''
|
||||
}
|
||||
}
|
||||
|
||||
const onOrderDateChange = (e) => {
|
||||
const onOrderDateChange = (e) => {
|
||||
const val = e.detail.value // YYYY-MM-DD
|
||||
// orderTime format in default is "YYYY-MM-DD HH:mm"
|
||||
// We need to keep the time part if possible, or default to current time
|
||||
|
|
@ -541,40 +551,44 @@ const onOrderDateChange = (e) => {
|
|||
oldTime = data.ticketsInfo.orderInfo.orderTime.split(' ')[1]
|
||||
}
|
||||
data.ticketsInfo.orderInfo.orderTime = val + ' ' + oldTime
|
||||
}
|
||||
}
|
||||
|
||||
const onFlightDateChange = (e) => {
|
||||
const onFlightDateChange = (e) => {
|
||||
data.ticketsInfo.flightInfo.date = e.detail.value
|
||||
}
|
||||
}
|
||||
|
||||
// Custom Time Picker Data
|
||||
const hours = Array.from({ length: 24 }, (_, i) => i.toString().padStart(2, '0'));
|
||||
const minutes = Array.from({ length: 60 }, (_, i) => i.toString().padStart(2, '0'));
|
||||
const timeRange = [hours, minutes];
|
||||
// Custom Time Picker Data
|
||||
const hours = Array.from({
|
||||
length: 24
|
||||
}, (_, i) => i.toString().padStart(2, '0'));
|
||||
const minutes = Array.from({
|
||||
length: 60
|
||||
}, (_, i) => i.toString().padStart(2, '0'));
|
||||
const timeRange = [hours, minutes];
|
||||
|
||||
const getTimeIndex = (timeStr) => {
|
||||
const getTimeIndex = (timeStr) => {
|
||||
if (!timeStr) return [0, 0];
|
||||
const [h, m] = timeStr.split(':');
|
||||
const hIndex = hours.findIndex(item => item === h);
|
||||
const mIndex = minutes.findIndex(item => item === m);
|
||||
return [hIndex === -1 ? 0 : hIndex, mIndex === -1 ? 0 : mIndex];
|
||||
};
|
||||
};
|
||||
|
||||
const onStartTimeChange = (e) => {
|
||||
const onStartTimeChange = (e) => {
|
||||
const [hIndex, mIndex] = e.detail.value;
|
||||
const time = `${hours[hIndex]}:${minutes[mIndex]}`;
|
||||
data.ticketsInfo.flightInfo.startTime = time;
|
||||
updateDuration();
|
||||
}
|
||||
}
|
||||
|
||||
const onEndTimeChange = (e) => {
|
||||
const onEndTimeChange = (e) => {
|
||||
const [hIndex, mIndex] = e.detail.value;
|
||||
const time = `${hours[hIndex]}:${minutes[mIndex]}`;
|
||||
data.ticketsInfo.flightInfo.endTime = time;
|
||||
updateDuration();
|
||||
}
|
||||
}
|
||||
|
||||
const updateDuration = () => {
|
||||
const updateDuration = () => {
|
||||
// Simple calc if same day or we can just leave it to user to input manually (which we support via input)
|
||||
// But let's try a best effort calc
|
||||
const ft = data.ticketsInfo.flightInfo
|
||||
|
|
@ -586,55 +600,59 @@ const updateDuration = () => {
|
|||
|
||||
const h = Math.floor(diffMin / 60)
|
||||
const m = diffMin % 60
|
||||
if (h > 0) {
|
||||
ft.duration = `${h}时${m}分`
|
||||
} else {
|
||||
ft.duration = `${m}分`
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import "@/common/main.css";
|
||||
@import "@/common/main.css";
|
||||
|
||||
page {
|
||||
page {
|
||||
background-color: #F8F8F8;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.container {
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
}
|
||||
}
|
||||
|
||||
.form-content {
|
||||
.form-content {
|
||||
flex: 1;
|
||||
height: 0;
|
||||
padding: 24rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
.section-container {
|
||||
.section-container {
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.section-header {
|
||||
.section-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 24rpx 12rpx 16rpx;
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.section-title {
|
||||
.section-title {
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
.card {
|
||||
background-color: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 0 24rpx;
|
||||
|
|
@ -661,9 +679,9 @@ page {
|
|||
color: #FF4D4F;
|
||||
padding: 4rpx 12rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-item {
|
||||
.form-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
|
@ -684,9 +702,9 @@ page {
|
|||
color: #333;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.add-btn-box {
|
||||
.add-btn-box {
|
||||
background-color: #fff;
|
||||
border-radius: 16rpx;
|
||||
padding: 24rpx;
|
||||
|
|
@ -701,13 +719,13 @@ page {
|
|||
font-size: 30rpx;
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.placeholder {
|
||||
.placeholder {
|
||||
height: 60rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.tips-container {
|
||||
.tips-container {
|
||||
padding: 24rpx 0;
|
||||
border-bottom: 1rpx solid #F5F5F5;
|
||||
|
||||
|
|
@ -748,5 +766,5 @@ page {
|
|||
transition: transform 0.1s;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue