<style> .roomReservationsDetailsTalbe .el-button { padding: 5px; display: block; margin: 5px auto; font-size: 12px; } .rq_importNote { color: red; } .rq_disImNote { color: #ea6d6d; } .hc_Table td{ padding:5px; height:40px; } </style> <template> <div> <div style="width: 100%; overflow-x: auto;padding-bottom: 10px; " class="ownScrollbarStyle" ref="ownScrollbarStyle"> <table border="0" cellspacing="1" cellpadding="0" class="roomReservationsDetailsTalbe hc_Table" style="width:100%" v-loading="loading"> <tr> <th width="15%">{{$t('hotel.table_CheckInDate')}}</th> <th>{{$t('hotel.hotel_name')}}</th> <th>{{$t('ground.xiugaijiudiangys')}}</th> <th width="15%">手配书</th> </tr> <template v-for="(item,index) in list"> <tr v-for="(subItem,subIndex) in item.HotelOrderList"> <td > {{item.UseTimeStr}} </td> <!-- 酒店名称 --> <td> <p class="link" style="word-break: normal;" :class="{'Hotel_red':subItem.HotelChangeState==3}" @click="goUrlR('HotelManagement',subItem.HotelId,'酒店管理')">{{subItem.HotelName}}</p> </td> <td> <div><span style="color:green">{{subItem.NewHotelName}}</span></div> </td> <td> <template v-if="subItem.ContractUrl!=''"> <span style="color:green">已上传手配书</span> <a v-if="subItem.ContractUrl" target="_blank" style="color:blue" :href="subItem.ContractUrl">查看</a> </template> <template v-else> <span style="color:red">未上传</span> </template> </td> </tr> </template> </table> <div class="noDataNotice" v-if="list.length<1"> <i class="iconfont icon-kong"></i> <p>{{$t('active.ld_noData')}}</p> </div> </div> </div> </template> <script> import moment from 'moment' import comCheckHotel from "../commonPage/comCheckHotel.vue"; import commonHotelLog from "../commonPage/commonHotelLog.vue"; import commonPHlInfo from "../commonPage/commonPriceHotelInfo.vue"; export default { data() { return { defaultSelectValue: 0, list: [], roomList: [], TCNUM: '', hotelList: [], //创建人头像 CreateByPhoto: '', //创建人联系电话 CreateByAccount: '', //创建人姓名 CreateByName: '', //点击项 ClickItem: {}, parentEle: '', loading: false, //合团的团期编号 NewTCIDs: "", //供应商列表 SupplierList: [], ckedHotelId: 0, ckedHotelName: '', showHotelList: false, findex: 0, childIndex: 0, //修改酒店价格,付款方式权限[0-不能修改,1-有权限修改] IsEditHotel: 1, //0-可以操作,1-已制单,不能操作 IsOperation: 1, LeaderName: "", //领队名称 GuideName: "", //导游名称 IsEditHotelPeople: 1, //是否有修改人数权限[0-不能修改,1-可以修改] IsCombine: false, //是否是合团,true-是合团,false-不是合团 allCurrencyList: [], //币种列表 checkedIndex: '', checkedsubIndex: '', } }, components: { comCheckHotel, commonHotelLog, commonPHInfo: commonPHlInfo }, methods: { //付款方式切换 PayChange(subItem) { if (subItem.PayStyle > 0) { subItem.DMCPayType = subItem.PayStyle; } }, //调用子组件方法 GetHotelUsePriceList(HotelId, UseDay, index, hotelSubIndex) { let str = `dmccomPriceHotelInfo${index}${hotelSubIndex}`; this.$refs[str][0].getHotelPriceList(HotelId, UseDay); }, //调用子组件获取日志方法 GetHotelLog(subItem, index, hotelSubIndex) { let str = `comHotelLog${index}${hotelSubIndex}` this.$refs[str][0].getHotelLogsList(subItem.TCID, subItem.HotelId, subItem.CheckInDateStr); }, //获取子组件返回的数据 childHotelList(ckedObj) { //使用时间 var oldData = JSON.parse(JSON.stringify(this.list[this.findex].HotelOrderList[this.childIndex])); this.list.forEach(x => { x.HotelOrderList.forEach(y => { y.isShowPop = false; }) }); var useTime = oldData.CheckInDateStr; var hotelId = ckedObj.ID; var TCID = oldData.TCID; this.apipost('travel_get_GetHotelUsePriceListService_V2', { HotelId: hotelId, UseTime: useTime, TCID: TCID }, res => { if (res.data.resultCode == 1) { var objData = res.data.data; //库存不够 if (objData.isOverStock == 0) { if (objData.list && objData.list.length > 0) { var str = ""; objData.list.forEach((cItem, cIndex) => { str += (cIndex == 0 ? "" : ",") + cItem.TCNUM + "使用了" + cItem.LastUseNum + this.$t('hotel.hotel_room'); }); if (str != "") { this.Info(str); } } } //库存充足或没有酒店库存的情况 else if (objData.isOverStock == 1 || objData.isOverStock == -1) { this.list[this.findex].HotelOrderList[this.childIndex].Address = ckedObj.Address; this.list[this.findex].HotelOrderList[this.childIndex].NewHotelName = ckedObj.Name; this.list[this.findex].HotelOrderList[this.childIndex].Tel = ckedObj.Tel; this.list[this.findex].HotelOrderList[this.childIndex].NewHotelId = ckedObj.ID; this.list[this.findex].HotelOrderList[this.childIndex].PayStyle = ckedObj.PayStyle; this.list[this.findex].HotelOrderList[this.childIndex].PayStyleExt = ckedObj.PayStyle; //判断供应商编号是否大于0 if (ckedObj.Supplier > 0) { this.list[this.findex].HotelOrderList[this.childIndex].SupplierId = ckedObj.Supplier; } this.list[this.findex].HotelOrderList[this.childIndex].OrderDetailsList.forEach((subItem, subIndex) => { //判断是否有库存价格 if (subIndex == 1 && ckedObj.CostPrice > 0) { subItem.IsHaveStockPrice = 1; } else { subItem.IsHaveStockPrice = 0; } subItem.UnitPrice = ckedObj.CostPrice; subItem.RebateRatio = ckedObj.RebateRatio; }); this.calculationPrice(this.list[this.findex].HotelOrderList[this.childIndex]); } } else { this.Error(this.$t('ground.qingqiucanscw')); } }, err => {}) }, getChildHotel(index, subIndex) { this.findex = index; this.childIndex = subIndex; let str = `comCheckHotel${index}${subIndex}` this.$refs[str][0].getCheckHotel(); }, //输入返佣自动前面4个房型赋值 SetRebateRatio(subItem, newValue) { subItem.OrderDetailsList.forEach((sItem, sIndex) => { if (sIndex < 4) { sItem.RebateRatio = newValue; } }); }, DateMinus(sDate) { var newDate = moment(sDate).format("YYYY-MM-DD"); var sdate = new Date(newDate.replace(/-/g, "/")); var now = new Date(); var days = now.getTime() - sdate.getTime(); var day = Math.abs(parseInt(days / (1000 * 60 * 60 * 24))); return day; }, //添加酒店 AddHotel(item, subIndex) { var subItem = JSON.parse(JSON.stringify(item.HotelOrderList[subIndex])); subItem.HotelId = 0; subItem.HotelName = ""; subItem.OrderID = 0; subItem.OrderDetailsList.forEach(childItem => { childItem.OrderDetailsId = 0; }); item.HotelOrderList.push(subItem); }, //删除酒店 DeleteHotel(item, subIndex) { var that = this; this.Confirm(this.$t('sm.sfdeletenothf'), function () { var subItem = item.HotelOrderList[subIndex]; if (subItem.OrderID > 0) { that.apipost('dmcstatistics_post_DeleteHotelOrder', { ID: subItem.OrderID, TCID: subItem.TCID }, res => { if (res.data.resultCode == 1) { that.Success(res.data.message); that.getList(); item.HotelOrderList.splice(subIndex, 1); } else { that.Error(res.data.message); } }, err => {}) } else { item.HotelOrderList.splice(subIndex, 1); that.saveList(0); } }); }, getItem(index, subIndex) { this.checkedIndex = index this.checkedsubIndex = subIndex }, uploadFileBtnS(file) { //手配书上传 let that = this let newArr = [] newArr.push(file.file) let path = '/Upload/DMC/Hotel' this.$message.info('上传中...') this.UploadSelfFileT(path, newArr, x => { var fileUrl=this.domainManager() .ViittoFileUrl + x.data.FilePath; this.list[this.checkedIndex].HotelOrderList[this.checkedsubIndex].ContractUrl = fileUrl; this.$forceUpdate() }) }, goUrl(path, obj, name) { this.$router.push({ path: path, query: { id: obj.HotelId, blank: "y", tab: name } }); }, goUrlR(path, obj, title) { this.$router.push({ name: path, query: { "ID": obj, blank: 'y', tab: title } }) }, goUrlT(path, obj, title) { this.$router.push({ name: path, query: { "id": obj, blank: 'y', tab: title } }) }, getList() { this.loading = true; this.apipost('dmcstatistics_get_GetHotelStaticsDetail_V2', { TCIDs: this.$route.query.id, NewCombinationNum: this.$route.query.NewCombinationNum, IsCombine: this.IsCombine, NewTCIDs: this.NewTCIDs }, res => { if (res.data.resultCode == 1) { this.IsOperation = res.data.data.IsOperation; this.IsEditHotel = res.data.data.IsEditHotel; this.IsEditHotelPeople = res.data.data.IsEditHotelPeople; let list = res.data.data.HotelOrderListReport; this.CreateBy = res.data.data.CreateBy; this.CreateByPhoto = res.data.data.CreateByPhoto; this.CreateByAccount = res.data.data.CreateByAccount; if (list != null && list.length > 0) { list.forEach((item, sIndex) => { item.HotelOrderList.forEach(subItem => { subItem.hotelList.push({ Name: subItem.NewHotelName, ID: subItem.NewHotelId }); //默认成日元 if (subItem.CurrencyId == 0) { subItem.CurrencyId = 3; } this.calculationPrice(subItem); subItem.OrderDetailsList.forEach((x, index1) => { x.HouseTypeCount = x.HouseTypeCount.toString(); x.UnitPrice = x.UnitPrice.toString(); x.HotelDiscount = x.HotelDiscount.toString(); }) if (subItem.ReserveNo == '' || subItem.ReserveNo == null) { subItem.ReserveNo = this.$route.query.NewCombinationNum; } subItem.isShowPop = false; subItem.ckedHotelName = ""; //遍历手配 this.SupplierList.forEach(x => { if (x.ID == subItem.SupplierId) { subItem.IsHaveShouPeiFee = x.IsHaveShouPeiFee; subItem.ShouPeiMoney = x.ShouPeiMoney; } }) }) }); this.list = list; this.$forceUpdate(); } } else { this.Error(res.data.message); } this.loading = false }, err => {}) }, calculationPrice(obj) { let totalPrice = 0; //获取当前选中的对象 let currentObj = {}; if (obj.CurrencyId != 0) { currentObj = this.allCurrencyList.find(item => { return item.ID === obj.CurrencyId; //筛选出匹配数据 }); } //日元 let jpaObj = this.allCurrencyList.find(item => { return item.ID === 3; //筛选出匹配数据 }); obj.OrderDetailsList.forEach((item, index) => { var tempPrice = 0; var coefficient = 1; //税别 if (obj.TaxType == 2) { coefficient = 1 + 0.08; } if (index == 4 && obj.DMCPayType == 9) { tempPrice = 0; } else { tempPrice = item.UnitPrice * (item.BookNum - item.HotelDiscount) * (coefficient - item.RebateRatio / 100); } totalPrice += tempPrice; }) totalPrice += obj.ParkFee + obj.CityTax + obj.InTangTax; obj.TotalPrice = totalPrice.toFixed(2); if (currentObj && currentObj.ID > 0) { //人民币 if (currentObj.ID == 1) { obj.NewTotalPrice = currentObj.Name + ":" + (totalPrice * jpaObj.PayRate).toFixed(2); } //日元 else if (currentObj.ID == 3) { obj.NewTotalPrice = ""; } else { if (currentObj.CurrentRate > 1) { obj.NewTotalPrice = currentObj.Name + ":" + ((totalPrice * jpaObj.PayRate) / currentObj.CurrentRate) .toFixed(2); } else { obj.NewTotalPrice = currentObj.Name + ":" + ((totalPrice * jpaObj.PayRate) * currentObj.CurrentRate) .toFixed(2); } } } else { obj.NewTotalPrice = ""; } this.$forceUpdate(); }, saveList(type) { if (type == 0) { this.list.forEach(item => { item.HotelOrderList.forEach(subItem => { subItem.HotelOrderState = 0; }); }) } if (type == 1) { this.list.forEach(item => { item.HotelOrderList.forEach(subItem => { subItem.HotelOrderState = 1; }); }) } var flag=true; var isUpload=true; var str=""; this.list.forEach(item => { item.HotelOrderList.forEach(subItem => { if(isUpload&&subItem.PayStyle==1&&subItem.ContractUrl==''){ str+=`请上传${item.UseTimeStr}的手配书` isUpload=false; } subItem.OrderDetailsList.forEach((y, sIndex) => { if (y.HouseTypeCount) { y.HouseTypeCount = parseFloat(y.HouseTypeCount); } else { y.HouseTypeCount = 0; } if (y.UnitPrice) { y.UnitPrice = parseInt(y.UnitPrice); } else { y.UnitPrice = 0; } if (y.HotelDiscount) { y.HotelDiscount = parseInt(y.HotelDiscount); } else { y.HotelDiscount = 0; } if (y.BookNum == "") { y.BookNum = 0; } if (!this.$commonUtils.isNumber(y.RebateRatio)) { y.RebateRatio = 0; } }) if (!this.$commonUtils.isNumber(subItem.TotalPrice)) { subItem.TotalPrice = 0; } }); }) if(!isUpload){ this.Error(str); return; } this.loading = true; this.apipost('dmcstatistics_get_SetHotelOrder', this.list, res => { this.loading = false; if (res.data.resultCode == 1) { this.getList(); this.Success(res.data.message); } else { this.Error(res.data.message); } }, err => {}) }, //单条保存 SaveSingle(item) { item.HotelOrderState = 1; var flag=true; var isUpload=true; var str=""; this.list.forEach(item => { item.HotelOrderList.forEach(subItem => { if(isUpload&&subItem.PayStyle==1&&subItem.ContractUrl==''){ str+=`请上传${item.UseTimeStr}的手配书` isUpload=false; } subItem.OrderDetailsList.forEach(y => { if (y.HouseTypeCount) { y.HouseTypeCount = parseFloat(y.HouseTypeCount); } else { y.HouseTypeCount = 0; } if (y.UnitPrice) { y.UnitPrice = parseInt(y.UnitPrice); } else { y.UnitPrice = 0; } if (y.HotelDiscount) { y.HotelDiscount = parseInt(y.HotelDiscount); } else { y.HotelDiscount = 0; } if (y.BookNum == "") { y.BookNum = 0; } if (!this.$commonUtils.isNumber(y.RebateRatio)) { y.RebateRatio = 0; } }) if (!this.$commonUtils.isNumber(subItem.TotalPrice)) { subItem.TotalPrice = 0; } }); }) if(!isUpload){ this.Error(str); return; } let mag = { TotalList: this.list, SingleItem: item }; this.apipost('dmcstatistics_get_SetHotelOrder', this.list, res => { if (res.data.resultCode == 1) { this.Success(res.data.message); this.getList(); } else { this.Error(res.data.message); } }, err => {}) }, // 获取供应商 initSupplier() { this.apipost("supplier_post_GetAllList", { Type: 1, Country: 651 }, res => { if (res.data.resultCode === 1) { this.SupplierList = res.data.data; } }, err => {}); }, //改变id获取手配价格 getSupplierShoupei(SubItem) { this.SupplierList.forEach(x => { if (x.ID == SubItem.SupplierId) { SubItem.IsHaveShouPeiFee = x.IsHaveShouPeiFee; SubItem.ShouPeiMoney = x.ShouPeiMoney; } }) }, //获取所有币种 getAllCurrency() { this.apipost("financeinfo_post_GetList", {}, res => { if (res.data.resultCode === 1) { this.allCurrencyList = res.data.data; } }, err => {}); } }, mounted() { this.getAllCurrency(); this.TCNUM = this.$route.query.TCNUM; this.NewTCIDs = this.$route.query.NewTCIDs; this.initSupplier(); this.getList(); } } </script> <style> .roomReservationsDetailsTalbe { border-collapse: collapse; background: #fff; text-align: center; } .roomReservationsDetailsTalbe .el-button+.el-button { margin: 5px auto !important; } .roomReservationsDetailsTalbe tr th { background: #eee; height: 40px; font-size: 12px; color: #333; border: 1px solid #d1d1d1; } .roomReservationsDetailsTalbe tr td { font-size: 12px; border: 1px solid #d1d1d1; } .roomReservationsDetailsTalbe .pHouseStyle { border-bottom: 1px solid #ccc; height: 28px; line-height: 28px; } .roomReservationsDetailsTalbe tr td .colorRed { color: #E95252; } .roomReservationsDetailsTalbe tr td .pHouseStyle:last-child { border-bottom: none; } .roomReservationsDetailsTalbe tr td input { height: 20px !important; padding: 0 !important; text-align: center; } .roomReservationsDetailsTalbe tr td .sel input { height: 34px !important; padding-right: 20px !important; padding-left: 5px !important; font-size: 12px !important; } .roomReservationsDetailsTalbe tr td .link:hover { text-decoration: underline; cursor: pointer; } .roomReservationsDetailsTalbe .Hotel_red { color: red; } .roomReservationsDetailsTalbe .hotelTable { border: none; } .roomReservationsDetailsTalbe .hotelTable tr td { border: none; } </style>