feat：修改首页相关文字信息，新增合作伙伴；修改我的资产页布局；新增订单tab页，重构旅游tab页；

src/assets/css/common.css

@@ -64,6 +64,9 @@
 .fc-FFEB3B{
 	color: #FFEB3B;
 }
+.fc-C1B5C5 {
+	color: #C1B5C5!important;
+}
 
 .bg-c-EEF4FF{
 	background-color: #EEF4FF;

src/components/Forestage/Navigation.vue

@@ -4,13 +4,14 @@
 
       <div class="align-items-center">
         <img class="logo-box" src="@/assets/img/logo.png" alt="">
-        <div class="fs-18 fc-f">GIobal Merchant Center</div>
+        <div class="fs-18 fc-f">Booking Holdings</div>
       </div>
 
       <div class="align-items-center">
         <div @click="navClick(1)" class="fs-16 mr-38 fc-f hand-cursor p-f" >{{$t('Home')}}<div v-if="navActive==1" class="p-c wow animate__animated animate__bounceInRight"></div></div>
         <div @click="navClick(2)" class="fs-16 mr-38 fc-f hand-cursor p-f" >{{$t('Tourism')}}<div v-if="navActive==2" class="p-c wow animate__animated animate__bounceInRight"></div></div>
-        <div @click="navClick(3)" class="fs-16 mr-38 fc-f hand-cursor p-f" >{{$t('Team')}}<div v-if="navActive==3" class="p-c wow animate__animated animate__bounceInRight"></div></div>
+        <!-- <div @click="navClick(3)" class="fs-16 mr-38 fc-f hand-cursor p-f" >{{$t('Team')}}<div v-if="navActive==3" class="p-c wow animate__animated animate__bounceInRight"></div></div> -->
+        <div @click="navClick(3)" class="fs-16 mr-38 fc-f hand-cursor p-f" >{{$t('Order')}}<div v-if="navActive==3" class="p-c wow animate__animated animate__bounceInRight"></div></div>
         <div @click="navClick(4)" class="fs-16 mr-38 fc-f hand-cursor p-f" >{{$t('Recharge')}}<div v-if="navActive==4" class="p-c wow animate__animated animate__bounceInRight"></div></div>
         <div @click="navClick(5)" class="fs-16 mr-38 fc-f hand-cursor p-f" >{{$t('Draw Money')}}<div v-if="navActive==5" class="p-c wow animate__animated animate__bounceInRight"></div></div>
         <div @click="navClick(6)" class="fs-16 mr-38 fc-f hand-cursor p-f" >{{$t('My Account')}}<div v-if="navActive==6" class="p-c wow animate__animated animate__bounceInRight"></div></div>
@@ -90,7 +91,8 @@ export default {
           this.$router.push({ path: '/Tourism' })
           break
         case 3:
-          this.$router.push({ path: '/Team' })
+          /* this.$router.push({ path: '/Team' }) */
+          this.$router.push({ path: '/Order' })
           break
         case 4:
           this.$router.push({ path: '/Recharge' })
@@ -144,7 +146,7 @@ export default {
     width: 48px;
     height: 48px;
     opacity: 1;
-    background: rgba(255, 255, 255, 1);
+    /* background: rgba(255, 255, 255, 1); */
     border-radius: 50%;
     margin-right: 10px;
   }

src/components/Forestage/PageFoot.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="footer-container align-items-center justify-content">
     <img class="logo-box" src="@/assets/img/logo.png" alt="">
-    <div class="fs-16 fc-f m-r-40">GIobal Merchant Center</div>
+    <div class="fs-16 fc-f m-r-40">Booking Holdings</div>
     <div class="fs-12 fc-f">Copyright © 1999 - 2025 GMC Operating Company, LLC. All Rights Reserved. </div>
   </div>
 </template>
@@ -48,7 +48,7 @@ export default {
       width: 48px;
       height: 48px;
       opacity: 1;
-      background: rgba(255, 255, 255, 1);
+      /* background: rgba(255, 255, 255, 1); */
       border-radius: 50%;
       margin-right: 10px;
     }

src/locales/en.json

@@ -2,6 +2,7 @@
 	"Home":"Home",
 	"Tourism":"Travel",
 	"Team":"Team",
+	"Order": "Order",
 	"Recharge":"Deposit",
 	"Draw Money":"Withdraw",
 	"My Account":"Account",
@@ -40,14 +41,18 @@
 		  "text1":"Global Merchant Center Internet Platform",
 		  "text2":"Book tickets and browse popular travel attractions around the world",
 		  "text3":"Services we provide",
+			"text333": "About Us Booking Holdings",
 		  "text4":"The platform we provide allows global attraction merchants and individual users to cooperate directly, where the attraction merchants will display and promote popular and hot attractions from different countries around the world. Individual users can participate in advertising promotions to earn income, share and promote global attractions by booking tickets online on this platform, increase the popularity of attractions on a global scale, and users can get income from each ticket booking. Individual users can also start Internet entrepreneurship and achieve team profitability by forming a team. We partner with global cryptocurrency companies to provide all users with new, easy and secure ways to deposit and withdraw!",
-		  "text5":"Internet cooperation model",
+		  "text444":"Booking Holdings is one of the world's largest online travel companies, headquartered in Norwalk, Connecticut, USA. It provides diversified travel booking services to global users through its multiple brands, including hotels, flights, car rentals, attractions and activities, etc. It also provides services in many countries around the world, including the United States, Canada, the Netherlands, Singapore, Japan and many European countries.",
+			"text5":"Internet cooperation model",
 		  "text6":"We provide a convenient and effective platform for cooperation between merchants and users, allowing people from all over the world to achieve leading cooperation in the Internet era",
 		  "text7":"Online ticket booking revenue",
 		  "text8":"Users can promote businesses by booking real-time tickets for attractions every day, and get different personal income based on the tickets for each different attraction, which can be withdrawn",
 		  "text9":"Start a business team",
+			"text999":"Diversified global brand portfolio",
 		  "text10":"Invite new users to join GMC to start a business team through the invitation code to achieve team automation income",
-		  "text11":"Crypto payment method",
+		  "text101010":"Powerful technical support and AI recommendation algorithm, huge user database, strong user loyalty and localized services.",
+			"text11":"Crypto payment method",
 		  "text12":"To solve the deposit and withdrawal difficulties of global users, we provide new, fast, convenient and safe deposit and withdrawal methods",
 		  "text13":"Popular travel countries around the world",
 		  "text14":"America",
@@ -56,9 +61,9 @@
 		  "text17":"Thailand",
 		  "text18":"Europe",
 		  "text19":"About our working model",
-		  "text20":"The Global Merchant Center plays a very important bridging role, providing people with an effective and convenient entrepreneurship and promotion advertising platform. We have achieved rapid growth of the Internet economy.",
+		  "text20":"The Booking Holdings plays a very important bridging role, providing people with an effective and convenient entrepreneurship and promotion advertising platform. We have achieved rapid growth of the Internet economy.",
 		  "text21":"Our platform is jointly supervised and operated by many merchants around the world, with total investment assets of more than 10 billion US dollars, including corporate deposits and income funds that users can receive. The funds are provided by global merchants and used for attraction advertising and promotion. We have achieved a win-win situation for the Internet economic system, promoting the development of the tourism industry and the development of the national tourism economic system. The Internet model will become better and better, bringing people a convenient and effective way of working!",
-		  "text22":"We add popular attractions around the world to the GMC travel program, choose your favorite attraction to support them. Users can book tickets 5 times a day, and will receive different income based on the tickets they book for different attractions, which depends on the rules of different merchants for advertising funds. After the user successfully books the ticket, the merchant will immediately return the ticket amount and percentage revenue.",
+		  "text22":"We have added popular attractions around the world to the Booking Holdings travel plan. Choose your favorite regional attractions to support them. Users can book 20 to 40 tickets per day. Different attractions will receive different revenues, depending on the rules of advertising funds for different merchants. After the user successfully books the ticket, the merchant will immediately return the ticket price and percentage of the revenue.",
 		  "text23":"Internet team business model",
 		  "text24":"Users who join GMC through your invitation code will automatically become your team members. You can get up to 5 levels of team members. When your team members get income, you will get some additional team income again.",
 		  "text25":"Users who sign up  through your invitation code will become your A-level team members. When your A-level team members receive income, you will receive additional team income, which will be 50% of your A-level team member income",
@@ -70,6 +75,7 @@
 
 	"home2":{
 		  "text1":"Travel Plans",
+			"text11":"Start Your Journey & Grab Tickets",
 		  "text2":"Booking successful and settling income",
 		  "text3":"Waiting"
 	},
@@ -137,6 +143,7 @@
 
 		"index1":{
 			"text1":"My balance",
+			"text1111": "Today's Commission",
 			"text2":"Today's income ",
 			"text3":"Today's team income ",
 			"text4":"Total booking income ",
@@ -156,7 +163,9 @@
 			"text5":"Order income",
 			"text6":"Time",
 			"text7":"State",
-			"text8":"Done"
+			"text8":"Done",
+			"text9":"Unfinished",
+			"text10":"Go to Submit"
 		},
 		"index3":{
 			"text1":"Send"
@@ -181,5 +190,18 @@
 			"text10":"Set withdrawal password",
 			"text11":"Withdrawal password again"
 		}
+	},
+
+	"other": {
+		"time1": "Refreshes at 12:00 PM Beijing Time",
+		"text1": "Our Partners",
+		"text2": "Account",
+		"text3": "Price Zone",
+		"text4": "Ticketing Zone",
+		"text5": "Enter",
+		"text6": "Account Balance",
+		"text7": "Today's Commission",
+		"text8": "Estimated commission rate per ticket: 0.4%~0.6%",
+		"text9": "Grab tickets"
 	}
 }

src/locales/zh-CN.json

@@ -2,6 +2,7 @@
   "Home":"首頁",
   "Tourism":"旅游",
   "Team":"團隊",
+	"Order": "訂單",
   "Recharge":"充值",
   "Draw Money":"提款",
   "My Account":"我的帳戶",
@@ -40,13 +41,17 @@
 	  "text1":"全球商戶中心互聯網平臺",
 	  "text2":"預訂門票和瀏覽全球熱門旅行景點",
 	  "text3":"我們提供的服務",
+		"text333": "關於我們Booking Holdings",
 	  "text4":"我們提供的這個平臺讓全球景點商家和個人用戶直接合作，景點商家將在這裡展示和推廣來自全球不同國家熱門和受歡迎的景點。 個人用戶可以參與廣告推廣來賺取收益，通過在此平臺上線上訂票的管道來分享和推廣全球景點，新增景點在全球範圍內的知名度，用戶們可以從每次訂票中得到收益。 個人用戶還可以通過組建團隊來啟動互聯網創業並實現團隊盈利。 我們與全球加密貨幣公司合作，為所有用戶提供了新的、簡單和安全的支付和提款管道！",
-	  "text5":"互聯網合作模式",
+	  "text444": "Booking Holdings是全球最大的線上旅遊公司之一，總部位於美國康涅狄格州諾沃克，通過旗下多個品牌為全球用戶提供酒店、航班、租車和景點活動等多元化旅遊預訂服務，業務遍及美國、加拿大、荷蘭、新加坡、日本及歐洲多個國家。",
+		"text5":"互聯網合作模式",
 	  "text6":"我們為商家和用戶之間的合作提供了一個便捷有效的平臺，讓來自全世界的人們實現互聯網時代領先的合作。",
 	  "text7":"線上訂票收益",
 	  "text8":"用戶可以每天通過實时訂票景點門票的管道為商家做推廣，根據每個不同景點門票得到不同的個人收益，該收益可以被提款。",
 	  "text9":"開啟生意團隊",
+		"text999":"全球品牌組合多元化",
 	  "text10":"通過邀請碼邀請新用戶加入GMC開始生意團隊，實現得到團隊自動化收益。",
+		"text101010":"強大的技術支援和AI推薦演算法、龐大的用戶數據庫、高用戶忠誠度及本地化服務。",
 	  "text11":"加密貨幣支付方式",
 	  "text12":"解决全球用户的付款和提款困难问题，我们提供了新的、快速的、便捷的、安全的存款和提款方式。",
 	  "text13":"全球非常受歡迎的熱門旅行國家",
@@ -56,9 +61,9 @@
 	  "text17":"泰國",
 	  "text18":"歐洲",
 	  "text19":"關於我們的工作模式",
-	  "text20":"全球商戶中心擁有非常重要的橋樑作用，為人們提供了一個有效而便捷的創業和推廣業務平臺，我們實現了讓互聯網經濟快速增長。",
+	  "text20":"Booking Holdings擁有非常重要的橋樑作用，為人們提供了一個有效而便捷的創業和推廣業務平臺，我們實現了讓互聯網經濟快速增長。",
 	  "text21":"我們的平臺由全球許多商家共同監督經營，總投資資產超過100億美元，其中包含企業保證金和用戶可以得到的收益資金，資金由全球商家提供並用於景點廣告推廣。 我們做到了互聯網經濟體系的雙贏局面，促進旅遊行業的發展和國家旅行經濟體系的發展，互聯網模式將越來越好，為人們帶來便捷和有效的工作方式！",
-	  "text22":"我們將全球受歡迎的景點添加到GMC旅行計畫中，選擇你最喜歡的景點去支持他們。 用戶每天可以訂票5次，根據訂票不同景點門票會獲得不同收益，這取決於不同商家投放廣告資金的規則。 用戶訂票成功後，商家會立即返還票價金額和百分比收益。",
+	  "text22":"我們將全球受歡迎的景點添加到Booking Holdings旅行計畫中，選擇你最喜歡的区域景點去支持他們。 用戶每天可以訂票20~40张票，根據訂票不同景點門票會獲得不同收益，這取決於不同商家投放廣告資金的規則。 用戶訂票成功後，商家會立即返還票價金額和百分比收益。",
 	  "text23":"互聯網團隊生意模式",
 	  "text24":"通過你的邀請碼加入GMC的用戶將自動成為你的團隊成員，你最多可以得到5個層級的團隊成員，當你的團隊成員得到收益時，你能從他們的收益中再次得到一部分額外的團隊收益。",
 	  "text25":"通过你的邀请码注册的用户将成为你的A级团队成员，当你的A级团队成员得到收益时，你将获得额外团队收益，它会是你的A级团队成员收益的50%。",
@@ -70,6 +75,7 @@
 
   "home2":{
 	  "text1":"旅行計畫",
+		"text11":"開始旅行與搶票",
 	  "text2":"恭喜！ 購買成功，訂單結算中…",
 	  "text3":"倒數計時"
   },
@@ -137,6 +143,8 @@
 
 	"index1":{
 		"text1":"我的餘額",
+		"text1111": "今日佣金",
+		"text2222":"訂票收益",
 		"text2":"今日訂票收益",
 		"text3":"今日團隊收益",
 		"text4":"訂票總收益",
@@ -156,7 +164,9 @@
 		"text5":"訂單收益",
 		"text6":"創建時間",
 		"text7":"狀態",
-		"text8":"已完成"
+		"text8":"已完成",
+		"text9":"未完成",
+		"text10":"去提交"
 	},
 	"index3":{
 		"text1":"發送"
@@ -181,6 +191,17 @@
 		"text10":"設定提款密碼",
 		"text11":"再次輸入提款密碼"
 	}
-  }
-
+  },
+	"other": {
+		"time1": "北京時間中午12點更新",
+		"text1": "與我們合作的公司",
+		"text2": "帳號",
+		"text3": "價格區域",
+		"text4": "票務區域",
+		"text5": "進入",
+		"text6": "帳戶餘額",
+		"text7": "今日佣金",
+		"text8": "每張票的預估佣金利率為0.4%~0.6%",
+		"text9": "開始搶票"
+	}
 }

src/router/front.js

@@ -20,6 +20,11 @@ export default [
         name: 'Team',
         component: () => import('@/views/Forestage/Team/index.vue')
       },
+      {
+        path: '/Order',
+        name: 'Order',
+        component: () => import('@/views/Forestage/Order/index.vue')
+      },
       {
         path: '/Recharge',
         name: 'Recharge',

src/views/Forestage/Home/index.vue

@@ -11,9 +11,9 @@
     </div>
 
     <div class="index-bg-2  box-sizing-border-box pt-60">
-      <div class="fs-30 mb-18 text-align-center  animate__animated animate__bounceInUp" >{{$t('home.text3')}}</div>
+      <div class="fs-30 mb-18 text-align-center  animate__animated animate__bounceInUp" >{{$t('home.text333')}}</div>
       <div class="fs-14 mb-60 box-sizing-border-box plr-220 lh-20  animate__animated animate__bounceInUp" >
-        {{$t('home.text4')}}
+        {{$t('home.text444')}}
       </div>
       <div class="box-sizing-border-box plr-220 justify-content-space-between">
         <div class="home-1  animate__animated animate__bounceInLeft">
@@ -28,8 +28,8 @@
         </div>
         <div class="home-1  animate__animated animate__bounceInRight">
           <img class="home-1-img" src="@/assets/img/home/home-1-3.png" alt="">
-          <div class="fs-14 mb-5">{{$t('home.text9')}}</div>
-          <div class="fs-12 lh-17">{{$t('home.text10')}}</div>
+          <div class="fs-14 mb-5">{{$t('home.text999')}}</div>
+          <div class="fs-12 lh-17">{{$t('home.text101010')}}</div>
         </div>
         <div class="home-1  animate__animated animate__bounceInRight">
           <img class="home-1-img" src="@/assets/img/home/home-1-4.png" alt="">
@@ -88,7 +88,40 @@
     </div>
 
     <div class="index-bg-5 box-sizing-border-box pt-60 wow animate__animated animate__bounceInUp" data-wow-delay='0.5s'>
-      <div class="fs-42 fw-600 mb-18 text-align-center mb-12">{{$t('home.text23')}}</div>
+
+
+      <div class="title">{{ $t('other.text1') }}</div>
+      <div class="content">
+        <div class="one">
+          <img src="@/assets/img/cooperation-imgs/1.png"></img>
+          <img src="@/assets/img/cooperation-imgs/2.png"></img>
+          <img src="@/assets/img/cooperation-imgs/3.png"></img>
+          <img src="@/assets/img/cooperation-imgs/4.png"></img>
+          <img src="@/assets/img/cooperation-imgs/5.png"></img>
+        </div>
+        <div class="two">
+          <img src="@/assets/img/cooperation-imgs/6.png"></img>
+          <img src="@/assets/img/cooperation-imgs/7.png"></img>
+          <img src="@/assets/img/cooperation-imgs/8.png"></img>
+          <img src="@/assets/img/cooperation-imgs/9.png"></img>
+        </div>
+        <div class="three">
+          <img src="@/assets/img/cooperation-imgs/10.png"></img>
+          <img src="@/assets/img/cooperation-imgs/11.png"></img>
+          <img src="@/assets/img/cooperation-imgs/12.png"></img>
+          <img src="@/assets/img/cooperation-imgs/13.png"></img>
+          <img src="@/assets/img/cooperation-imgs/14.png"></img>
+        </div>
+        <div class="four">
+          <img src="@/assets/img/cooperation-imgs/15.png"></img>
+          <img src="@/assets/img/cooperation-imgs/16.png"></img>
+          <img src="@/assets/img/cooperation-imgs/17.png"></img>
+          <img src="@/assets/img/cooperation-imgs/18.png"></img>
+        </div>
+      </div>
+
+
+      <!-- <div class="fs-42 fw-600 mb-18 text-align-center mb-12">{{$t('home.text23')}}</div>
       <div class="fs-12 mb-18 text-align-center mb-12 mb-60 plr-314 lh-20">{{$t('home.text24')}}</div>
 
 
@@ -125,7 +158,7 @@
         <div class="text-1">{{$t('home.text27')}}</div>
         <div class="text-1">{{$t('home.text28')}}</div>
         <div class="text-1">{{$t('home.text29')}}</div>
-      </div>
+      </div> -->
     </div>
   </div>
 </template>
@@ -222,10 +255,57 @@ export default {
       }
     }
     .index-bg-5{
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      width: 100%;
+      height: 574px;
+      background: url(@/assets/img/home/index5.png) no-repeat;
+      background-size: 100% 100%;
+
+      .title {
+        text-align: center;
+        font-size: 26px;
+        font-weight: 500;
+        line-height: 44px;
+      }
+
+      .content {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        margin-top: 70px;
+
+        .one,
+        .two,
+        .three,
+        .four {
+          display: flex;
+          justify-content: center;
+
+          img:not(:first-child) {
+            margin-left: 20px;
+          }
+        }
+
+        .two,
+        .three,
+        .four {
+          margin-top: 20px;
+        }
+
+        img {
+          width: 184px;
+          height: 60px;
+        }
+      }
+    }
+    /* .index-bg-5{
       width: 100%;
       height: 557px;
       background: url(@/assets/img/home/index5.png) no-repeat;
       background-size: 100% 100%;
+
       .num-box{
         width: 48px;
         height: 48px;
@@ -247,6 +327,6 @@ export default {
         line-height: 18px;
         margin-right: 52px;
       }
-    }
+    } */
   }
 </style>

src/views/Forestage/Me/mod/msg.vue

@@ -2,7 +2,7 @@
 	<div class="msg-box bgc-755C82 wow animate__animated animate__bounceInRight">
 		<div class="box-1 align-items-center box-sizing-border-box">
 		  <img class="logo-box mr-10" src="@/assets/img/logo.png" alt="">
-		  <div class="fs-16 fw-700 fc-f">GIobal Merchant Center</div>
+		  <div class="fs-16 fw-700 fc-f">Booking Holdings</div>
 		</div>
 		<div ref="scrollBox" class="box-2 box-sizing-border-box">
 			<div class="mb-32" v-for="(item,i) in list" :key="i">
@@ -109,7 +109,7 @@
 			.logo-box{
 				width: 32px;
 				height: 32px;
-				background-color: #fff;
+				/* background-color: #fff; */
 				border-radius: 50%;
 			}
 		}

src/views/Forestage/Me/mod/my-money.vue

@@ -6,16 +6,22 @@
 				<img v-if="userInfo.head_img" :src="userInfo.head_img" alt="" />
 				<div class="">
 					<div class="fs-20 mb-7 fw-500 ">{{userInfo.nickname||''}}（{{userInfo.level_name}}）</div>
-					<div class="fs-14 mb-7 fw-400 ">{{userInfo.email||''}}</div>
+					<div class="fs-14 mb-7 fw-400 ">
+						<span>{{ $t("other.text2") }}：{{userInfo.email||''}}</span>
+						<span style="margin-left: 20px;">ID：{{userInfo.invite_code||''}}</span>
+					</div>
 					<div class="fs-14  fw-400 ">ID：{{userInfo.invite_code||''}}</div>
 				</div>
 			</div>
-			<div class="box-2 bgc-755C82 box-sizing-border-box fw-500 fs-16">{{$t('home6.nav1')}}</div>
-			<div class="box-3 bgc-755C82 box-sizing-border-box">
+			<div class="box-2 justify-content-space-between bgc-755C82 box-sizing-border-box fw-500 fs-16">
+				<div>{{$t('home6.nav1')}}</div>
+				<div class="fs-14 fc-C1B5C5 fw-400">{{$t('other.time1')}}</div>
+			</div>
+			<!-- <div class="box-3 bgc-755C82 box-sizing-border-box">
 				<div class="fs-16 fw-400 mb-16">{{$t('home6.index1.text1')}}（USDT）</div>
 				<div class="fs-20 fw-700">{{(userInfo.money*1).toFixed(6)||"0.000000"}}</div>
-			</div>
-			<div class="justify-content-space-between">
+			</div> -->
+			<!-- <div class="justify-content-space-between">
 				<div class="box-4 justify-content-space-between align-items-center right-border box-sizing-border-box bgc-755C82">
 					<div class="align-items-center">
 						<img class="img-1" src="@/assets/img/me/money.png" alt="" />
@@ -30,8 +36,8 @@
 					</div>
 					<div class="fs-14 fw-700">{{(userInfo.day_team*1).toFixed(6)}}</div>
 				</div>
-			</div>
-			<div class="justify-content-space-between">
+			</div> -->
+			<!-- <div class="justify-content-space-between">
 				<div class="box-4 justify-content-space-between align-items-center right-border box-sizing-border-box bgc-755C82">
 					<div class="align-items-center">
 						<img class="img-1" src="@/assets/img/me/money.png" alt="" />
@@ -46,7 +52,28 @@
 					</div>
 					<div class="fs-14 fw-700">{{(userInfo.order_team*1).toFixed(6)}}</div>
 				</div>
+			</div> -->
+
+			<!-- 2025-6-30 新增 -->
+			<div class="justify-content-space-between">
+				<div class="box-444 justify-content-space-between align-items-center right-border box-sizing-border-box bgc-755C82">
+					<div class="item">
+						<img class="icon" src="@/assets/img/me/balance.png" alt="" />
+						<div class="content">
+							<div class="money">{{(userInfo.money*1).toFixed(6)||"0.000000"}}</div>
+							<div class="tips">{{$t('home6.index1.text1')}}（USDT）</div>
+						</div>
+					</div>
+					<div class="item">
+						<img class="icon" src="@/assets/img/me/commission.png" alt="" />
+						<div class="content">
+							<div class="money">{{(userInfo.day_yield*1).toFixed(6)}}</div>
+							<div class="tips">{{$t('home6.index1.text1111')}}（USDT）</div>
+						</div>
+					</div>
+				</div>
 			</div>
+
 			<div class="justify-content-space-between">
 				<div class="box-5 align-items-center justify-content box-sizing-border-box bgc-755C82 right-border hand-cursor" @click="toIndex(1)">
 					<img class="img-3" src="@/assets/img/me/congzhi.png" alt="" />
@@ -59,6 +86,7 @@
 			</div>
 		</div>
 
+		<!-- 充值记录 -->
 		<div v-if="indexType == 1" class="index-card bgc-755C82 wow animate__animated animate__bounceInRight">
 			<div class="box-6 align-items-center hand-cursor" @click="toIndex(0)">
 				<img src="@/assets/img/lang-icon.png" alt="" />
@@ -84,6 +112,7 @@
 
 		</div>
 
+		<!-- 提现记录 -->
 		<div v-if="indexType == 2" class="index-card bgc-755C82 wow animate__animated animate__bounceInRight">
 			<div class="box-6 align-items-center hand-cursor" @click="toIndex(0)">
 				<img src="@/assets/img/lang-icon.png" alt="" />
@@ -241,6 +270,49 @@
 			border-bottom: 1px solid #C1B5C5;
 
 		}
+
+		.box-444 {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			width: 100%;
+			border-bottom: 1px solid #C1B5C5;
+			height: 480px;
+
+			.item {
+				flex: 1;
+				display: flex;
+				align-items: center;
+				height: 200px;
+				margin-left: 40px;
+
+				&:not(:last-child) {
+					border-right: 1px solid #C1B5C5;
+				}
+
+				.icon {
+					width: 100px;
+					height: 100px;
+				}
+
+				.content {
+					margin-left: 30px;
+
+					.money {
+						font-size: 28px;
+						font-weight: 700;
+						line-height: 37px;
+					}
+
+					.tips {
+						margin-top: 10px;
+						font-size: 16px;
+					}
+				}
+			}
+		}
+
+
 		.right-border{
 			border-right: 1px solid #C1B5C5;
 		}

src/views/Forestage/Order/index.vue

@@ -0,0 +1,177 @@
+<template>
+  <!-- 订单 -->
+  <div class="order-index">
+    <div class="item" v-for="(item, i) in list" :key="i">
+      <div class="head">
+        <div class="title">{{lang == 'cn'?item.goods_name:item.goods_name_en}}</div>
+        <div v-if="item.status == 1" class="status">{{$t('home6.index2.text9')}}</div>
+        <div v-if="item.status == 2" class="status">{{$t('home6.index2.text8')}}</div>
+      </div>
+      <div class="content">
+        <img class="order-img" :src="item.goods_img" alt="">
+        <div class="info">
+          <div><span class="fw-400">{{$t('home6.index2.text4')}}：</span>{{item.price}} USDT</div>
+          <div><span class="fw-400">{{$t('home6.index2.text5')}}：</span>{{item.yield_money}} USDT</div>
+          <div><span class="fw-400">{{$t('home6.index2.text3')}}：</span>{{item.order_sn}}</div>
+        </div>
+        <div v-if="item.status == 1" class="operate" @click="goToPay(item)">{{$t('home6.index2.text10')}}</div>
+      </div>
+    </div>
+    <div class="justify-right mt-16">
+			<div class="box-page fs-12 fw-400 fc-12 hand-cursor" @click="upPage()">{{$t('syy')}}</div>
+			<div class="box-page fs-12 fw-400 fc-12 hand-cursor" @click="downPage()">{{$t('xyy')}}</div>
+		</div>
+
+    <order-sett ref="orderSett"></order-sett>
+  </div>
+</template>
+
+<script>
+import {orderlist} from '@/api/order.js';
+import tools from '@/utils/tools.js';
+import OrderSett from '@/views/Forestage/Tourism/order-sett.vue'
+export default {
+  name: 'Order',
+  data(){
+			return{
+				page:1,
+				list:[],
+        isAJAX: false,
+				total:0,
+        lang:'en',
+			}
+		},
+  mounted() {
+    this.lang = localStorage.getItem('lang')||'en'
+
+    setInterval(() => {
+      this.lang = localStorage.getItem('lang')||'en'
+
+    }, 500); // 每隔1秒检查一次
+    this.getList();
+  },
+  methods: {
+    getList(){
+			orderlist({page:this.page}).then((res)=>{
+				if(res.code == 1){
+					this.list = res.data.list;
+					this.total = res.data.total
+				}
+			})
+		},
+    upPage(){
+			if(this.page == 1){
+				return tools.error(this.$t('yddyy'))
+			}else{
+				this.page -= 1;
+				this.getList();
+			}
+		},
+		downPage(){
+			let flag = (this.page*1)*20 < (this.total * 1);
+			if(!flag){
+				return tools.error(this.$t('mygdsj'))
+			}else{
+				this.page += 1;
+				this.getList();
+			}
+		},
+
+    goToPay() {
+      let  token= localStorage.getItem('userToken')
+        if (token){
+          if(this.isAJAX){
+            return
+          }
+          this.isAJAX = true;
+          ordercreat({
+            goods_id: item.id
+          }).then((res) => {
+            if(res.code == 1){
+              this.isAJAX = false;
+              // tools.success(res.msg)
+              this.$refs.orderSett.setOpen(true)
+            }else{
+              this.isAJAX = false;
+              tools.error(res.msg)
+            }
+          })
+        } else {
+        this.$router.push({ path: '/login' })
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.order-index {
+  padding: 70px 120px 20px;
+  color: black;
+  min-height: 100vh;
+  background-color: #C1B5C5FF;
+
+  .item {
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    height: 199px;
+    margin-top: 20px;
+    background-color: #755c82;
+    border-radius: 10px;
+
+    .head {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      height: 40px;
+      padding: 0 20px 0 15px;
+      color: #ffffff;
+      font-size: 16px;
+      border-bottom: 1px solid #C1B5C5;
+    }
+
+    .content {
+      flex: 1;
+      display: flex;
+      align-items: center;
+      padding: 0 20px 0 15px;
+
+      .order-img {
+        width: 193px;
+        height: 129px;
+      }
+
+      .info {
+        flex: 1;
+        height: 100%;
+        display: flex;
+        flex-direction: column;
+        justify-content: space-evenly;
+        margin-left: 20px;
+        font-weight: 500;
+        font-size: 16px;
+        color: #ffffff;
+      }
+
+      .operate {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        height: 40px;
+        padding: 0 16px;
+        font-size: 16px;
+        background-color: #C7AB7B;
+        border-radius: 4px;
+      }
+    }
+  }
+
+  .box-page{
+		padding: 8px 10px;
+		background: #C7AB7B;
+		margin-left: 10px;
+		border-radius: 2px;
+	}
+}
+</style>

src/views/Forestage/Tourism/detail.vue

@@ -0,0 +1,17 @@
+<template>
+  <div>
+    
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {}
+  },
+  mounted() {},
+  methods: {}
+}
+</script>
+
+<style lang="scss" scoped></style>

src/views/Forestage/Tourism/index original.vue

@@ -0,0 +1,231 @@
+<template>
+	<!-- 旅游 -->
+	<div class="tourism-box">
+		<div class="fs-42 fw-400 text-align-center mt-30 mb-18 wow animate__animated animate__bounceInUp">{{$t('home2.text1')}}</div>
+		<div class="justify-content box-sizing-border-box plr-220  row-wrap">
+			<div class="class-item text-align-center fs-14 fw-500 box-sizing-border-box hand-cursor "
+				v-for="(item,i) in classList" :key="i" :class="id==item.id?'s-class-item':''"
+				@click="selectType(item,i)">{{lang == 'cn'?item.class_name:item.class_name_en}}</div>
+		</div>
+
+		<div class="box-sizing-border-box plr-220 ">
+			<div class="justify-content-space-between goods-box box-sizing-border-box mt-16"
+				v-for="(item,i) in goodsList" :key="i">
+				<img class="item-img" :src="item.cover_img" alt="">
+				<div class="flex-1 box-sizing-border-box ptb-8">
+					<div class="fs-24 fw-400 mb-10">{{lang == 'cn'?item.goods_name:item.goods_name_en}}</div>
+					<div class="fs-18 fw-400 lh-26 mb-12">
+						{{lang == 'cn'?item.contents:item.contents_en}}
+					</div>
+					<div class="align-items-center">
+						<div class="b-buttom hand-cursor">${{item.price}}</div>
+						<div class="b-buttom hand-cursor" @click="pay(item)">Book ticket</div>
+					</div>
+				</div>
+			</div>
+
+      <div class="justify-right mt-30 p-b-33">
+        <el-pagination
+          class="pagination-data"
+          background
+          layout="prev, pager, next"
+          :page-size="20"
+          :total="total" :current-page="page" @current-change="currentChange">
+        </el-pagination>
+      </div>
+
+		</div>
+
+
+    <order-sett ref="orderSett"></order-sett>
+	</div>
+</template>
+
+<script>
+	import tools from '@/utils/tools';
+	import {
+		ordercreat
+	} from '@/api/order.js';
+	import {
+		getClass,
+		getList
+	} from '@/api/goods.js';
+  import OrderSett from '@/views/Forestage/Tourism/order-sett.vue'
+	export default {
+    components: { OrderSett },
+		data() {
+			return {
+				// backgroundImg: require('@/assets/img/home/2-2.png'),
+				id: 1,
+				classList: [],
+				goodsList: [],
+				isAJAX: false,
+        busy: false,
+				lang:'en',
+        page:1,
+        total:0
+			}
+		},
+		created() {
+
+		},
+		mounted() {
+      this.lang = localStorage.getItem('lang')||'en'
+
+      setInterval(() => {
+        this.lang = localStorage.getItem('lang')||'en'
+
+      }, 500); // 每隔1秒检查一次
+			this.getClass();
+
+		},
+		methods: {
+      loadMore() {
+        console.log('loadMore---------------------')
+        if (this.busy) return; // 防止重复加载数据
+        this.busy = true; // 设置加载状态为忙碌状态
+        // 模拟从服务器获取数据（替换为你的实际数据获取逻辑）
+        setTimeout(() => {
+         this.getlist()
+          this.busy = false; // 设置加载状态为非忙碌状态，允许再次触发加载更多事件
+        }, 1000); // 模拟网络延迟时间，实际应用中应为异步请求的响应时间
+      },
+			getClass() {
+				getClass().then((res) => {
+					if (res.code == 1) {
+						this.classList = res.data;
+						this.id = this.classList[0].id;
+						this.getlist();
+					}
+				})
+			},
+			getlist() {
+				getList({
+					class_id: this.id,
+          page:this.page
+				}).then((res) => {
+					if (res.code == 1) {
+            this.total = res.data.total
+            this.goodsList = res.data.list;
+					}
+				})
+			},
+			selectType(item, i) {
+				if (this.id != item.id) {
+					this.id = item.id
+					this.getlist();
+				}
+			},
+
+      currentChange(val){
+        this.page = val;
+        this.getlist();
+      },
+
+			pay(item) {
+        let  token= localStorage.getItem('userToken')
+        if (token){
+          if(this.isAJAX){
+            return
+          }
+          this.isAJAX = true;
+          ordercreat({
+            goods_id: item.id
+          }).then((res) => {
+            if(res.code == 1){
+              this.isAJAX = false;
+              // tools.success(res.msg)
+              this.$refs.orderSett.setOpen(true)
+            }else{
+              this.isAJAX = false;
+              tools.error(res.msg)
+            }
+          })
+        }else {
+          this.$router.push({ path: '/login' })
+        }
+
+			},
+		},
+	}
+</script>
+
+<style scoped lang="scss">
+
+  .mtb-20{
+    margin: 20px 0;
+  }
+
+  ::v-deep .el-pagination{
+    .btn-prev{
+      background-color: #C7AB7B !important;
+      color: #333 !important;
+    }
+    .btn-next{
+      background-color: #C7AB7B !important;
+      color: #333 !important;
+    }
+    .number{
+      opacity: 0.3;
+    }
+    .active {
+        background-color: #C7AB7B !important;
+        color: #333 !important;
+        opacity: 0.8 !important;
+    }
+
+
+
+  }
+
+
+
+	.tourism-box {
+		padding-top: 70px;
+		min-height: 100vh;
+		background: url('@/assets/img/login-bg.png');
+
+		.class-item {
+			min-width: 68px;
+			padding: 0 10px;
+			height: 36px;
+			line-height: 36px;
+			opacity: 1;
+			border-radius: 2px;
+			border: 1px solid rgba(255, 255, 255, 1);
+			margin: 0 20px 18px 20px;
+			color: #fff;
+		}
+
+		.s-class-item {
+			background: rgba(199, 171, 123, 1) !important;
+			border: 1px solid rgba(199, 171, 123, 1) !important;
+			color: #121212;
+		}
+
+		.goods-box {
+			width: 100%;
+			min-height: 184px;
+			background: #E4F7F0FF;
+			padding: 12px 15px;
+		}
+
+		.item-img {
+			width: 220px;
+			height: 160px;
+			margin-right: 20px;
+		}
+
+		.b-buttom {
+			padding: 0 16px;
+			height: 34px;
+			opacity: 1;
+			border-radius: 2px;
+			background: #C7AB7BFF;
+			line-height: 36px;
+			color: #121212;
+			text-align: center;
+			margin-right: 10px;
+		}
+	}
+</style>

src/views/Forestage/Tourism/index.vue

@@ -1,231 +1,575 @@
 <template>
 	<!-- 旅游 -->
 	<div class="tourism-box">
-		<div class="fs-42 fw-400 text-align-center mt-30 mb-18 wow animate__animated animate__bounceInUp">{{$t('home2.text1')}}</div>
-		<div class="justify-content box-sizing-border-box plr-220  row-wrap">
-			<div class="class-item text-align-center fs-14 fw-500 box-sizing-border-box hand-cursor "
-				v-for="(item,i) in classList" :key="i" :class="id==item.id?'s-class-item':''"
-				@click="selectType(item,i)">{{lang == 'cn'?item.class_name:item.class_name_en}}</div>
-		</div>
+		<div class="fs-42 fw-400 text-align-center mt-40 mb-40 fc-f wow animate__animated animate__bounceInUp">
+			{{ $t('home2.text11') }}</div>
 
-		<div class="box-sizing-border-box plr-220 ">
-			<div class="justify-content-space-between goods-box box-sizing-border-box mt-16"
-				v-for="(item,i) in goodsList" :key="i">
-				<img class="item-img" :src="item.cover_img" alt="">
-				<div class="flex-1 box-sizing-border-box ptb-8">
-					<div class="fs-24 fw-400 mb-10">{{lang == 'cn'?item.goods_name:item.goods_name_en}}</div>
-					<div class="fs-18 fw-400 lh-26 mb-12">
-						{{lang == 'cn'?item.contents:item.contents_en}}
+		<div v-if="current == 'list'" class="box-sizing-border-box">
+			<div class="goods-list-container">
+				<div class="item" v-for="(item, i) in goodsList" :key="i">
+					<div class="head">
+						<img class="vip-img" src="@/assets/img/vip.png" alt="">
+						<div class="text">VIP{{ i + 1 }}</div>
+						<img class="plane-img" src="@/assets/img/plane.png" alt="">
 					</div>
-					<div class="align-items-center">
-						<div class="b-buttom hand-cursor">${{item.price}}</div>
-						<div class="b-buttom hand-cursor" @click="pay(item)">Book ticket</div>
+					<div class="content">
+						<img class="goods-img" :src="item.cover_img" alt="">
+						<div class="info">
+							<div class="i">
+								<div class="label">{{ $t('other.text3') }}</div>
+								<div class="val">{{ item.price }}USDT</div>
+							</div>
+							<div class="i">
+								<div class="label">{{ $t('other.text4') }}</div>
+								<div class="val">美洲、亚洲、欧洲和澳洲区域以及 不分其他国家</div>
+							</div>
+						</div>
+						<div class="operate" @click="handleGoodsItem(item)">{{ $t('other.text5') }}</div>
 					</div>
 				</div>
 			</div>
 
-      <div class="justify-right mt-30 p-b-33">
-        <el-pagination
-          class="pagination-data"
-          background
-          layout="prev, pager, next"
-          :page-size="20"
-          :total="total" :current-page="page" @current-change="currentChange">
-        </el-pagination>
-      </div>
+			<div class="justify-right mt-30 p-b-33">
+				<el-pagination class="pagination-data" background layout="prev, pager, next" :page-size="20" :total="total"
+					:current-page="page" @current-change="currentChange">
+				</el-pagination>
+			</div>
+
+		</div>
+
+
+		<!-- 单个商品区域 -->
+		<div v-if="current == 'goods'" class="current-goods-container box-sizing-border-box">
+			<div class="item one">
+				<div class="head">
+					<img class="vip-img" src="@/assets/img/vip.png" alt="">
+					<div class="text">VIP1</div>
+				</div>
+				<div class="content">
+					<div class="i">
+						<div class="label">{{ $t('other.text6') }}</div>
+						<div class="money">
+							<span>8888.8888</span>
+							<span class="unit">USDT</span>
+						</div>
+					</div>
+					<div class="i">
+						<div class="label">{{ $t('other.text7') }}</div>
+						<div class="money">
+							<span>8888.8888</span>
+							<span class="unit">USDT</span>
+						</div>
+					</div>
+				</div>
+			</div>
+			<div class="item two">
+				<div class="head">
+					<img class="vip-img" src="@/assets/img/vip.png" alt="">
+					<div class="text">VIP1</div>
+					<img class="plane-img" src="@/assets/img/plane.png" alt="">
+				</div>
+				<div class="content">
+					<img class="goods-img" src="@/assets/img/home/2-1.png" alt="">
+					<div class="info">
+						<div class="i">
+							<div class="label">{{ $t('other.text3') }}</div>
+							<div class="val">2000USDT ~ 4999USDT</div>
+						</div>
+						<div class="i">
+							<div class="label">{{ $t('other.text4') }}</div>
+							<div class="val">美洲、亚洲、欧洲和澳洲区域以及 不分其他国家</div>
+						</div>
+					</div>
+					<div class="tips">{{ $t('other.text8') }}</div>
+				</div>
+			</div>
 
+			<!-- 时间、开始抢票 -->
+			<div class="time-or-buy">
+				<div class="time">00 / 20</div>
+				<div class="buy">{{ $t('other.text9') }}</div>
+			</div>
 		</div>
 
 
-    <order-sett ref="orderSett"></order-sett>
+		<order-detail ref="orderDetail"></order-detail>
+		<order-sett ref="orderSett"></order-sett>
 	</div>
 </template>
 
 <script>
-	import tools from '@/utils/tools';
-	import {
-		ordercreat
-	} from '@/api/order.js';
-	import {
-		getClass,
-		getList
-	} from '@/api/goods.js';
-  import OrderSett from '@/views/Forestage/Tourism/order-sett.vue'
-	export default {
-    components: { OrderSett },
-		data() {
-			return {
-				// backgroundImg: require('@/assets/img/home/2-2.png'),
-				id: 1,
-				classList: [],
-				goodsList: [],
-				isAJAX: false,
-        busy: false,
-				lang:'en',
-        page:1,
-        total:0
+import tools from '@/utils/tools';
+import {
+	ordercreat
+} from '@/api/order.js';
+import {
+	getClass,
+	getList
+} from '@/api/goods.js';
+import OrderSett from '@/views/Forestage/Tourism/order-sett.vue'
+import OrderDetail from '@/views/Forestage/Tourism/order-detail.vue'
+export default {
+	components: { OrderSett, OrderDetail },
+	data() {
+		return {
+			// backgroundImg: require('@/assets/img/home/2-2.png'),
+			id: 1,
+			classList: [],
+			goodsList: [],
+			isAJAX: false,
+			busy: false,
+			lang: 'en',
+			page: 1,
+			total: 0,
+			current: 'list'
+		}
+	},
+	created() {
+
+	},
+	mounted() {
+		this.lang = localStorage.getItem('lang') || 'en'
+
+		setInterval(() => {
+			this.lang = localStorage.getItem('lang') || 'en'
+
+		}, 500); // 每隔1秒检查一次
+		this.getClass();
+
+	},
+	methods: {
+		loadMore() {
+			console.log('loadMore---------------------')
+			if (this.busy) return; // 防止重复加载数据
+			this.busy = true; // 设置加载状态为忙碌状态
+			// 模拟从服务器获取数据（替换为你的实际数据获取逻辑）
+			setTimeout(() => {
+				this.getlist()
+				this.busy = false; // 设置加载状态为非忙碌状态，允许再次触发加载更多事件
+			}, 1000); // 模拟网络延迟时间，实际应用中应为异步请求的响应时间
+		},
+		getClass() {
+			getClass().then((res) => {
+				if (res.code == 1) {
+					this.classList = res.data;
+					this.id = this.classList[0].id;
+					this.getlist();
+				}
+			})
+		},
+		getlist() {
+			getList({
+				class_id: this.id,
+				page: this.page
+			}).then((res) => {
+				if (res.code == 1) {
+					this.total = res.data.total
+					this.goodsList = res.data.list;
+				}
+			})
+		},
+		selectType(item, i) {
+			if (this.id != item.id) {
+				this.id = item.id
+				this.getlist();
 			}
 		},
-		created() {
 
+		currentChange(val) {
+			this.page = val;
+			this.getlist();
 		},
-		mounted() {
-      this.lang = localStorage.getItem('lang')||'en'
-
-      setInterval(() => {
-        this.lang = localStorage.getItem('lang')||'en'
-
-      }, 500); // 每隔1秒检查一次
-			this.getClass();
 
+		handleGoodsItem(item) {
+			this.current = 'goods'
 		},
-		methods: {
-      loadMore() {
-        console.log('loadMore---------------------')
-        if (this.busy) return; // 防止重复加载数据
-        this.busy = true; // 设置加载状态为忙碌状态
-        // 模拟从服务器获取数据（替换为你的实际数据获取逻辑）
-        setTimeout(() => {
-         this.getlist()
-          this.busy = false; // 设置加载状态为非忙碌状态，允许再次触发加载更多事件
-        }, 1000); // 模拟网络延迟时间，实际应用中应为异步请求的响应时间
-      },
-			getClass() {
-				getClass().then((res) => {
-					if (res.code == 1) {
-						this.classList = res.data;
-						this.id = this.classList[0].id;
-						this.getlist();
-					}
-				})
-			},
-			getlist() {
-				getList({
-					class_id: this.id,
-          page:this.page
+
+		pay(item) {
+			let token = localStorage.getItem('userToken')
+			if (token) {
+				if (this.isAJAX) {
+					return
+				}
+				this.isAJAX = true;
+				ordercreat({
+					goods_id: item.id
 				}).then((res) => {
 					if (res.code == 1) {
-            this.total = res.data.total
-            this.goodsList = res.data.list;
+						this.isAJAX = false;
+						// tools.success(res.msg)
+						this.$refs.orderSett.setOpen(true)
+					} else {
+						this.isAJAX = false;
+						tools.error(res.msg)
 					}
 				})
-			},
-			selectType(item, i) {
-				if (this.id != item.id) {
-					this.id = item.id
-					this.getlist();
-				}
-			},
-
-      currentChange(val){
-        this.page = val;
-        this.getlist();
-      },
-
-			pay(item) {
-        let  token= localStorage.getItem('userToken')
-        if (token){
-          if(this.isAJAX){
-            return
-          }
-          this.isAJAX = true;
-          ordercreat({
-            goods_id: item.id
-          }).then((res) => {
-            if(res.code == 1){
-              this.isAJAX = false;
-              // tools.success(res.msg)
-              this.$refs.orderSett.setOpen(true)
-            }else{
-              this.isAJAX = false;
-              tools.error(res.msg)
-            }
-          })
-        }else {
-          this.$router.push({ path: '/login' })
-        }
-
-			},
+			} else {
+				this.$router.push({ path: '/login' })
+			}
+
 		},
-	}
+	},
+}
 </script>
 
 <style scoped lang="scss">
+div,
+span {
+	box-sizing: border-box
+}
+
+.mtb-20 {
+	margin: 20px 0;
+}
+
+::v-deep .el-pagination {
+	.btn-prev {
+		background-color: #C7AB7B !important;
+		color: #333 !important;
+	}
+
+	.btn-next {
+		background-color: #C7AB7B !important;
+		color: #333 !important;
+	}
+
+	.number {
+		opacity: 0.3;
+	}
+
+	.active {
+		background-color: #C7AB7B !important;
+		color: #333 !important;
+		opacity: 0.8 !important;
+	}
+
+
+
+}
+
+
+
+.tourism-box {
+	padding-top: 70px;
+	min-height: 100vh;
+	background: url('@/assets/img/home/new-travel.png');
+	background-size: 100%;
+
+	.class-item {
+		min-width: 68px;
+		padding: 0 10px;
+		height: 36px;
+		line-height: 36px;
+		opacity: 1;
+		border-radius: 2px;
+		border: 1px solid rgba(255, 255, 255, 1);
+		margin: 0 20px 18px 20px;
+		color: #fff;
+	}
+
+	.s-class-item {
+		background: rgba(199, 171, 123, 1) !important;
+		border: 1px solid rgba(199, 171, 123, 1) !important;
+		color: #121212;
+	}
+
+	.goods-box {
+		width: 100%;
+		min-height: 184px;
+		background: #E4F7F0FF;
+		padding: 12px 15px;
+	}
+
+	.item-img {
+		width: 220px;
+		height: 160px;
+		margin-right: 20px;
+	}
+
+	.b-buttom {
+		padding: 0 16px;
+		height: 34px;
+		opacity: 1;
+		border-radius: 2px;
+		background: #C7AB7BFF;
+		line-height: 36px;
+		color: #121212;
+		text-align: center;
+		margin-right: 10px;
+	}
+}
 
-  .mtb-20{
-    margin: 20px 0;
-  }
-
-  ::v-deep .el-pagination{
-    .btn-prev{
-      background-color: #C7AB7B !important;
-      color: #333 !important;
-    }
-    .btn-next{
-      background-color: #C7AB7B !important;
-      color: #333 !important;
-    }
-    .number{
-      opacity: 0.3;
-    }
-    .active {
-        background-color: #C7AB7B !important;
-        color: #333 !important;
-        opacity: 0.8 !important;
-    }
-
-
-
-  }
-
-
-
-	.tourism-box {
-		padding-top: 70px;
-		min-height: 100vh;
-		background: url('@/assets/img/login-bg.png');
-
-		.class-item {
-			min-width: 68px;
-			padding: 0 10px;
-			height: 36px;
-			line-height: 36px;
-			opacity: 1;
-			border-radius: 2px;
-			border: 1px solid rgba(255, 255, 255, 1);
-			margin: 0 20px 18px 20px;
-			color: #fff;
+.goods-list-container {
+	width: 100%;
+
+	.item {
+		height: 247px;
+		margin: 0 120px;
+		background-color: #C1B5C5;
+		border-radius: 20px;
+		overflow: hidden;
+
+		&:not(:first-child) {
+			margin-top: 20px;
 		}
 
-		.s-class-item {
-			background: rgba(199, 171, 123, 1) !important;
-			border: 1px solid rgba(199, 171, 123, 1) !important;
-			color: #121212;
+		.head {
+			position: relative;
+			display: flex;
+			align-items: center;
+			height: 40px;
+			padding-left: 20px;
+
+			.vip-img {
+				width: 32px;
+				height: 32px;
+			}
+
+			.text {
+				margin-left: 10px;
+				font-size: 24px;
+				font-weight: 700;
+			}
+
+			.plane-img {
+				position: absolute;
+				top: 20px;
+				right: 200px;
+				width: 40px;
+				height: 37px;
+			}
 		}
 
-		.goods-box {
-			width: 100%;
-			min-height: 184px;
-			background: #E4F7F0FF;
-			padding: 12px 15px;
+		.content {
+			display: flex;
+			align-items: center;
+			height: 187px;
+			padding: 0 20px;
+			background-color: #ffffff;
+
+			.goods-img {
+				width: 220px;
+				height: 147px;
+			}
+
+			.info {
+				flex: 1;
+				display: flex;
+				height: 147px;
+				flex-direction: column;
+				margin-left: 20px;
+				padding: 9px 0 4px;
+
+				.i {
+
+					&:not(:first-child) {
+						margin-top: 18px;
+					}
+
+					.label {
+						color: #707070;
+						font-size: 18px;
+						font-weight: 700;
+						line-height: 26px;
+					}
+
+					.val {
+						margin-top: 2px;
+						color: #171717;
+						font-size: 20px;
+						font-weight: 700;
+						line-height: 29px;
+					}
+				}
+			}
+
+			.operate {
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				padding: 0 64px;
+				height: 42px;
+				font-size: 16px;
+				background-color: #c7ab7b;
+				border-radius: 2px;
+				cursor: pointer;
+			}
 		}
+	}
+}
+
+/* 单个商品区域 */
+.current-goods-container {
+	width: 100%;
+	padding-bottom: 96px;
+
+	.item {
+		margin: 0 120px;
+		border-radius: 20px;
+		overflow: hidden;
+
+		.head {
+			position: relative;
+			display: flex;
+			align-items: center;
+			height: 40px;
+			padding-left: 20px;
+			background-color: #C1B5C5;
+
+			.vip-img {
+				width: 32px;
+				height: 32px;
+			}
+
+			.text {
+				margin-left: 10px;
+				font-size: 24px;
+				font-weight: 700;
+			}
+
+			.plane-img {
+				position: absolute;
+				top: 20px;
+				right: 200px;
+				width: 40px;
+				height: 37px;
+			}
+		}
+
+		&.one {
+
+			.content {
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				height: 175px;
+				padding: 0 30px 0 20px;
+				background-color: #ffffff;
+
+				.i {
+					display: flex;
+					flex-direction: column;
+					justify-content: space-between;
+					width: 560px;
+					height: 116px;
+					background-color: #C1B5C5;
+					border-radius: 10px;
+					padding: 20px 0 30px 20px;
+
+					&:not(:first-child) {
+						margin-left: 30px;
+					}
+
+					.label {
+						color: #404040;
+						font-size: 16px;
+						line-height: 23px;
+					}
+
+					.money {
+						display: flex;
+						align-items: center;
+						/* margin-top: 15px; */
+						font-size: 20px;
+						font-weight: 700;
+						line-height: 26px;
+
+						.unit {
+							margin-left: 15px;
+							color: #404040;
+							font-size: 16px;
+							font-weight: 400;
+						}
+					}
+				}
+			}
+		}
+
+		&.two {
+			margin-top: 20px;
+			background-color: #c1b5c5;
+
+			.content {
+				display: flex;
+				align-items: center;
+				height: 187px;
+				padding: 0 20px;
+				background-color: #ffffff;
+
+				.goods-img {
+					width: 220px;
+					height: 147px;
+				}
+
+				.info {
+					flex: 1;
+					display: flex;
+					height: 147px;
+					flex-direction: column;
+					margin-left: 20px;
+					padding: 9px 0 4px;
+
+					.i {
+
+						&:not(:first-child) {
+							margin-top: 28px;
+						}
+
+						.label {
+							color: #707070;
+							font-size: 16px;
+							font-weight: 400;
+							line-height: 23px;
+						}
+
+						.val {
+							margin-top: 2px;
+							color: #171717;
+							font-size: 16px;
+							font-weight: 400;
+							line-height: 23px;
+						}
+					}
+				}
+
+				.tips {
+					color: #ED2121;
+					font-size: 14px;
+					line-height: 20px;
+					margin-top: 134px;
+					align-self: self-start;
+				}
+			}
+		}
+	}
+
+	/* 时间、开始抢票 */
+	.time-or-buy {
+		position: relative;
+		width: 597px;
+		height: 154px;
+		margin: 75px auto 0;
+		background: url("@/assets/img/time-box.png") no-repeat;
+		background-size: 100% 100%;
+		cursor: pointer;
 
-		.item-img {
-			width: 220px;
-			height: 160px;
-			margin-right: 20px;
+		.time {
+			position: absolute;
+			top: 51px;
+			left: 70px;
+			font-size: 36px;
+			font-weight: 700;
+			line-height: 52px;
 		}
 
-		.b-buttom {
-			padding: 0 16px;
-			height: 34px;
-			opacity: 1;
-			border-radius: 2px;
-			background: #C7AB7BFF;
-			line-height: 36px;
-			color: #121212;
-			text-align: center;
-			margin-right: 10px;
+		.buy {
+			position: absolute;
+			top: 51px;
+			right: 84px;
+			font-size: 36px;
+			font-weight: 700;
+			line-height: 52px;
 		}
 	}
+}
 </style>

src/views/Forestage/Tourism/order-detail.vue

@@ -0,0 +1,185 @@
+<template>
+  <div>
+    <Bounced v-if="dialogVisible" :dialogVisible="dialogVisible" :titleName="''" bouncedWidth="550px">
+      <template slot="from">
+        <!-- 提交订单弹窗 -->
+        <div class="order-detail-dialog">
+          <div class="goods-img">
+            <img class="g-img" src="@/assets/img/home/2-1.png" alt="">
+          </div>
+          <div class="content">
+            <div class="title">泰国曼谷大皇宫</div>
+            <div class="desc">它是曼谷王朝的象征，是旅游者的垂爱之地，暹罗式风格的皇宫建筑群汇集了泰国书画、雕刻和装饰艺术的精华。</div>
+            <div class="money">
+              <div class="i">
+                <div class="label">票价</div>
+                <div class="val">
+                  <span>888.88</span>
+                  <span class="unit">USDT</span>
+                </div>
+              </div>
+              <div class="i">
+                <div class="label">票价</div>
+                <div class="val">
+                  <span>888.88</span>
+                  <span class="unit">USDT</span>
+                </div>
+              </div>
+            </div>
+            <div class="operates">
+              <div class="btn submit">提交</div>
+              <div class="btn cancel">关闭</div>
+            </div>
+          </div>
+        </div>  
+      </template>
+    </Bounced>
+  </div>
+</template>
+
+<script>
+import Bounced from '@/components/Admin/bounced.vue'
+export default {
+  name: 'order-sett',
+  components: { Bounced },
+  props: {},
+  data() {
+    return {
+      dialogVisible: false,
+      timeServe: undefined,
+      time: 0
+
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+    setOpen(dialogVisible) {
+      this.dialogVisible = dialogVisible === true;
+      if (this.dialogVisible) {
+        this.time = 15
+        this.timeServe = setInterval(() => {
+          this.time--;
+          this.text = this.time;
+          if (this.time === 0) {
+            clearInterval(this.timeServe);
+            this.timeServe = undefined
+            this.dialogVisible = false
+          }
+        }, 1000);
+      }
+    }
+
+
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+/* 订单提交弹窗 */
+.order-detail-dialog {
+  display: flex;
+  flex-direction: column;
+  width: 550px;
+  min-height: 529px;
+  margin: 0 auto;
+  border-radius: 10px!important;
+  background-color: #ffffff;
+  overflow: hidden;
+
+  .goods-img {
+    width: 550px;
+    height: 210px;
+
+    .g-img {
+      width: 550px;
+      height: 100%;
+      border-radius: 10px!important;
+    }
+  }
+
+  .content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 100%;
+
+    .title {
+      font-size: 24px;
+      font-weight: 700;
+      line-height: 34px;
+      margin: 15px 0;
+    }
+
+    .desc {
+      margin: 0 20px;
+      font-size: 14px;
+      line-height: 20px;
+    }
+
+    .money {
+      width: 100%;
+      margin-top: 15px;
+
+      .i {
+        display: flex;
+        padding: 0 20px;
+        height: 44px;
+
+        &:not(:first-child) {
+          margin-top: 10px;
+        }
+
+        .label {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 86px;
+          height: 44px;
+          font-size: 14px;
+          background-color: #C1B5C5;
+        }
+
+        .val {
+          flex: 1;
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          padding: 0 15px 0 20px;
+          border: 1px solid #C1B5C5;
+        }
+      }
+    }
+
+    .operates {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      margin: 28px 20px;
+
+      .btn {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 245px;
+        height: 44px;
+        font-size: 16px;
+        border-radius: 4px;
+
+        &:not(:first-child) {
+          margin-left: 20px;
+        }
+
+        &.submit {
+          background-color: #c7ab7b
+        }
+
+        &.cancel {
+          background-color: #cccccc
+        }
+      }
+    }
+  }
+}
+</style>

src/views/Forestage/login/forget-password.vue

@@ -115,7 +115,7 @@
         width: 48px;
         height: 48px;
         opacity: 1;
-        background: rgba(255, 255, 255, 1);
+        /* background: rgba(255, 255, 255, 1); */
         border-radius: 50%;
 
       }

src/views/Forestage/login/login.vue

@@ -113,7 +113,7 @@
         width: 48px;
         height: 48px;
         opacity: 1;
-        background: rgba(255, 255, 255, 1);
+        /* background: rgba(255, 255, 255, 1); */
         border-radius: 50%;
 
       }

src/views/Forestage/login/register.vue

@@ -115,7 +115,7 @@
         width: 48px;
         height: 48px;
         opacity: 1;
-        background: rgba(255, 255, 255, 1);
+        /* background: rgba(255, 255, 255, 1); */
         border-radius: 50%;
 
       }