样式调整

src/components/Hotel/DiDa/HotelList.vue

 <style scoped>
-
-
-.side-hotel-map__marker {
+  .side-hotel-map__marker {
     --map-marker-size: 24px;
     display: inline-block;
     color: #fff;
@@ -12,51 +10,69 @@
     border: 1px solid white;
     background: #14808c;
     text-align: center;
-}
-.hotelnamespan {
+  }
+
+  .hotelnamespan {
     font-size: 18px;
     font-weight: 600;
     color: #606266;
     height: 26px;
-}
-.q-pr-lg {
+  }
+
+  .q-pr-lg {
     margin-right: 24px;
 
-}
-.hotelDiv{
-  display: inline-flex; cursor: pointer;
-}
-.hotelname{
+  }
+
+  .hotelDiv {
+    display: inline-flex;
+    cursor: pointer;
+  }
+
+  .hotelname {
     display: inline-flex;
     cursor: pointer;
-  max-width:83%;
-  white-space: nowrap;  /* 不换行 */
-  overflow: hidden;   white-space: nowrap;  /* 隐藏 */
-  text-overflow: ellipsis; /* 显示为省略号 */
-   border-bottom:1px solid white;
-}
+    max-width: 83%;
+    white-space: nowrap;
+    /* 不换行 */
+    overflow: hidden;
+    white-space: nowrap;
+    /* 隐藏 */
+    text-overflow: ellipsis;
+    /* 显示为省略号 */
+    border-bottom: 1px solid white;
+  }
 
-.hotelname p{
-  white-space: nowrap;  /* 不换行 */
-     overflow: hidden;   white-space: nowrap;  /* 隐藏 */
-     text-overflow: ellipsis; /* 显示为省略号 */
+  .hotelname p {
+    white-space: nowrap;
+    /* 不换行 */
+    overflow: hidden;
+    white-space: nowrap;
+    /* 隐藏 */
+    text-overflow: ellipsis;
+    /* 显示为省略号 */
     /* border-bottom:1px solid #606266 ; */
-}
-.hotelname:hover{
+  }
+
+  .hotelname:hover {
     /* text-decoration: underline; */
-  border-bottom:1px solid #606266 ;
-}
-.hotel-card-img {
+    border-bottom: 1px solid #606266;
+  }
+
+  .hotel-card-img {
     position: relative;
     overflow: hidden;
     width: 160px;
     height: 150px;
     margin-right: 16px;
-}
-.el-card.is-always-shadow, .el-card.is-hover-shadow:focus, .el-card.is-hover-shadow:hover {
+  }
+
+  .el-card.is-always-shadow,
+  .el-card.is-hover-shadow:focus,
+  .el-card.is-hover-shadow:hover {
 
     margin-bottom: 12px;
-}
+  }
 
   .d12p {
     margin-top: 3px;
@@ -72,7 +88,7 @@
     -webkit-box-orient: vertical;
   }
 
-.d12p:hover {
+  .d12p:hover {
     color: #999;
   }
 
@@ -80,19 +96,20 @@
   .pic_item {
     position: relative;
     height: 100%;
-}
-.pic_item:hover{
+  }
+
+  .pic_item:hover {
     cursor: pointer;
-}
+  }
 
-.pic_item h3 {
+  .pic_item h3 {
     position: absolute;
     left: 4rem;
     bottom: 1rem;
     font-size: 50px;
     color: white;
     font-weight: 900;
-    font-family:Georgia, 'Times New Roman', Times, serif;
+    font-family: Georgia, 'Times New Roman', Times, serif;
     font-size: 12px;
     line-height: 116%;
     display: flex;
@@ -100,115 +117,118 @@
     flex: none;
     order: 1;
     align-self: stretch;
-}
-.ant-col {
+  }
+
+  .ant-col {
     max-width: 100%;
     min-height: 1px;
-  position: absolute; /* 设置div为绝对定位 */
-  right: 0; /* 距离右边0像素 */
-  bottom: 0; /* 距离底部0像素 */
-  font-size:18px;
-}
-.nd-price-tag_lg, .nd-price-tag_lg .nd-price-tag__currency {
+    position: absolute;
+    /* 设置div为绝对定位 */
+    right: 0;
+    /* 距离右边0像素 */
+    bottom: 0;
+    /* 距离底部0像素 */
+    font-size: 18px;
+  }
+
+  .nd-price-tag_lg,
+  .nd-price-tag_lg .nd-price-tag__currency {
     font-size: 16px;
     line-height: 24px;
-}
-.nd-price-tag_lg .nd-price-tag__price {
+  }
+
+  .nd-price-tag_lg .nd-price-tag__price {
     font-size: 18px;
     line-height: 26px;
     font-weight: 700;
-}
-.nd-price-tag {
+  }
+
+  .nd-price-tag {
     font-weight: 400;
     color: #f32a4e;
-}
-.nd-reserve-btn {
+  }
+
+  .nd-reserve-btn {
     /* --nd-reserve-btn-color-bg-hover: rgb(20 128 140 / 80%) */
     color: #fff;
     border-color: #14808c;
     background-color: #14808c;
-    margin-left:24px;
-}
-.nd-reserve-btn:hover{
-  background-color:rgb(20 128 140 / 80%);
-}
+    margin-left: 24px;
+  }
+
+  .nd-reserve-btn:hover {
+    background-color: rgb(20 128 140 / 80%);
+  }
 
 </style>
 <template>
-  <div class="page_iisMg" >
+  <div class="flexOne page_iisMg">
     <div class="query-box">
-      <div @keyup.enter="resetPageIndex()">
-      
-      <el-form class="iis_info_box clearfix" label-width="110px">
-        <el-row>
-          <el-col :span="4" :gutter="35">
-            <el-form-item label="国家" >
+      <ul>
+        <li>
+          <span>
+            <em>国家</em>
             <el-select v-model="msg.Country" filterable @change="getCityList(msg.Country,'Destination')"
               :placeholder="$t('hotel.hotel_province')" clearable @clear="msg.Province='',msg.City=''">
               <el-option :key="0" :value="0" :label="$t('pub.pleaseSel')"></el-option>
-              <el-option v-for="item in provinceList" :key="item.ISOCountryCode" :label="item.CountryName_CN" :value="item.ISOCountryCode"></el-option>
+              <el-option v-for="item in provinceList" :key="item.ISOCountryCode" :label="item.CountryName_CN"
+                :value="item.ISOCountryCode"></el-option>
             </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="4" :gutter="35">
-            <el-form-item label="省份">
-              <el-select
-    v-model="msg.DestinationID"
-    filterable
-    remote
-    reserve-keyword
-    placeholder="请输入关键词"
-    :remote-method="remoteMethod"
-    :loading="loading"><el-option :key="0" :value="0" :label="$t('pub.pleaseSel')"></el-option>
-    <el-option v-for="item in cityList" :key="item.CityCode" :label="item.CityName_CN" :value="item.CityCode"></el-option>
+          </span>
+        </li>
+        <li>
+          <span>
+            <em>省份</em>
+            <el-select v-model="msg.DestinationID" filterable remote reserve-keyword placeholder="请输入关键词"
+              :remote-method="remoteMethod" :loading="loading">
+              <el-option :key="0" :value="0" :label="$t('pub.pleaseSel')"></el-option>
+              <el-option v-for="item in cityList" :key="item.CityCode" :label="item.CityName_CN" :value="item.CityCode">
+              </el-option>
             </el-select>
-            </el-form-item>
-          </el-col>
-          <el-col :span="8" :gutter="35">
-            <el-form-item :label="$t('pub.date')">
+          </span>
+        </li>
+        <li>
+          <span>
+            <em>{{$t('pub.date')}}</em>
             <el-date-picker v-model='msg.StartDate' value-format="yyyy-MM-dd" type="date" :picker-options="beforeCheck">
             </el-date-picker>
             <el-date-picker v-model='msg.EndDate' value-format="yyyy-MM-dd" type="date" :picker-options="afterCheck">
             </el-date-picker>
-            </el-form-item>
-          </el-col>
-          <el-col :span="4" :gutter="35">
-            <el-form-item :label="$t('hotel.hotel')">
+          </span>
+        </li>
+        <li>
+          <span>
+            <em>{{$t('hotel.hotel')}}</em>
             <el-input type="" v-model="msg.HotelName" :placeholder="$t('hotel.table_hotelname')"></el-input>
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
-    </div>
-      <ul>
+          </span>
+        </li>
         <li>
-          <button
-            class="hollowFixedBtn"
-            @click="resetPageIndex()"
-          >{{$t('pub.searchBtn')}}</button>
+          <button class="hollowFixedBtn" @click="resetPageIndex()">{{$t('pub.searchBtn')}}</button>
         </li>
       </ul>
     </div>
-
+    <div v-if="dataList.length>0">
+      <el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage"
+        layout="total,prev, pager, next, jumper" :page-size='msg.pageSize' :total='total'>
+      </el-pagination>
+    </div>
     <div style="max-width: 1366px; min-width: 375px; margin: auto;width:1300px">
       <div v-loading="loading">
-      <el-card class="box-card" v-for="(item, index) in dataList" :key="index"  >
-
+        <el-card class="box-card" v-for="(item, index) in dataList" :key="index">
           <div class="hotelDiv" style="width:100%;margin-bottom:12px;">
             <div style="width:85%;">
               <div class="side-hotel-map__marker q-pr-lg"> {{index+1}}</div>
-      <div class="hotelname " ><p ><span class="hotelnamespan"> {{item.hotelName}}</span> <span style="font-size:12px;color:#606266;margin-left:8px;">{{item.hotelEName}}</span></p></div>
+              <div class="hotelname ">
+                <p><span class="hotelnamespan"> {{item.hotelName}}</span> <span
+                    style="font-size:12px;color:#606266;margin-left:8px;">{{item.hotelEName}}</span></p>
+              </div>
+            </div>
+            <div style="width:15%;">
+              <el-rate v-model="item.reviewRating" disabled :max="getPrice(item.reviewRating)" show-score
+                text-color="#ff9900" :colors="['orange','orange','orange','orange','orange']"
+                disabled-void-color="rgb(211 217 225)">
+              </el-rate>
             </div>
-      <div style="width:15%;"><el-rate
-  v-model="item.reviewRating"
-  disabled
-  :max="getPrice(item.reviewRating)"
-  show-score
-  text-color="#ff9900"
-  :colors="['orange','orange','orange','orange','orange']"
-  disabled-void-color="rgb(211 217 225)"
-  >
-</el-rate></div>
           </div>
           <div style="display: inline-flex; width:100%;height:auto;margin-top:12px;">
             <!-- 图片 -->
@@ -227,58 +247,52 @@
             <!-- 基本信息 -->
             <div style="position: relative; width:100%;">
               <div style="width:100%;line-height:26px;">
-        <p >
+                <p>
                   <i class="text-grey-13 q-mr-xs el-icon-location-outline" name="place" size="xs"></i>
                   {{item.address}}
                 </p>
 
                 <template v-if="item.DescriptionList&&item.DescriptionList.length>0">
-        <el-popover
-    placement="top"
-    width="600"
-    title="酒店简介"
-    trigger="click" >
+                  <el-popover placement="top" width="600" title="酒店简介" trigger="click">
                     <div style="line-height:27px;" v-html="item.DescriptionList[0].HotelDescription_CN"></div>
                     <div slot="reference" class="d12p" style="line-height:26px;font-size:14px;">
                       <span class="hotelnamespan" style="float: left;">酒店简介</span>
                       <div v-html="item.DescriptionList[0].NoHtmlHotelDescription"></div>
                     </div>
                   </el-popover>
-</template>
+                </template>
               </div>
               <div class="ant-col nd-price-tag">
                 <span class="nd-price-tag__currency nd-price-tag">CNY </span>
-           <span class="nd-price-tag__price nd-price-tag" style="font-weight: bolder !important;font-size: 20px;">{{item.lowrateBySetCurrency}} </span>
+                <span class="nd-price-tag__price nd-price-tag"
+                  style="font-weight: bolder !important;font-size: 20px;">{{item.lowrateBySetCurrency}} </span>
                 <span class="nd-price-tag">起</span>
-      <el-button round class="nd-reserve-btn" @click="goUrlT('HotelDetails', item.hotelId)" >立即预订</el-button>
+                <el-button round class="nd-reserve-btn" @click="goUrlT('HotelDetails', item.hotelId)">立即预订</el-button>
               </div>
             </div>
           </div>
 
-</el-card>
-</div>
+        </el-card>
+      </div>
+    </div>
+    <div class="noDataNotice" v-if="dataList.length<1&&loading==false"><i class="iconfont icon-kong"></i>
+      <p>没有找到你需要的数据</p>
     </div>
-    <div class="noDataNotice" v-if="dataList.length<1&&loading==false"><i class="iconfont icon-kong"></i> <p>没有找到你需要的数据</p></div>
     <div v-if="dataList.length>0">
-      <el-pagination
-          background
-          @current-change="handleCurrentChange"
-          :current-page.sync="currentPage"
-          layout="total,prev, pager, next, jumper"
-          :page-size='msg.pageSize'
-          :total='total'>
+      <el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage"
+        layout="total,prev, pager, next, jumper" :page-size='msg.pageSize' :total='total'>
       </el-pagination>
     </div>
 
   </div>
 </template>
 <script>
-export default {
+  export default {
     data() {
       return {
         active: 1,
-      RB_Group_Id:'',
-      companyList:[],
+        RB_Group_Id: '',
+        companyList: [],
         msg: {
           //只查询日本
           Country: "JP",
@@ -291,18 +305,18 @@ export default {
           MaxPrice: 0,
           MinPrice: 0,
           HotelName: '',
-          StartDate:'',
-          EndDate:'',
+          StartDate: '',
+          EndDate: '',
           pageIndex: 1,
           pageSize: 10,
-        IsSelectImg:1,
+          IsSelectImg: 1,
         },
         productionDate: [],
         dataList: [],
         loading: false,
         isShow: false,
         currentPage: 0,
-      total:0,
+        total: 0,
         //国家 省市 区
         provinceList: [],
         cityList: [],
@@ -335,8 +349,8 @@ export default {
         if (query !== '') {
           let msg = {
             CountryCode: this.msg.Country,
-          Type:'Destination',
-          CityName_CN:query
+            Type: 'Destination',
+            CityName_CN: query
           };
           this.apipost(
             "dmc_post_GetDiDaCityBaseInfo",
@@ -349,54 +363,59 @@ export default {
           this.cityList = [];
         }
       },
-      getCityList(ID,Type) {
+      getCityList(ID, Type) {
         //根据省份获取城市
-        let msg = {  };
-        if(Type==="Destination"){
+        let msg = {};
+        if (Type === "Destination") {
           msg = {
             CountryCode: ID,
-          Type:Type
+            Type: Type
           };
           this.cityList = [];
-        }
-        else {
+        } else {
           msg = {
             ParentCityCode: ID,
-          Type:Type
+            Type: Type
           };
-          this.district=[];
+          this.district = [];
         }
         this.apipost(
           "dmc_post_GetDiDaCityBaseInfo",
           msg,
           res => {
-            if(Type==="Destination"){
+            if (Type === "Destination") {
               this.cityList = res.data.data;
-        }
-        else {
-          this.district= res.data.data;
+            } else {
+              this.district = res.data.data;
             }
           },
         );
       },
-      getProvinceList(countryId) {
+      getProvinceList() {
         //根据省份获取城市
         this.provinceList = [];
-       
         this.apipost(
-          "dmc_post_GetDiDaCountryList",
-          {},
+          "dmc_post_GetDiDaCountryList", {},
           res => {
             this.provinceList = res.data.data;
           },
         );
       },
-      goUrlT(url,id){
-        this.$router.push({ name:url,query:{"id":id,"StartDate":this.msg.StartDate,"EndDate":this.msg.EndDate,blank:'y',tab:'道旅酒店详情'}})
+      goUrlT(url, id) {
+        this.$router.push({
+          name: url,
+          query: {
+            "id": id,
+            "StartDate": this.msg.StartDate,
+            "EndDate": this.msg.EndDate,
+            blank: 'y',
+            tab: '道旅酒店详情'
+          }
+        })
       },
       getPageList: function () {
         this.loading = true
-      this.apipost('dmc_post_GetDiDaHotelPageList', this.msg, res=>{
+        this.apipost('dmc_post_GetDiDaHotelPageList', this.msg, res => {
           this.loading = false
           if (res.data.resultCode == 1) {
             this.total = res.data.data.count;
@@ -408,20 +427,12 @@ export default {
         this.msg.pageIndex = val;
         this.getPageList();
       },
-    resetPageIndex: function (){  // 重置页码
-      this.msg.pageIndex=1;
+      resetPageIndex: function () { // 重置页码
+        this.msg.pageIndex = 1;
         this.currentPage = 1;
         this.getPageList()
       },
-    getBranchList(){
 
-      this.RB_Group_Id = this.getLocalStorage().RB_Group_id;
-      this.apipost('admin_get_BranchGetList', {RB_Group_Id:this.RB_Group_Id}, res=>{
-        if (res.data.resultCode == 1) {
-          this.companyList=res.data.data;
-        }
-      }, null)
-    },
       getPrice(price) {
         return Math.ceil(price);
       },
@@ -432,20 +443,21 @@ export default {
       var year = DateTime.getFullYear();
       var month = DateTime.getMonth() + 1;
       var day = DateTime.getDate();
-    this.msg.StartDate= year + "-" + 
+      this.msg.StartDate = year + "-" +
         (month < 10 ? "0" : "") + month + "-" +
-                   (day < 10 ? "0" : "") + day ;
+        (day < 10 ? "0" : "") + day;
 
       var eDateTime = new Date();
       eDateTime.setDate(eDateTime.getDate() + 9);
       var eyear = eDateTime.getFullYear();
       var emonth = eDateTime.getMonth() + 1;
       var eday = eDateTime.getDate();
-    this.msg.EndDate= eyear + "-" + 
+      this.msg.EndDate = eyear + "-" +
         (emonth < 10 ? "0" : "") + emonth + "-" +
-                   (eday < 10 ? "0" : "") + eday ;           
-    this.getProvinceList("JP");
+        (eday < 10 ? "0" : "") + eday;
+      this.getProvinceList();
       this.getPageList();
     }
-};
+  };
+
 </script>

src/components/Hotel/DiDa/HotelSure.vue

 <style scoped>
-.hotelCard-img {
+  .hotelCard-img {
     width: 228px;
     height: 162px;
     overflow: hidden;
-}
-.hotelCard-title {
+  }
+
+  .hotelCard-title {
     width: 100%;
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
-}
-.hotel-info-item::before {
+  }
+
+  .hotel-info-item::before {
     display: inline;
     content: "·";
     font-weight: bolder;
     margin-right: 4px;
-}
-.height-320 {
+  }
+
+  .height-320 {
     height: 250px;
-}
-.hotel-details-table {
+  }
+
+  .hotel-details-table {
     border: 1px solid #dcdcdc;
     border-collapse: collapse;
     width: 680px;
-}
-.hotel-details-table .td01 {
+  }
+
+  .hotel-details-table .td01 {
     padding: 3px 15px;
     background: #f7f7f7;
     width: 226px;
     height: 19px;
     text-align: center;
-}
-.hotel-details-table .td02 {
+  }
+
+  .hotel-details-table .td02 {
     padding: 3px 15px;
     background: #fafafa;
     width: 69px;
     height: 19px;
     text-align: center;
-}
-.hotel-details-table td {
+  }
+
+  .hotel-details-table td {
     width: 439px;
     padding: 10px 20px;
     vertical-align: middle;
@@ -46,28 +53,32 @@
     border: 1px solid #dcdcdc;
     font-size: 14px;
     box-sizing: border-box;
-}
-.hotel-details-tableMoblie {
+  }
+
+  .hotel-details-tableMoblie {
     border: 1px solid #dcdcdc;
     border-collapse: collapse;
     width: 100%;
     margin-top: 5px;
-}
-.hotel-details-tableMoblie .td01 {
+  }
+
+  .hotel-details-tableMoblie .td01 {
     padding: 3px 10px;
     background: #f7f7f7;
     width: 33.33%;
     height: 19px;
     text-align: center;
-}
-.hotel-details-tableMoblie .td02 {
+  }
+
+  .hotel-details-tableMoblie .td02 {
     padding: 3px 5px;
     background: #fafafa;
     width: 33.33%;
     height: 19px;
     text-align: center;
-}
-.hotel-details-tableMoblie td {
+  }
+
+  .hotel-details-tableMoblie td {
     width: 100%;
     padding: 10px 20px;
     vertical-align: middle;
@@ -75,66 +86,79 @@
     border: 1px solid #dcdcdc;
     font-size: 14px;
     box-sizing: border-box;
-}
-.HD_hotelComIntroduce {
+  }
+
+  .HD_hotelComIntroduce {
     margin: auto;
     height: auto;
     border-bottom: 1px solid #dcdcdc;
     color: #111111;
-}
-.HD_hotelComIntroduce span {
+  }
+
+  .HD_hotelComIntroduce span {
     display: inline-block;
     margin-bottom: 10px;
-}
-.HD_inTitle {
+  }
+
+  .HD_inTitle {
     font-size: 14px;
     font-weight: bold;
     color: #111111;
     margin-bottom: 20px;
-}
-.HD_ServiceList span {
+  }
+
+  .HD_ServiceList span {
     display: inline-block;
     margin: 0 30px 10px 0;
     white-space: nowrap;
-}
-.bg-white {
+  }
+
+  .bg-white {
     background: #fff !important;
-}
-.q-py-lg {
+  }
+
+  .q-py-lg {
     padding-top: 24px;
     padding-bottom: 24px;
-}
-.q-py-lg8 {
+  }
+
+  .q-py-lg8 {
     padding-top: 8px;
     padding-bottom: 8px;
-}
+  }
 
-.q-py-bottom8 {
+  .q-py-bottom8 {
     padding-bottom: 8px;
-}
-.column {
+  }
+
+  .column {
     flex-direction: column;
-}
-.row {
+  }
+
+  .row {
     display: flex;
     flex-wrap: wrap;
-}
-.q-mb-lg {
+  }
+
+  .q-mb-lg {
     margin-bottom: 24px;
-}
-.justify-between {
+  }
+
+  .justify-between {
     justify-content: space-between;
-}
+  }
 
-.q-position-engine {
+  .q-position-engine {
     margin-top: var(--q-pe-top, 0) !important;
     margin-left: var(--q-pe-left, 0) !important;
     will-change: auto;
-}
-.scroll {
+  }
+
+  .scroll {
     overflow: auto;
-}
-.q-menu {
+  }
+
+  .q-menu {
     position: fixed !important;
     display: inline-block;
     max-width: 95vw;
@@ -146,129 +170,158 @@
     outline: 0;
     max-height: 65vh;
     z-index: 6000;
-}
-.q-pa-md {
+  }
+
+  .q-pa-md {
     padding: 16px;
-}
-.q-pa-mdlr {
+  }
+
+  .q-pa-mdlr {
     padding: 0px 16px;
-}
-.rounded-borders {
+  }
+
+  .rounded-borders {
     border-radius: 4px;
-}
-.wrap {
+  }
+
+  .wrap {
     flex-wrap: wrap;
-}
-.q-card {
+  }
+
+  .q-card {
     box-shadow: 0 1px 5px #0003, 0 2px 2px #00000024, 0 3px 1px -2px #0000001f;
     border-radius: 4px;
     vertical-align: top;
     background: #fff;
     position: relative;
-}
-.q-card > div:not(:last-child),
-.q-card > img:not(:last-child) {
+  }
+
+  .q-card>div:not(:last-child),
+  .q-card>img:not(:last-child) {
     border-bottom-left-radius: 0;
     border-bottom-right-radius: 0;
-}
-.q-card > div:first-child,
-.q-card > img:first-child {
+  }
+
+  .q-card>div:first-child,
+  .q-card>img:first-child {
     border-top: 0;
     border-top-left-radius: inherit;
     border-top-right-radius: inherit;
-}
-.q-card > div {
+  }
+
+  .q-card>div {
     border-left: 0;
     border-right: 0;
     box-shadow: none;
-}
-.q-mr-md {
+  }
+
+  .q-mr-md {
     margin-right: 16px;
-}
-.no-shadow {
+  }
+
+  .no-shadow {
     display: flex;
     justify-content: flex-start;
-}
+  }
 
-.el-date-editor .el-range-input {
+  .el-date-editor .el-range-input {
     width: 70px;
-}
-.el-range-separator {
+  }
+
+  .el-range-separator {
     width: 20px !important;
-}
-.el-date-editor--daterange.el-input,
-.el-date-editor--daterange.el-input__inner,
-.el-date-editor--timerange.el-input,
-.el-date-editor--timerange.el-input__inner {
+  }
+
+  .el-date-editor--daterange.el-input,
+  .el-date-editor--daterange.el-input__inner,
+  .el-date-editor--timerange.el-input,
+  .el-date-editor--timerange.el-input__inner {
     width: 202px;
-}
-.el-input .el-input__inner,
-.el-select .el-input {
+  }
+
+  .el-input .el-input__inner,
+  .el-select .el-input {
     border-radius: 4px;
     height: 32px;
-}
-.HD_Green {
+  }
+
+  .HD_Green {
     background-color: green;
-}
-.text-white {
+  }
+
+  .text-white {
     color: #fff !important;
-}
-.absolute,
-.absolute-full,
-.absolute-center,
-.absolute-bottom,
-.absolute-left,
-.absolute-right,
-.absolute-top,
-.absolute-top-left,
-.absolute-top-right,
-.absolute-bottom-left,
-.absolute-bottom-right {
+  }
+
+  .absolute,
+  .absolute-full,
+  .absolute-center,
+  .absolute-bottom,
+  .absolute-left,
+  .absolute-right,
+  .absolute-top,
+  .absolute-top-left,
+  .absolute-top-right,
+  .absolute-bottom-left,
+  .absolute-bottom-right {
     position: absolute;
-}
-.HD_Black {
+  }
+
+  .HD_Black {
     background-color: #000;
-}
-.q-px-lg {
+  }
+
+  .q-px-lg {
     padding-left: 24px;
     padding-right: 24px;
-}
-.q-pl-lg {
+  }
+
+  .q-pl-lg {
     padding-left: 24px;
-}
-.q-pt-sm {
+  }
+
+  .q-pt-sm {
     padding-top: 8px;
-}
-.q-px-sm {
+  }
+
+  .q-px-sm {
     padding-left: 8px;
     padding-right: 8px;
-}
+  }
 
-.q-pb-md8 {
+  .q-pb-md8 {
     padding-bottom: 8px;
-}
-.q-mb-md {
+  }
+
+  .q-mb-md {
     margin-bottom: 16px !important;
-}
-.q-mb-md8 {
-  margin-bottom:8px !important;
-}
-.text-right {
+  }
+
+  .q-mb-md8 {
+    margin-bottom: 8px !important;
+  }
+
+  .text-right {
     text-align: right;
-}
-.q-pt-md {
+  }
+
+  .q-pt-md {
     padding-top: 16px;
-}
-.text-green {
+  }
+
+  .text-green {
     color: #4caf50 !important;
-}
-.text-grey-6 {
+  }
+
+  .text-grey-6 {
     color: #9e9e9e !important;
-}
-.text-red {
+  }
+
+  .text-red {
     color: #f44336 !important;
-}
-.q-focus-helper {
+  }
+
+  .q-focus-helper {
     position: absolute;
     top: 0;
     left: 0;
@@ -279,156 +332,149 @@
     opacity: 0;
     transition: background-color 0.3s cubic-bezier(0.25, 0.8, 0.5, 1),
       opacity 0.4s cubic-bezier(0.25, 0.8, 0.5, 1);
-}
-.q-btn--actionable {
+  }
+
+  .q-btn--actionable {
     cursor: pointer;
-}
-.bg-green-6 {
+  }
+
+  .bg-green-6 {
     background: #4caf50 !important;
-}
-.q-separator--horizontal {
+  }
+
+  .q-separator--horizontal {
     display: block;
     height: 1px;
-}
-.el-divider--horizontal {
+  }
+
+  .el-divider--horizontal {
     margin: 0px !important;
-}
-.order-show {
+  }
+
+  .order-show {
     text-align: center;
     color: red;
-}
-.fz18 {
+  }
+
+  .fz18 {
     font-size: 18px;
     font-weight: bold;
-}
-.text-orange-6 {
+  }
+
+  .text-orange-6 {
     color: #ff9800 !important;
-}
-.text-green-6 {
+  }
+
+  .text-green-6 {
     color: #4caf50 !important;
-}
-.text-weight-bold {
+  }
+
+  .text-weight-bold {
     font-weight: 700;
-}
-.text-grey-9 {
+  }
+
+  .text-grey-9 {
     color: #424242 !important;
-}
-.fz20 {
+  }
+
+  .fz20 {
     font-size: 20px;
-}
-.text-red {
+  }
+
+  .text-red {
     color: #f44336 !important;
-}
-.text-h5 {
+  }
+
+  .text-h5 {
     font-size: 1.5rem;
     font-weight: 400;
     line-height: 2rem;
     letter-spacing: normal;
-}
-.q-ml-md {
+  }
+
+  .q-ml-md {
     margin-left: 6px;
-}
-.q-px-md {
+  }
+
+  .q-px-md {
     padding-left: 16px;
     padding-right: 16px;
-}
-.items-center,
-.flex-center {
+  }
+
+  .items-center,
+  .flex-center {
     align-items: center;
-}
-.items-end {
+  }
+
+  .items-end {
     align-items: flex-end;
-}
-/deep/ .el-card__body, .el-main {
+  }
+
+  /deep/ .el-card__body,
+  .el-main {
     padding: 10px !important;
-}
-.d-pr8 {
+  }
+
+  .d-pr8 {
     padding-right: 8px;
-}
+  }
 
-.table-list tr, td {
+  .table-list tr,
+  td {
     border-bottom: 1px solid #ddd;
     border-right: 1px solid #ddd;
     border-left: 1px solid #ddd;
-  padding:8px;
-  border-collapse: collapse; /* 移除单元格之间的间隔 */
-  font-size:12px;
-}
-.table-list tr:first-child td {
+    padding: 8px;
+    border-collapse: collapse;
+    /* 移除单元格之间的间隔 */
+    font-size: 12px;
+  }
+
+  .table-list tr:first-child td {
     border-top: 1px solid #ddd;
     border-right: 1px solid #ddd;
     border-left: 1px solid #ddd;
-  padding:8px;
-  border-collapse: collapse; /* 移除单元格之间的间隔 */
-}
+    padding: 8px;
+    border-collapse: collapse;
+    /* 移除单元格之间的间隔 */
+  }
+
 </style>
 <template>
   <div class="q-py-lg">
-    <div
-      class="bg-white q-py-lg8 column  q-mb-md"
-      style="max-width: 1366px; min-width: 375px; margin: auto;width:1300px"
-    >
+    <div class="bg-white q-py-lg8 column  q-mb-md"
+      style="max-width: 1366px; min-width: 375px; margin: auto;width:1300px">
       <div class="row q-px-lg q-py-lg8 row justify-between">
-        <div
-          class="row no-wrap items-center  q-mt-xs q-pt-sm text-orange-6 text-weight-bold"
-          style="width:100%;"
-        >
-          <el-button
-            class="bg-orange-6 text-white"
-            size="sm"
-            type="warning"
-            icon="el-icon-user"
-            circle
-          ></el-button>
-          <span class="fz18 q-pl-lg" style="margin-top:8px;"
-            >超过13岁视为成人处理</span
-          >
+        <div class="row no-wrap items-center  q-mt-xs q-pt-sm text-orange-6 text-weight-bold" style="width:100%;">
+          <el-button class="bg-orange-6 text-white" size="sm" type="warning" icon="el-icon-user" circle></el-button>
+          <span class="fz18 q-pl-lg" style="margin-top:8px;">超过13岁视为成人处理</span>
         </div>
-        <div
-          class="row no-wrap items-center text-green-6 q-mt-xs q-pt-sm text-weight-bold"
-          style="width:100%;"
-        >
-          <el-button
-            class="bg-green-6 text-white"
-            size="sm"
-            type="success"
-            icon="el-icon-document"
-            circle
-          ></el-button>
-          <span class="fz18 q-pl-lg" style="margin-top:8px;"
-            >预定成功后房间将为您保留整晚</span
-          >
+        <div class="row no-wrap items-center text-green-6 q-mt-xs q-pt-sm text-weight-bold" style="width:100%;">
+          <el-button class="bg-green-6 text-white" size="sm" type="success" icon="el-icon-document" circle></el-button>
+          <span class="fz18 q-pl-lg" style="margin-top:8px;">预定成功后房间将为您保留整晚</span>
         </div>
       </div>
     </div>
 
-   
     <div class="bg-white  column  q-mb-md" style="max-width: 1366px; min-width: 375px; margin: auto;width:1300px">
       <div class="row  q-py-bottom8 row justify-between">
-        <div style="width:100%;background:#e1f5fe!important;font-weight:700;border-radius:4px;height:53px;display:flex;padding-left:10px; align-items: center;">
+        <div
+          style="width:100%;background:#e1f5fe!important;font-weight:700;border-radius:4px;height:53px;display:flex;padding-left:10px; align-items: center;">
           预定信息
         </div>
       </div>
-
       <template v-if="sureMsg&&sureMsg.BookingID&&sureMsg.BookingID.length>0">
         <div class="row q-px-lg  row justify-between q-mb-md">
-        <div
-          class="row no-wrap items-center  q-mt-xs q-pt-sm text-red text-weight-bold"
-          style="width:100%;"
-        >
+          <div class="row no-wrap items-center  q-mt-xs q-pt-sm text-red text-weight-bold" style="width:100%;">
             <span class="fz18 text-red">
-            {{ sureMsg.HotelName }}</span
-          >
+              {{ sureMsg.HotelName }}</span>
           </div>
         </div>
         <div style="padding-bottom: 8px;">
-<div style="display: flex;">
+          <div style="display: flex;">
             <div class="q-pt-xs col q-px-lg q-mb-md8" style="width:50%;">
-      <span class="text-grey-6 q-pr-lg"> <i
-            class="text-grey-13 q-mr-xs el-icon-location-outline"
-            name="place"
-            size="xs"
-          ></i>
+              <span class="text-grey-6 q-pr-lg"> <i class="text-grey-13 q-mr-xs el-icon-location-outline" name="place"
+                  size="xs"></i>
                 <span class="col fz14 text-weight-bold text-blick text-grey-6">{{
             Address
           }}</span>
@@ -436,59 +482,42 @@
             </div>
 
             <div class="q-pt-xs col q-px-lg q-mb-md8" style="width:50%;">
-    <span class="text-grey-6 q-pr-lg"> <i
-          style="color:#c0c4cc;"
-            class="text-grey-13 q-mr-xs el-icon-phone"
-            name="place"
-            size="xs"
-          ></i>
+              <span class="text-grey-6 q-pr-lg"> <i style="color:#c0c4cc;" class="text-grey-13 q-mr-xs el-icon-phone"
+                  name="place" size="xs"></i>
                 <span class="col fz14 text-weight-bold text-blick text-grey-6">{{  $route.query.tel }}</span>
               </span>
 
             </div>
-</div>
-</div>
-   
-
+          </div>
+        </div>
         <div style="display:row;flex-direction:row;padding-bottom:16px;" class="justify-between">
-       
           <div style="padding-bottom: 8px;">
-<div style="display: flex;">
+            <div style="display: flex;">
               <div class="q-pt-xs col q-px-lg q-mb-md8" style="width:50%;">
                 <span class="text-grey-6 q-pr-lg">房型</span>
                 <span class="text-grey-9">
-        <template v-if=" roomRateDetails.RatePlanList && roomRateDetails.RatePlanList.length > 0 " >
+                  <template v-if=" roomRateDetails.RatePlanList && roomRateDetails.RatePlanList.length > 0 ">
                     {{ roomRateDetails.RatePlanList[0].RoomName_CN }}
                   </template>
                 </span>
               </div>
-
               <div class="q-pt-xs col q-px-lg q-mb-md8" style="width:50%;">
                 <span class="text-grey-6 q-pr-lg">床型</span>
-    <span
-      class="text-grey-9 q-pr-lg"
-      v-if="
-        roomRateDetails.RatePlanList &&
-          roomRateDetails.RatePlanList.length > 0
-      "
-      v-loading="loading"
-    >
+                <span class="text-grey-9 q-pr-lg"
+                  v-if="roomRateDetails.RatePlanList &&  roomRateDetails.RatePlanList.length > 0" v-loading="loading">
                   {{ getRoomType(roomRateDetails.RatePlanList[0].BedType) }}
                 </span>
               </div>
-</div>
-</div>
-           
-<div style="padding-bottom: 8px;">
-
-<div style="display: flex;">
+            </div>
+          </div>
 
+          <div style="padding-bottom: 8px;">
+            <div style="display: flex;">
               <div class="q-pt-xs col q-px-lg q-mb-md8" style="width:50%;">
-     
                 <span class="text-grey-6 q-pr-lg">入住日期</span>
                 <span class="text-grey-9"> {{params.CheckInDate}} <span class="q-ml-md">{{ checkInWeek }}</span>
                   -
-          <span > {{params.CheckOutDate}} </span>
+                  <span> {{params.CheckOutDate}} </span>
                   <span class="q-ml-md">{{ checkOutWeek }}</span>
                 </span>
               </div>
@@ -496,29 +525,21 @@
                 <span class="text-grey-6 q-pr-lg">入住人數</span>
                 <span class="text-grey-9">
                   <span>成人 {{ auditNum }} 人</span>
-                  <span class="q-pl-lg" v-if="childNum > 0"
-                    >儿童{{ childNum }} 人</span
-                  >
+                  <span class="q-pl-lg" v-if="childNum > 0">儿童{{ childNum }} 人</span>
                   <span class="q-pl-lg" v-if="isBaoChild">不能报儿童</span>
                 </span>
               </div>
-              
-</div>
-</div>
+            </div>
+          </div>
           <div style="padding-bottom: 8px;">
-
             <div style=" display: flex;">
-              
-              <div style="width:50%;" v-if=" roomRateDetails.RatePlanList && roomRateDetails.RatePlanList.length > 0   "  v-for="(item, index) in roomRateDetails.RatePlanList"  :key="index"  >
-                <div class="q-pt-xs col q-px-lg q-mb-md8" >
+              <div style="width:50%;" v-if="roomRateDetails.RatePlanList && roomRateDetails.RatePlanList.length > 0"
+                v-for="(item, index) in roomRateDetails.RatePlanList" :key="index">
+                <div class="q-pt-xs col q-px-lg q-mb-md8">
                   <span class="text-grey-6 q-pr-lg">房间数量</span>
                   <span class="text-grey-9"> {{ item.RoomOccupancy.RoomNum }} </span>
-                  <span class="text-grey-9"
-                    ><i
-                      class="text-grey-13 q-mr-xs  el-icon-warning-outline text-orange-6"
-                      name="place"
-                      size="xs"
-                    ></i>
+                  <span class="text-grey-9"><i class="text-grey-13 q-mr-xs  el-icon-warning-outline text-orange-6"
+                      name="place" size="xs"></i>
                     仅剩
                     <span class="text-orange text-orange-6">{{
                       item.InventoryCount
@@ -531,28 +552,25 @@
                 <div>
                   <span class="text-grey-6 q-pr-lg">报价是否即时确认</span>
                   <span class="text-grey-9">
-                  <template v-if=" roomRateDetails.RatePlanList && roomRateDetails.RatePlanList.length > 0 " >
+                    <template v-if=" roomRateDetails.RatePlanList && roomRateDetails.RatePlanList.length > 0 ">
                       {{ roomRateDetails.RatePlanList[0].IsOnRequest?"否":"是" }}
                     </template>
                   </span>
                 </div>
               </div>
-
             </div>
           </div>
-
-        <div class="q-pt-xs col q-px-lg q-mb-md " >
-            <span class=" q-pr-lg d-pr8" style="float:left;" >订单总金额</span >
+          <div class="q-pt-xs col q-px-lg q-mb-md ">
+            <span class=" q-pr-lg d-pr8" style="float:left;">订单总金额</span>
             <span class=" col row wrap text-red" style="font-size:18px;">
               ( {{DanWei}} ){{roomRateDetails.TotalPrice}}
             </span>
           </div>
-
           <div class="q-pt-xs col q-px-lg q-mb-md">
-            <span class="text-grey-6 q-pr-lg d-pr8" style="float:left;" >房費情況</span >
+            <span class="text-grey-6 q-pr-lg d-pr8" style="float:left;">房費情況</span>
             <span class="text-grey-9 col row wrap">
               <template v-if="roomRateDetails.RatePlanList && roomRateDetails.RatePlanList.length > 0">
-                <table class="table-list" cellspacing="0" >
+                <table class="table-list" cellspacing="0">
                   <tr style="background-color: #f1f1f1;">
                     <td v-for="( itemp, indexp ) in roomRateDetails.RatePlanList[0].PriceList" :key="indexp">
                       {{getWeekD(itemp.StayDate)}}
@@ -561,102 +579,72 @@
                   <tr>
                     <td v-for="( itemp, indexp ) in roomRateDetails.RatePlanList[0].PriceList" :key="indexp">
                       <span class="text-red">{{DanWei }} {{itemp.Price}}</span>
-                                  
-                                    <p >
-                                <span :class="itemp.MealAmount>0?'text-green':'' " >
+                      <p>
+                        <span :class="itemp.MealAmount>0?'text-green':'' ">
                           {{getMealtype(itemp.MealType)}}
                           <template v-if="itemp.MealAmount>0">
                             ×{{itemp.MealAmount}}份
                           </template>
                         </span>
                       </p>
-                        
                     </td>
                   </tr>
                 </table>
               </template>
-               
             </span>
           </div>
-
-         
         </div>
-
       </template>
-    <template v-else><div style="text-align:center;padding:18px;">暂无数据</div></template>
-
-
+      <template v-else>
+        <div style="text-align:center;padding:18px;">暂无数据</div>
+      </template>
     </div>
 
-    <div
-      class="bg-white  column  q-mb-md"
-      style="max-width: 1366px; min-width: 375px; margin: auto;width:1300px"
-    >
+    <div class="bg-white  column  q-mb-md" style="max-width: 1366px; min-width: 375px; margin: auto;width:1300px">
       <div class="row  q-py-bottom8 row justify-between">
         <div
-          style="width:100%;background:#e1f5fe!important;font-weight:700;border-radius:4px;height:53px;padding-left:10px; align-items: center;"
-        >
-          <span style="float: left;  padding-top: 16px;   display: block;"
-            >入住信息</span
-          >
-
-          <span
-            style="float: right;  padding-top: 16px; padding-right:16px;  display: block;"
-            class="text-orange-6"
-          >
-            <i
-              class="text-grey-13 q-mr-xs  el-icon-warning-outline"
-              name="place"
-              size="xs"
-            ></i
-            >所填姓名需和入住时所持证件一致</span
-          >
+          style="width:100%;background:#e1f5fe!important;font-weight:700;border-radius:4px;height:53px;padding-left:10px; align-items: center;">
+          <span style="float: left;  padding-top: 16px;   display: block;">入住信息</span>
+          <span style="float: right;  padding-top: 16px; padding-right:16px;  display: block;" class="text-orange-6">
+            <i class="text-grey-13 q-mr-xs  el-icon-warning-outline" name="place" size="xs"></i>所填姓名需和入住时所持证件一致</span>
         </div>
       </div>
-
       <div class="row q-px-lg q-py-lg8 row justify-between" style="width: 100%; display: block;">
-        <el-form label-position="left" label-width="80px" class="iis_info_box clearfix" 
-         ref="sureMsg" :rules="rules" :model="sureMsg" >
+        <el-form label-position="left" label-width="80px" class="iis_info_box clearfix" ref="sureMsg" :rules="rules"
+          :model="sureMsg">
           <el-row>
             <el-col :gutter="35" style="width:26%;">
-              <el-form-item label="预订人" prop="guestLastName" >
+              <el-form-item label="预订人" prop="guestLastName">
                 <el-input v-model="sureMsg.guestLastName" placeholder="姓（英文）"></el-input>
-               
               </el-form-item>
             </el-col>
-
             <el-col :gutter="35" style="width:25%;margin-right:24px;">
               <el-form-item label="" prop="guestFirstName">
                 <el-input v-model="sureMsg.guestFirstName" placeholder="名（英文）"></el-input>
               </el-form-item>
             </el-col>
-
             <el-col :gutter="35" style="width:30%;">
               <el-form-item label="Email" prop="guestEmail">
                 <el-input v-model="sureMsg.guestEmail" placeholder="Email"></el-input>
               </el-form-item>
             </el-col>
           </el-row>
-
           <el-row>
-            <el-col style="width:49%;":gutter="35">
+            <el-col style="width:49%;" :gutter="35">
               <el-form-item label="电话" prop="guestPhoneNumber">
                 <el-input v-model="sureMsg.guestPhoneNumber" placeholder="电话"></el-input>
               </el-form-item>
             </el-col>
           </el-row>
-
           <el-row>
             <el-col style="width:49%;" :gutter="35">
-              <el-form-item label="客户需求" >
+              <el-form-item label="客户需求">
                 <el-input v-model="sureMsg.guestRequest" placeholder="客户需求"></el-input>
               </el-form-item>
             </el-col>
           </el-row>
-
-          
           <el-form-item label-width="0px" v-if="sureMsg.GuestList && sureMsg.GuestList.length > 0">
-          <template  v-for="(item, subIndex) in sureMsg.GuestList" >
+            <template v-for="(item, subIndex) in sureMsg.GuestList">
               <div v-for="(itemguest, numberOfAdultsIndex) in item.GuestInfo" :key="subIndex">
                 <el-row style="margin-bottom:22px">
                   <el-col :gutter="35" style="width:26%;margin-right:24px;">
@@ -666,28 +654,22 @@
                       <el-input v-model="itemguest.LastName" placeholder="姓（英文）"></el-input>
                     </el-form-item>
                   </el-col>
-
                   <el-col :gutter="35" style="width:25%;margin-right:24px;">
                     <el-form-item label="" :prop="`GuestList[${subIndex}].GuestInfo[${numberOfAdultsIndex}].FirstName`"
-                    :rules="rules.FirstName" >
+                      :rules="rules.FirstName">
                       <el-input v-model="itemguest.FirstName" placeholder="名（英文）"></el-input>
                     </el-form-item>
                   </el-col>
-
                   <el-col :gutter="35" style="width:30%;">
-                  <el-form-item label=""  >
-                    <el-input type="number" v-model="itemguest.Age" :min="0"  :max="12" placeholder="年龄（儿童必填）" ></el-input>
+                    <el-form-item label="">
+                      <el-input type="number" v-model="itemguest.Age" :min="0" :max="12" placeholder="年龄（儿童必填）">
+                      </el-input>
                     </el-form-item>
                   </el-col>
-                
                 </el-row>
               </div>
-            
             </template>
           </el-form-item>
-         
-
-
           <el-row>
             <el-col :gutter="35">
               <div class="row col-12 text-red q-mb-md" v-if="
@@ -701,31 +683,26 @@
                   </div>
                   <div v-else>
                     <p>{{ getformatDateStr(itemCancella.FromDate) }}
-                                <span v-if="index1!=(roomRateDetails.CancellationPolicyList.length-1)">- {{ getformatDateStr(roomRateDetails.CancellationPolicyList[index1+1].FromDate) }} 之间</span> 
+                      <span v-if="index1!=(roomRateDetails.CancellationPolicyList.length-1)">-
+                        {{ getformatDateStr(roomRateDetails.CancellationPolicyList[index1+1].FromDate) }} 之间</span>
                       取消，收费 {{DanWei}}{{getPrice(itemCancella.Amount)}};</p>
                   </div>
-
                 </div>
-
               </div>
-             
             </el-col>
           </el-row>
-
         </el-form>
       </div>
     </div>
-    <div
-      class="col row q-mb-md"
-      style="max-width: 1366px; min-width: 375px; margin: auto;width:1300px"
-    >
-    <el-button type="primary"  :disabled="submDisabled" style="width:100%;" @click="submitForm('sureMsg')" :loading="submLoading">下单</el-button>
+    <div class="col row q-mb-md" style="max-width: 1366px; min-width: 375px; margin: auto;width:1300px">
+      <el-button type="primary" :disabled="submDisabled" style="width:50%; margin:0 auto;" @click="submitForm('sureMsg')"
+        :loading="submLoading">下单</el-button>
     </div>
 
   </div>
 </template>
 <script>
-export default {
+  export default {
     data() {
       return {
         isShowTime: true,
@@ -757,16 +734,16 @@ export default {
         numberOfAdults: 0,
         numberOfChildren: 0,
         submLoading: false,
-      submDisabled:false,
+        submDisabled: false,
         loading: false,
         dateRange: "", //当前日期
         dateRange2: "", //当前日期
         roomRateDetails: {},
         DanWei: "",
         HotelRoomTypes: [], //散客房间类型
-      HotelMealTypes:[],//餐型
+        HotelMealTypes: [], //餐型
         dataList: {},
-      GuestInfo:{
+        GuestInfo: {
           LastName: '',
           FirstName: '',
           Age: '',
@@ -794,8 +771,8 @@ export default {
           OrderForm: 1,
           //备注
           guestRequest: "",
-        hotelId:'',
-        roomType:0,
+          hotelId: '',
+          roomType: 0,
         },
         auditNum: 0,
         childNum: 0,
@@ -874,18 +851,19 @@ export default {
     methods: {
       // 提交下单
       submitForm(formName) {
-      this.$refs[formName].validate((valid)=>{
-        if(valid){
+        this.$refs[formName].validate((valid) => {
+          if (valid) {
             if (this.submLoading) return;
             let flag = false;
             this.sureMsg.hotelId = this.$route.query.hotelId;
             this.sureMsg.RatePlanID = this.$route.query.RatePlanID;
             this.sureMsg.CheckInDate = this.params.CheckInDate;
-      this.sureMsg.EmployeeIdStr =this.getLocalStorage().EmployeeId+"";
+            this.sureMsg.EmployeeIdStr = this.getLocalStorage().EmployeeId + "";
             this.sureMsg.totalRoomCount = this.params.searchroomGroup.length;
             this.sureMsg.RoomCount = this.params.searchroomGroup.length;
             this.sureMsg.CheckOutDate = this.params.CheckOutDate;
-      if(this.roomRateDetails&&this.roomRateDetails.RatePlanList&&this.roomRateDetails.RatePlanList.length>0){
+            if (this.roomRateDetails && this.roomRateDetails.RatePlanList && this.roomRateDetails.RatePlanList
+              .length > 0) {
               this.sureMsg.roomType = this.roomRateDetails.RatePlanList[0].BedType;
             }
 
@@ -909,9 +887,13 @@ export default {
                 this.loading = false;
                 if (res.data.resultCode == 1) {
                   this.Success("下单成功");
-            this.$router.push({ name:"HotelOrderTotal",query:{tab:'散卖酒店订单'}})
+                  this.$router.push({
+                    name: "HotelOrderTotal",
+                    query: {
+                      tab: '散卖酒店订单'
                     }
-          else{
+                  })
+                } else {
                   this.Error(res.data.message);
                 }
                 this.submLoading = false;
@@ -926,7 +908,7 @@ export default {
 
       //获取道旅餐食类型
       getdidaMealType() {
-        this.apipost('dmc_post_GetDidaMealType', this.hotelMsg, res=>{
+        this.apipost('dmc_post_GetDidaMealType', this.hotelMsg, res => {
           this.loading = false
           if (res.data.resultCode == 1) {
             this.HotelMealTypes = res.data.data;
@@ -946,22 +928,21 @@ export default {
         return mealtypeName;
       },
       //日期格式化
- getIsCancella(RatePlanCancellationPolicyList,TotalPrice) {
-  let IsCancel=0;//不可取消
-        let date2 = new Date();//当前时间
-        RatePlanCancellationPolicyList.forEach((item,index) => {
-          var dt = new Date(item.FromDate);//取消时间
-          if(IsCancel==0){
-            if (dt > date2 ) {
-            if(item.Amount==TotalPrice){
-              IsCancel=1;
-            }else{
-              IsCancel=2;
-            }
+      getIsCancella(RatePlanCancellationPolicyList, TotalPrice) {
+        let IsCancel = 0; //不可取消
+        let date2 = new Date(); //当前时间
+        RatePlanCancellationPolicyList.forEach((item, index) => {
+          var dt = new Date(item.FromDate); //取消时间
+          if (IsCancel == 0) {
+            if (dt > date2) {
+              if (item.Amount == TotalPrice) {
+                IsCancel = 1;
+              } else {
+                IsCancel = 2;
               }
-        else{
-              if(item.Amount!=TotalPrice){
-                IsCancel=2;
+            } else {
+              if (item.Amount != TotalPrice) {
+                IsCancel = 2;
               }
             }
           }
@@ -985,7 +966,7 @@ export default {
         let year = dt.getFullYear();
         let month = (dt.getMonth() + 1).toString().padStart(2, "0");
         let date = (dt.getDate() + 1).toString().padStart(2, "0");
-     return  month + "-" + date +"("+this.WeekList[dt.getDay()]+")";
+        return month + "-" + date + "(" + this.WeekList[dt.getDay()] + ")";
       },
 
       //日期格式化
@@ -993,19 +974,23 @@ export default {
         var dt = new Date(value);
         let year = dt.getFullYear();
         let month = (dt.getMonth() + 1).toString().padStart(2, "0");
-      let date = (dt.getDate() ).toString().padStart(2, "0");
+        let date = (dt.getDate()).toString().padStart(2, "0");
         return year + "-" + month + "-" + date;
       },
       optionsFnStar(cd) {
         return (
           cd <=
-        date.formatDate(date.addToDate(new Date(), { days: 9 }), "YYYY/MM/DD")
+          date.formatDate(date.addToDate(new Date(), {
+            days: 9
+          }), "YYYY/MM/DD")
         );
       },
       optionsFnEnd(cd) {
         return (
           cd >=
-        date.formatDate(date.addToDate(new Date(), { days: 9 }), "YYYY/MM/DD")
+          date.formatDate(date.addToDate(new Date(), {
+            days: 9
+          }), "YYYY/MM/DD")
         );
       },
       dateRangeHandler(e) {
@@ -1049,11 +1034,11 @@ export default {
               this.TotalChildCount = 0;
               let rateGrouoLen = 0;
             }
-          if(this.roomRateDetails&&this.roomRateDetails.RatePlanList&&this.roomRateDetails.RatePlanList.length>0){
-              this.submDisabled=false;
-            }
-            else{
-              this.submDisabled=true;
+            if (this.roomRateDetails && this.roomRateDetails.RatePlanList && this.roomRateDetails.RatePlanList
+              .length > 0) {
+              this.submDisabled = false;
+            } else {
+              this.submDisabled = true;
             }
           },
           null
@@ -1181,5 +1166,6 @@ export default {
       this.getdidaMealType();
       this.initHotel();
     }
-};
+  };
+
 </script>