|  |  | 
 |  |  | <template> | 
 |  |  |     <GlobalWindow | 
 |  |  |         :title="title" | 
 |  |  |         width="60%" | 
 |  |  |         width="70%" | 
 |  |  |         :visible.sync="visible" | 
 |  |  |         append-to-body | 
 |  |  |         :confirm-working="isWorking" | 
 |  |  |         @confirm="confirm" | 
 |  |  |     > | 
 |  |  |         <div class="list"> | 
 |  |  |             <div class="list_item"> | 
 |  |  |                 <div class="list_item_label">拜访信息</div> | 
 |  |  |                 <div class="list_item_val" v-if="info"> | 
 |  |  |                 <div class="list_item_val" v-if="info" style="display: inline-block"> | 
 |  |  |                     <div class="list_item_val_item">拜访对方:{{info.receptMemberName}} - {{info.receptMemberDepartment}}</div> | 
 |  |  |                     <div class="list_item_val_item">拜访时间:{{info.starttime}} 至 {{info.endtime}}</div> | 
 |  |  |                     <div class="list_item_val_item">预约时间:{{info.starttime}} 至 {{info.endtime}}</div> | 
 |  |  |                     <div class="list_item_val_item" v-if="info.inDate && info.outDate">签到时间:{{info.inDate}} 至 {{info.outDate}}</div> | 
 |  |  |                     <div class="list_item_val_item" v-else>签到时间:-</div> | 
 |  |  |                     <div class="list_item_val_item">拜访事由:{{info.reason}}</div> | 
 |  |  |                     <div class="list_item_val_item">申请人员:{{info.name}} {{info.companyName}}</div> | 
 |  |  |                     <div class="list_item_val_item">申请门禁:{{info.deviceRoleList ? info.deviceRoleList.map(item => item.name).join(' | ') : ''}}</div> | 
 |  |  |                     <div class="list_item_val_item">申请门禁:{{info.deviceRoleList ? info.deviceRoleList.map(item => item.name).join(' | ') : '-'}}</div> | 
 |  |  |                     <div class="list_item_val_item">创建时间:{{info.createDate}}</div> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |                 <div class="list_item_val" v-if="info" style="display: inline-block;float: right"> | 
 |  |  |                   <div class="list_item_val_item"   id="qrcode2" ref="qrcode2"></div> | 
 |  |  |                 </div> | 
 |  |  |               </div> | 
 |  |  |             <div class="list_item"> | 
 |  |  |                 <div class="list_item_label">访客信息</div> | 
 |  |  |                 <div class="list_item_table" v-if="info"> | 
 |  |  | 
 |  |  |                         border | 
 |  |  |                         :header-cell-style="{background: '#dcdde2', color: 'rgb(51, 51, 51)'}" | 
 |  |  |                         style="width: 100%"> | 
 |  |  |                       <el-table-column prop="status"   label="状态" min-width="100px"> | 
 |  |  |                         <template slot-scope="{row}"> | 
 |  |  |                           <span style="color: rgba(245, 154, 35, 0.996);" v-if="row.status === 0">待提交审批</span> | 
 |  |  |                           <span v-if="row.status === 1">审批中</span> | 
 |  |  |                           <span v-if="row.status === 2">审核通过</span> | 
 |  |  |                           <span style="color: red;" v-if="row.status === 3">审核不通过</span> | 
 |  |  |                           <span v-if="row.status === 4">取消</span> | 
 |  |  |                           <span v-if="row.status === 5">预约成功</span> | 
 |  |  |                           <span v-if="row.status === 6">预约失败</span> | 
 |  |  |                           <span v-if="row.status === 7">拜访中</span> | 
 |  |  |                           <span v-if="row.status === 8">已签离</span> | 
 |  |  |                           <span v-if="row.status === 9">已失效</span> | 
 |  |  |                         </template> | 
 |  |  |                       </el-table-column> | 
 |  |  |                         <el-table-column | 
 |  |  |                             width="150" | 
 |  |  |                             label="姓名"> | 
 |  |  | 
 |  |  |                         <el-table-column | 
 |  |  |                             width="150" | 
 |  |  |                             prop="companyName" | 
 |  |  |                             label="公司"> | 
 |  |  |                             label="组织"> | 
 |  |  |                         </el-table-column> | 
 |  |  |                         <el-table-column | 
 |  |  |                             width="150" | 
 |  |  |                             prop="carNos" | 
 |  |  |                             label="随行车辆"> | 
 |  |  |                         </el-table-column> | 
 |  |  |                         <el-table-column | 
 |  |  |                             width="150" | 
 |  |  |                             label="访客二维码"> | 
 |  |  |                             <template slot-scope="{row}"> | 
 |  |  |                               <div   :id="`qrcode${row.id}`" :ref="`qrcode${row.id}`"></div> | 
 |  |  |                             </template> | 
 |  |  |                         </el-table-column> | 
 |  |  |                         <el-table-column | 
 |  |  |                             width="150" | 
 |  |  | 
 |  |  | import BaseOpera from '@/components/base/BaseOpera' | 
 |  |  | import GlobalWindow from '@/components/common/GlobalWindow' | 
 |  |  | import { queryById } from '@/api/business/visits' | 
 |  |  | import QRCode from "qrcodejs2"; | 
 |  |  | export default { | 
 |  |  |   name: 'OperaVisitsWindow', | 
 |  |  |   extends: BaseOpera, | 
 |  |  | 
 |  |  |   data () { | 
 |  |  |     return { | 
 |  |  |       list: [], | 
 |  |  |       info: null | 
 |  |  |       info: null, | 
 |  |  |       innerVisible:false | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   created () { | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     getAge (val) { | 
 |  |  | 
 |  |  |         return calculationAge - 1 | 
 |  |  |       } | 
 |  |  |     }, | 
 |  |  |     crateQrcodeShow (div,qrcode1) { | 
 |  |  |       if(qrcode1 ==null ||qrcode1 ==''){ | 
 |  |  |         return; | 
 |  |  |       } | 
 |  |  |       this.qr = new QRCode(div, { | 
 |  |  |         width: 90, | 
 |  |  |         height: 90, | 
 |  |  |         text: qrcode1 | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |  | 
 |  |  |     open (title, id) { | 
 |  |  |       this.title = title | 
 |  |  |       this.visible = true | 
 |  |  | 
 |  |  |         .then(res => { | 
 |  |  |           console.log(res) | 
 |  |  |           this.info = res | 
 |  |  |           this.$nextTick(() => { | 
 |  |  |             // this.$refs.qrcode2.innerHTML = '' | 
 |  |  |             // this.crateQrcodeShow('qrcode2',res.qrcode) | 
 |  |  |             if(this.info.withUserList ){ | 
 |  |  |               this.info.withUserList.forEach(row => { | 
 |  |  |                 this.$refs['qrcode'+row.id].innerHTML = '' | 
 |  |  |                 this.crateQrcodeShow('qrcode'+row.id,row.qrcode) | 
 |  |  |               }) | 
 |  |  |             } | 
 |  |  |           }) | 
 |  |  |         }) | 
 |  |  |     } | 
 |  |  |   } |