<style> .currentManage ._vMG_edit{overflow: auto;display: none;position:absolute;font-family: 'PingFangSc-Fine';bottom:0;left: 0;border-top:1px solid #d1d1d1;background-color:#FFFFFF;padding: 10px;width: 100%;} .currentManage ._vMG_edit ._tit{padding-left: 10px;border-left: 3px solid #E95252; font-size: 16px;color: #000000} .currentManage ._vMG_edit ._tit span{color: #666666;font-size: 14px;} ._edHeight{height:400px;} .edHeight{display: block !important;height: 230px;} ._scrollbar::-webkit-scrollbar{width: 4px;height: 8px;} ._scrollbar::-webkit-scrollbar-thumb{border-radius: 4px;box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);background: #c9c9c9;} ._scrollbar::-webkit-scrollbar-track{box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);border-radius: 4px;background: #EDEDED;} .currentManage ._info_box ul{margin-top: 15px} .currentManage ._info_box ul li{float: left; width: 250px;} .currentManage .po_content{ border-collapse: collapse; } .currentManage .po_content{ width: 100%; } .currentManage .po_content tr:first-child{ font-size: 12px; color: #666666; background-color: #DCDCDC; } .currentManage .po_content tr th,.currentManage .po_content tr td{ padding: 10px 20px; text-align: left; } .currentManage .po_content tr td{ color: #333333; font-size: 14px; border:1px solid #E6E6E6; } .currentManage .po_content tr td .iconfont{ font-size: 14px; padding: 4px; } .RoomMealImport .query-box .iconfont{ cursor: pointer; background-color: #E95252; color: white; width: 30px; height: 30px; display: inline-block; text-align: center; line-height: 30px; border-radius: 50%; margin-left: 10px; } .currentManage ._yuan{ width:12px; height:12px; background:rgba(233,82,82,1); border-radius:50%; display: inline-block; } .currentManage ._yuan._yuan_red{ background:#47BF8C; } .RoomMealImport .picload{ width: 138px; height: 92px; border-radius: 2px; cursor: pointer; margin-bottom: 10px; padding: 5px; margin-right: 10px; position: relative; } .RoomMealImport .picload .el-upload{ width: 138px; height: 92px; } .RoomMealImport .picload .el-upload-dragger{ width: 100%; height: 100%; } .RoomMealImport ._addUpload_box>div{ float: left; width: 138px; height: 92px; border: 1px dashed rgba(210,210,210,1); border-radius: 2px; cursor: pointer; margin-bottom: 10px; padding: 5px; margin-right: 10px; position: relative; } .RoomMealImport ._addUpload_box .icon-excel, .RoomMealImport ._addUpload_box .icon-pdf{ text-align: center; font-size: 38px; color: green; line-height: 75px; } .RoomMealImport ._addUpload_box .icon-guanbi1{ font-size: 12px; color: white; display: inline-block; margin-left: 15px; position: absolute; right: -6px; top: -9px; background-color: #f56c6c; border-radius: 50%; height: 20px; width: 20px; text-align: center; line-height: 20px; } </style> <template> <div class="flexOne currentManage RoomMealImport"> <div> <ul style="margin:10px 0;text-align:right"> <li> <a class="hollowFixedBtn downBtn" style="padding:4px 9px;" :href="downList">导入模板下载</a> <button class="hollowFixedBtn" @click="outerVisible=true">导入</button> <button class="hollowFixedBtn" @click="AddR">提交</button> <button class="hollowFixedBtn" @click="Gourl">跳转到我的财务单据</button> </li> </ul> </div> <div class="cm_content _scrollbar"> <table class="po_content singeRowTable" style="border:1px solid #E6E6E6;" cellspacing="0" cellpadding="0" v-loading="loading"> <tr> <th>{{$t('hotel.hotel_SerialNumber')}}</th> <th>出团公司</th> <th>入住日期</th> <th>订房团号</th> <th>团号</th> <th>原币金额</th> <th>币种</th> <!-- <th>人民币</th> --> <!-- <th>{{$t('system.table_operation')}}</th> --> </tr> <tr v-for="(item,index) in DataList" :key="index"> <td>{{item.ID}}</td> <td>{{item.BranchName}}</td> <td>{{item.CheckInDate}}</td> <td>{{item.ReservationsTCNUM}}</td> <td>{{item.TCNUM}}</td> <td>{{item.WBMoney}}</td> <td>{{item.CurrencyName}}</td> <!-- <td>{{item.Money}}</td> --> <!-- <td> <span style="cursor: pointer;color:blue;text-decoration:underline" v-if="item.Type==2">认领</span> <span style="cursor: pointer;color:red;text-decoration:underline" @click="Delete(item)" v-if="item.IsDelete==1">删除</span> </td> --> </tr> </table> <div class="noData" v-if="DataList.length==0"> {{$t('system.content_noData')}} </div> <!-- <div> <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> <el-dialog custom-class='w700' title="导入" :visible.sync="outerVisible" center> <el-upload :show-file-list="false" style="text-align: center;" drag class="upload-demo" :action="importFileUrl2" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload"> <i class="el-icon-upload"></i> <div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div> <!-- <div slot="tip" class="el-upload__tip">只能上传Excel文件</div> --> </el-upload> </el-dialog> <el-dialog width="1000px" title="保存" :visible.sync="moneyR" center> <el-form :rules="rules" class="Rform" ref="form" :model="form" label-width="110px"> <el-row> <el-col :span="8"> <el-form-item label="导入类型"> <el-select filterable prop="ImportType" v-model='msg.ImportType' > <el-option label="房费" :value='1'></el-option> <el-option label="餐费" :value='2'></el-option> <el-option label="CHI包房" :value='3'></el-option> <el-option label="用房手配费" :value='4'></el-option> <el-option label="转账手续费" :value='5'></el-option> </el-select> </el-form-item> </el-col> <el-col :span="8"> <el-form-item label="预计付款日期"> <el-date-picker v-model="msg.PayDate" value-format="yyyy-MM-dd" type="date" placeholder="选择日期"> </el-date-picker> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="8"> <el-form-item label="付款类型"> <el-select filterable prop="IsPublic" v-model='msg.IsPublic' > <el-option :label="$t('fnc.gongzhang')" :value='1' :key='1'></el-option> <el-option :label="$t('fnc.sizhang')" :value='0' :key='0'></el-option> <el-option :label="$t('fnc.rmbxianjin')" :value='2' :key='2'></el-option> <el-option :label="$t('fnc.wbxianjin')" :value='3' :key='3'></el-option> <el-option :label="$t('fnc.zjinchi')" :value='4' :key='4'></el-option> <el-option :label="$t('fnc.ptxnzhanghu')" :value='5' :key='5'></el-option> <el-option :label="$t('fnc.djxnzhanghu')" :value='6' :key='6'></el-option> <el-option :label="$t('fnc.szxiangdi')" :value='7' :key='7'></el-option> <el-option label="原路退款" :value='8' :key='8'></el-option> <el-option label="地接预支款" :value='9' :key='9'></el-option> </el-select> </el-form-item> </el-col> <el-col :span="8"> <el-form-item :label="$t('fnc.khleixing')"> <el-select v-if="!showDisable" filterable v-model='msg.ClientType' @change="financeinfo_post_GetClientAccountList(msg.ClientType)"> <el-option v-for='item in ClientTypeList' :label='item.Name' :value='item.ID' :key='item.ID'> </el-option> </el-select> </el-form-item> </el-col> <el-col :span="8"> <el-form-item :label="$t('fnc.khmingcheng')"> <el-select filterable v-model='msg.ClientID'> <el-option v-for='item in ClientAccountList' :label='item.Name' :value='item.ID' :key='item.ID'> </el-option> </el-select> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="8"> <el-form-item label="上传附件"> <div class="picload"> <el-upload style="width: 138px;height: 92px;" drag :http-request="uploadFileBtn" :multiple="true" :show-file-list="false" action=""> <i class="el-icon-plus avatar-uploader-icon"></i> <div class="el-upload__text">{{$t('active.ld_djscwj')}}</div> </el-upload> </div> </el-form-item> </el-col> <el-col :span="16" style="padding-top:5px"> <div class="_addUpload_box" v-for="(file,fIndex) in saveMsg" :key="fIndex"> <div v-if="file.Type==3"> <div style="width:100%;height:100%;overflow: hidden;"> <img style="width:100%" :src="file.Url?file.Url:file.Content" @click="showUpLoadFile(file)"> </div> <span class="iconfont icon-guanbi1" @click="deleteUploadFile(fIndex)"></span> </div> <div v-if="file.Type==1"> <div class="iconfont " :class="file.Content.substring(file.Content.lastIndexOf('.')+1,file.Content.length).toUpperCase()=='PDF'? 'icon-pdf' : 'icon-excel'" @click="showUpLoadFile(file)"> </div> <span class="iconfont icon-guanbi1" @click="deleteUploadFile(fIndex)"></span> </div> <div v-if="file.Type==2"> <div class="iconfont icon-excel" @click="showUpLoadFile(file)"> </div> <span class="iconfont icon-guanbi1" @click="deleteUploadFile(fIndex)"></span> </div> </div> </el-col> </el-row> </el-form> <span slot="footer" class="dialog-footer"> <el-button size="small" @click="moneyR = false">{{$t('pub.cancelBtn')}}</el-button> <el-button :loading="Btnloading" size="small" type="danger" @click="RSumbit">确 定</el-button> </span> </el-dialog> </div> </template> <script> export default { data() { return { form:{ ID:"", FrId:'', }, moneyR:false, outerVisible:false, msg:{ ImportType:'', IsPublic:"", ClientType:"", ClientID:"", vorcherInos:[], PayDate:'', }, productionDate:[], DataList:[], loading:false, currentPage:1, total:0, currencyTypeList:[], importFileUrl2: "", downList:"", showDisable:false, ClientAccountList:[], ClientTypeList:[], saveMsg:[], rules: { ImportType: [ { required: true, message: '请选择导入类型', trigger: 'change' } ], IsPublic: [ { required: true, message: '请选择付款类型', trigger: 'change' } ], }, Btnloading:false, } },created(){ let userInfo = this.getLocalStorage(); this.importFileUrl2=this.domainManager().UploadFileUrl + "?cmd=dmc_post_LocalFileUpload&fileType=1&fileLimit=1&RB_Group_id=2&Type=7&EmployeeId="+userInfo.EmployeeId; this.downList =this.domainManager().LocalTemplateFileDownLoadUrl +"/Upload/Template/房餐批量导入模板.xls"; }, filters:{ PNumber(val){ if(val){ return val.substr(0, 4) + "****" + val.substr(-4,4) } }, }, mounted(){ this.GetAccount(); this.financeinfo_post_GetClientTypeList(); }, methods: { financeinfo_post_GetClientTypeList(){ // 获取对象类型 this.apipost('financeinfo_post_GetClientTypeList',{}, res => { if(res.data.resultCode == 1) { this.ClientTypeList = res.data.data; } }, err => {}) }, showUpLoadFile(i){ // 预览上传文件 if(i.Type==3){ this.picObj.push(i.Url); this.picIsShow= true; }else{ if(i.Content.substring(i.Content.lastIndexOf('.')+1,i.Content.length).toUpperCase()=='PDF'){ this.previewPDF(i.Url) }else{ window.open("https://view.officeapps.live.com/op/view.aspx?src="+i.Url) } } }, deleteUploadFile(i){ // 删除上传文件 this.saveMsg.splice(i,1); }, uploadFileBtn(file) { //上传 if(file.file.size > 1024 * 1024 * 10) { this.$message.warning(this.$t('tips.wjdxbncgsz')) return } // 1 文档 2 数据 3 图片 let typeArr=[ {stringArr:'GIF|JPG|JPEG|PNG|BMP',type:3}, {stringArr:'DOCX|DOC|XLSX|XLS|PPT|PPTX|PDF',type:1}, ] let ft=file.file.name.substring(file.file.name.lastIndexOf('.')+1,file.file.name.length).toUpperCase(); let fileTypeNumber = 2; let typeOk = false; typeArr.forEach(x=>{ if(x.stringArr.indexOf(ft)!='-1') { fileTypeNumber=x.type; typeOk = true; } }) if (!typeOk) return this.$message.error(this.$t('tips.qscWEfile')); let newArr = []; newArr.push(file.file) let path = "/Upload/Temporary/" this.$message.info(this.$t('tips.shangchuanzhong')) this.UploadSelfFileT(path, newArr, x => { let fileSize = file.file.size<1024? file.file.size:(file.file.size / 1024).toFixed(0); this.saveMsg.push({ Content: x.data.FilePath, ID:0, Type:fileTypeNumber, Url: this.domainManager().ViittoFileUrl + x.data.FilePath, }) this.$message.success(this.$t('tips.scchenggong')) }, 1); }, IsPublicChange(val){ this.showDisable=false; this.msg.ClientType = ''; this.msg.ClientID = ''; this.msg.AccountNumber = ''; this.ClientAccountListS=[]; if(val==8||val==9){ this.showDisable=true; } }, financeinfo_post_GetClientAccountList(t,i){ //获取付款 对象类型 新增用 let msg = { ID:0, Type:t, ObjID:0, CardNum:'' } if(i>=0){ msg.ID=i; }else{ this.msg.ClientID=''; this.msg.AccountNumber=''; this.msg.RemitterName=''; this.msg.IsLeader=1; } this.apipost('financeinfo_post_GetClientAccountList',msg, res => { if(res.data.resultCode == 1) { let data = res.data.data; let ClientAccountList = []; if(i){ data.forEach(x=>{ let obj = { ID:x.ID, Name:x.AccountHolder + + `(${x.AccountAlias})`, Nom:x.CardNum, OpenBankName:x.OpenBankName, allName:x.CardNum+" "+x.OpenBankName, ObjID:x.ObjID, } ClientAccountList.push(obj) }) this.ClientAccountListS = ClientAccountList; }else{ data.forEach(x=>{ let obj = { ID:x.ID, Name:x.AccountHolder + `(${x.AccountAlias})`, Nom:x.CardNum, OpenBankName:x.OpenBankName, ObjID:x.ObjID, } ClientAccountList.push(obj) }) this.ClientAccountList = ClientAccountList; } } }, err => {}) }, GetClientAccountList(i){ //获取客户名称并且根据费用类型和付款对象获取客户账号 this.msg.AccountNumber=''; this.ClientAccountList.forEach(x=>{ if(x.ID==i){ this.msg.RemitterName=x.Name; this.financeinfo_post_GetClientAccountList(this.msg.ClientType,x.ID); } }) }, AddR(item){ this.moneyR=true; }, Delete(item){ var msg = { ID: item.ID } this.$confirm(this.$t('tips.shifoushanchu'), this.$t('tips.tips'), { confirmButtonText: this.$t('pub.sureBtn'), cancelButtonText: this.$t('pub.cancelBtn'), type: 'warning' }).then(() => { this.apipost( 'Financial_post_DelFinanceRemittanceClaim', msg, res => { if (res.data.resultCode == 1) { this.Success(res.data.message) this.getList() } else { this.Error(res.data.message) } }, null ) }).catch(() => { }); }, RSumbit(){ this.msg.vorcherInos = this.saveMsg; if(this.msg.PayDate==""){ this.Error("请选择时间!"); return; } if(!this.msg.HouseMealList||this.msg.HouseMealList.length==0){ this.Error("请先导入模板!"); return; } this.Btnloading=true; this.apipost('Financial_post_SetHouseMealBetchImport',this.msg,res=>{ this.Btnloading=false; if(res.data.resultCode==1){ this.Success(res.data.message) this.DataList=[]; this.initMsg(); this.moneyR=false; }else{ this.Error(res.data.message) } },err=>{}) }, initMsg(){ this.saveMsg=[]; this.msg={ ImportType:'', IsPublic:"", ClientType:"", ClientID:"", vorcherInos:[], PayDate:'', } }, Gourl(){ this.$router.push({ name: "FinancialDocuments", query: { blank: 'y' } }) }, beforeAvatarUpload(file) { return; const isJPG = file.type === "application/x-msdownload"; if (!isJPG) { this.$message.error(this.$t('tips.shangchuanExcel')); } return isJPG && isLt2M; }, //上传 handleAvatarSuccess(res, file) { if (res.resultCode == 1) { this.msg.HouseMealList=res.data; this.DataList=res.data; this.outerVisible = false; }else{ this.Error(res.message); } }, GetAccount(){ this.apipost('bankaccount_post_GetList',{TypeId:'0'},res=>{ if(res.data.resultCode==1){ this.currencyTypeList = res.data.data; }else{ } },err=>{}) }, }, } </script>