页面修改

src/components/Hotel/HouseTypeList.vue

-<template>
-  <div>
-    <div class="query-box" style="border-bottom: none;">
-      <ul>
-       <li>
-          <span>
-            <em>酒店</em>
-            <el-select v-model="msg.HotelId" :placeholder="$t('pub.pleaseSel')" filterable>
-              <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
-              <el-option v-for="item in HotelList" :key="item.ID" :label="item.Name" :value="item.ID"></el-option>
-            </el-select>
-          </span>
-        </li>
-        <li><span><em>日期</em>
-            <el-date-picker v-model='msg.StartDate' class='w135' value-format="yyyy-MM-dd" type="date"></el-date-picker>
-            -
-            <el-date-picker v-model='msg.EndDate' class='w135' value-format="yyyy-MM-dd" type="date"></el-date-picker>
-          </span>
-        </li>
-        <li>
-          <input type="button" class="normalBtn" value="查询" @click="getList()" />
-        </li>      
-        </ul>
-    </div>
-    <div style="width: 100%;  overflow-x: auto;padding-bottom: 10px; " class="ownScrollbarStyle">
-      <table border="0" cellspacing="1" cellpadding="0" class="HouseTypeList" v-if="isShow">
-        <tr>
-          <th width="300">酒店名称</th>
-          <th width="80"></th>
-          <th v-for="item in dataList[0].subList">
-            {{getDateList(item.DateStr)}}
-          </th>
-        </tr>
-        <tr>
-          <th></th>
-          <th></th>
-          <th v-for="item in dataList[0].subList">
-            {{getWeek(item.DateStr)}}
-          </th>
-        </tr>
-        <tr v-for="item in dataList">
-            <td>
-              <div style="min-width:300px; text-align:left;padding-left:5px;">{{item.HotelName}}</div>
-            </td>
-            <td>
-                <div class="Hotel_kong" style="min-width:60px;">空房</div>
-                <div class="Hotel_kong">超定</div>
-            </td>
-            <td v-for="subItem in item.subList">
-                <div class="Hotel_kong Com_hoteldiv" :class="{'noKucun':subItem.Status==0}">{{subItem.RemainingInventory}}</div>
-                <div class="Hotel_kong Com_hoteldiv">
-                  <span v-if="subItem.UseInventory-subItem.Inventory>0" style="color:red;">{{subItem.UseInventory-subItem.Inventory}}</span>
-                </div>
-            </td>
-        </tr>
-      </table>
-    </div>
-  </div>
-</template>
-
-<script>
-  export default {
-    data() {
-      return {
-          msg:{
-              HotelId:0,
-              StartDate: new Date().Format("yyyy-MM-dd"),
-              EndDate: this.setEdate(),
-          },
-          HotelList: [],
-          dataList: [],
-          isShow:false,
-      };
-    },
-    methods: {
-      getList() {
-        if (this.msg.StartDate == null) {
-          this.msg.StartDate = new Date().Format("yyyy-MM-dd")
-        }
-        if (this.msg.EndDate == null) {
-          this.msg.EndDate = this.setEdate()
-        }
-        this.apipost("dict_post_HotelOffer_GetHotelStatics",this.msg,
-          res => {
-            if (res.data.resultCode == 1) {
-              this.dataList = res.data.data;
-              this.isShow=true;
-              console.log(this.dataList,'dataList');
-            } else {
-              this.Error(res.data.message);
-            }
-          },
-          err => {}
-        );
-      },
-      //获取酒店列表
-      GetHotelList() {
-        this.apipost(
-          "hotel_post_GetHasStockHotelList", {
-            Country: 651,
-            IsMoreThanZero: 1
-          },
-          res => {
-            if (res.data.resultCode == 1) {
-              this.HotelList = res.data.data;
-            }
-          },
-          err => {}
-        );
-      },
-      setEdate(){
-          return this.addMoth(new Date().Format("yyyy-MM-dd"), 1)
-      },
-      addMoth(d, m) {
-        let ds = d.split('-'),
-          _d = ds[2] - 0;
-        let nextM = new Date(ds[0], ds[1] - 1 + m + 1, 0);
-        let max = nextM.getDate();
-        d = new Date(ds[0], ds[1] - 1 + m, _d > max ? max : _d);
-        return d.toLocaleDateString().match(/\d+/g).join('-')
-      },
-      //格式化返回显示日期
-      getDateList(dateStr){
-        var str = dateStr.split('-');
-        return str[1]+'/'+str[2];
-      },
-      //获取星期几
-      getWeek(dateStr){
-        var weekDay = ["天", "一", "二", "三", "四", "五", "六"];  
-        var myDate = new Date(Date.parse(dateStr));  
-        return weekDay[myDate.getDay()]
-      }
-    },
-    mounted() {
-      this.GetHotelList();
-      this.getList();
-    }
-  };
-</script>
-
-<style>
-  .HouseTypeList {
-    background: #ccc;
-    width:100%;
-  }
-  .Com_hoteldiv{
-    min-width: 40px;
-  }
-  .noKucun{
-    background-color: black;
-  }
-  .Hotel_kong{
-    width:100%;
-    height:35px;
-    line-height: 35px;
-    border-bottom:1px solid #d1d1d1;
-  }
-  .Hotel_kong:last-child{
-    border:0;
-  }
-  .HouseTypeList tr th {
-    background: #e6e6e6;
-    height: 35px;
-    font-size: 12px;
-    color: #333;
-  }
-
-  .HouseTypeList tr {
-    background: #fff;
-    text-align: center;
-    height: 35px;
-  }
-
-  .HouseTypeList tr td {
-    font-size: 12px;
-  }
-</style>

src/router/config.js

@@ -628,11 +628,11 @@ export default {
                 title: '酒店核算详情'
               },
             },{
-              path: '/HouseTypeList', //配房类型
-              name: 'HouseTypeList',
-              component: resolve => require(['@/components/Hotel/HouseTypeList'], resolve),
+              path: '/HotelQueryList', //酒店查询统计
+              name: 'HotelQueryList',
+              component: resolve => require(['@/components/Hotel/HotelQueryList'], resolve),
               meta: {
-                title: '配房类型'
+                title: '酒店查询统计'
               },
             },
             {