css

liukangdong

2024-06-03 248f2f32b0f1e406a8110f0839702914a9c3ca0a

 admin/src/components/business/OperaVisitsDesWindow.vue

@@ -1,35 +1,58 @@
<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.deviceList ? info.deviceList.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_info" v-if="info">随访车辆：{{info.carNos}}</div>
                <div class="list_item_table" v-if="info">
                    <el-table
                        :data="info.withUserList ? info.withUserList : []"
                        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
                            prop="name"
                            width="150"
                            label="姓名">
                            <template slot-scope="{row}">
                                <span>{{row.name}}</span>
                                <span style="border-radius: 5px; padding: 2px 5px; box-sizing: border-box; border: 1px solid #0d68ff; color: #0d68ff; margin-left: 5px;" v-if="info.memberId === row.memberId">申请人</span>
                            </template>
                        </el-table-column>
                        <el-table-column
                            label="性别">
@@ -64,8 +87,21 @@
                            label="身份证号码">
                        </el-table-column>
                        <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"
@@ -116,6 +152,7 @@
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,
@@ -123,8 +160,11 @@
  data () {
    return {
      list: [],
      info: null
      info: null,
      innerVisible:false
    }
  },
  created () {
  },
  methods: {
    getAge (val) {
@@ -140,6 +180,17 @@
        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
@@ -147,6 +198,16 @@
        .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)
              })
            }
          })
        })
    }
  }