Skip to content

B
bigwood
Commit f9dcaba4 authored by youjie's avatar youjie
Browse files
Options

no message

parent 4577f1c9
Show whitespace changes
Inline Side-by-side
Showing with 535 additions and 349 deletions
src/components/vehicle/list/ListHeader.vue 0 → 100644
View file @ f9dcaba4
<template>
<div class="rounded-borders bg-white row items-center q-pa-md q-my-md">
<q-input v-if="$q.platform.is.desktop" v-model="searchClone.UseCompName" class="col-2 q-mr-md" reverse-fill-mask dense type="text" standout :label="$t('v102.vehicle.list.s1')" />
<q-input v-if="$q.platform.is.desktop" v-model="searchClone.TeamName" class="col-2 q-mr-md" reverse-fill-mask dense type="text" standout :label="$t('v102.vehicle.list.s3')" />
<q-field v-if="$q.platform.is.desktop" stack-label :label="$t('daterange')" standout class="q-ml-lg col-2" style="min-width: 190px" dense>
<div class="self-center full-width no-outline" tabindex="0">{{ dateRangeFormat }}</div>
<q-popup-proxy :offset="[0, 10]" ref="qDateProxy">
<q-date v-model="dateRange" :options="optionsFn" range mask="YYYY/MM/DD" landscape @range-end="dateRangeHandler"></q-date>
</q-popup-proxy>
</q-field>
<div class="col"></div>
<q-btn unelevated class="bg-grey-3 hover q-mr-md" :title="$t('morequery')">
<q-badge rounded class="din bg-red-2 text-red-14 text-weight-bold" floating :label="searchCnt" v-if="searchCnt > 0" />
<svg-icon color="dark" icon="Text/Filter.svg" :tips="$t('morequery')" :size="20"></svg-icon>
<q-tooltip>{{ $t('morequery') }}</q-tooltip>
<q-popup-proxy class="no-shadow" style="box-shadow: 0 0 50px #ddd !important" :offset="[0, 20]" :model-value="canHide">
<q-card class="q-pa-md rounded-borders" style="width: 300px">
<div class="q-mb-md text-subtitle2">{{ $t('morequery') }}</div>
<div class="q-my-md" v-if="$q.platform.is.mobile">
<q-input v-model="searchClone.UseCompName" class="col-2 q-mr-md" reverse-fill-mask dense type="text" standout :label="$t('v102.vehicle.list.s1')" />
</div>
<div class="q-my-md">
<q-input v-model="searchClone.UseName" class="col-2 q-mr-md" reverse-fill-mask dense type="text" standout :label="$t('v102.vehicle.list.s2')" />
</div>
<div class="q-my-md" v-if="$q.platform.is.mobile">
<q-input v-model="searchClone.TeamName" class="col-2 q-mr-md" reverse-fill-mask dense type="text" standout :label="$t('v102.vehicle.list.s3')" />
</div>
<div class="q-my-md" v-if="$q.platform.is.mobile">
<q-field stack-label :label="$t('daterange')" standout class="col-2" style="min-width: 190px" dense>
<div class="self-center full-width no-outline" tabindex="0">{{ dateRangeFormat }}</div>
<q-popup-proxy :offset="[0, 10]" ref="qDateProxy">
<q-date v-model="dateRange" :options="optionsFn" range mask="YYYY/MM/DD" landscape @range-end="dateRangeHandler"></q-date>
</q-popup-proxy>
</q-field>
</div>
</q-card>
</q-popup-proxy>
</q-btn>
<q-btn v-if="$q.platform.is.desktop" color="primary" unelevated :label="$t('query')" @click="setSearchHandler"/>
<q-btn v-else color="primary" :round="$q.platform.is.mobile" :dense="$q.platform.is.mobile" :icon="$q.platform.is.mobile?'search':''" unelevated :label="$q.platform.is.mobile?'':$t('query')" @click="setSearchHandler"/>
<q-btn class="q-ml-sm" color="primary" unelevated :label="$t('v102.CharteredBus.td')" @click="goUrl"/>
</div>
</template>
<script lang="ts">
import svgIcon from '../../global/svg-icon.vue'
import { date } from 'quasar'
import { useQuasar } from 'quasar'
import { computed, ref, inject, reactive, toRefs } from 'vue'
import { DirtionmaryHelper } from 'src/config/dictionary'
import CharteredBusService from 'src/api/CharteredBus'
import { CascaderOption, NCascader } from 'naive-ui'
import { ApiResult } from 'src/@types/enumHelper'
import message from 'src/utils/message'
import { useHotel } from '../../../utils/hotelRate'
import { useRouter } from 'vue-router'
export default {
components: { svgIcon, NCascader },
setup(props) {
const $q = useQuasar()
const $router = useRouter()
const qDateProxy = ref(null) as any
const data = reactive({
dateRange: {} as any,
dateRangeFormat: '',
CharteredBusType: useHotel.getCharteredBusType(),
provinces: [] as any,
cascader: {
addressValue: null,
AirportValue: null
} as any,
searchClone:{} as any,
canHide: false,
AirportList: [] as any
})
const search = inject(DirtionmaryHelper.TICKET_QUERY_PARAM) as any
data.dateRange.from = date.formatDate(date.addToDate(new Date(), { days: 1 }), 'YYYY/MM/DD')
data.dateRange.to = date.formatDate(date.addToDate(new Date(), { days: 10 }), 'YYYY/MM/DD')
data.dateRangeFormat = `${data.dateRange.from} - ${data.dateRange.to}`
data.searchClone = JSON.parse(JSON.stringify(search.msg))
data.searchClone.StartTime = data.dateRange.from
data.searchClone.EndTime = data.dateRange.to
const methods = {
goUrl(){
$router.push({ path:`/vehicle/addEditVehicle`})
},
changearea(e: number, option: any, pathValues: Array<any>) {
data.searchClone.Q_Province = 0
data.searchClone.Q_City = 0
if (pathValues) {
if (pathValues.length > 0) {
data.searchClone.Q_Province = pathValues[0].ID
}
if (pathValues.length > 1) {
data.searchClone.Q_City = pathValues[1].ID
}
}
methods.initAirport()
},
changeareaAirport(e: number, option: any, pathValues: Array<any>) {
data.searchClone.Q_AirportId = 0
if (pathValues) {
if (pathValues.length > 0) {
// data.searchClone.Q_Province = pathValues[0].ID
}
if (pathValues.length > 1) {
data.searchClone.Q_AirportId = pathValues[1].ID
}
}
},
setSearchHandler(){
search.msg = JSON.parse(JSON.stringify(data.searchClone))
},
changeViewHandler(t:number){
data.searchClone.ViewType = t
methods.setSearchHandler()
},
dateRangeHandler(e: any) {
data.searchClone.StartTime = `${e.from.year}/${e.from.month}/${e.from.day}`
data.searchClone.EndTime = `${e.to.year}/${e.to.month}/${e.to.day} `
data.dateRangeFormat = `${data.searchClone.StartTime} - ${data.searchClone.EndTime} `
if (qDateProxy.value) qDateProxy.value.hide()
},
optionsFn(cd: any) {
return cd >= date.formatDate(date.addToDate(new Date(), { days: 1 }), 'YYYY/MM/DD')
},
}
const searchCnt = computed(() => {
let setCnt = 0
if ($q.platform.is.mobile) {
if (data.searchClone.UseCompName > 0) setCnt++
if (data.searchClone.TeamName > 0) setCnt++
if (data.dateRangeFormat.length>0) setCnt++
}
if (data.searchClone.UseName>0) setCnt++
return setCnt
})
return {
qDateProxy,
searchCnt,
...toRefs(data),
...methods
}
}
}
</script>
<style></style>
src/components/vehicle/list/ListTable.vue 0 → 100644
View file @ f9dcaba4
<template>
<div>
<q-card class="light-shadow q-pa-md bg-white rounded-borders q-mb-md" flat v-for="(x,index) in orders">
<!-- <div class="row items-center desktop-only">
<div class="q-mr-md">
<q-btn :color="search.OrderType == 1 ?'cyan' : (search.OrderType == 2 ?'negative':'positive')" unelevated disable size="sm">
<template v-if="search.OrderType == 1">{{$t('v102.CharteredBus.baochetype1')}}</template>
<template v-if="search.OrderType == 2">{{$t('v102.CharteredBus.baochetype2')}}</template>
<template v-if="search.OrderType == 3">{{$t('v102.CharteredBus.baochetype3')}}</template>
</q-btn>
</div>
<div class="f12 text-grey-6">{{ $t('hotelorder.search.orderNum') }}：{{ x.OrderNo }}</div>
<div class="q-ml-md">
<q-btn color="dark" flat size="sm" :label="$t('hotelorder.copy')" v-if="copyId != x.OrderId" @click="setCopyHandler(x)" />
<q-btn color="cyan" icon="check" outline size="sm" :label="$t('hotelorder.copyed')" v-else></q-btn>
</div>
<div class="col text-center f12 text-grey-6">
<span>{{ $t('v102.ticket.sj') }}：{{ x.SurName }}{{ x.Name }}/{{ x.Mobile }}</span>
</div>
<div class="f12 text-grey-6">{{ $t('hotelorder.createTime') }}：{{ x.CreateTime }}</div>
<div class="q-ml-md f12" :class="[x.typeInfo.Color]">
<q-icon :name="x.typeInfo.Icon" />
<span class="q-ml-sm">{{ x.typeInfo.StatusName }}</span>
</div>
</div>
<div class="mobile-only">
<div class="row justify-between">
<div class="q-mr-md">
<q-btn :color="x.MailingState == 1 ? 'cyan' : 'negative'" unelevated disable size="sm" :label="`${x.MailingState == 1 ? $t('hotelorder.orderType.guest') : $t('hotelorder.orderType.tour')}`"></q-btn>
</div>
<div class="q-ml-md f12" :class="[x.typeInfo.Color]">
<q-icon :name="x.typeInfo.Icon" />
<span class="q-ml-sm">{{ x.typeInfo.StatusName }}</span>
</div>
</div>
<div class="bg-grey-2 rounded-borders q-pa-sm q-mt-md">
<div class="row items-center justify-between">
<div class="f12 text-grey-6">{{ $t('hotelorder.search.orderNum') }}：{{ x.OrderNo }}</div>
<div class="q-ml-md">
<q-btn color="dark" flat size="sm" :label="$t('hotelorder.copy')" v-if="copyId != x.OrderId" @click="setCopyHandler(x)" />
<q-btn color="cyan" outline size="sm" :label="$t('hotelorder.copyed')" v-else></q-btn>
</div>
</div>
<div class="f12 text-grey-6">
<span v-if="x.MailingState">{{ $t('hotelorder.search.contactInfo') }}：{{ x.Name }}({{ x.EName }})/{{ x.ContactPhone }}</span>
</div>
<div class="f12 text-grey-6">{{ $t('hotelorder.createTime') }}：{{ x.CreateTime }}</div>
</div>
</div> -->
<div class="q-mt-md row">
<q-table separator="cell" :hide-bottom="!x.Remark" :pagination="{ rowsPerPage: 100 }" :rows="[x]" bordered :columns="cols" class="sticky-rightrowspan-column-table light-border col no-shadow">
<template v-slot:body-cell-Id="props">
<!--未提交报价，可以修改-->
<q-td :prop="props">
<span @click="mask(props.row.Id)" v-if="props.row.Status == 0 && props.row.OfferState == 1">
<q-btn class="col q-mr-md fz12" color="primary" unelevated
:label="$t('v102.vehicle.list.s5')" />
</span>
<span @click="cancel(props.row.Id)">
<q-btn class="col q-mr-md fz12" color="grey-6" unelevated
:label="$t('v102.vehicle.add3')" />
</span>
<!--申请报价-->
<span v-if="props.row.OfferState == 1 && props.row.Status == 0"
@click="ApplyTripBus(props.row)">
<q-btn class="col q-mr-md fz12" unelevated color="primary"
:label="$t('v102.vehicle.list.s8')" />
</span>
<!--弹窗显示详细信息-->
<span @click="details(props.row.Id)" v-if="props.row.OfferState == 3">
<q-btn class="col q-mr-md fz12" color="primary" unelevated
:label="$t('v102.vehicle.list.s9')" />
</span>
<!--确认报价-->
<span v-if="props.row.OfferState == 3 && props.row.Status == 0"
@click="sureBusPrice(props.row)">
<q-btn class="col q-mr-md fz12" color="primary" unelevated
:label="$t('v102.vehicle.list.s10')" />
</span>
</q-td>
</template>
</q-table>
</div>
<!-- <div class="q-mt-md" v-if="x.OrderStatus != 3" :class="{ row: $q.platform.is.desktop, 'column reverse': $q.platform.is.mobile }">
<div class="pay row text-grey rounded-borders" :class="{ 'bg-grey-2 q-mt-md': $q.platform.is.mobile, col: $q.platform.is.desktop }">
</div>
<div class="col desktop-only"></div>
<div class="rounded-borders bg-grey-2 q-pa-md" :class="{ 'q-mx-md': $q.platform.is.desktop, 'q-mt-md': $q.platform.is.mobile }">
<div class="row items-center justify-between q-mb-sm q-pb-sm" style="border-bottom: 1px dashed #ddd">
<div class="f12 text-grey">{{ $t('hotelorder.orderMoney') }}</div>
<div class="dark q-ml-xl">
<span class="din text-subtitle1">{{ moneyFormat(x.Money) }}</span>
<span class="f12">{{ x.CurrencyCode }}</span>
</div>
</div>
<div class="text-right">
<q-btn dense outline color="accent" size="sm" class="q-mt-sm" :label="$t('hotelorder.payinfo')" @click="ViewPayment"></q-btn>
</div>
</div>
<div class="rounded-borders q-pa-sm justify-between" :class="{ column: $q.platform.is.desktop, 'row items-center': $q.platform.is.mobile, 'bg-green-1': x.OrderStatus != 1, 'bg-grey-2': x.OrderStatus == 1 }">
<q-list dense v-if="x.OrderStatus == 1" :class="{ 'row items-center justify-between full-width': $q.platform.is.mobile }">
<q-item class="text-negative" clickable v-close-popup @click="cancelConfirmHandler(x.OrderId)">
<q-item-section>
<q-item-label>{{ $t('hotelorder.opera.cancel') }}</q-item-label>
</q-item-section>
</q-item>
<q-item class="text-primary" clickable v-close-popup @click="editOrder(x)">
<q-item-section>
<q-item-label>{{ $t('hotelorder.opera.edit') }}</q-item-label>
</q-item-section>
</q-item>
<q-item class="text-positive" clickable v-close-popup>
<q-item-section>
<q-item-label>{{ $t('v101.Listofquotation.baojiadan') }}</q-item-label>
</q-item-section>
</q-item>
</q-list>
<div v-else>
<div class="f12 text-green-4">{{ $t('hotelorder.payed') }}</div>
<div class="text-subtitle1 din text-green-14">
{{ x.Money.toFixed(2) }}
<span class="text-green-4 f12">{{ $t('unit.jp') }}</span>
</div>
</div>
</div>
</div>
<div v-if="x.OrderStatus == 3">
<div class="q-mt-md q-pa-sm row items-center rounded-borders bg-orange-1" style="border-width: 0 5px; border-style: solid; border-color: #ffb74d">
<div class="text-subtitle2 text-weight-bolder text-grey-900">{{ $t('v101.cancelRemark') }}：</div>
<div class="f12 text-grey-600 q-ml-sm col">{{ x.CancelRemark ? x.CancelRemark : $t('v101.selfCancle') }}</div>
<div class="f12 text-grey-900">{{ x.CancelEmpName }} {{ x.CancelTime }}</div>
</div>
</div> -->
</q-card>
<q-card class="light-shadow q-pa-md bg-white rounded-borders q-mb-md" v-if="pages.pageCount > 0" flat>
<q-pagination class="full-width justify-end" v-model="pages.pageIndex" color="primary" :max="pages.pageCount" :input="true" @update:model-value="changePageHandler" />
</q-card>
<q-inner-loading :showing="loading" :label="$t('loading')" label-class="text-grey-6 f12" />
</div>
<div class="text-center q-mt-xl" v-if="(!orders || orders.length == 0) && !loading">
<svg-icon :size="50" color="nav" icon="General/Clipboard.svg"></svg-icon>
<div class="q-mt-md f12 text-grey-6">{{ $t('noneData') }}</div>
</div>
<!-- 详情 -->
<q-dialog v-model="showdetails">
<vehicle-details @close="close" :Id='Id' @refresh="refresh">
</vehicle-details>
</q-dialog>
<!-- 取消弹窗 -->
<q-dialog v-model="cancelshow">
<q-card flat class="q-px-lg" style="width: 30vw;">
<q-card-section class="q-pa-sm">
<div class="text-h6">{{ $t('v102.vehicle.add3') }}</div>
</q-card-section>
<q-card-section>
<q-input v-model="CancelRemark" :label="$t('v102.vehicle.add4')" :rows="3" filled type="textarea" />
</q-card-section>
<q-card-actions align="right" class="bg-white">
<q-btn flat dense color="dark" :label="$t('close')" class="q-mr-sm" @click="cancelshow = true"
v-close-popup />
<q-btn unelevated dense color="accent q-px-md" :label="$t('v102.vehicle.add5')"
@click="cancellations" />
</q-card-actions>
</q-card>
</q-dialog>
</template>
<script lang="ts">
import vehiclePopover from '..//vehiclePopover.vue'
import vehicleDetails from '../vehicleDetails.vue'//详情
import { date } from 'quasar'
import { ApiResult } from '../../../@types/enumHelper'
import { useQuasar } from 'quasar'
import HotelService from '../../../api/vehicle'
import message from '../../../utils/message'
import { DirtionmaryHelper } from 'src/config/dictionary'
import { defineComponent, inject, reactive, toRefs, watch } from 'vue'
import { useRouter } from 'vue-router'
import { useI18n } from 'vue-i18n'
export default defineComponent({
components: { vehicleDetails },
setup(props) {
const { t } = useI18n()
const $q = useQuasar()
const $router = useRouter()
const data = reactive({
showdetails: false,
cancelshow: false,
CancelRemark: '',
Id: 0,
loading: false,
loading: false,
pages: {
pageIndex: 1,
pageSize: 12,
pageCount: 0,
},
orders: [] as any[],
ProductId: {} as any,
showDetails: false,
cols: [
{ name: 'UseCompName', label: t('v102.vehicle.title1'), field: (row: any) => row.UseCompName, align: 'left' },
{ name: 'UseName', label: t('v102.vehicle.title2'), field: (row: any) => row.UseName, align: 'left' },
{ name: 'PickUpInfo', label: t('v102.vehicle.title3'), field: (row: any) => row.PickUpInfo, align: 'left' },
{ name: 'GoFlightInfo', label: t('v102.vehicle.title4'), field: (row: any) => row.GoFlightInfo, align: 'left' },
{ name: 'BackFlightInfo', label: t('v102.vehicle.title5'), field: (row: any) => row.BackFlightInfo, align: 'left' },
{ name: 'PeopleNum', label: t('v102.vehicle.title6'), field: (row: any) => row.PeopleNum, align: 'left' },
{ name: 'StartDate', label: t('v102.vehicle.title7'), field: (row: any) => row.StartDate, align: 'left' },
{ name: 'UseDayNum', label: t('v102.vehicle.title8'), field: (row: any) => row.UseDayNum, align: 'left' },
{ name: 'BusTypeName', label: t('v102.vehicle.title9'), field: (row: any) => row.GuideInfo, align: 'left' },
{ name: 'UseName', label: t('v102.vehicle.title10'), field: (row: any) => row.GuideInfo, align: 'left' },
{ name: 'TeamName', label: t('v102.vehicle.title11'), field: (row: any) => row.TeamName, align: 'left' },
{ name: 'CreateDate', label: t('v102.vehicle.title12'), field: (row: any) => row.CreateDate, align: 'left' },
{ name: 'OfferStateName', label: t('v102.vehicle.list.s6'), field: (row: any) => row.OfferStateName, align: 'left' },
{ name: 'IsSure', label: t('v102.vehicle.list.s10'), field: (row: any) => row.IsSure, align: 'left' },
{ name: 'Id', label: t('hotel.addRoomBtn'), field: (row: any) => row.Id, align: 'left' },
] as any,
})
// if ($q.platform.is.desktop) {
// if ($q.screen.gt.md) {
// data.pages.PageSize = 12
// } else {
// data.pages.PageSize = 9
// }
// } else {
// data.pages.PageSize = 10
// }
const search = inject(DirtionmaryHelper.TICKET_QUERY_PARAM) as any
watch(search, (n, o) => {
if (data.loading) return
data.pages.pageIndex = 1
methods.getList()
})
const methods = {
// 详情
details(val: any) {
data.Id = val
data.showdetails = true
},
//申请报价
ApplyTripBus(item: any) {
HotelService.applyBusPricelation(item.Id)
.then(r => {
if (r.data.resultCode == ApiResult.SUCCESS) {
methods.getList()
} else {
message.errorMsg(r.data.message)
}
})
.catch(e => {
message.errorMsg(e.message)
})
},
//确认报价
sureBusPrice(item: any) {
HotelService.sureBusPricelation(item.Id).then(r => {
if (r.data.resultCode == ApiResult.SUCCESS) {
methods.getList()
} else {
message.errorMsg(r.data.message)
}
}).catch(e => {
message.errorMsg(e.message)
})
},
cancel(item: any) {
data.cancelshow = true
data.Id = item
},
// 取消用车
cancellations() {
HotelService.cancellation(data.Id, data.CancelRemark)
.then(r => {
if (r.data.resultCode == ApiResult.SUCCESS) {
data.cancelshow = false
methods.getList()
} else {
message.errorMsg(r.data.message)
}
})
.catch(e => {
message.errorMsg(e.message)
})
},
mask(val: any) {
data.Id = val
$router.push({ path: `/vehicle/addEditVehicle${data.Id ? '/' + data.Id : ''}` })
},
getList() {
let param = Object.assign(data.pages, search.msg)
HotelService.vehicleList(param)
.then(r => {
if (r.data.resultCode == ApiResult.SUCCESS) {
data.orders = r.data.data.pageData
data.pages.pageCount = r.data.data.pageCount
} else {
message.errorMsg(r.data.message)
}
}).catch(e => {
message.errorMsg(e.message)
data.loading = false
})
},
optionsFn(cd: any) {
return cd >= date.formatDate(date.addToDate(new Date(), { days: 0 }), 'YYYY/MM/DD')
},
changePageHandler(n: number) {
data.pages.pageIndex = n
methods.getList()
},
}
methods.getList()
return {
...toRefs(data),
...methods,
search
}
}
})
</script>
<style></style>
src/pages/vehicle/teamOrder.vue
View file @ f9dcaba4
<template>
<div class="q-py-md">
<!-- 表格 -->
<q-card class="light-shadow q-pa-md" flat>
<div class="add q-mb-md">
<div class="flex">
<q-input v-model="pages.UseCompName" @blur="refresh" class="col q-mr-md" reverse-fill-mask dense
standout :label="$t('v102.vehicle.list.s1')" />
<q-input v-model="pages.UseName" @blur="refresh" class="col q-mr-md" dense reverse-fill-mask
standout :label="$t('v102.vehicle.list.s2')" />
<q-input v-model="pages.TeamName" @blur="refresh" class="col q-mr-md" dense reverse-fill-mask
standout :label="$t('v102.vehicle.list.s3')" />
<q-field v-if="$q.platform.is.desktop" clearable v-model="dateRangeFormat"
:label="$t('v102.vehicle.list.s4')" standout class="col-2" style="min-width: 190px" dense>
<div class="self-center full-width no-outline" tabindex="0">{{ dateRangeFormat }}</div>
<q-popup-proxy :offset="[0, 10]" ref="qDateProxy">
<q-date v-model="dateRange" :options="optionsFn" range mask="YYYY/MM/DD" landscape
@range-end="dateRangeHandler"></q-date>
</q-popup-proxy>
</q-field>
</div>
<div>
<q-btn class="col q-mr-md" color="primary" unelevated :label="$t('v102.vehicle.add')"
@click="mask(0)" />
<q-btn class="col q-mr-md" color="primary" unelevated :label="$t('query')" @click="refresh" />
</div>
</div>
<div class="bg-white rounded-borders">
<q-table v-if="$q.platform.is.desktop" separator="cell" :pagination="pages" dense :rows="hotels"
row-key="Id" bordered :columns="cols"
class="sticky-rightrowspan-column-table light-border col no-shadow sticky-rightrowspan-column-table2">
<template v-slot:body-cell-Id="props">
<!--未提交报价，可以修改-->
<q-td :prop="props">
<span @click="mask(props.row.Id)" v-if="props.row.Status == 0 && props.row.OfferState == 1">
<q-btn class="col q-mr-md fz12" color="primary" unelevated
:label="$t('v102.vehicle.list.s5')" />
</span>
<span @click="cancel(props.row.Id)">
<q-btn class="col q-mr-md fz12" color="grey-6" unelevated
:label="$t('v102.vehicle.add3')" />
</span>
<!--申请报价-->
<span v-if="props.row.OfferState == 1 && props.row.Status == 0"
@click="ApplyTripBus(props.row)">
<q-btn class="col q-mr-md fz12" unelevated color="primary"
:label="$t('v102.vehicle.list.s8')" />
</span>
<!--弹窗显示详细信息-->
<span @click="details(props.row.Id)" v-if="props.row.OfferState == 3">
<q-btn class="col q-mr-md fz12" color="primary" unelevated
:label="$t('v102.vehicle.list.s9')" />
</span>
<!--确认报价-->
<span v-if="props.row.OfferState == 3 && props.row.Status == 0"
@click="sureBusPrice(props.row)">
<q-btn class="col q-mr-md fz12" color="primary" unelevated
:label="$t('v102.vehicle.list.s10')" />
</span>
</q-td>
</template>
<template v-slot:bottom>
<q-pagination class="full-width justify-end" v-model="pages.pageIndex" color="primary"
:max="pageCount" :input="true" @update:model-value="changePageHandler" />
</template>
</q-table>
<!-- 移动 -->
<q-table hide-header v-else :rows="hotels" grid :columns="cols" row-key="Id"
card-class="no-shadow bg-primary text-white col" :pagination="pages" :loading="loading">
<template v-slot:body-cell-Id="props">
<q-td :prop="props">
<span @click="mask(props.row.Id)" v-if="props.row.Status == 0">
<q-btn class="col q-mr-md" color="primary" unelevated
:label="$t('v102.vehicle.list.s5')" />
</span>
<span @click="cancel(props.row.Id)">
<q-btn color="red" unelevated :label="$t('v102.vehicle.add3')" />
</span>
<!--申请报价-->
<span v-if="props.row.OfferState == 1 && props.row.Status == 0"
@click="ApplyTripBus(props.row)">
<q-btn class="col q-mr-md" color="primary" unelevated
:label="$t('v102.vehicle.list.s8')" />
</span>
</q-td>
</template>
<template v-slot:bottom>
<q-pagination class="full-width justify-end" v-model="pages.pageIndex" color="primary"
:max="pageCount" :input="true" @update:model-value="changePageHandler" />
</template>
</q-table>
</div>
</q-card>
<!-- 编辑 -->
<q-dialog v-model="showPriceList">
<vehicle-popover @close="close" :Id='Id' @refresh="refresh">
</vehicle-popover>
</q-dialog>
<!-- 详情 -->
<q-dialog v-model="showdetails">
<vehicle-details @close="close" :Id='Id' @refresh="refresh">
</vehicle-details>
</q-dialog>
<!-- 取消弹窗 -->
<q-dialog v-model="cancelshow">
<q-card flat class="" style="width: 40vw;">
<q-card-section class="q-pa-sm">
<div class="text-h6">{{ $t('v102.vehicle.add3') }}</div>
</q-card-section>
<q-card-section>
<q-input v-model="CancelRemark" :label="$t('v102.vehicle.add4')" :rows="3" filled type="textarea" />
</q-card-section>
<q-card-actions align="right" class="bg-white">
<q-btn flat dense color="dark" :label="$t('close')" class="q-mr-sm" @click="cancelshow = true"
v-close-popup />
<q-btn unelevated dense color="accent q-px-md" :label="$t('v102.vehicle.add5')"
@click="cancellations" />
</q-card-actions>
</q-card>
</q-dialog>
</div>
<list-header></list-header>
<list-table></list-table>
</template>
<script lang="ts">
import { defineComponent, ref, reactive, toRefs, provide, onMounted, inject, watch, onBeforeUnmount, computed } from 'vue'
import useMetaModule from '../../module/meta/metaModule'
import { useI18n } from 'vue-i18n'
import { useQuasar } from 'quasar'
import { date } from 'quasar'
import vehiclePopover from '../../components/vehicle/vehiclePopover.vue'
import vehicleDetails from '../../components/vehicle/vehicleDetails.vue'//详情
import { DirtionmaryHelper } from '../../config/dictionary'
import useScrollModule from 'src/module/scrollbar/scrollModule'
import HotelService from '../../api/vehicle'
import message from 'src/utils/message'
import { ApiResult } from 'src/@types/enumHelper'
import { useRouter } from 'vue-router'
export default defineComponent({
components: { vehiclePopover, vehicleDetails },
setup() {
const qDateProxy = ref(null) as any
<script lang="ts">
import { date } from 'quasar'
import { inject, provide, reactive, toRefs, defineComponent,onMounted } from 'vue';
import useMetaModule from '../../module/meta/metaModule'
import { useI18n } from 'vue-i18n'
import { DirtionmaryHelper } from '../../config/dictionary';
import ListHeader from 'src/components/vehicle/list/ListHeader.vue';
import ListTable from 'src/components/vehicle/list/ListTable.vue';
export default defineComponent({
components: { ListHeader, ListTable },
setup(props) {
let { setTitle } = useMetaModule()
const { t } = useI18n()
const $q = useQuasar()
const $router = useRouter()
const pageTitle = inject(DirtionmaryHelper.PAGE_TITLE_KEY) as any
pageTitle.value = t('v102.CharteredBus.pageTitle')
setTitle(pageTitle.value)
const data= reactive({
})
const data = reactive({
showdetails: false,
cancelshow: false,
CancelRemark: '',
Id: 0,
loading: false,
showPriceList: false,
pageTitle: '44' as (string | undefined),
pages: {
pageIndex: 1,
pageSize: 12,
rowsPerPage: 12,
const search = reactive({
msg:{
UseCompName: '',
UseName: '',
TeamName: '',
StartTime: "",
EndTime: '',
},
dateRangeFormat: '',
dateRange: {} as any,
pageCount: 0,
hotels: [
] as Array<any>,
cols: [
{ name: 'UseCompName', label: t('v102.vehicle.title1'), field: (row: any) => row.UseCompName, align: 'left' },
{ name: 'UseName', label: t('v102.vehicle.title2'), field: (row: any) => row.UseName, align: 'left' },
{ name: 'PickUpInfo', label: t('v102.vehicle.title3'), field: (row: any) => row.PickUpInfo, align: 'left' },
{ name: 'GoFlightInfo', label: t('v102.vehicle.title4'), field: (row: any) => row.GoFlightInfo, align: 'left' },
{ name: 'BackFlightInfo', label: t('v102.vehicle.title5'), field: (row: any) => row.BackFlightInfo, align: 'left' },
{ name: 'PeopleNum', label: t('v102.vehicle.title6'), field: (row: any) => row.PeopleNum, align: 'left' },
{ name: 'StartDate', label: t('v102.vehicle.title7'), field: (row: any) => row.StartDate, align: 'left' },
{ name: 'UseDayNum', label: t('v102.vehicle.title8'), field: (row: any) => row.UseDayNum, align: 'left' },
{ name: 'BusTypeName', label: t('v102.vehicle.title9'), field: (row: any) => row.GuideInfo, align: 'left' },
{ name: 'UseName', label: t('v102.vehicle.title10'), field: (row: any) => row.GuideInfo, align: 'left' },
{ name: 'TeamName', label: t('v102.vehicle.title11'), field: (row: any) => row.TeamName, align: 'left' },
{ name: 'CreateDate', label: t('v102.vehicle.title12'), field: (row: any) => row.CreateDate, align: 'left' },
{ name: 'OfferStateName', label: t('v102.vehicle.list.s6'), field: (row: any) => row.OfferStateName, align: 'left' },
{ name: 'IsSure', label: t('v102.vehicle.list.s10'), field: (row: any) => row.IsSure, align: 'left' },
{ name: 'Id', label: t('hotel.addRoomBtn'), field: (row: any) => row.Id, align: 'left' },
] as any,
})
// data.dateRange.to = date.formatDate(date.addToDate(new Date(), { days: 9 }), 'YYYY/MM/DD')
// data.dateRange.from = date.formatDate(date.addToDate(new Date(), { days: 8 }), 'YYYY/MM/DD')
// data.dateRangeFormat = `${data.dateRange.from} - ${data.dateRange.to}`
// data.pages.StartTime = data.dateRange.from
// data.pages.EndTime = data.dateRange.to
// data.pageTitle = inject(DirtionmaryHelper.PAGE_TITLE_KEY)
const methods = {
// 详情
details(val: any) {
data.Id = val
data.showdetails = true
},
//申请报价
ApplyTripBus(item: any) {
HotelService.applyBusPricelation(item.Id)
.then(r => {
if (r.data.resultCode == ApiResult.SUCCESS) {
methods.refresh()
} else {
message.errorMsg(r.data.message)
}
})
.catch(e => {
message.errorMsg(e.message)
})
},
//确认报价
sureBusPrice(item: any) {
HotelService.sureBusPricelation(item.Id).then(r => {
if (r.data.resultCode == ApiResult.SUCCESS) {
methods.refresh()
} else {
message.errorMsg(r.data.message)
}
}).catch(e => {
message.errorMsg(e.message)
})
},
cancel(item: any) {
data.cancelshow = true
data.Id = item
},
// 取消用车
cancellations() {
HotelService.cancellation(data.Id, data.CancelRemark)
.then(r => {
if (r.data.resultCode == ApiResult.SUCCESS) {
data.cancelshow = false
methods.refresh()
} else {
message.errorMsg(r.data.message)
}
})
.catch(e => {
message.errorMsg(e.message)
})
},
// 获取列表数据
initHotel() {
HotelService.vehicleList(data.pages)
.then(r => {
if (r.data.resultCode == ApiResult.SUCCESS) {
data.hotels = r.data.data.pageData
data.pageCount = r.data.data.pageCount
} else {
message.errorMsg(r.data.message)
provide(DirtionmaryHelper.TICKET_QUERY_PARAM, search)
const menu=inject(DirtionmaryHelper.MENU_KEYS) as any
menu.value=5
const methods = {
}
onMounted(()=>{
})
.catch(e => {
message.errorMsg(e.message)
})
},
// 获取时间选择
dateRangeHandler(e: any) {
data.pages.StartTime = `${e.from.year}-${e.from.month}-${e.from.day}`
data.pages.EndTime = `${e.to.year}-${e.to.month}-${e.to.day} `
data.dateRangeFormat = `${data.pages.StartTime} - ${data.pages.EndTime} `
if (qDateProxy.value) {
qDateProxy.value.hide()
// methods.refresh()
return {
...toRefs(data),
...methods
}
},
close() {
data.showdetails = false
data.showPriceList = false
},
// 刷新
refresh() {
// console.log('444')
data.pages.pageIndex = 1
methods.initHotel()
data.showdetails = false
data.showPriceList = false
},
// 翻页
changePageHandler(n: any) {
console.log(n)
data.pages.pageIndex = n
methods.initHotel()
},
mask(val: any) {
data.Id = val
$router.push({ path: `/vehicle/addEditVehicle${data.Id ? '/' + data.Id : ''}` })
// data.showPriceList = true
}
}
onMounted(() => {
methods.initHotel()
})
return { ...toRefs(data), ...methods, qDateProxy }
},
})
</script>
<style scoped>
.date-box :deep(.q-field__control) {
height: 20px;
}
.add {
margin-bottom: 20px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.shou {
cursor: pointer;
}
.driver {
font-size: 14px;
font-weight: 400;
border-bottom: 1px solid;
margin-left: 50px;
}
.title {
display: flex;
justify-content: center;
font-size: 22px;
margin-bottom: 10px;
}
.flex {
display: flex;
align-items: center;
}
</script>
th {
padding: 10px 10px;
font-size: 14px;
}
<style>
.table-title {
font-size: 14px;
}
</style>
\ No newline at end of file
.sticky-rightrowspan-column-table2 th:last-child,
.sticky-rightrowspan-column-table2 tbody tr td {
position: sticky !important;
right: 0 !important;
z-index: 1 !important;
box-shadow: rgba(0, 0, 0, 0.05) -2px 0px 0px !important;
}
</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