新增机票下载

src/components/Ticketing/seatStatistics.vue

 <style>
-/* 日期样式开始 */
-.seatStatistics .month ul {
+  /* 日期样式开始 */
+  .seatStatistics .month ul {
     border-radius: 4px 4px 0 0;
     width: 100%;
     height: 50px;
@@ -9,47 +9,56 @@
     margin: 0;
     padding: 0;
     text-align: center;
-}
-.seatStatistics .year-month {
+  }
+
+  .seatStatistics .year-month {
     flex-direction: column;
     align-items: center;
     justify-content: space-around;
-}
-.seatStatistics .year-month > input {
+  }
+
+  .seatStatistics .year-month>input {
     width: 100px;
     float: left;
-}
-.seatStatistics .arrow {
+  }
+
+  .seatStatistics .arrow {
     padding: 10px;
     font-style: normal;
     cursor: pointer;
-}
-.seatStatistics .monthminus {
+  }
+
+  .seatStatistics .monthminus {
     position: absolute;
     left: 0px;
     top: 15px;
-}
-.seatStatistics .monthadd {
+  }
+
+  .seatStatistics .monthadd {
     position: absolute;
     right: 21px;
     top: 15px;
-}
-.seatStatistics .month ul li {
+  }
+
+  .seatStatistics .month ul li {
     font-size: 18px;
     color: #fff;
     position: relative;
     display: inline-block;
     letter-spacing: 3px;
-}
-.seatStatistics .month ul li i {
+  }
+
+  .seatStatistics .month ul li i {
     font-size: 22px;
     color: #ff7e7e;
     cursor: pointer;
-}
-.seatStatistics .month ul li > input {
+  }
+
+  .seatStatistics .month ul li>input {
     text-align: center;
-}
-.seatStatistics .weekdays {
+  }
+
+  .seatStatistics .weekdays {
     margin: 0;
     padding: 3px 0;
     background-color: #3fa783;
@@ -58,19 +67,23 @@
     flex-wrap: wrap;
     color: #fff;
     justify-content: space-around;
-}
-.seatStatistics .weekdays li {
+  }
+
+  .seatStatistics .weekdays li {
     display: inline-block;
     width: 14.2857%;
     text-align: center;
-}
-.seatStatistics .days li:nth-child(7n-1) p {
+  }
+
+  .seatStatistics .days li:nth-child(7n-1) p {
     color: #e95252 !important;
-}
-.seatStatistics .days li:nth-child(7n) p {
+  }
+
+  .seatStatistics .days li:nth-child(7n) p {
     color: #e95252 !important;
-}
-.seatStatistics .days {
+  }
+
+  .seatStatistics .days {
     width: 100%;
     padding: 0;
     margin: 0;
@@ -78,8 +91,9 @@
     flex-wrap: wrap;
     box-sizing: border-box;
     justify-content: space-around;
-}
-.seatStatistics .days > li {
+  }
+
+  .seatStatistics .days>li {
     list-style-type: none;
     width: 14.2857%;
     height: 140px;
@@ -91,25 +105,29 @@
     box-sizing: border-box;
     border-right: 1px solid #ddd;
     border-bottom: 1px solid #ddd;
-}
-.seatStatistics .days li > div {
+  }
+
+  .seatStatistics .days li>div {
     height: 112px;
     width: 100%;
     overflow-y: auto;
     text-align: left;
-}
-.seatStatistics .days li > div > p {
+  }
+
+  .seatStatistics .days li>div>p {
     border-bottom: 1px dashed #ccc;
     height: 28px;
     line-height: 28px;
     width: 100%;
     text-indent: 10px;
     background: #fff;
-}
-.seatStatistics .days li > div > p:nth-child(2n) {
+  }
+
+  .seatStatistics .days li>div>p:nth-child(2n) {
     background: #f5f5f5;
-}
-.seatStatistics .currentInput {
+  }
+
+  .seatStatistics .currentInput {
     width: 120px;
     height: 30px;
     border-radius: 17px;
@@ -118,8 +136,9 @@
     color: #fff;
     background: transparent;
     font-size: 18px;
-}
-.seatStatistics .days li .other-month {
+  }
+
+  .seatStatistics .days li .other-month {
     display: inline-block;
     position: absolute;
     right: 0;
@@ -130,11 +149,13 @@
     line-height: 17px;
     background-color: #cccccc;
     color: #fff;
-}
-.seatStatistics .addCompany {
+  }
+
+  .seatStatistics .addCompany {
     width: 700px;
-}
-.seatStatistics .ckStyle {
+  }
+
+  .seatStatistics .ckStyle {
     width: 100%;
     height: 28px;
     line-height: 28px;
@@ -143,40 +164,49 @@
     font-weight: bold;
     background: #ccc;
     color: #000;
-}
-.seatStatistics .ckStyleOther {
+  }
+
+  .seatStatistics .ckStyleOther {
     background: #dddddd !important;
     font-weight: normal !important;
     color: #999;
-}
-.seatStatistics .el-dialog--center .el-dialog__body {
+  }
+
+  .seatStatistics .el-dialog--center .el-dialog__body {
     padding-top: 0;
-}
-.HB_Inventor {
+  }
+
+  .HB_Inventor {
     display: block;
     text-align: left;
     padding-top: 8px;
-}
-.HB_Inventor > span {
+  }
+
+  .HB_Inventor>span {
     display: block;
     padding-left: 10px;
     font-size: 12px;
     height: 18px;
     margin-bottom: 3px;
-}
-.seatStatistics .Owe_Room {
+  }
+
+  .seatStatistics .Owe_Room {
     color: #e95252;
-}
-.seatStatistics .Used_room {
+  }
+
+  .seatStatistics .Used_room {
     color: #13b0ae;
-}
-.seatStatistics .otherMoth {
+  }
+
+  .seatStatistics .otherMoth {
     background: #f2f2f2;
-}
-.seatStatistics .weekendDay {
+  }
+
+  .seatStatistics .weekendDay {
     color: #e95252;
-}
-.seatStatistics .title {
+  }
+
+  .seatStatistics .title {
     height: 14px;
     line-height: 14px;
     border-left: 3px solid #e95252;
@@ -184,8 +214,10 @@
     color: #333;
     text-indent: 10px;
     margin: 20px 0;
-}
-/* 日期样式结束*/
+  }
+
+  /* 日期样式结束*/
+
 </style>
 <template>
   <div class="flexOne seatStatistics">
@@ -196,12 +228,8 @@
             <em>{{$t('advmanager.v_line')}}</em>
             <el-select v-model="msg.QLineId" :placeholder="$t('pub.pleaseSel')" filterable>
               <el-option :label="$t('pub.unlimitedSel')" :value="defaultSelectValue"></el-option>
-              <el-option
-                v-for="item in LineList"
-                :key="item.LineID"
-                :label="item.LineName"
-                :value="item.LineID"
-              ></el-option>
+              <el-option v-for="item in LineList" :key="item.LineID" :label="item.LineName" :value="item.LineID">
+              </el-option>
             </el-select>
           </span>
         </li>
@@ -210,40 +238,23 @@
             <em>{{$t('system.table_goCity')}}</em>
             <el-select v-model="msg.QCityId" :placeholder="$t('system.ph_in')" filterable>
               <el-option :label="$t('pub.unlimitedSel')" :value="defaultSelectValue"></el-option>
-              <el-option
-                v-for="item in cityList"
-                :key="item.ID"
-                :label="item.Name"
-                :value="item.ID"
-              ></el-option>
+              <el-option v-for="item in cityList" :key="item.ID" :label="item.Name" :value="item.ID"></el-option>
             </el-select>
           </span>
         </li>
         <li>
           <span>
             <em>{{$t('admin.admin_czPerson')}}</em>
-            <el-select
-              v-model="msg.QCreateBy"
-              filterable
-              :placeholder="$t('system.ph_in')"
-              class="w120"
-            >
+            <el-select v-model="msg.QCreateBy" filterable :placeholder="$t('system.ph_in')" class="w120">
               <el-option :label="$t('pub.unlimitedSel')" :value="defaultSelectValue"></el-option>
-              <el-option
-                v-for="item in EmployeeList"
-                :label="item.EmName"
-                :value="item.EmployeeId"
-                :key="item.EmployeeId"
-              ></el-option>
+              <el-option v-for="item in EmployeeList" :label="item.EmName" :value="item.EmployeeId"
+                :key="item.EmployeeId"></el-option>
             </el-select>
           </span>
         </li>
         <li style="margin-right:50px;">
-          <button
-            class="normalBtn"
-            type="button"
-            @click="GetHoltelInventory()"
-          >{{$t('pub.searchBtn')}}</button>
+          <button class="normalBtn" type="button" @click="GetHoltelInventory()">{{$t('pub.searchBtn')}}</button>
+          <button class="normalBtn" type="button" @click="DownLoadAirticket()">下载</button>
         </li>
       </ul>
     </div>
@@ -255,31 +266,15 @@
     <div class="month">
       <ul>
         <li>
-          <i
-            class="el-icon-caret-left monthminus"
-            @click="currentYear-=1,getDateString(),initCalendar(dateString)"
-          ></i>
-          <input
-            type="text"
-            disabled="disabled"
-            v-model="currentYear"
-            class="currentInput"
-            @input="getDateString(),initCalendar(dateString)"
-          >年
-          <i
-            class="el-icon-caret-right monthadd"
-            @click="currentYear+=1,getDateString(),initCalendar(dateString)"
-          ></i>
+          <i class="el-icon-caret-left monthminus" @click="currentYear-=1,getDateString(),initCalendar(dateString)"></i>
+          <input type="text" disabled="disabled" v-model="currentYear" class="currentInput"
+            @input="getDateString(),initCalendar(dateString)">年
+          <i class="el-icon-caret-right monthadd" @click="currentYear+=1,getDateString(),initCalendar(dateString)"></i>
         </li>
         <li>
           <i class="el-icon-caret-left monthminus" @click="pickPre(currentYear,currentMonth)"></i>
-          <input
-            type="text"
-            disabled="disabled"
-            v-model="currentMonth"
-            class="currentInput"
-            @input="getDateString(),initCalendar(dateString)"
-          >月
+          <input type="text" disabled="disabled" v-model="currentMonth" class="currentInput"
+            @input="getDateString(),initCalendar(dateString)">月
           <i class="el-icon-caret-right monthadd" @click="pickNext(currentYear,currentMonth)"></i>
         </li>
       </ul>
@@ -294,18 +289,12 @@
       <li class="weekendDay">{{$t('hotel.hotel_Saturday')}}</li>
       <li class="weekendDay">{{$t('hotel.hotel_Sunday')}}</li>
     </ul>
-    <ul class="days clearfix">
+    <ul class="days clearfix" v-loading="loading">
       <li v-for="(dayobject,index) in days" :key="dayobject.index">
-        <p
-          class="ckStyle"
-          :class="{ckStyleOther:dayobject.day.getMonth()+1 != currentMonth}"
-        >{{dayobject.day.getDate()}} ({{dayobject.TotalCount}})</p>
+        <p class="ckStyle" :class="{ckStyleOther:dayobject.day.getMonth()+1 != currentMonth}">
+          {{dayobject.day.getDate()}} ({{dayobject.TotalCount}})</p>
         <div class="ownScrollbarStyle">
-          <p
-            class="over_ellipsis"
-            v-for="item in dayobject.listArr"
-            @click="goUrl('TicketManager',item,'票务管理')"
-          >
+          <p class="over_ellipsis" v-for="item in dayobject.listArr" @click="goUrl('TicketManager',item,'票务管理')">
             {{item.AirLineTicketId}}
             {{item.DepartureName}}
             -
@@ -319,7 +308,7 @@
   </div>
 </template>
 <script>
-export default {
+  export default {
     data() {
       return {
         msg: {
@@ -348,15 +337,15 @@ export default {
         //员工列表
         EmployeeList: [],
         TotalCount: 0,
-      TotalSeat: 0
+        TotalSeat: 0,
+        loading:false
       };
     },
     methods: {
       //获取线路列表
       GetLineList() {
         this.apipost(
-        "line_post_GetAllList",
-        {},
+          "line_post_GetAllList", {},
           res => {
             if (res.data.resultCode == 1) {
               this.LineList = res.data.data;
@@ -376,7 +365,7 @@ export default {
         });
       },
       //格式化日期
-    getDateString: function() {
+      getDateString: function () {
         this.dateString = this.$calendarUtils.formatDate(
           this.currentYear,
           this.currentMonth,
@@ -384,7 +373,7 @@ export default {
         );
         this.GetHoltelInventory();
       },
-    initCalendar: function(cur) {
+      initCalendar: function (cur) {
         var newDays = this.$calendarUtils.createCalendar(cur);
         this.currentDay = newDays.CurrentDay;
         this.currentYear = newDays.CurrentYear;
@@ -400,7 +389,7 @@ export default {
         }
       },
       //点击左箭头切换年月
-    pickPre: function(year, month) {
+      pickPre: function (year, month) {
         var d = new Date(this.$calendarUtils.formatDate(year, month, 1));
         d.setDate(0);
         this.nowDate = d.getFullYear() + "-" + (d.getMonth() + 1) + "-1";
@@ -410,7 +399,7 @@ export default {
         this.GetHoltelInventory();
       },
       //点击右箭头切换年月
-    pickNext: function(year, month) {
+      pickNext: function (year, month) {
         var d = new Date(this.$calendarUtils.formatDate(year, month, 1));
         d.setDate(35);
         this.nowDate = d.getFullYear() + "-" + (d.getMonth() + 1) + "-1";
@@ -421,11 +410,13 @@ export default {
       },
       //点击获取机票库存数据
       GetHoltelInventory() {
+        this.loading=true;
         this.msg.FlightDate = this.currentYear + "-" + this.currentMonth + "-01";
         this.apipost(
           "AirTicket_get_GetMonthAirticketFlight",
           this.msg,
           res => {
+            this.loading=false;
             this.DayData = res.data.data;
             this.TotalCount = 0;
             this.TotalSeat = 0;
@@ -455,8 +446,7 @@ export default {
       //获取中国下面的城市列表
       getCityList() {
         this.apipost(
-        "Destination_get_GetCityListByCountryId",
-        {
+          "Destination_get_GetCityListByCountryId", {
             Id: 2
           },
           res => {
@@ -468,7 +458,9 @@ export default {
       //根据当前员工所在部门获取该部门及子部门员工信息
       getEmployeeList() {
         let UserInfo = this.getLocalStorage();
-      var msg = { GroupId: UserInfo.RB_Group_id };
+        var msg = {
+          GroupId: UserInfo.RB_Group_id
+        };
         this.apipost(
           "admin_get_EmployeeGetList",
           msg,
@@ -479,7 +471,17 @@ export default {
           },
           err => {}
         );
-    }
+      },
+      //机票导出
+      DownLoadAirticket() {
+        this.loading = true;
+        var fileName = "机票下载" + this.msg.Month + ".xls";
+        this.GetLocalFile("airticket_get_DownLoadAirticket", this.msg, fileName,
+          res => {
+            this.loading = false;
+          });
+
+      },
     },
     mounted() {
       //初始化日历
@@ -492,5 +494,6 @@ export default {
       this.initCalendar();
       this.GetHoltelInventory();
     }
-};
+  };
+
 </script>