/* * @description: 费用-差旅组件 * @Author: CP * @Date: 2020-11-16 14:52:08 * @FilePath: \cld\global\vue\fee\receipt_trave_component.js */ Vue.component("trave", { data: function () { return { // 行程时间 traveDay: 0, tripTime: "", regionOption: region, // regionLeve2Option: region[0].child, // arrivalLeve2Option: region[0].child, //新增下拉地区 regionLeve2Option: region[defaultTraveProvinceIndex].child, arrivalLeve2Option: region[defaultTraveProvinceIndex].child, //编辑下拉地区 regionLeve2OptionEdi: [], arrivalLeve2OptionEdi: [], // 出发地 省 市 // departureProvince: region[0].name, // departureCity: region[0].child[0].name, departureProvince: defaultTraveProvince, departureCity: region[defaultTraveProvinceIndex].child[0].name, // 结束地 省 市 // arrivalProvince: region[0].name, // arrivalCity: region[0].child[0].name, arrivalProvince: defaultTraveProvince, arrivalCity: region[defaultTraveProvinceIndex].child[0].name, // 目的地数组 arrivalList: [], tripTimeEdi: "", departureProvinceEdi: '', departureCityEdi: '', arrivalProvinceEdi: '', arrivalCityEdi: '', ediIndex: '', // arrivalListEdi: [], } }, props: ['traveItem', 'alertDia', 'traveList', 'traveExplain'], computed: { travePrice: function () { return travePrice(this.traveList); } }, methods: { //行程时间验证 changeCount: function (event) { this.tripTime = event.target.value; this.tripTimeEdi = event.target.value; let dateArray = event.target.value.split(" - "); if (dateArray.length == 2) { let dateFormat = /^(\d{4})-(\d{2})-(\d{2})$/; if (!dateFormat.test(dateArray[0])) { this.alertDia("差旅行程时间填写有误"); return } if (!dateFormat.test(dateArray[1])) { this.alertDia("差旅行程时间填写有误"); return } } // if(ValidTraveDate(dateArray)){ // this.alertDia("差旅行程时间填写有误"); // return // } traveDay = (Math.abs(Date.parse(dateArray[0]) - Date.parse(dateArray[1]))) / (1000 * 60 * 60 * 24) + 1; if (!isNaN(traveDay)) { this.traveDay = traveDay; let alertDia = this.alertDia; // 验证时间 $.ajax({ type: "GET", url: "/json/trave/date/all", dataType: "json", processData: false, contentType: false, }).success(function (sortList) { let item = new Array(new Date(Math.round(new Date(dateArray[0]).getTime() / 1000 - 28800)).getTime(), new Date(Math.round(new Date(dateArray[1]).getTime() / 1000 - 28800)).getTime()); sortList.push(item); let TraveStatus = isTraveDate(sortList); if (TraveStatus == 2) { alertDia("差旅行程日期段-有重复"); } }).fail(function (msg) { alertDia("历史差旅时间获取失败"); }); } // this.traveDay=new Date(dateArray[1]).getDate()-new Date(dateArray[0]).getDate()+1; }, changeRegionLeve2: function (event, model) { this.regionOption.forEach(element => { if (element.name == event.target.value) { if (model == "departureCity") { this.regionLeve2Option = element.child; this.departureCity = element.child[0].name; this.departureCityEdi = element.child[0].name; this.arrivalProvinceEdi = element.name; this.arrivalProvince = element.name; this.arrivalLeve2Option = element.child; this.arrivalCity = element.child[0].name; this.arrivalCityEdi = element.child[0].name; } else if (model == "arrivalCity") { this.arrivalLeve2Option = element.child; this.arrivalCity = element.child[0].name; this.arrivalCityEdi = element.child[0].name; } return } }); }, changeArrivalCity: function (event) { this.arrivalCity = event.target.value this.arrivalCityEdi = event.target.value }, // 行程单相关 // 打开行程单 openTrip: function () { this.arrivalList = []; this.tripTime = ""; }, deleteTrip(index) { this.traveList.splice(index, 1) }, addTrip: function () { if (this.tripTime == "") { this.alertDia("请选择行程时间"); return } // 构建行程信息 tripList = []; // 出发地 var newTripItem = NewTraveItem(); tripList.push({ province: this.departureProvince, city: this.departureCity, tripItem: newTripItem, subtotal: 0, }); // 目的地 this.arrivalList.forEach(element => { var newTripItem = NewTraveItem(); tripList.push({ province: element.arrivalProvince, city: element.arrivalCity, tripItem: newTripItem, subtotal: 0, }); }); // 结束地 var newTripItem = NewTraveItem(); tripList.push({ province: this.arrivalProvince, city: this.arrivalCity, tripItem: newTripItem, subtotal: 0.00, }); // 构建差旅信息 trave = { tripTime: this.tripTime, tripList: tripList, total: 0.00, }; this.traveList.push(trave); $('#route-add').modal('hide') }, openEdiTrip(index) { this.ediIndex = index; let tripData = this.traveList[index]; this.tripTimeEdi = tripData.tripTime; // 出发地 this.departureProvinceEdi = tripData.tripList[0].province; this.departureCityEdi = tripData.tripList[0].city; this.regionOption.forEach(el => { if (el.name == this.departureProvinceEdi) { this.regionLeve2OptionEdi = el.child; return } }); //this.regionLeve2Option= tripData.tripList; // 结束 let endIndex = tripData.tripList.length - 1 this.arrivalProvinceEdi = tripData.tripList[endIndex].province; this.arrivalCityEdi = tripData.tripList[endIndex].city; this.regionOption.forEach(el => { if (el.name == this.arrivalProvinceEdi) { this.arrivalLeve2OptionEdi = el.child; return } }); //this.arrivalLeve2Option=tripData.tripList, // 目的地 this.arrivalList = []; tripData.tripList.forEach((element, index) => { // 获得目的城市下拉菜单 let arrivalCityOption = []; this.regionOption.forEach(el => { if (el.name == element.province) { arrivalCityOption = el.child; return } }); if (index !== 0 && index !== endIndex) { this.arrivalList.push({ "arrivalProvince": element.province, "arrivalCity": element.city, "arrivalCityOption": arrivalCityOption }); } }); }, ediTrip() { if (this.tripTime == "") { this.alertDia("请选择行程时间"); return } // // 构建行程信息 // tripList = []; // // 出发地 // var newTripItem = NewTraveItem(); // tripList.push({ // province: this.departureProvinceEdi, // city: this.departureCityEdi, // tripItem: newTripItem, // subtotal: 0, // }); // // 目的地 // this.arrivalList.forEach(element => { // var newTripItem = NewTraveItem(); // tripList.push({ // province: element.arrivalProvince, // city: element.arrivalCity, // tripItem: newTripItem, // subtotal: 0, // }); // }); // // 结束地 // var newTripItem = NewTraveItem(); // tripList.push({ // province: this.arrivalProvinceEdi, // city: this.arrivalCityEdi, // tripItem: newTripItem, // subtotal: 0.00, // }); // // 构建差旅信息 // trave = { // tripTime: this.tripTime, // tripList: tripList, // total: 0.00, // }; // this.traveList[this.ediIndex] = trave; // // 更新差旅信息 this.traveList[this.ediIndex].tripList[0].province=this.departureProvinceEdi; this.traveList[this.ediIndex].tripList[0].city=this.departureCityEdi; // this.traveList[this.ediIndex].tripList[0].subtotal=0; // // 更新出发地 // this.traveList[this.ediIndex].tripList[0].tripItem.forEach(element => { // element.price=0.00; // element.remark=""; // }); // 更新目的地 let countOriginal=this.traveList[this.ediIndex].tripList.length-2; let countNow=this.arrivalList.length; if(countOriginal>countNow){ let poor=countOriginal-countNow; this.traveList[this.ediIndex].tripList.splice(countNow,poor); } // 相等-更新省市,是否更新过 if(countOriginal==countNow){ let count=this.traveList[this.ediIndex].tripList.length-1; this.traveList[this.ediIndex].tripList.forEach((element,index) => { if(index>0&&index2){ this.traveList[this.ediIndex].tripList.forEach((element,index) => { if(index>0&&index { var newTripItem = NewTraveItem(); this.traveList[this.ediIndex].tripList.splice(1,0,{ province: element.arrivalProvince, city: element.arrivalCity, tripItem: newTripItem, subtotal: 0, }); }); }else{ let poor=countNow-countOriginal; for (let i = 0; i < poor; i++) { var newTripItem = NewTraveItem(); this.traveList[this.ediIndex].tripList.splice(countOriginal+1,0,{ province: this.arrivalList[poor+i].arrivalProvince, city: this.arrivalList[poor+i].arrivalCity, tripItem: newTripItem, subtotal: 0, }); } } } // this.traveList[this.ediIndex].tripList.splice(1,countOriginal-2); // this.traveList[this.ediIndex].tripList.forEach((element,index) => { // if(index>0&&index { // var newTripItem = NewTraveItem(); // this.traveList[this.ediIndex].tripList.splice(1,0,{ // province: element.arrivalProvince, // city: element.arrivalCity, // tripItem: newTripItem, // subtotal: 0, // }); // // this.traveList[this.ediIndex].tripList.push({ // // province: element.arrivalProvince, // // city: element.arrivalCity, // // tripItem: newTripItem, // // subtotal: 0, // // }); // }); // 结束地 let count=this.traveList[this.ediIndex].tripList.length; this.traveList[this.ediIndex].tripList[count-1].province=this.arrivalProvinceEdi; this.traveList[this.ediIndex].tripList[count-1].city=this.arrivalCityEdi; // this.traveList[this.ediIndex].tripList[count-1].subtotal=0.00; // var newTripItem = NewTraveItem(); // this.traveList[this.ediIndex].tripList.push({ // province: this.arrivalProvinceEdi, // city: this.arrivalCityEdi, // tripItem: newTripItem, // subtotal: 0.00, // }); this.traveList[this.ediIndex].tripTime=this.tripTime; this.traveList[this.ediIndex].total=0.00; // 重新计算费用合计 this.computeTraveItem(); // this.travePrice(); // this.traveItem=[]; // 更新完成 this.ediIndex = ''; this.tripTimeEdi = ''; this.departureProvinceEdi = ''; this.departureCityEdi = ''; this.arrivalProvinceEdi = ''; this.arrivalCityEdi = ''; this.arrivalList = []; $('#route-edi').modal('hide') }, addArrivalDom: function (option) { // dom = { // "arrivalProvince": region[0].name, // "arrivalCity": region[0].child[0].name, // "arrivalCityOption": region[0].child, // } //1.没有目的地的时候 let arrivalProvince = this.departureProvince; let arrivalCity = this.departureCity; let childIndexValue = this.departureProvince; if (option == "edi") { arrivalProvince = this.departureProvinceEdi; arrivalCity = this.departureCityEdi; childIndexValue = this.departureProvinceEdi; } if (this.arrivalList.length !== 0) { childIndexValue = this.arrivalList[this.arrivalList.length - 1].arrivalProvince arrivalProvince = childIndexValue; arrivalCity = this.arrivalList[this.arrivalList.length - 1].arrivalCity; } let index = 0; region.forEach((element, i) => { if (element.name === childIndexValue) { index = i; return; } }); dom = { "arrivalProvince": arrivalProvince, "arrivalCity": arrivalCity, "arrivalCityOption": region[index].child, } this.arrivalList.push(dom); }, delArrivalDom: function (index) { this.arrivalList.splice(index, 1) }, changeArrivalLeve2: function (event, index) { this.regionOption.forEach(element => { if (element.name == event.target.value) { this.arrivalList[index].arrivalCityOption = element.child; this.arrivalList[index].arrivalCity = element.child[0].name; return } }); }, computeTraveItem: function (event) { this.traveItem.forEach((element, index) => { let sum = 0; // 每一列求和 this.traveList.forEach(el => { el.tripList.forEach(elementlv2 => { elementlv2.tripItem.forEach(elementlv3 => { if (element.name == elementlv3.name) { sum += Number(elementlv3.price); } }); }); }); this.traveItem[index].price = sum.toFixed(2); }); // 每一个小目的地合计 this.traveList.forEach((el, index) => { let total = 0; el.tripList.forEach((elementlv2, indexlv2) => { let sum = 0; elementlv2.tripItem.forEach(elementlv3 => { sum += Number(elementlv3.price); }); total += sum this.traveList[index].tripList[indexlv2].subtotal = sum.toFixed(2); }); this.traveList[index].total = total.toFixed(2); }); }, }, template: `
差旅相关费用
行程{{ index+1 }}# {{ trave.tripTime }}
P {{trip.province}}-{{trip.city}}
{{item.name}}
添加新行程
差旅相关费用合计
{{ item.name }} ¥{{ item.price }}
差旅相关费用合计 ¥{{travePrice}}
报销说明
报销单填写说明

1 请按先后发生顺序填写报销明细,交通费(市内交通费及往来交通费)、邮寄费需在批注明注明费用明细(例:珠海-广州70元-佛山20元);

2 出差补助30元/天,不需提供发票,只需在报销单上填写清楚;

3 产生费用所在办事处 默认使用您所在的第一个办事处。

总行程单

  • 行程{{ index+1 }}# {{ trave.tripTime }}
  • P {{trip.city}}
    小计 ¥{{ trip.subtotal }}
  • 行程{{ index+1 }}# 合计:{{ trave.total }}
` })