<style> .page_visaList ._vl_nav li{float: left;font-size: 12px;color: #333333;padding: 16px 20px;cursor: pointer;display: flex;align-items: center;border-bottom: 3px solid white} .page_visaList ._vl_nav li img{width: 40px;height: 40px;display: inline-block;margin-right: 10px} .page_visaList ._vl_nav li._active{border-color: #E95252} .page_visaList .normalBtn{width: auto;} .page_visaList .icon-bianji-smal{color: #FF9797} .page_visaList ._vl_content{width: 100%;padding: 30px 20px;overflow: auto} .page_visaList .query-box{border: none} .page_visaList ._vl_content ._vlc_list{height: 60px;margin-bottom: 10px;background-color: #FFFFFF;width: 100%;min-width: 1580px;} .page_visaList ._vl_content ._vlc_list:hover{box-shadow:0px 0px 20px rgba(191,191,191,1);transition: all linear 0.5s;} .page_visaList ._vlc_list input[type="checkbox"]{margin: 0 30px} .page_visaList ._vlc_list>div{float: left;height: 100%;display: flex;align-items: center;text-align: center} .page_visaList ._radius {display: inline-block;width: 24px;height: 24px;background-color: #FF793E;color: #fff;border-radius: 50%;text-align: center;line-height: 22px;font-size: 12px;margin-right: 10px;} .page_visaList ._radius._tuan{background-color: #3EABFF} .page_visaList ._f_b3{font-size: 14px;color: #333333} .page_visaList ._cu{text-decoration: underline;} .page_visaList ._cu:hover{color: #E95252;cursor: pointer;text-decoration: underline} .page_visaList ._br{border-right: 1px dashed #D7D7D7;} .page_visaList ._pr30{padding-right: 30px} .page_visaList ._pl30{padding-left: 30px} .page_visaList ._square{height: 46px;width: 24px;background-color: #3FB9F8;border:2px solid #7FD3FF;border-radius:4px;display: inline-block;font-size: 12px;padding-top: 5px;margin-right: 15px;color: white} .page_visaList .ta_l{text-align: left !important;} .page_visaList ._ml20{margin-left: 20px} .page_visaList ._font12{font-size: 12px} .page_visaList ._mr_20{margin-right: 20px} .page_visaList ._vlc_info span{color: #666666;display: inline-block;width: 30px;text-align: left} .page_visaList .Operating{width: 250px;} .page_visaList .Operating i{width: 30px;height: 30px;display: inline-block;color: white !important;border-radius: 50%;text-align: center;line-height: 30px;margin-right: 10px;cursor: pointer;} .page_visaList .Operating i:nth-child(1){background-color: #00B1E4} .page_visaList .Operating i:nth-child(2){background-color: #28CACC} .page_visaList .Operating i:nth-child(3){background-color: #9E8DE3} .page_visaList .Operating i:nth-child(4){background-color: #63C76A} .page_visaList .Operating i:nth-child(5){background-color: rgb(255, 69, 0)} .page_visaList .Operating i:nth-child(6){background-color: rgb(0, 69, 0)} .page_visaList .Operating i:nth-child(1):hover{background-color: #00C6FF} .page_visaList .Operating i:nth-child(2):hover{background-color: #2EDEE0} .page_visaList .Operating i:nth-child(3):hover{background-color: #AD9AF6} .page_visaList .Operating i:nth-child(4):hover{background-color: #6DD875} .page_visaList .Operating i:nth-child(5):hover{background-color: rgb(253, 110, 56)} .page_visaList .Operating i:nth-child(1):active{background-color: #00B5E9} .page_visaList .Operating i:nth-child(2):active{background-color: #25C1C3} .page_visaList .Operating i:nth-child(3):active{background-color: #9887D9} .page_visaList .Operating i:nth-child(4):active{background-color: #5EBB64} .page_visaList .Operating i:nth-child(5):active{background-color: rgb(253, 110, 56)} .page_visaList .icon-img_gwgl{background-color: #9887D9} .Operating .icon-lists{background-color: #6DD875} .page_visaList .icon-img_kqmrtj{background-color: #FFA037} .page_visaList ._scrollbar::-webkit-scrollbar{width: 4px;height:8px;} .page_visaList ._scrollbar::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);border-radius: 4px;background: #EDEDED;} .page_visaList ._scrollbar::-webkit-scrollbar-thumb{border-radius: 4px;-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);background: #c9c9c9;} .page_visaList .el-pagination{border:none} .visaList_tripDetails{padding: 0;box-shadow: 0px 1px 3px 0px #dedede;margin-left: 235px;max-height: 300px;overflow: auto;} .visaList_tripDetails .popper__arrow::after{border-bottom-color: #EDEDED !important;} .visaList_tripDetails table{padding: 10px 0 0 20px;background-color: #EDEDED;border-collapse: collapse;border: 1px solid #D2D2D2;font-size: 12px;} .visaList_tripDetails table th{background-color: #EDEDED;padding: 5px;} .visaList_tripDetails table td{background-color: #FFFFFF;padding: 9px 15px;color: #333333;border: 1px solid #D2D2D2} .visaList_tripDetails table ._color_666{color: #666666;} .visaList_tripDetails table tr._color_666 th{padding: 9px 15px;} .visaList_tripDetails ._form{text-decoration: underline;cursor: pointer;} .page_visaList ._OrderRemarks{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 120px;} .page_visaList ._OrderRemarks .iconfont.el-tooltip.item{font-size: 12px} .page_visaList ._btn_group button{margin-left: 10px} </style> <template> <div class="page_visaList" v-loading="loading2" :element-loading-text="$t('visaT.Download')" element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.1)"> <ul class="_vl_nav clearfix"> <li v-for="(item,index) in VisaManagementList" :key="index" @click="actieID=item.Id,msg.CountryType = item.Id,getList(),CountryType = item.Id" :class="actieID ==item.Id?'_active':''" ><img src="../../assets/img/logo@2x.png" alt="">{{item.Name}}</li> </ul> <div class="query-box"> <ul> <li> <span> <em>{{$t('visa.v_creatDate')}}</em> <el-date-picker clearable class="w150" @change="dataDui()" v-model="msg.StartTime" type="date" :picker-options="beforeCheck" value-format="yyyy-MM-dd" :placeholder="$t('admin.admin_choDate')"> </el-date-picker><span class="_ln">-</span><el-date-picker clearable class="w150" v-model="msg.EndTime" type="date" @change="dataDui()" :picker-options="afterCheck" value-format="yyyy-MM-dd" :placeholder="$t('admin.admin_choDate')"> </el-date-picker> </span> </li> <li> <span> <el-input class="w400" :placeholder="$t('visa.v_shurutuanhao')" prefix-icon="el-icon-search" v-model="msg.orderId"> </el-input> </span> </li> <li class="_btn_group"> <button class="normalBtn" type="button" @click="addVisa('addVisaNew',CountryType,0,'','visaList')"> <i class="iconfont icon-bianji-smal"></i> 新建签申请</button> <button class="hollowFixedBtn" @click="resetPageIndex(),getList()">{{$t('pub.searchBtn')}}</button> <button class="hollowFixedBtn" @click="downLoadAllIdentity()">{{$t('visa.v_daochu')}}</button> </li> </ul> </div> <div class="_vl_content _scrollbar" v-loading="loading"> <div class="_vlc_list" v-for="(item,index) in DataList" :key="index"> <div> <input type="checkbox" :disabled='item.SignStatus!=1' v-model="checkList" :value="item.Id"> </div> <div class="_br _pr30 w160"> <span class="_radius" v-if="item.SignStatus==1">{{$t('visa.v_dan')}}</span> <span class="_radius _tuan" v-if="item.SignStatus==2">{{$t('visa.v_tuan')}}</span> <el-popover popper-class="visaList_tripDetails" width="1200" trigger="click"> <div class=""> <table width="100%" border="0" cellspacing="0" cellpadding="0" class="popTable"> <tr class="_color_666"> <th>{{$t('visa.v_paihao')}}</th> <th>{{$t('system.query_name')}}</th> <th>{{$t('system.table_sex')}}</th> <th>{{$t('system.table_Passport')}}</th> <th>{{$t('visa.v_jtjzd')}}</th> <th>{{$t('visa.v_shenqingbiao')}}</th> <th width="200">{{$t('system.table_operation')}}</th> </tr> <tr v-for="(son,sIndex) in item.PeopleList" :key="sIndex"> <td>{{son.Id}}</td> <td>{{son.Name}}</td> <td>{{son.Sex}}</td> <td>{{son.PassportNo}}</td> <td>{{son.Address}}</td> <td class="_form" @click="item.SignStatus==2?goUrl('VisaPersonalFormTuan',son.Id,'visaList'):goUrl('VisaPersonalForm',son.Id)">{{$t('visaT.rbqzsqb')}}</td> <td> <img src="../../assets/img/fail@2x.png" v-if="son.ApplyStatus==2" alt=""> <img src="../../assets/img/pass@2x.png" v-if="son.ApplyStatus==1" alt=""> <button class="normalBtn" type="button" @click="operationVisa($t('visa.v_jujue'),son.Id,2)" v-if="son.ApplyStatus==0">{{$t('visa.v_jujue')}}</button> <button class="normalBtn" type="button" @click="operationVisa($t('visa.v_tongguo'),son.Id,1)" v-if="son.ApplyStatus==0">{{$t('visa.v_tongguo')}}</button> </td> </tr> </table> </div> <span slot="reference" class="_f_b3 _cu w95">{{item.NameRemark}}</span> </el-popover> </div> <div class="_br _pr30 _pl30"> <span class="_square">{{$t('visa.v_rujing')}}</span> <div class="ta_l w210"> <p class="_f_b3">{{item.EnterCountryTime}}</p> <el-tooltip class="item" effect="dark" :content="item.DepartCity+'->'+item.ArriveAirName+'('+item.DepartFlight+')'" placement="top-start" popper-class="max-w250"> <p class="_f_b3 max_w250_over">{{item.DepartCity}} -> {{item.ArriveAirName}}({{item.DepartFlight}})</p> </el-tooltip> </div> <span class="_square _ml20">{{$t('visa.v_chujing')}}</span> <div class="ta_l w210"> <p class="_f_b3">{{item.LeaveCountryTime}}</p> <el-tooltip class="item" effect="dark" :content="item.LeaveAirName+'->'+item.BackCity+'('+item.BackFilght+')'" placement="top-start" popper-class="max-w250"> <p class="_f_b3 max_w250_over">{{item.LeaveAirName}}->{{item.BackCity}}({{item.BackFilght}})</p> </el-tooltip> </div> </div> <div class="_br _pr30 _pl30 _font12 ta_l _vlc_info w305"> <div class="_mr_20"> <p class="_OrderRemarks" style="width: 130px;"><span>{{$t('visa.v_tuanhao')}}</span> <el-tooltip class="item" effect="dark" :content="item.OrderId" placement="top-start" popper-class="max-w250"> <i class="iconfont"> {{item.OrderId}}({{item.VisaType==1?$t('visa.v_gvisa'): $t('visa.v_tvisa')}})</i> </el-tooltip> </p> <p class="_OrderRemarks" style="width: 130px;"><span></span> <el-tooltip class="item" effect="dark" :content="item.TCNUM" placement="top-start" popper-class="max-w250"> <i class="iconfont"> {{item.TCNUM}}</i> </el-tooltip> </p> </div> <div> <p class="_OrderRemarks"><span>{{$t('hotel.hotel_remark')}} </span> <el-tooltip class="item" effect="dark" :content="item.OrderRemarks" placement="top-start" popper-class="max-w250"> <i class="iconfont">{{item.OrderRemarks}}</i> </el-tooltip> </p> </div> </div> <div class="_br _pr30 _pl30 _font12 ta_l Operating"> <el-tooltip class="item" effect="dark" :content="$t('pub.updateMsg')" placement="top-start" popper-class="max-w250"> <i class="iconfont icon-bianji-smal" @click="goUrlT('addVisaNew',CountryType,item.Id,'','visaList')"></i> </el-tooltip> <el-tooltip class="item" effect="dark" :content="$t('visaT.complete')" placement="top-start" popper-class="max-w250"> <i class="iconfont icon-wancheng" @click="completeVisa(index)"></i> </el-tooltip> <!-- <el-tooltip class="item" effect="dark" content="复制申请人信息" v-if="item.SignStatus==1" placement="top-start" popper-class="max-w250"> <i class="iconfont icon-img_tongshang" @click="goUrlT('addVisa',CountryType,item.Id,true)"></i> </el-tooltip> --> <el-tooltip class="item" effect="dark" :content="$t('visaT.qzzlxz')" v-if="item.SignStatus==1" placement="top-start" popper-class="max-w250"> <i class="iconfont icon-img_download" @click="downLoadAllInfo(item.Id)"></i> </el-tooltip> <el-tooltip class="item" effect="dark" :content="$t('visaT.jbzlxz')" v-if="item.SignStatus==2" placement="top-start" popper-class="max-w250"> <i class="iconfont icon-img_gwgl" @click="downLoadTuanAllInfo(item.Id,'dmc_get_DownLoadGroupSignInformation')"></i> </el-tooltip> <el-tooltip class="item" effect="dark" :content="$t('visaT.sqsxz')" v-if="item.SignStatus==2" placement="top-start" popper-class="max-w250"> <i class="iconfont icon-img_kqmrtj" @click="downLoadTuanAllInfo(item.Id,'dmc_get_DownLoadGuestApplicationForm')"></i> </el-tooltip> <el-tooltip class="item" effect="dark" :content="$t('visaT.tqmdxz')" v-if="item.SignStatus==2" placement="top-start" popper-class="max-w250"> <i class="iconfont icon-lists" @click="downLoadTuanAllInfo(item.Id,'dmc_get_DownLoadTravelGuestExcel')"></i> </el-tooltip> <!-- <el-tooltip class="item" effect="dark" content="下载航班信息" placement="top-start" popper-class="max-w250"> <i class="iconfont icon-feiji" @click="downLoadFlyInfo(item.Id)"></i> </el-tooltip> <el-tooltip class="item" effect="dark" content="下载申请人名单" placement="top-start" popper-class="max-w250"> <i class="iconfont icon-lists" @click="downLoadFlyPeople(item.Id)"></i> </el-tooltip> --> </div> <div class="_pr30 _pl30 _font12 ta_l"> <div> <p>{{item.CreateByName}}</p> <p>{{item.CreateTime}}</p> </div> </div> </div> <div class="noData" v-show="noData"> {{$t('system.content_noData')}} </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> </template> <script> export default { data(){ return{ msg:{ pageIndex:1, pageSize:7, StartTime:'', EndTime:'', orderId:'', IsSaveFile:'', search:'', CountryType:1, PlanStatus:0, SignStatus:0, }, actieID:-1, CountryType:1, DataList:[], checkList:[], VisaManagementList:[], total:0, currentPage: 1, noData:false, loading:true, loading2:false, beforeCheck:{ // disabledDate: (time) => { // let endTime = new Date(this.msg.EndTime); // return endTime.getTime()<time.getTime(); // } }, afterCheck:{ // disabledDate: (time) => { // let startTime = new Date(this.msg.StartTime); // return startTime.getTime()>time.getTime() // } }, } },methods:{ //重置页数 resetPageIndex() { this.msg.pageIndex = 1; this.msg.currentPage = 1; }, downLoadAllInfo(id){ // 下载全部资料 this.loading2 = true this.apipost('dmc_get_VisaMergingDownload',{VisaPlanId:id},res=>{ if(res.data.resultCode==1){ const link = document.createElement('a'); let _loadUrl=this.domainManager().DomainUrl let str = window.location.href link.href = _loadUrl+res.data.data document.body.appendChild(link); link.click(); this.$message.success(this.$t('visaT.dccg')) this.loading2 = false }else{ this.loading2 = false this.$message.error(res.data.message) } },err=>{}) }, downLoadTuanAllInfo(id,cmd){ this.loading2 = true this.apipost(cmd,{VisaPlanId:id},res=>{ if(res.data.resultCode==1){ const link = document.createElement('a'); let _loadUrl=this.domainManager().DomainUrl let str = window.location.href link.href = _loadUrl+res.data.data document.body.appendChild(link); link.click(); this.$message.success(this.$t('visaT.dccg')) this.loading2 = false }else{ this.loading2 = false this.$message.error(res.data.message) } },err=>{}) }, dataDui(){ if(this.msg.StartTime>this.msg.EndTime){ this.$message.error(this.$t('visaT.titleT')) this.msg.EndTime='' } }, downLoadFlyPeople(id){ this.loading2 = true this.apipost('dmc_post_DownLoadWordTravelPeople',{VisaPlanId:id},res=>{ if(res.data.resultCode==1){ const link = document.createElement('a'); let _loadUrl=this.domainManager().DomainUrl let str = window.location.href link.href = _loadUrl+res.data.data document.body.appendChild(link); link.click(); this.$message.success(this.$t('visaT.dccg')) this.loading2 = false }else{ this.loading2 = false this.$message.error(res.data.message) } },err=>{}) }, downLoadFlyInfo(id){ // 下载航班信息 this.loading2 = true this.apipost('dmc_post_GetWordFlightPlanList',{Id:id},res=>{ if(res.data.resultCode==1){ const link = document.createElement('a'); let _loadUrl=this.domainManager().DomainUrl let str = window.location.href link.href = _loadUrl+res.data.data document.body.appendChild(link); link.click(); this.$message.success(this.$t('visaT.dccg')) this.loading2 = false }else{ this.loading2 = false this.$message.error(res.data.message) } },err=>{}) }, downLoadAllIdentity(){ // 批量下载身元信息 this.loading2 = true if(this.checkList.length>0){ let id = this.checkList.join(",") this.apipost('dmc_post_BatchDownLoadWordTravelAndPeople',{VisaPlanIds:id},res=>{ if(res.data.resultCode==1){ const link = document.createElement('a'); let _loadUrl=this.domainManager().DomainUrl let str = window.location.href link.href = _loadUrl+res.data.data document.body.appendChild(link); link.click(); this.$message.success(this.$t('visaT.dccg')) this.loading2 = false }else{ this.loading2 = false this.$message.error(res.data.message) } },err=>{}) }else{ this.loading2 = false this.$message.error(this.$t('visaT.titleTh')) } }, downLoadIdentity(id){ // 下载身元信息 this.loading2 = true this.apipost('dmc_post_DownLoadWordTravelAndPeople',{VisaPlanId:id},res=>{ if(res.data.resultCode==1){ const link = document.createElement('a'); let _loadUrl=this.domainManager().DomainUrl let str = window.location.href link.href = _loadUrl+res.data.data document.body.appendChild(link); link.click(); this.$message.success(this.$t('visaT.dccg')) this.loading2 = false }else{ this.loading2 = false this.$message.error(res.data.message) } },err=>{}) }, completeVisa(i){ // if(!this.DataList[i].IsDdispose){ // this.$message.error('还有未确认的信息,请先确认!') // return // } this.$confirm(this.$t('visaT.qrcpomplete'), this.$t('tips.tips'), { confirmButtonText: this.$t('pub.sureBtn'), cancelButtonText: this.$t('pub.cancelBtn'), type: 'warning' }).then(() => { let msg ={ Id:this.DataList[i].Id, PlanStatus:1 } this.apipost('dmc_post_visa_UpdateVisaPlanInfo',msg,res=>{ if(res.data.resultCode==1){ this.$message.success(res.data.message); this.getList() }else{ this.$message.error(res.data.message) } },err=>{}) }).catch(() => { this.$message({ type: 'info', message: this.$t('hotel.hotel_HasBeenCancelled') }); }); }, operationVisa(text,Id,ApplyStatus){ // 申请人签证审核 this.$confirm(text+ this.$t('visa.titleF'), this.$t('tips.tips'), { confirmButtonText: this.$t('pub.sureBtn'), cancelButtonText: this.$t('pub.cancelBtn'), type: 'warning' }).then(() => { let msg ={ Id:Id, ApplyStatus:ApplyStatus } this.apipost('dmc_post_visa_UpdateVisaApplyPeopleInfo',msg,res=>{ if(res.data.resultCode==1){ this.$message.success(res.data.message); this.getList() }else{ this.$message.error(res.data.message) this.getList() } },err=>{}) }).catch(() => { this.$message({ type: 'info', message: this.$t('hotel.hotel_HasBeenCancelled')+text }); }); }, addVisa(path,CountryType,num,copy,url){ if(this.actieID==1){ this.goUrlT(path,CountryType,num,copy,url) }else{ this.$message.info(this.$t('visaT.titlef')); } }, getList(){ // 获取列表数据 this.loading = true; this.apipost('dmc_get_visa_GetPageList',this.msg,res=>{ if(res.data.resultCode==1){ this.loading = false; if(res.data.data.count>0){ this.total = res.data.data.count; this.DataList = res.data.data.pageData this.noData =false; }else{ this.total = res.data.data.count; this.noData =true; this.DataList = []; } }else{ this.$message.error(res.data.message) } },err=>{}) }, getVisaManagementList(){ // 获取签证管理 this.apipost('dmc_get_visa_GetVisaManagementList',{Status:0,BranchId:-1,SignStatus:0},res=>{ if(res.data.resultCode==1){ this.VisaManagementList = res.data.data; if(this.VisaManagementList.length>0){ this.actieID = this.VisaManagementList[0].Id; this.msg.CountryType=this.actieID; this.getList() } }else{ this.$message.error(res.data.message) } },err=>{}) }, handleCurrentChange(val){ this.msg.pageIndex=val; this.getList() }, resetPageIndex(){ this.msg.pageIndex=1; this.currentPage = 1 }, goUrl(path,id,url){ let routeData = this.$router.resolve({name: path, query: {data: id,url:url}}); window.open(routeData.href, '_blank'); }, goUrlT(path,Cid,id,copy,url){ this.$router.push({ name: path, query:{"id":id,"Cid":Cid,'copy':copy,'url':url,blank:'y',tab:'新增签证'} }) } },mounted(){ this.getVisaManagementList() } } </script>