save

src/api/travel.ts

@@ -13,7 +13,11 @@ class travelService {
   }
   // 获取包机结算列表
   static async payList(params:any):Promise<HttpResponse>{
-    return request('sellorder_post_GetTravelTeamOrderList',params)
+    return request('travelteam_GetTravelTeamPartnerPage',params)
+  }
+  // 获取包机订单分页列表
+  static async getOrderList(params:any):Promise<HttpResponse>{
+    return request('sellorder_post_GetTravelTeamOrderPicList',params)
   }
 }
 

src/i18n/zh-TW/index.ts

@@ -358,7 +358,7 @@ export default {
     travel: {
       first: '包机',
       second: '包机服务',
-      three: ' '
+      three: '包机结算'
     }
   },
   login: {

src/pages/travel/OrderPayList.vue

@@ -2,19 +2,58 @@
 </style>
 <template>
 <div>
+  
+  <div class="rounded-borders bg-white row items-center q-pa-md">
+    <q-field :class="$q.platform.is.desktop ? '' : 'q-mb-md'" 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>
+    <q-input class="q-mr-md q-ml-md" v-model="search.GTeamName" dense standout label="团号"/>
+    <div class="col"></div>
+    <q-btn color="primary" unelevated :label="$t('query')"  @click="setQueryHandler"/>
+  </div>
+  <div v-for="item in orders" :key="item.id">
 
+    <div>合作伙伴:<span>{{item.ContactName}}</span></div>
+    <div>已入名单人数：<span>{{item.EntGuestNum}}</span></div>
+    <div>已入名单人数：<span>{{item.IsHaveFinance}}</span></div>
+    <div>报名总人数:<span>{{item.GuestNum}}</span></div>
+    <div>应收总金额：<span>{{item.PreferPrice}}</span></div>
+    <div>退款金额：<span>{{item.Refund}}</span></div>
+    <div>平台税金:<span>{{item.PlatformTax}}</span></div>
+    <div>实收：<span>{{item.Income}}</span></div>
+    <div>在途金额：<span>{{item.ZaiTuMoney}}</span></div>
+    <div>折扣金额:<span>{{item.DiscountMoney}}</span></div>
+    <div>大红包抵扣金额：<span>{{item.RedEnvelopeMoney}}</span></div>
+    <div>代收总金额：<span>{{item.DueInMoney}}</span></div>
+    <div>利润（先给这个字段，规则还没有）：<span>{{item.CommissionRate}}</span></div></div>
 </div>
 </template>
 <script lang="ts">
-  import { inject, provide, reactive, toRefs, defineComponent,onMounted } from 'vue';
+  import { inject, provide, reactive, toRefs, defineComponent,onMounted, ref } from 'vue';
 import travelService from "../../api/travel";
 import { ApiResult } from "../../@types/enumHelper";
 import message from "../../utils/message";
 import { useRoute } from 'vue-router'
+import { date } from 'quasar'
 export default defineComponent({
   setup(props) {
+    const qDateProxy = ref(null) as any
+    const dateRange = reactive({from: '', to: ''})
+    dateRange.to = date.formatDate(date.addToDate(new Date(), { days: 50 }), 'YYYY/MM/DD')
+    dateRange.from = date.formatDate(date.addToDate(new Date(), { days: 20 }), 'YYYY/MM/DD')
+    const dateRangeFormat = ref(`${dateRange.from} - ${dateRange.to}`)
     const {query, params} = useRoute()
+    const search = {
+        GTeamName: '',   
+        SelectEndDate: '',     
+        SelectStartDate: '',
+      }
     const data = reactive({
+      
       info: {},
       copyId: 0,
       showAddOrder: false,
@@ -30,28 +69,30 @@ export default defineComponent({
       loading: false,
     });
 
-    
+    search.SelectStartDate = dateRange.from
+    search.SelectEndDate = dateRange.to
     const methods = {
+      setQueryHandler() {
+        data.pages.pageIndex = 1
+        this.initOrders()
+      },
+      dateRangeHandler(e: any) {
+        search.SelectStartDate = `${e.from.year}/${e.from.month}/${e.from.day}`
+        search.SelectEndDate = `${e.to.year}/${e.to.month}/${e.to.day} `
+        dateRangeFormat.value = `${search.SelectStartDate} - ${search.SelectEndDate} `
+        if (qDateProxy.value) qDateProxy.value.hide()
+      },
+      optionsFn(cd: any) {
+        return cd >= date.formatDate(date.addToDate(new Date(), { days: 20 }), 'YYYY/MM/DD')
+      },
       initOrders() {
         data.loading = true;
-        let param = {
-          TCID: ''
-        }
+        let param = Object.assign(data.pages, search);
         travelService
           .payList(param)
           .then((r) => {
             data.loading = false;
             if (r.data.resultCode == ApiResult.SUCCESS) {
-              // r.data.data.pageData.forEach((x: any) => {
-              //   x.typeInfo = data.status.find(y => y.StatusId == x.OrderStatus) ?? data.status[1]
-              //   x.SendType = data.sends.find(y => y.Id == x.MailingState) ?? data.sends[0]
-              //   x.Money = 0
-              //   let Money = 0
-              //   x.DetailList.forEach((y:any)=>{
-              //     Money+=y.Money
-              //   })
-              //   x.Money= Number(Money+x.MailingMoney)
-              // })
               data.orders = r.data.data.pageData;
               data.pages.pageCount = r.data.data.pageCount;
             } else {
@@ -64,9 +105,13 @@ export default defineComponent({
           });
       },
     }
+    methods.initOrders()
     return {
       ...toRefs(data),
       ...methods,
+      search,
+      dateRangeFormat,
+      dateRange
     };
   }
 })

src/pages/travel/components/OrderList.vue

@@ -11,30 +11,21 @@
         <div class="mb-title">
           <i class="iconfont icon-biaoti1"></i><span>包机信息</span>
         </div>
-        {{ x.GTeamName }}
-        <div class="mb">
-          <span>{{ x.Title }}</span>
+        <div>
+          ：<span>{{ x.orderId }}</span>
+        </div>
+        <div>
+          ：<span>{{ x.orderId }}</span>
         </div>
         <div>
-          出发日期：<span>{{ x.StartDate }}</span>
+          ：<span>{{ x.orderId }}</span>
         </div>
         <div>
-          团队信息：<span>{{ x.TCNUM }}({{ x.TCID }})</span>
+          ：<span>{{ x.orderId }}</span>
         </div>
       </div>
       <div class="col-4">
                 <div class="mb-title"><i class="iconfont icon-hangban1"></i><span>航班信息</span></div>
-        <div
-          class="mb"
-          v-for="(subItem, subIndex) in x.TravelTeamFlightList"
-          :key="subIndex + 1000"
-        >
-          <div>
-            {{ subItem.Flight_number }} {{ subItem.DepartureAirPortName }}
-            {{ subItem.Departure_time }} {{ subItem.ArrivalAirPortName }}
-            {{ subItem.Arrival_time }}
-          </div>
-        </div>
       </div>
       <div class="col-2">
         <div>
@@ -79,6 +70,7 @@
       </div>
       <div class="col-1">
         <q-btn color="primary" unelevated @click="ViewPayment(x)">下单</q-btn>
+        <q-btn color="primary" unelevated @click="gotoUrl(x)">包机结算</q-btn>
       </div>
     </q-card>
     <q-card
@@ -129,10 +121,12 @@ import { currentRouter } from "../../../router";
 // import OrderdDetail from './OrderdDetail.vue'
 // import BankAccount from '../../BankAccount.vue'
 import AddOrder from "./addOrder.vue";
+import {useRouter} from 'vue-router'
 
 export default defineComponent({
   components: { AddOrder },
   setup(props) {
+    const $router = useRouter()
     const search = inject(DirtionmaryHelper.TRAVEL_ORDER_OBJ) as any;
     const { t } = useI18n();
     const $q = useQuasar();
@@ -173,6 +167,10 @@ export default defineComponent({
         console.log("ViewPayment", toRaw(info));
         data.showAddOrder = true;
       },
+      gotoUrl(x) {
+        console.log('`/travel/payList?id=${x.TCID}`')
+        $router.push({ path:`/travel/payList`, query: {id: x.TCID}})
+      },
       canCelHotel(ThirdOrderNo) {
         $q.dialog({
           title: t("dialog.titles.horder"),
@@ -217,7 +215,7 @@ export default defineComponent({
         data.loading = true;
         let param = Object.assign(data.pages, search);
         travelService
-          .getTravelList(param)
+          .getOrderList(param)
           .then((r) => {
             data.loading = false;
             if (r.data.resultCode == ApiResult.SUCCESS) {

src/pages/travel/components/OrderListHeader.vue

 <template>
+  <!--
+    接口文档地址
+     http://dev.api.oytour.com/#/home/project/inside/api/detail?groupID=20&childGroupID=730&apiID=4386&projectName=REBORN&projectID=2
+
+    参考
+    http://dev.api.oytour.com/#/home/project/inside/api/detail?groupID=157&childGroupID=170&apiID=1010&projectName=REBORN&projectID=2
+  
+  -->
   <div class="rounded-borders bg-white row items-center q-pa-md">
+    <div>
+      <span>订单状态</span>
+      <q-select v-model="search.OrderState"></q-select>
+    </div>
+    <div>
+      <span>参团类型</span>
+      <q-select v-model="search.GroupType"></q-select>
+    </div>
+    <div>
+      <span>订单来源</span>
+      <q-select v-model="search.OrderSource"></q-select>
+    </div>
+    <div>
+      <span>支付状态</span>
+      <q-select v-model="search.PayStatus"></q-select>
+    </div>
+    <q-field :class="$q.platform.is.desktop ? '' : 'q-mb-md'" 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>
     <q-field :class="$q.platform.is.desktop ? '' : 'q-mb-md'" 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">
@@ -7,7 +38,7 @@
           @range-end="dateRangeHandler"></q-date>
       </q-popup-proxy>
     </q-field>
-    <q-input class="q-mr-md q-ml-md" v-model="search.TCID" dense standout label="团号"/>
+    <q-input class="q-mr-md q-ml-md" v-model="search.TCNUM" dense standout label="团号"/>
     <div class="col"></div>
     <q-btn color="primary" unelevated :label="$t('query')"  @click="setQueryHandler"/>
   </div>
@@ -33,7 +64,7 @@ export default defineComponent({
       setQueryHandler(){
         realSearch.StartTime=search.StartTime
         realSearch.EndTime=search.EndTime
-        realSearch.TCID=search.TCID
+        realSearch.TCNUM=search.TCNUM
       },
       dateRangeHandler(e: any) {
         search.StartTime = `${e.from.year}/${e.from.month}/${e.from.day}`

src/pages/travel/components/productHeader.vue

+<template>
+  <div class="rounded-borders bg-white row items-center q-pa-md">
+    <q-field :class="$q.platform.is.desktop ? '' : 'q-mb-md'" 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>
+    <q-input class="q-mr-md q-ml-md" v-model="search.TCID" dense standout label="团号"/>
+    <div class="col"></div>
+    <q-btn color="primary" unelevated :label="$t('query')"  @click="setQueryHandler"/>
+  </div>
+</template>
+
+<script lang="ts">
+import { DirtionmaryHelper } from '../../../config/dictionary'
+import { defineComponent, inject, reactive, ref } from 'vue'
+import { date } from 'quasar'
+
+export default defineComponent({
+  setup(props) {
+    const qDateProxy = ref(null) as any
+    const realSearch = inject(DirtionmaryHelper.TRAVEL_ORDER_OBJ) as any
+    const search = reactive(JSON.parse(JSON.stringify(realSearch)))
+    const dateRange = reactive({from: '', to: ''})
+    dateRange.to = date.formatDate(date.addToDate(new Date(), { days: 50 }), 'YYYY/MM/DD')
+    dateRange.from = date.formatDate(date.addToDate(new Date(), { days: 20 }), 'YYYY/MM/DD')
+    const dateRangeFormat = ref(`${dateRange.from} - ${dateRange.to}`)
+    search.StartTime = dateRange.from
+    search.EndTime = dateRange.to
+    const methods = {
+      setQueryHandler(){
+        realSearch.StartTime=search.StartTime
+        realSearch.EndTime=search.EndTime
+        realSearch.TCID=search.TCID
+      },
+      dateRangeHandler(e: any) {
+        search.StartTime = `${e.from.year}/${e.from.month}/${e.from.day}`
+        search.EndTime = `${e.to.year}/${e.to.month}/${e.to.day} `
+        dateRangeFormat.value = `${search.StartTime} - ${search.EndTime} `
+        if (qDateProxy.value) qDateProxy.value.hide()
+      },
+      optionsFn(cd: any) {
+        return cd >= date.formatDate(date.addToDate(new Date(), { days: 20 }), 'YYYY/MM/DD')
+      },
+    }
+    return {
+      ...methods,
+      search,
+      dateRange,
+      dateRangeFormat
+      
+    }
+  }
+})
+</script>
+
+<style></style>

src/pages/travel/components/productList.vue

+<template>
+  <div>
+    <q-card
+      class="light-shadow q-pa-md bg-white rounded-borders q-mb-md"
+      flat
+      :class="$q.platform.is.desktop ? 'row' : ''"
+      v-for="(x, index) in orders"
+    >
+      <div class="col-2">
+
+        <div class="mb-title">
+          <i class="iconfont icon-biaoti1"></i><span>包机信息</span>
+        </div>
+        {{ x.GTeamName }}
+        <div class="mb">
+          <span>{{ x.Title }}</span>
+        </div>
+        <div>
+          出发日期：<span>{{ x.StartDate }}</span>
+        </div>
+        <div>
+          团队信息：<span>{{ x.TCNUM }}({{ x.TCID }})</span>
+        </div>
+      </div>
+      <div class="col-4">
+                <div class="mb-title"><i class="iconfont icon-hangban1"></i><span>航班信息</span></div>
+        <div
+          class="mb"
+          v-for="(subItem, subIndex) in x.TravelTeamFlightList"
+          :key="subIndex + 1000"
+        >
+          <div>
+            {{ subItem.Flight_number }} {{ subItem.DepartureAirPortName }}
+            {{ subItem.Departure_time }} {{ subItem.ArrivalAirPortName }}
+            {{ subItem.Arrival_time }}
+          </div>
+        </div>
+      </div>
+      <div class="col-2">
+        <div>
+          <div class="mb-title">
+            <i class="iconfont icon-jiage"></i><span>团位信息</span>
+          </div>
+          <div class="mb">
+            <span>经济舱: {{ x.YSeat }}</span>
+          </div>
+          <div class="mb">
+            <span>商务舱: {{ x.CSeat }}</span>
+          </div>
+          <div class="mb">
+            <span>头等舱: {{ x.FSeat }}</span>
+          </div>
+        </div>
+      </div>
+      <div class="col-3">
+        <div class="mb-title">
+          <i class="iconfont icon-jiage"></i><span>价格信息</span>
+        </div>
+        <div class="mb">
+          <span>中心价: {{ x.B2BMemberPrice }}</span>
+        </div>
+        <div class="mb">
+          <span
+            >小孩占床: {{ x.ChildNeedPrice }}&nbsp;不占床:
+            {{ x.ChildNoNeedPrice }}</span
+          >
+        </div>
+        <div class="mb">
+          <span
+            >婴儿: {{ x.BabyPrice }}&nbsp; 婴儿附加费: {{ x.BabyChargePrice }}</span
+          >
+        </div>
+        <div class="mb">
+          <span
+            >老人附加费: {{ x.OldManChargePrice }} &nbsp;签证:
+            {{ x.VisaPrice }}</span
+          >
+        </div>
+      </div>
+      <div class="col-1">
+        <q-btn color="primary" unelevated @click="ViewPayment(x)">下单</q-btn>
+        <q-btn color="primary" unelevated @click="gotoUrl(x)">包机结算</q-btn>
+      </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="showOrderdDetail">
+    <!-- <OrderdDetail :OrderID="OrderID"></OrderdDetail> -->
+  </q-dialog>
+
+  <q-dialog v-model="showAddOrder">
+    <AddOrder :info="info" @close="showAddOrder = false"></AddOrder>
+  </q-dialog>
+</template>
+
+<script lang="ts">
+import { DirtionmaryHelper } from "../../../config/dictionary";
+import { defineComponent, inject, reactive, toRefs, watch, toRaw } from "vue";
+import travelService from "../../../api/travel";
+import { ApiResult } from "../../../@types/enumHelper";
+import message from "../../../utils/message";
+import { RoomType, StandardStatus } from "../../../@types";
+import { getHotelOrderStatus, getHotelRoomType, moneyFormat } from "../../../utils/tools";
+import { useI18n } from "vue-i18n";
+import svgIcon from "../../../global/svg-icon.vue";
+import { copyToClipboard, useQuasar } from "quasar";
+import { currentRouter } from "../../../router";
+// import OrderdDetail from './OrderdDetail.vue'
+// import BankAccount from '../../BankAccount.vue'
+import AddOrder from "./addOrder.vue";
+import {useRouter} from 'vue-router'
+
+export default defineComponent({
+  components: { AddOrder },
+  setup(props) {
+    const $router = useRouter()
+    const search = inject(DirtionmaryHelper.TRAVEL_ORDER_OBJ) as any;
+    const { t } = useI18n();
+    const $q = useQuasar();
+
+    watch(search, (n, o) => {
+      if (data.loading) return;
+      data.pages.pageIndex = 1;
+      data.orders = [];
+      methods.initOrders();
+    });
+
+    const data = reactive({
+      info: {},
+      copyId: 0,
+      showAddOrder: false,
+      OrderID: "",
+      showOrderdDetail: false,
+      orders: [] as Array<any>,
+      status: [] as Array<StandardStatus>,
+      rooms: [] as Array<RoomType>,
+      pages: {
+        pageIndex: 1,
+        pageSize: 10,
+        pageCount: 0,
+      },
+      loadingCel: false,
+      loading: false,
+    });
+
+    const methods = {
+      changePageHandler(n: any) {
+        console.log(n);
+        data.pages.pageIndex = n;
+        methods.initOrders();
+      },
+      ViewPayment(info: any) {
+        data.info = toRaw(info);
+        console.log("ViewPayment", toRaw(info));
+        data.showAddOrder = true;
+      },
+      gotoUrl(x) {
+        console.log('`/travel/payList?id=${x.TCID}`')
+        $router.push({ path:`/travel/payList`, query: {id: x.TCID}})
+      },
+      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;
+        let msg = {
+          bookingNumber: ThirdOrderNo,
+          CancelBy: search.CustomerId,
+          CancelType: 2,
+        };
+        let param = Object.assign(msg);
+        data.loadingCel = true;
+        travelService
+          .getTravelList(param)
+          .then((r) => {
+            if (r.data.resultCode == ApiResult.SUCCESS) {
+              message.successMsg(`${t("success")}`);
+              methods.initOrders();
+            } else {
+              message.errorMsg(r.data.message);
+            }
+            data.loadingCel = false;
+          })
+          .catch((e) => {
+            message.errorMsg(e.message);
+            data.loadingCel = false;
+          });
+      },
+      getDetail(OrderID) {
+        data.showOrderdDetail = true;
+        data.OrderID = OrderID;
+      },
+
+      initOrders() {
+        data.loading = true;
+        let param = Object.assign(data.pages, search);
+        travelService
+          .getTravelList(param)
+          .then((r) => {
+            data.loading = false;
+            if (r.data.resultCode == ApiResult.SUCCESS) {
+              // r.data.data.pageData.forEach((x: any) => {
+              //   x.typeInfo = data.status.find(y => y.StatusId == x.OrderStatus) ?? data.status[1]
+              //   x.SendType = data.sends.find(y => y.Id == x.MailingState) ?? data.sends[0]
+              //   x.Money = 0
+              //   let Money = 0
+              //   x.DetailList.forEach((y:any)=>{
+              //     Money+=y.Money
+              //   })
+              //   x.Money= Number(Money+x.MailingMoney)
+              // })
+              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;
+          });
+      },
+      init() {
+        data.status = getHotelOrderStatus();
+        data.rooms = getHotelRoomType();
+        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);
+      },
+    };
+
+    methods.init();
+    return {
+      ...toRefs(data),
+      ...methods,
+      moneyFormat,
+    };
+  },
+});
+</script>
+
+<style>
+.light-border table,
+.light-border table td,
+.light-border .q-table__middle,
+.light-border.borders,
+.light-border table th {
+  border-color: #eee !important;
+  white-space: wrap;
+}
+.light-border .room-item {
+  height: 28px;
+  line-height: 28px;
+  border-bottom: 1px solid #eee;
+}
+.light-border .room-item:last-child {
+  border-bottom: none;
+}
+.light-border .max-hotelname {
+  width: 140px;
+  height: 28px;
+  line-height: 28px;
+}
+.orderListDialog-title {
+  position: relative;
+}
+.orderListDialog-title span {
+  font-size: 20px;
+}
+.orderListDialog-close {
+  position: absolute;
+  right: 0;
+  top: -10px;
+  font-size: 26px;
+}
+.orderListDialog-bg {
+  background: #5098ff;
+  border-radius: 10px;
+}
+.orderListDialog-img {
+  background: url("../../../assets/images/wallet.png") no-repeat right #5098ff;
+  background-size: 97px 100%;
+}
+</style>
+<style scoped>
+.mb-title {
+  font-weight: bold;
+  margin-bottom: 10px;
+}
+.mb {
+  margin-bottom: 10px;
+}
+</style>
\ No newline at end of file

src/pages/travel/order.vue

@@ -14,8 +14,8 @@ import { SendType, StandardStatus } from '../../@types'
 import { ApiResult } from '../../@types/enumHelper'
 import message from '../../utils/message'
 import { useI18n } from 'vue-i18n'
-import OrderListHeader from './components/OrderListHeader.vue';
-import OrderList from './components/OrderList.vue';
+import OrderListHeader from './components/productHeader.vue';
+import OrderList from './components/productList.vue';
 import { DirtionmaryHelper } from '../../config/dictionary';
   export default defineComponent({
     components: {OrderListHeader, OrderList},

src/pages/travel/orderList.vue

+<template>
+  <div class="fix-height-subpage column no-wrap q-pa-md">
+    <order-list-header></order-list-header>
+    <div class="col q-mt-md">
+      <order-list></order-list>
+    </div>
+  </div>
+</template>
+  
+  <script lang="ts">
+  import { inject, provide, reactive, toRefs, defineComponent,onMounted } from 'vue';
+import travelService from '../../api/travel'
+import { SendType, StandardStatus } from '../../@types'
+import { ApiResult } from '../../@types/enumHelper'
+import message from '../../utils/message'
+import { useI18n } from 'vue-i18n'
+import OrderListHeader from './components/OrderListHeader.vue';
+import OrderList from './components/OrderList.vue';
+import { DirtionmaryHelper } from '../../config/dictionary';
+  export default defineComponent({
+    components: {OrderListHeader, OrderList},
+    props: ['OrderId'],
+    setup(props) {
+    const { t } = useI18n()
+       const data = reactive({
+      PaymentDialog: false,
+      orders: [] as Array<any>,
+      status: [] as Array<StandardStatus>,
+      sends: [] as Array<SendType>,
+      showBankAccount: false,
+      pages: {
+        pageIndex: 1,
+        pageSize: 10,
+        pageCount: 0
+      },
+      loading: false,
+      copyId: 0,
+      expendsOrderId: 0,
+      cols: [
+        { name: 'Date', label: t('v102.ticket.jq')+'('+t('v102.ticket.d')+')', field: (row: any) => row.Date, align: 'left' },
+        { name: 'TicketName', label: t('v102.ticket.hn'), field: (row: any) => row.TicketName, align: 'left' },
+        { name: 'Num', label: t('v102.ticket.sl'), field: (row: any) => row.Num, align: 'left' },
+        { name: 'Money', label: t('hotelorder.col.m'), field: (row: any) => row.Money, align: 'left' }
+      ] as any[],
+      modifyOrder:{} as any,
+      showModify:false,
+    })
+
+      const search = reactive({
+        GTeamName:"", // 包机名称
+        FlightCompany:"", // 航空公司
+        FlightNo:"", // 航班号  
+        SelectEndDate:"", // 出发开始时间  
+        SelectStartDate:"", // 出发结算时间
+      })
+      const methods = {
+      }
+      provide(DirtionmaryHelper.TRAVEL_ORDER_OBJ,search)
+      onMounted(()=>{
+        
+      })
+      return {
+        // ...toRefs(data),
+        ...methods
+      }
+    }
+  })
+  </script>
+  
+  <style>
+  
+  </style>
+  
\ No newline at end of file

src/router/routes.ts

@@ -37,6 +37,8 @@ const routes: RouteRecordRaw[] = [
       { path: '/scheduledTrip/preview/:tripId', component: () => import('pages/scheduledTrip/TripOrderPreview.vue') },
       { path: '/scheduledTrip/order/:orderId?', component: () => import('pages/scheduledTrip/TripOrder.vue') },
       { path: '/travel/order', component: () => import('pages/travel/order.vue') },
+      { path: '/travel/payList', component: () => import('pages/travel/OrderPayList.vue') },
+      { path: '/travel/orderList', component: () => import('pages/travel/orderList.vue') },
     ]
   },
   {

src/utils/menus.ts

@@ -150,12 +150,12 @@ const useMenus = {
                     id: 21,
                     parentId: 20,
                 },
-                // {
-                //     name: t('menu.travel.three'),
-                //     url: '/comingsoon',
-                //     id: 12,
-                //     parentId: 10,
-                // }
+                {
+                    name: t('menu.travel.three'),
+                    url: '/travel/orderList',
+                    id: 22,
+                    parentId: 20,
+                }
             ]
         })
         return menus