Skip to content

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

no message

parent fe25dc9e
Hide whitespace changes
Inline Side-by-side
Showing with 222 additions and 75 deletions
src/components/scattered/order/OrderList.vue
View file @ 417ba251
<template> <template>
<div> <div>
<q-card class="light-shadow q-pa-md bg-white rounded-borders q-my-md" flat> <q-card class="light-shadow q-pa-md bg-white rounded-borders q-mb-md" flat v-for="(x,index) in orders">
<q-table v-if="$q.platform.is.desktop" separator="cell" :pagination="{rowsPerPage:100}" dense :rows="orders" bordered :columns="cols" class="sticky-rightrowspan-column-table light-border col no-shadow"> <div class="row items-center desktop-only">
<template v-slot:body-cell-HotelName="props"> <!-- <div class="q-mr-md">
<q-td :props="props"> <q-btn color="negative" unelevated disable size="sm">
<div class="cursor-pointer" @click="getDetail(props.row.OrderID)"> {{$t('v102.vehicle.travelvehicle')}}
<q-img :src="props.row.HotelPic" spinner-color="drk" spinner-size="20px" width="50px" height="50px" mode="cover" /> </q-btn>
<span class="q-mx-md">{{ props.row.HotelName }}</span> </div> -->
</div> <div class="f12 text-grey-6">{{ $t('hotelorder.search.orderNum') }}：{{ x.ThirdOrderNo }}</div>
</q-td> <div class="q-ml-md">
</template> <q-btn color="dark" flat size="sm" :label="$t('hotelorder.copy')" v-if="copyId != x.OrderID" @click="setCopyHandler(x)" />
<template v-slot:body-cell-OrderStatus="props"> <q-btn color="cyan" icon="check" outline size="sm" :label="$t('hotelorder.copyed')" v-else></q-btn>
<q-td :props="props"> </div>
<span :class="[props.row.typeInfo.Color]">{{ props.row.OrderStatus }}</span> <div class="col text-center f12 text-grey-6">
</q-td> <!-- <span>{{ $t('v101.scatteredOrderList.table1') }}：{{ x.HotelName }}</span> -->
</template>
<template v-slot:body-cell-operation="props">
<q-td :props="props">
<q-btn :loading="loadingCel" v-if="props.row.OrderStatus!='已取消'" size="md" color="white" text-color="black" :label="$t('v101.scatteredOrderList.quxiaodindan')" @click.stop="canCelHotel(props.row.ThirdOrderNo)"></q-btn>
</q-td>
</template>
<template v-slot:bottom>
<q-pagination class="full-width justify-end" v-model="pages.pageIndex" color="primary" :max="pages.pageCount" :input="true" @update:model-value="changePageHandler" />
</template>
</q-table>
<q-table
v-if="$q.platform.is.mobile"
hide-header
:title="pageTitle"
:rows="orders"
grid
:columns="mobileCols"
row-key="name"
card-class="no-shadow bg-primary text-white"
:pagination="pages"
:loading="loading"
>
<template v-slot:item="props">
<div @click="getDetail(props.row.OrderID)" class="rounded-borders bg-primary text-white col-12 q-mb-sm" style="padding: 12px;margin-left: 12px;margin-right: 12px; width: calc(100% - 24px);">
<div>
<div style="opacity: 0.54;font-weight: 500;font-size: 12px;margin-bottom: 4px;">{{$t('v101.scatteredOrderList.table1')}}</div>
<div style="font-size: 13px;">{{props.row.HotelName}}</div>
</div> </div>
<div class="q-my-md"> <div class="f12 text-grey-6">{{ $t('hotelorder.createTime') }}：{{ x.CreateDateStr }}</div>
<div style="opacity: 0.54;font-weight: 500;font-size: 12px;margin-bottom: 4px;">{{$t('v101.scatteredOrderList.table2')}}</div> <div class="q-ml-md f12" :class="[x.typeInfo.Color]">
<div style="font-size: 13px;"> <q-icon :name="x.typeInfo.Icon" />
<span class="q-ml-xs">{{props.row.OrderID}}</span> <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="negative" unelevated disable size="sm" :label="$t('v102.vehicle.travelvehicle')"></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> </div>
<div class="row"> <div class="bg-grey-2 rounded-borders q-pa-sm q-mt-md">
<div> <div class="row items-center justify-between">
<div style="opacity: 0.54;font-weight: 500;font-size: 12px;margin-bottom: 4px;">{{$t('v101.scatteredOrderList.table4')}}</div> <div class="f12 text-grey-6">{{ $t('hotelorder.search.orderNum') }}：{{ x.ThirdOrderNo }}</div>
<div class=""> <div class="q-ml-md">
<span>円{{props.row.TotalPrice.toFixed(2)}}</span> <q-btn color="dark" flat size="sm" :label="$t('hotelorder.copy')" v-if="copyId != x.OrderID" @click.stop="setCopyHandler(x)" />
<q-btn color="cyan" outline size="sm" :label="$t('hotelorder.copyed')" v-else></q-btn>
</div> </div>
</div> </div>
<div class="q-pl-lg"> <div class="f12 text-grey-6">
<div style="opacity: 0.54;font-weight: 500;font-size: 12px;margin-bottom: 4px;">{{$t('v101.scatteredOrderList.table5')}}</div> <span></span>
<div class=""> </div>
<span>円{{props.row.CustomerPayMoney.toFixed(2)}}</span> <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.CreateRemark" :pagination="{ rowsPerPage: 100 }" :rows="[x]" bordered :columns="cols" class="sticky-rightrowspan-column-table light-border col no-shadow">
<template v-slot:body-cell-UseCompName="props">
<q-th :props="props">
<div>
<div class="ellipsis fz13">{{ props.row.UseCompName }}</div>
<div class="fz12 text-grey-6">{{ props.row.UseName }}</div>
<q-tooltip>{{ props.row.UseCompName + props.row.UseName }}</q-tooltip>
</div>
</q-th>
</template>
<template v-slot:body-cell-PickUpInfo="props">
<q-th :props="props">
<div class="fz13 text-grey-6">
<div>{{$t('v102.vehicle.title4')}}: <span class="text-dark q-pl-sm">{{ props.row.GoFlightInfo }}</span> </div>
<div class="q-py-xs">{{$t('v102.vehicle.title5')}}: <span class="text-dark q-pl-sm">{{ props.row.BackFlightInfo }}</span> </div>
<div>{{$t('v102.vehicle.title3')}}: <span class="text-dark q-pl-sm">{{ props.row.PickUpInfo }}</span></div>
</div>
</q-th>
</template>
<template v-slot:body-cell-UseDayNum="props">
<q-td :props="props">
<div class="room-item f12 text-grey-6" v-for="x in props.row.DetailList">
<span class="q-mr-md">
<!-- {{ $t('v102.vehicle.tatle.th1') }}： -->
{{ x.UseDate }}</span>
<span class="q-mr-md"> {{ $t('v102.vehicle.di') }}{{x.DayNum}}{{ $t('v102.vehicle.tian') }} </span>
<span class="q-mr-md">
<!-- {{ $t('v102.vehicle.tatle.th3') }}: -->
{{ x.UseTypeName }} </span>
<span class="q-mr-md">{{ $t('v102.vehicle.tatle.th4') }}: {{x.TripInfo}}</span>
<span class="q-mr-md" v-if="x.UnitPrice>0">{{ $t('v102.vehicle.list2.s21') }}: {{x.UnitPrice}}</span>
<span class="q-mr-md" v-if="x.StopBusPrice>0">{{ $t('v102.vehicle.list2.s22') }}: {{x.StopBusPrice}}</span>
<span class="q-mr-md" v-if="x.RoomPrice>0">{{ $t('v102.vehicle.list2.s23') }}: {{x.RoomPrice}}</span>
<span class="q-mr-md" v-if="x.Money>0"> {{ $t('hotelorder.xj') }}: {{ x.Money }} </span>
</div>
</q-td>
</template>
<template v-slot:body-cell-BusTypeName="props">
<q-td :props="props">
<div class="f12">
<div><span class="q-mr-xs text-grey-6">{{ $t('v102.vehicle.title9') }}：</span>{{ x.BusTypeName }}</div>
<template v-if="x.DriverInfo ">
<div><span class="q-mr-xs text-grey-6">{{ $t('v102.vehicle.list2.s30') }}：</span>{{ x.DriverInfo }}</div>
<div><span class="q-mr-xs text-grey-6">{{ $t('v102.vehicle.list2.s31') }}：</span>{{ x.BusNo }}</div>
</template>
</div>
</q-td>
</template>
<template v-slot:body-cell-HandFittingFee="props">
<q-td :props="props" :colspan="x.DetailList.length" v-if="props.rowIndex == 0" >
<div class="q-mt-sm" v-if="x.OrderStatus!=2">
<q-btn size="sm" dense outline color="primary" v-if="x.ContractUrl">
<a class="text-primary" style="text-decoration:none"
:href="x.ContractUrl">{{ $t('v101.downloadHands') }}</a>
</q-btn>
<span class="text-grey-500 f12">{{ $t('v101.noneHands') }}</span>
</div>
<template v-else>
{{ moneyFormat(x.ShouPeiFee)?moneyFormat(x.ShouPeiFee):$t('v102.vehicle.nomoney') }}
</template>
</q-td>
</template>
<template v-slot:bottom>
<div class="msl text-negative">{{ $t('v101.hotelRemark') }}：{{ x.CreateRemark }}</div>
</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.TotalPrice) }}
<!-- {{ x.totalMoney.toFixed(2) }} -->
</span>
<span class="f12">
{{$t('unit.jp')}}
</span>
</div> </div>
</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 != '已取消', 'bg-grey-2': x.OrderStatus == '已取消' }">
<q-list dense :class="{ 'row items-center justify-between full-width': $q.platform.is.mobile }">
<q-item v-if="x.OrderStatus != '已取消'" class="text-negative" clickable v-close-popup @click="canCelHotel(x.ThirdOrderNo)">
<q-item-section>
<q-item-label>{{ $t('hotelorder.opera.cancel') }}</q-item-label>
</q-item-section>
</q-item>
<q-item class="text-positive" clickable v-close-popup @click="getDetail(x.OrderID)">
<q-item-section>
<q-item-label>{{ $t('v101.scatteredOrderList.xiangqing') }}</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">
{{ moneyFormat(x.totalMoney) }}
<span class="text-green-4 f12">
{{$t('unit.jp')}}
</span>
</div>
</div> -->
</div> </div>
<div class="row q-pt-sm" :class="{'justify-between items-center':props.row.OrderStatus!='已取消','justify-end items-end':props.row.OrderStatus=='已取消'}"> </div>
<span class="rounded-borders q-px-sm text-white">{{ props.row.OrderStatus }}</span> <div v-if="x.OrderStatus == 3">
<q-btn :loading="loadingCel" v-if="props.row.OrderStatus!='已取消'" size="sm" color="white" text-color="black" :label="$t('v101.scatteredOrderList.quxiaodindan')" @click.stop="canCelHotel(props.row.ThirdOrderNo)"></q-btn> <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.CancelRemark }}
</div>
</div> </div>
</div> </div>
</template> </q-card>
<template v-slot:bottom> <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-pagination class="full-width justify-end" v-model="pages.pageIndex" color="primary" :max="pages.pageCount" :input="true" @update:model-value="changePageHandler" />
</template>
</q-table>
</q-card> </q-card>
<q-inner-loading :showing="loading" :label="$t('loading')" label-class="text-grey-6 f12" /> <q-inner-loading :showing="loading" :label="$t('loading')" label-class="text-grey-6 f12" />
</div> </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="showOrderdDetail"> <q-dialog v-model="showOrderdDetail">
<OrderdDetail :OrderID="OrderID"></OrderdDetail> <OrderdDetail :OrderID="OrderID"></OrderdDetail>
</q-dialog> </q-dialog>
<q-dialog v-model="showBankAccount">
<BankAccount @change="showBankAccount=false"></BankAccount>
</q-dialog>
</template> </template>
<script lang="ts"> <script lang="ts">
...@@ -95,9 +204,10 @@ import svgIcon from '../../../global/svg-icon.vue' ...@@ -95,9 +204,10 @@ import svgIcon from '../../../global/svg-icon.vue'
import { copyToClipboard, useQuasar } from 'quasar' import { copyToClipboard, useQuasar } from 'quasar'
import { currentRouter } from '../../../router' import { currentRouter } from '../../../router'
import OrderdDetail from './OrderdDetail.vue' import OrderdDetail from './OrderdDetail.vue'
import BankAccount from '../../BankAccount.vue'
export default defineComponent({ export default defineComponent({
components: { OrderdDetail }, components: { OrderdDetail, BankAccount },
setup(props) { setup(props) {
const search = inject(DirtionmaryHelper.HOTEL_ORDER_SEARCH) as any const search = inject(DirtionmaryHelper.HOTEL_ORDER_SEARCH) as any
const { t } = useI18n() const { t } = useI18n()
...@@ -111,6 +221,8 @@ export default defineComponent({ ...@@ -111,6 +221,8 @@ export default defineComponent({
}) })
const data = reactive({ const data = reactive({
copyId: 0,
showBankAccount: false,
OrderID: '', OrderID: '',
showOrderdDetail: false, showOrderdDetail: false,
orders: [] as Array<any>, orders: [] as Array<any>,
...@@ -124,15 +236,11 @@ export default defineComponent({ ...@@ -124,15 +236,11 @@ export default defineComponent({
loadingCel: false, loadingCel: false,
loading: false, loading: false,
cols: [ cols: [
{ name: 'HotelName', label: t('v101.scatteredOrderList.table1'), align: 'left' }, { name: 'HotelName', label: t('v101.scatteredOrderList.table1'), field: (row: any) => row.HotelName, align: 'left' },
{ name: 'OrderID', label: t('v101.scatteredOrderList.table2'), field: (row: any) => row.OrderID, align: 'left' },
{ name: 'Number', label: t('v101.scatteredOrderList.table3'), field: (row: any) => row.Number, align: 'left' }, { name: 'Number', label: t('v101.scatteredOrderList.table3'), field: (row: any) => row.Number, align: 'left' },
{ name: 'TotalPrice', label: t('v101.scatteredOrderList.table4'), field: (row: any) => `円${row.TotalPrice.toFixed(2)}`, align: 'left' }, { name: 'DiscountMoney', label: t('v101.scatteredOrderList.youhui'), field: (row: any) => `${row.DiscountMoney.toFixed(2)}`, align: 'left' },
{ name: 'CustomerPayMoney', label: t('v101.scatteredOrderList.table5'), field: (row: any) => `円${row.CustomerPayMoney.toFixed(2)}`, align: 'left' }, { name: 'CustomerPayMoney', label: t('v101.scatteredOrderList.table5'), field: (row: any) => row.CustomerPayMoney.toFixed(2), align: 'left' },
{ name: 'OrderStatus', label: t('v101.scatteredOrderList.table6'), align: 'left' }, { name: 'Money', label: t('hotelorder.col.m'), field: (row: any) => row.Money.toFixed(2), align: 'left' },
{ name: 'CreateDateStr', label: t('v101.scatteredOrderList.table7'), field: (row: any) => row.CreateDateStr, align: 'left' },
{ name: 'operation', label: t('v101.scatteredOrderList.table8'), align: 'center' },
] as any, ] as any,
mobileCols: [ mobileCols: [
{ name: 'HotelName', label: t('v101.scatteredOrderList.table1'), align: 'left' }, { name: 'HotelName', label: t('v101.scatteredOrderList.table1'), align: 'left' },
...@@ -142,7 +250,20 @@ export default defineComponent({ ...@@ -142,7 +250,20 @@ export default defineComponent({
}) })
const methods = { const methods = {
ViewPayment() {
data.showBankAccount = true
},
canCelHotel(ThirdOrderNo) { canCelHotel(ThirdOrderNo) {
$q.dialog({
title: t('dialog.titles.horder'),
message: t('dialog.contents.horder'),
cancel: true,
persistent: true
}).onOk(() => {
methods.cancellations(ThirdOrderNo)
})
},
cancellations(ThirdOrderNo){
if(data.loadingCel) return if(data.loadingCel) return
let msg ={ let msg ={
bookingNumber:ThirdOrderNo, bookingNumber:ThirdOrderNo,
...@@ -178,7 +299,10 @@ export default defineComponent({ ...@@ -178,7 +299,10 @@ export default defineComponent({
if (r.data.resultCode == ApiResult.SUCCESS) { if (r.data.resultCode == ApiResult.SUCCESS) {
r.data.data.pageData.forEach((x: any) => { r.data.data.pageData.forEach((x: any) => {
x.typeInfo = data.status.find(y => y.StatusName == x.OrderStatus) ?? data.status[1] x.typeInfo = data.status.find(y => y.StatusName == x.OrderStatus) ?? data.status[1]
x.Money = 0
x.Money += Number(x.CustomerPayMoney-x.DiscountMoney)
}) })
console.log(r.data.data.pageData,'-----')
data.orders = r.data.data.pageData data.orders = r.data.data.pageData
data.pages.pageCount = r.data.data.pageCount data.pages.pageCount = r.data.data.pageCount
} else { } else {
...@@ -199,6 +323,19 @@ export default defineComponent({ ...@@ -199,6 +323,19 @@ export default defineComponent({
data.status = getHotelOrderStatus() data.status = getHotelOrderStatus()
data.rooms = getHotelRoomType() data.rooms = getHotelRoomType()
methods.initOrders() methods.initOrders()
},
setCopyHandler(order: any, ctx?: string) {
if (ctx) {
data.copyId = -1
copyToClipboard(ctx)
} else {
data.copyId = order.OrderID
copyToClipboard(order.ThirdOrderNo)
}
setTimeout(() => {
data.copyId = 0
}, 2000)
} }
} }
......
src/i18n/ja-RB/index.ts
View file @ 417ba251
...@@ -785,6 +785,8 @@ export default { ...@@ -785,6 +785,8 @@ export default {
table7: '発注日です', table7: '発注日です',
table8: '操作', table8: '操作',
quxiaodindan: 'キャンセルします', quxiaodindan: 'キャンセルします',
youhui: '恩恵',
xiangqing: '详细'
} }
...@@ -986,7 +988,9 @@ export default { ...@@ -986,7 +988,9 @@ export default {
tian: '日', tian: '日',
ms: '註文明細です', ms: '註文明細です',
ds: '総受注日数です', ds: '総受注日数です',
nt: '註文情報がありません' nt: '註文情報がありません',
zuo: '座',
nomoney: '見積もりは保留です',
}, },
CharteredBus: { CharteredBus: {
jiesongdianfw: '送迎点範囲です', jiesongdianfw: '送迎点範囲です',
......
src/i18n/ko-HG/index.ts
View file @ 417ba251
...@@ -784,7 +784,9 @@ export default { ...@@ -784,7 +784,9 @@ export default {
table6: '주문상태', table6: '주문상태',
table7: '주문하는 날', table7: '주문하는 날',
table8: '조작', table8: '조작',
quxiaodindan: '주문 취소' quxiaodindan: '주문 취소',
youhui: '할인',
xiangqing: '자세 한 정보'
} }
...@@ -986,7 +988,9 @@ export default { ...@@ -986,7 +988,9 @@ export default {
tian: '일', tian: '일',
ms: '주문서 명세', ms: '주문서 명세',
ds:"총 주문일수", ds:"총 주문일수",
nt:"주문 정보가 없습니다" nt:"주문 정보가 없습니다",
zuo: '쭤',
nomoney: '미지불 오퍼',
}, },
CharteredBus:{ CharteredBus:{
jiesongdianfw: '픽업점 범위', jiesongdianfw: '픽업점 범위',
......
src/i18n/zh-TW/index.ts
View file @ 417ba251
...@@ -784,7 +784,9 @@ export default { ...@@ -784,7 +784,9 @@ export default {
table6: '訂單狀態', table6: '訂單狀態',
table7: '下單日期', table7: '下單日期',
table8: '操作', table8: '操作',
quxiaodindan: '取消訂單' quxiaodindan: '取消訂單',
youhui: '优惠',
xiangqing: '详情'
} }
......
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