no message

@@ -5,13 +5,14 @@
   </div>
   <div class="box">
     <div class="searchBar">
-      <el-input placeholder="请输入关键字搜索" v-model="query.name" class="no-border">
+      <el-input :placeholder="language==0?'请输入关键字搜索':'Search'" v-model="query.name" class="no-border">
       </el-input>
-      <el-button size="large" type="primary" class="btn-lineG" icon="search">搜索</el-button>
+      <el-button size="large" type="primary" class="btn-lineG" icon="search" @click="getList">
+        {{ language==0?'搜索':'Search' }}</el-button>
     </div>
   </div>
 
-  <div class="box">
+  <div class="box" v-loading="loading">
     <el-card v-for="(h,index) in list" class="mb20" @click="goDetail(h)">
 <!--        酒店列表-->
         <el-row class="hotel" align="middle" :gutter="20">
@@ -25,7 +26,7 @@
             </div>
             <div class="tagbox">
               <span v-for="(t,index) in h.label?.split('，')" v-show="index<4">{{t}}</span>
-              <a v-show="h.label?.split('，').length>4">更多 ></a>
+              <a v-show="h.label?.split('，').length>4">{{ language==0?'更多':'MORE' }} ></a>
             </div>
             <p class="esp addr">
               <el-icon size="16" style="position: relative;top: 2px" color="#929AA0"><LocationFilled /></el-icon>
@@ -33,11 +34,12 @@
             </p>
           </el-col>
           <el-col :span="8" class="text-right">
-            <div class="price">¥<span>{{ h.price }}</span><i>起</i></div>
-            <el-button class="btn-lineG w200px" round type="primary" size="large">立即预约 ⇀</el-button>
+            <div class="price">¥<span>{{ h.price }}</span><i v-if="language==0">起</i></div>
+            <el-button class="btn-lineG w200px" round type="primary" size="large">{{ language==0?'立即预约':'Book Now' }} ⇀</el-button>
           </el-col>
         </el-row>
     </el-card>
+    <el-empty v-show="!loading&&list.length==0" :image="`/img/order_no.png`" :image-size="228"  description="" />
   </div>
 
 </div>
@@ -46,19 +48,27 @@
 <script setup>
   import {onMounted} from "@vue/runtime-core"
   import * as booking from "@/apiPc/booking"
-  import {useRouter} from "vue-router";
+  import {useRouter,useRoute} from "vue-router";
+  import {useStorage} from "@vueuse/core/index";
   const router = useRouter()
+  const route = useRoute()
+  const language= useStorage('language',0)
   const query = ref({
     name:''
   })
-  const list = ref([''])
+  const cptId = ref('')
+  const list = ref([])
+  const loading = ref(false)
   onMounted(()=>{
     getList()
+    cptId.value = route.params.cptId
   })
 
   function getList() {
+    loading.value = true
     booking.getHotelList(query.value).then(res=>{
       list.value = res.rows
+      loading.value = false
     })
   }
   function goDetail(item) {

@@ -119,12 +119,16 @@ function goBooking(n) {
   }
 }
 .item_en{box-shadow: 0px 0px 21px 0px rgba(41,23,101,0.14);margin: 40px 0 0;cursor: pointer;
-  display: flex;align-items: center;text-align: center;
+  display: flex;align-items: center;text-align: center;color: #333;
   font-size: 18px;    flex-direction: column;padding: 35px 10px 20px;
   background:url("@/assets/dance/znbb.png") no-repeat left #FFFFFF;
   background-size: cover;
   position: relative;
   border-radius: 15px;
-  img{position: absolute;top: -30px}
+  img{position: absolute;top: -30px;transition: all 0.2s;}
+  &:hover{box-shadow: 0 0 10px #333;
+    img{transform: rotateY(180deg);}
+    p{color: #000;}
+  }
 }
 </style>