无人机管理后台前端(已迁走)
张含笑
2025-09-02 e5fc8c8a5fe96ac02a0e3e40e8577a0a44334321
feat:二维码调整
2 files modified
57 ■■■■■ changed files
src/components/CreateQRcode/CreateQRcode.vue 4 ●●●● patch | view | raw | blame | history
src/views/tickets/ticket.vue 53 ●●●●● patch | view | raw | blame | history
src/components/CreateQRcode/CreateQRcode.vue
@@ -19,8 +19,8 @@
    }
    // 生成新二维码
    qrCodeInstance = new QRCode(myQrCode.value, {
        width: 92,
        height: 91,
        width: 130,
        height: 130,
        text: `https://uri.amap.com/marker?position=${transformed}&name=%E4%BA%8B%E4%BB%B6%E7%82%B9`,
    })
}
src/views/tickets/ticket.vue
@@ -695,30 +695,21 @@
                  <template v-else>
                    <div class="media-title">
                      地图标记事件点
                      <el-popover
                        v-if="currentDetail.status === 3 || currentDetail.status === 0"
                        popper-class="custom-qrcode-popover"
                        :width="120"
                        :visible="currentDetail.showQR && detailVisible"
                        placement="top"
                        title=""
                        trigger="hover"
                      <el-popover   v-if="currentDetail.status === 3 || currentDetail.status === 0"
                     popper-class="custom-qrcode-popover"
                     :width="120"
                     :visible="currentDetail.showQR && detailVisible"
                     placement="top"
                     title=""
                     trigger="click"
                      >
                        <template #reference>
                          <img
                           @mouseenter="currentDetail.showQR = true"
                           @mouseleave="currentDetail.showQR = false"
                            class="QRCodeImg"
                            src="@/assets/images/dataCenter/qrCode.svg"
                            alt=""
                            title="事件导航"
                          />
                          <img @click.stop="handleQRCode(currentDetail)"  class="QRCodeImg" src="@/assets/images/dataCenter/qrCode.svg" alt="" title="事件导航" />
                        </template>
                        <div class="qrcode-content">
                          <CreateQRcode
                            v-if="currentDetail.showQR && detailVisible"
                            :latAndLon="currentDetail.location"
                          ></CreateQRcode>
                          <div class="close-btn"  @click.stop="currentDetail.showQR = false">×</div>
                          <CreateQRcode v-if="currentDetail.showQR && detailVisible" :latAndLon="currentDetail.location"></CreateQRcode>
                        </div>
                      </el-popover>
                    </div>
@@ -3107,7 +3098,27 @@
  max-height: 96vh;
}
.custom-qrcode-popover {
  min-width: 120px !important;
  min-width: 160px !important;
  min-height: 140px !important;
  position: relative;
  .qrcode-content{
margin-top: 8px;
    .close-btn {
      position: absolute;
      top: 2px;
      right: 2px;
      width: 16px;
      height: 16px;
      line-height: 16px;
      text-align: center;
      cursor: pointer;
      color: #999;
      font-size: 16px;
      z-index: 10;
    }
  }
}
</style>
<style lang="scss" scoped>