4.1

src/components/Title2/index.vue

@@ -1,7 +1,15 @@
 <template>
-  <div class="title-2">
+  <div v-if="type==1" class="title-2">
     <span>{{ title }}</span>
   </div>
+  <div v-if="type==2" class="title-2">
+	  <div class="item active">
+		  <span >{{ title }}</span>
+	  </div>
+	  <div class="item">
+		  <span>直通车购票</span>
+	  </div>
+  </div>
 </template>
 
 <script setup>
@@ -9,7 +17,11 @@
     title: {
       type: String,
       default: ''
-    }
+    },
+	type: {
+		type: Number,
+		default:1
+	}
   })
 </script>
 
@@ -19,10 +31,14 @@
     height: vh(28);
     display: flex;
     align-items: center;
-    background-image: url('@/assets/images/title-5.png');
+    // background-image: url('@/assets/images/title-5.png');
     background-size: 100% 100%;
-    & > span {
-      padding-left: vw(22);
+	.item{
+		// margin-right: vw(22);
+		padding:vw(5) vw(10);
+		// border-bottom:1px solid #ccc;
+	}
+    &  span {
       font-weight: bold;
       font-size: vw(15);
       background-image: linear-gradient(to bottom, #ffffff 0%, #75c1ff 100%);
@@ -31,5 +47,10 @@
       -webkit-text-fill-color: transparent; /* 兼容WebKit内核浏览器 */
       color: transparent; /* 兼容其他浏览器 */
     }
+	& .active{
+		background: linear-gradient(180deg, #00b7ff 0%, #0033ff 100%);
+		color:#fff;
+		border-bottom:none;
+	}
   }
 </style>

src/components/VideoDialog/index.vue

@@ -269,7 +269,7 @@
     }
     .video {
       width: vw(1814);
-      height: vw(950);
+      height: vw(920);
       object-fit: contain;
       background-color: #062b57;
     }

src/views/home/components/box-1.vue

@@ -69,7 +69,16 @@
     </div>
 
     <div class="ticket-box">
-      <Title2 title="景区购票" />
+      <Title2 :type="2" title="景区购票" />
+	  
+	<!-- <div class="select-box">
+	    <Select
+	      v-model="optVal"
+	      label="选择景区"
+	      :options="options"
+	      @on-change="getScenicChart"
+	    />
+	  </div> -->
       <div class="ticket-wrap">
         <img src="@/assets/images/ticket.png" />
         <div v-for="(item, index) in homeStore.scenicData.data" :key="index">
@@ -127,9 +136,20 @@
   import gauge from './gauge'
   import countup from 'vue-countup-v3'
   import { useHomeStore } from '@/stores/home'
-
+  let optVal = ref('景区购票')
+  let options = ref([
+	  {
+		id: '1',
+		ssname: '景区购票'
+	  }, {
+		id: '2',
+		ssname: '直通车购票'
+	  }
+  ])
   const homeStore = useHomeStore()
-
+  const getScenicChart = ()=>{
+	  
+  }
   // 今日景区承载量
   const scenicBearList = computed(() => {
     return [{ data: homeStore.scenicBearData.dataList.map((item) => item.value) }]
@@ -150,6 +170,11 @@
 </script>
 
 <style lang="scss" scoped>
+  .select-box {
+	  width:vw(200);
+	  height:vh(30);
+	  font-size:vw(16);
+   }
   .box-2 {
     margin-top: vh(120);
     width: vw(800);
@@ -350,7 +375,7 @@
       }
     }
     .ticket-wrap {
-      margin-top: vh(8);
+      margin-top: vh(18);
       display: flex;
       align-items: center;
       justify-content: space-between;