完善部分信息

.vscode/settings.json

 {
-  
-  "vetur.experimental.templateInterpolationService": true
+
+  "vetur.experimental.templateInterpolationService": true,
+  "vue-i18n.i18nPaths": "src/i18n"
 }

package.json

@@ -20,6 +20,10 @@
     "qrcode.vue": "^1.7.0",
     "qrcodejs2": "^0.0.2",
     "quasar": "^1.0.0",
+    "v-viewer": "^1.6.4",
+    "vue-concise-slider": "^4.2.5",
+    "vue-core-video-player": "^0.2.0",
+    "vue-core-video-players": "0.0.5",
     "vue-i18n": "^8.0.0"
   },
   "devDependencies": {

quasar.conf.js

@@ -90,7 +90,7 @@ module.exports = function( /* ctx */ ) {
         // https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-framework
         framework: {
             iconSet: 'material-icons', // Quasar icon set
-            lang: 'en-us', // Quasar language pack
+            lang: 'zh-hant', // Quasar language pack
 
             // Possible values for "all":
             // * 'auto' - Auto-import needed Quasar components & directives
@@ -149,7 +149,20 @@ module.exports = function( /* ctx */ ) {
                 'QCheckbox',
                 'QPagination',
                 'QRadio',
-                'QCardSection'
+                'QCardSection',
+                'QBreadcrumbs',
+                'QBreadcrumbsEl',
+                'QExpansionItem',
+                'QRange',
+                'QPageSticky',
+                'QTabPanels',
+                'QTabPanel',
+                'QTimeline',
+                'QTimelineEntry',
+                'QResponsive',
+                'QTooltip',
+                'QBadge',
+                'QParallax'
             ],
 
             directives: [
@@ -258,4 +271,4 @@ module.exports = function( /* ctx */ ) {
             }
         }
     }
-}
\ No newline at end of file
+}

src/App.vue

@@ -10,7 +10,7 @@ export default {
 };
 </script>
 <style>
-@import url("//at.alicdn.com/t/font_1890699_t3cp3liyfpg.css");
+@import url("//at.alicdn.com/t/c/font_1890699_q162a9wo98a.css");
 @font-face {
   font-family: "oswald";
   src: url("https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/smallapp/Oswald-Regular.ttf");
@@ -22,16 +22,35 @@ body {
     Microsoft JhengHei;
   background-color: #f6f6f6;
 }
-
+.rounded-borders{
+  border-radius: 6px !important;
+}
 .section-block {
   width: 100%;
   max-width: 1200px;
   margin: 0 auto;
 }
+.f12{
+  font-size: 12px !important;
+  font-family: "Noto Sans SC", 微软雅黑, "Microsoft YaHei", sans-serif !important;
+  font-weight: 400 !important;
+}
+.text-middle{
+  display: flex;
+    align-items: center;
+}
 @media only screen and (max-width: 1200px) {
   .section-block {
     max-width: 768px !important;
     padding:0 20px !important;
   }
 }
-</style>
\ No newline at end of file
+.light-shadow{
+  box-shadow: 0px 0px 20px 0px rgba(76, 87, 125, 0.2) !important
+}
+.product-price {
+    font-family: Arial Rounded MT Bold,Arial Rounded MT,sans-serif;
+    letter-spacing: 0;
+    text-align: right;
+}
+</style>

src/boot/utils.js

 import Vue from 'vue'
 import axios from 'axios'
 import md5 from 'js-md5'
+import VueCoreVideoPlayer from 'vue-core-video-players'
+import 'viewerjs/dist/viewer.css'
+import VueViewer from 'v-viewer'
+// import VueCoreVideoPlayer from 'vue-core-video-player'
 
+Vue.use(VueCoreVideoPlayer)
+Vue.use(VueViewer)
 //域名管理对象
 Vue.prototype.domainManager = function () {
   let domainUrl = '';
@@ -13,6 +19,7 @@ Vue.prototype.domainManager = function () {
     domainUrl = "http://testapi.oytour.com";
   } else if (domainNameUrl.indexOf('oytour') !== -1) {
     domainUrl = "http://reborn.oytour.com";
+    domainUrl = 'http://192.168.10.206:8015'
   }
   var obj = {
     //主地址
@@ -29,10 +36,48 @@ Vue.prototype.domainManager = function () {
 Vue.prototype.GetDomain=function()
 {
     var domainNameUrl =window.location.hostname;
-    //domainNameUrl="tmb2b.oytour.com";
+    domainNameUrl="t.oytour.com";
     return domainNameUrl;
 }
-
+Vue.prototype.groupBy = function (array, f){
+  const groups = {};
+  array.forEach((item) => {
+      const group = JSON.stringify(f(item));
+      groups[group] = groups[group] || [];
+      groups[group].push(item);
+  });
+  return Object.keys(groups).map((group) => {
+      return {
+        key:group.replace(/\"/g,""),
+        data:groups[group]
+      };
+  });
+}
+Vue.prototype.moneyFormat = function(num, decimal = 2, split = ',') {
+  function thousandFormat (num){
+    const len = num.length
+    return len <= 3 ? num : thousandFormat(num.substr(0, len - 3)) + split + num.substr(len - 3, 3)
+  }
+  if (isFinite(num)) { // num是数字
+    if (num === 0) { // 为0
+      return num.toFixed(decimal)
+    } else { // 非0
+      var res = ''
+      var dotIndex = String(num).indexOf('.')
+      if (dotIndex === -1) { // 整数
+        res = thousandFormat(String(num)) + (decimal>0?'.':'') + '0'.repeat(decimal)
+      } else {
+        decimal = decimal==0?2:decimal
+        const numStr = String((Math.round(num * Math.pow(10, decimal)) / Math.pow(10, decimal)).toFixed(decimal)) // 四舍五入，然后固定保留2位小数
+        const decimals = numStr.slice(dotIndex, dotIndex + decimal + 1) // 截取小数位
+        res = thousandFormat(numStr.slice(0, dotIndex)) + decimals
+      }
+      return res
+    }
+  } else {
+    return '--'
+  }
+}
 //HTTP提交数据
 Vue.prototype.apipost = function (cmd, msg, successCall, faildCall) {
   if (msg == null || msg == "") {

src/components/label_background_article/left.vue

 <template>
   <!--背景圖 - 文左-->
-  <div class="q-mt-lg">
-    <section class="about1" :style="{backgroundImage:`url('${plugData.ImageUrl}')`}">
+  <div class="q-mt-md">
+    <section
+      class="about1"
+      :style="{ backgroundImage: `url('${plugData.ImageUrl}')` }"
+      :class="{ padding: isPadding }"
+    >
       <div class="section-block">
         <div class="about-main">
-          <h2 class="about-title">{{plugData.Title}}</h2>
-          <div class="about-content">
-            {{plugData.Describe}}
+          <h2 class="about-title">{{ plugData.Title.split("|")[0] }}</h2>
+          <div class="about-content f12">
+            {{ plugData.Describe }}
           </div>
+          <q-btn
+          v-if="link"
+            label="立即奔赴"
+            class="q-mt-md"
+            icon-right="iconfont iconswap-right"
+            style="background: rgba(210, 210, 210, 0.7)"
+            unelevated
+            @click="OpenNewUrl"
+          />
         </div>
       </div>
     </section>
   </div>
 </template>
 <script>
-  export default {
-    props: ["plugData"],
-  };
-
+export default {
+  props: ["plugData"],
+  data() {
+    return {
+      isPadding: false,
+      link: "",
+    };
+  },
+  mounted() {
+    if (this.plugData) {
+      if (this.plugData.Title.indexOf("|padding") != -1) {
+        this.isPadding = true;
+      }
+      if (this.plugData.Title.indexOf("http://") != -1) {
+        let t = this.plugData.Title.split("|").find(
+          (x) => x.indexOf("http://") != -1
+        );
+        this.link = t;
+      }
+    }
+  },
+  methods: {
+    OpenNewUrl(){
+      window.location.href=this.link
+    }
+  },
+};
 </script>
 <style>
-  .about1 {
-    background-size: cover;
-    background-position: center;
-    position: relative;
-    margin: 0;
-    padding: 0;
-    border: 0;
-  }
+.about1 {
+  background-size: cover;
+  background-position: center;
+  position: relative;
+  margin: 0;
+  padding: 0;
+  border: 0;
+}
+.about1.padding {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0 16px;
+  border-radius: 5px;
+  overflow: hidden;
+}
+.about1::after {
+  top: 0;
+  left: 0;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.4);
+  content: "";
+  right: 0;
+  position: absolute;
+  bottom: 0;
+}
 
-  .about1::after {
-    top: 0;
-    left: 0;
-    height: 100%;
-    background-color: rgba(0, 0, 0, 0.4);
-    content: "";
-    right: 0;
-    position: absolute;
-    bottom: 0;
-  }
+.about1 .about-main {
+  position: relative;
+  padding: 100px 0;
+  z-index: 2;
+  width: 50%;
+  color: #fff;
+  font-weight: 700;
+  letter-spacing: 1px;
+}
 
-  .about1 .about-main {
-    position: relative;
-    padding: 100px 0;
-    z-index: 2;
-    width: 50%;
-    color: #fff;
-    font-weight: 700;
-    letter-spacing: 1px;
-  }
+.about1 .about-main .about-title {
+  margin-bottom: 35px;
+  font-size: 38px;
+  margin: 0;
+  padding: 0;
+  line-height: unset;
+  font-weight: 600;
+}
 
-  .about1 .about-main .about-title {
-    margin-bottom: 35px;
-    font-size: 38px;
-    margin: 0;
-    padding: 0;
-    line-height: unset;
-    font-weight: 600;
-  }
-
-  .about1 .about-main .about-content {
-    font-size: 16px;
-    line-height: 2.1;
-    margin: 0;
-    padding: 0;
-  }
+.about1 .about-main .about-content {
+  font-size: 16px;
+  line-height: 2.1;
+  margin: 0;
+  padding: 0;
+}
 
-  @media only screen and (max-width: 1200px) {
-    .about1 .about-main {
-      padding-right: 30px !important;
-      padding-left: 30px !important;
-      width: 100% !important;
-    }
+@media only screen and (max-width: 1200px) {
+  .about1 .about-main {
+    padding-right: 30px !important;
+    padding-left: 30px !important;
+    width: 100% !important;
   }
-
+}
 </style>

src/components/label_paragraph_title/paragraph1.vue

 <template>
-  <div class="q-mt-lg">
+  <div class="q-mt-xl">
     <section class="section-block about6">
        <!--段落標題 - 1x1-->
       <h2 class="about-title">{{plugData.Title}}</h2>
-      <ul class="about-list">
+      <ul class="about-list" v-if="plugData.Describe">
         <li class="list-item">
           <div class="content">
               {{plugData.Describe}}

src/components/search_s/search_s1.vue

 <template>
   <!--搜尋輪播橫 - 大-->
-  <div>
+  <div class="big-slider">
     <q-carousel v-model="slide" transition-prev="slide-right" transition-next="slide-left" :autoplay="true" swipeable
       animated control-color="white" padding arrows infinite height="410px"
       class="bg-primary text-white shadow-1 rounded-borders">

src/components/search_s/search_s3.vue

 <template>
   <!--搜尋輪播橫 - 小-->
-  <div>
+  <div class="small-slider">
     <q-carousel v-model="slide" transition-prev="slide-right" transition-next="slide-left" :autoplay="true" swipeable
       animated control-color="white" padding arrows infinite height="235px"
       class="bg-primary text-white shadow-1 rounded-borders">

src/components/trip/calendar.vue

+<template>
+  <div>
+    <div class="text-subtitle2 text-weight-bold">選擇日期、選項</div>
+    <div class="text-grey-6 f12 q-my-md">請選擇出發日期</div>
+    <div class="rounded-borders" style="border: 1px solid #eee">
+      <div class="q-px-lg q-py-sm row items-center">
+        <div class="text-subtitle2 text-weight-bold col">
+          {{ months[currentMonth].display }}
+        </div>
+        <div>
+          <q-btn
+            color="primary"
+            round
+            icon="iconfont iconpreviewleft"
+            flat
+            @click="changeShowMonthHandler(-1)"
+            class="q-mr-sm"
+            :disable="currentMonth == 0"
+          />
+          <q-btn
+            color="primary"
+            round
+            icon="iconfont iconpreviewright"
+            flat
+            @click="changeShowMonthHandler(1)"
+            :disable="currentMonth == months.length - 1"
+          />
+        </div>
+      </div>
+      <div class="q-pa-sm non-selectable" style="border-top: 1px solid #eee">
+        <div class="row items-center">
+          <div
+            class="col text-weight-bold text-center"
+            style="padding: 10px 0 20px"
+            v-for="(x, i) in chineseWeek"
+            :key="i"
+          >
+            {{ x }}
+          </div>
+        </div>
+        <div class="row wrap">
+          <div
+            class="rounded-borders text-center text-weight-bold"
+            :class="{
+              'cursor-pointer hover-date': x.value != '' && x.price,
+              'cursor-not-allowed': !x.price && x.value != '',
+              'bg-primary': x.value != '' && x.value == currentDate,
+            }"
+            style="padding: 8px 4px; width: 14.285%"
+            v-for="(x, i) in col"
+            :key="i"
+            @click="chosenDateHandler(x)"
+          >
+            <div
+              class="text-dark"
+              :class="{ 'text-white': x.value == currentDate }"
+              v-if="x.price"
+            >
+              {{ x.display }}
+            </div>
+            <div class="text-grey-6" v-else>{{ x.display }}</div>
+            <div
+              class="q-mt-sm f12"
+              :class="{
+                'text-grey-1': x.value == currentDate,
+                ' text-grey-6': x.value != currentDate,
+              }"
+            >
+              {{
+                x.price ? moneyFormat(x.price.originalB2CPrice, 0) : "&nbsp;"
+              }}
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { date } from "quasar";
+export default {
+  props: ["priceList"],
+  data() {
+    return {
+      chineseWeek: ["日", "一", "二", "三", "四", "五", "六"],
+      chineseMonth: [
+        "一月",
+        "二月",
+        "三月",
+        "四月",
+        "五月",
+        "6月",
+        "七月",
+        "八月",
+        "九月",
+        "十月",
+        "十一月",
+        "十二月",
+      ],
+      data: [],
+      months: [],
+      currentMonth: 0,
+      col: [],
+      prices: [],
+      currentDate: "",
+    };
+  },
+  watch: {
+    priceList: {
+      handler(oldValue, newVal) {
+        this.prices = newVal;
+        this.init();
+      },
+      deep: true, // 深度监听
+    },
+  },
+  created() {
+    this.prices = this.priceList;
+    this.init();
+  },
+  methods: {
+    init() {
+      this.createChosenDateHandler();
+      let firstMonth = date.formatDate(
+        new Date(this.prices[0].startDate),
+        "YYYY/MM"
+      );
+      this.currentMonth =
+        this.months.findIndex((x) => x.monthValue == firstMonth) ?? 0;
+      this.changeMonthHandler();
+    },
+    createChosenDateHandler() {
+      let beginDate = new Date();
+      let endDate = date.addToDate(beginDate, { years: 1 });
+      while (beginDate <= endDate) {
+        let i = parseInt(date.formatDate(beginDate, "M")) - 1;
+        this.months.push({
+          value: date.formatDate(beginDate, "YYYY/MM/DD"),
+          monthValue: date.formatDate(beginDate, "YYYY/MM"),
+          display: `${date.formatDate(beginDate, "YYYY")} ${
+            this.chineseMonth[i]
+          }`,
+        });
+        beginDate = date.addToDate(beginDate, { months: 1 });
+      }
+    },
+    changeShowMonthHandler(i) {
+      this.currentMonth += i;
+      this.changeMonthHandler();
+    },
+    changeMonthHandler() {
+      this.col = [];
+      let newDate = new Date(this.months[this.currentMonth].monthValue);
+      let newBeginDate = date.startOfDate(newDate, "month");
+      let newEndDate = date.endOfDate(newDate, "month");
+      for (let i = 0; i < date.formatDate(newBeginDate, "d"); i++) {
+        this.col.push({
+          value: "",
+        });
+      }
+      while (newBeginDate <= newEndDate) {
+        let value = date.formatDate(newBeginDate, "YYYY-MM-DD");
+        let price = this.prices.find((x) => x.startDate == value && x.remainNum>0);
+        this.col.push({
+          value,
+          display: date.formatDate(newBeginDate, "DD"),
+          price,
+        });
+        newBeginDate = date.addToDate(newBeginDate, { days: 1 });
+      }
+      let after = 6 - date.formatDate(newBeginDate, "d");
+      for (let i = 0; i < after; i++) {
+        this.col.push({
+          value: "",
+        });
+      }
+    },
+    chosenDateHandler(item) {
+      if (item.price) {
+        this.currentDate = item.value;
+        this.$emit("change", item);
+      }
+    },
+    reset() {
+      this.currentDate = "";
+    },
+  },
+};
+</script>
+
+<style>
+.hover-date:hover {
+  background: #eee;
+}
+</style>

src/components/trip/smaple.vue

+<template>
+  <div class="q-mt-md">
+    <div class="text-subtitle2 text-weight-bold">產品概要</div>
+    <div class="row q-pt-md q-col-gutter-md">
+        <div class="row items-center q-pt-mb col-6" v-if="traffic!=''">
+          <div class="col-3 q-mr-md">往返交通：</div>
+          <div class="col text-grey-6">{{ traffic }}</div>
+        </div>
+        <div class="row items-center q-pt-mb col-6" v-if="hotel!=''">
+          <div class="col-3 q-mr-md">酒店住宿：</div>
+          <div class="col text-grey-6">{{ hotel }}</div>
+        </div>
+        <div class="row items-center q-pt-mb col-6">
+          <div class="col-3 q-mr-md">購物：</div>
+          <div class="col text-grey-6">{{ trip.shopList.length>0?`${trip.shopList.length}個購物點`:'無購物行程' }}</div>
+        </div>
+        <div class="row items-center q-pt-mb col-6" v-if="team!=''">
+          <div class="col-3 q-mr-md">團隊人數：</div>
+          <div class="col text-grey-6">{{ team }}</div>
+        </div>
+        <div class="row items-center q-pt-mb col-6">
+          <div class="col-3 q-mr-md">景點：</div>
+          <div class="col text-grey-6">{{ trip.scenicList.length }}個景點或場館</div>
+        </div>
+        <div class="row items-center q-pt-mb col-6">
+          <div class="col-3 q-mr-md">自費項目：</div>
+          <div class="col text-grey-6">{{ trip.selfpayingList.length>0?`${trip.selfpayingList.length}個自費項目`:'無自費項目' }}</div>
+        </div>
+        <div class="row items-center q-pt-mb col-6" v-if="trip.freedomList.length>0">
+          <div class="col-3 q-mr-md">自由活動：</div>
+          <div class="col text-grey-6">{{ trip.freedomList.length}} 次自由活動</div>
+        </div>
+        <div class="row items-center q-pt-mb col-6">
+          <div class="col-3 q-mr-md">餐食：</div>
+          <div class="col text-grey-6">{{ dinner }}</div>
+        </div>
+        <div class="row items-center q-pt-mb col-6">
+          <div class="col-3 q-mr-md">服務用語</div>
+          <div class="col text-grey-6">普通話/日本語</div>
+        </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: ["trip"],
+  data() {
+    return {
+      traffic: "",
+      stars:['一星酒店','二星酒店','三星酒店','四星酒店','五星酒店','六星酒店','七星酒店','民宿','溫泉酒店'],
+      hotel:'',
+      team: '',
+      dinner: ''
+    };
+  },
+  created() {
+    this.formatTraffic()
+    this.formatHotel()
+    this.formatTeam()
+    this.formatDinner()
+  },
+  methods: {
+    formatTeam(){
+      let p = this.trip.priceList[0]
+      let t = p.priceTeamType??1
+      t=t==0?1:t
+      if(t==1){
+        this.team = `${p.seat}人團隊散拼`
+      }else{
+        this.team = '一单一团'
+      }
+    },
+    formatDinner(){
+      let d = []
+      this.trip.dinnerList.forEach(x=>{
+        if(x.dinnerName.indexOf('自理')==-1 && x.dinnerName.indexOf('请选择')==-1){
+          d.push(x)
+        }
+      })
+      if(d && d.length>0){
+        let g=this.groupBy(d,x=>{ return x.useDinnerType})
+        let t = ['早餐','午餐','晚餐']
+        g.forEach(x=>{
+          this.dinner+=`${x.data.length}次 ${t[parseInt(x.key)-1]}；`
+        })
+      }else{
+        this.dinner = '無餐食供應'
+      }
+    },
+    formatTraffic() {
+      let z = this.trip.trafficList[0].subTraffic[0]
+      if (z.arrivalType == 1) {
+        this.traffic = '飛機往返';
+      } else if (z.arrivalType == 2) {
+        this.traffic = '巴士往返';
+      } else if (z.arrivalType == 3) {
+        this.traffic = '郵輪往返';
+      } else {
+        this.traffic = '高鐵往返';
+      }
+    },
+    formatHotel(){
+      let h = []
+      this.trip.hotelList.forEach(x=>{
+        if(h.findIndex(y=>y.dayNum==x.dayNum)==-1){
+          h.push(x)
+        }
+      })
+      if(h && h.length>0){
+        let g = this.groupBy(h,(x)=>{return x.star})
+        g.forEach(x=>{
+          this.hotel+=`${x.data.length}晚${this.stars[parseInt(x.key)-1]}；`
+        })
+      }
+    }
+  },
+};
+</script>
+
+<style></style>

src/components/trip/trip.vue

+<template>
+  <div class="q-mt-lg">
+    <div class="text-subtitle1 text-weight-bold row items-center">
+      <span class="col">每日行程</span>
+      <span class="">
+        <q-chip class="bg-transparent text-weight-light text-grey-7 f12" icon="iconfont icontime" :label="`行程時間：${trip.dayList.length}天`" />
+      </span>
+    </div>
+    <q-tabs
+      v-model="displayType"
+      class="text-dark q-mt-md"
+      align="left"
+      :breakpoint="20"
+      inline-label
+      active-class="text-primary"
+      dense
+    >
+      <q-tab name="image" @click="changeHandler" icon="iconfont iconimage" class="no-padding q-mr-lg" label="圖文模式" />
+      <q-tab name="dates" @click="changeHandler" icon="iconfont iconrili" class="no-padding q-mr-lg" label="日曆模式" />
+    </q-tabs>
+    <list :days="trip.dayList" v-if="displayType=='image'"></list>
+    <calendar :days="trip.dayList" v-if="displayType=='dates'"></calendar>
+  </div>
+</template>
+
+<script>
+import calendar from './tripView/calendar.vue'
+import list from './tripView/list.vue'
+export default {
+  components: { list, calendar },
+  props:['trip'],
+  data() {
+    return {
+      displayType: 'image'
+    }
+  },
+  methods: {
+    changeHandler(){
+      console.log('change....')
+      this.$emit('change')
+    }
+  },
+}
+</script>
+
+<style>
+
+</style>

src/css/quasar.variables.scss

@@ -12,7 +12,9 @@
 // to match your app's branding.
 // Tip: Use the "Theme Builder" on Quasar's documentation website.
 
-$primary   : #1976D2;
+// $primary   : #1976D2;
+//$primary   : #31C3E0;
+$primary   : #F1416C;
 $secondary : #26A69A;
 $accent    : #9C27B0;
 

src/layouts/HomeLayout.vue

 <style>
   .q-page-container {
-    padding-top: 30px !important;
+    /* padding-top: 30px !important; */
     padding-bottom: 30px !important;
   }
 
@@ -8,7 +8,7 @@
     width: 56px;
     height: 56px;
     border-radius: 50%;
-    background-color: #027be3;
+    /* background-color: #027be3; */
     position: fixed;
     right: 20px;
     bottom: 20px;
@@ -32,7 +32,7 @@
     <q-page-container>
       <router-view />
     </q-page-container>
-    <div class="goBackTop" :class="{'showGoback':isShowTop}" @click="hangleGoUp">
+    <div class="goBackTop bg-primary" :class="{'showGoback':isShowTop}" @click="hangleGoUp">
       <i class="iconfont iconarrow-top"></i>
     </div>
     <q-footer elevated class="bg-grey-8 text-white" style="position: unset;">
@@ -94,7 +94,7 @@
       }
 
       //删除基础配置
-      localStorage.removeItem("baseifo");
+      //localStorage.removeItem("baseifo");
       //获取集团数据
       if (localStorage.groupinfo) {
         var jObj = JSON.parse(window.localStorage.getItem('groupinfo'));

src/router/routes.js

@@ -28,6 +28,10 @@ const routes = [{
         path: '/details/:id/:tcid',
         component: () =>
           import('pages/details.vue')
+      }, { //行程2
+        path: '/detail/:id/:tcid',
+        component: () =>
+          import('pages/detailsNew.vue')
       }, {
         path: '/search', //签证护照管理
         component: () =>