Move generate webpos QR api to dawn api.

https://dev.wormwood.com.sg/zentao/task-view-492.html

Strides-Admin/src/http/api/charge.js

@@ -45,8 +45,10 @@ const charge = {
   },
   getWebPosQrCode: (connectorPk) => {
     return get("station/webpos-qr/" + connectorPk)
-  }
-  
+  },
+  getLumiQrCode: (connectorPk) => {
+    return get("dawn/api/v1/charge-box/connector/gen-webpos-qr/" + connectorPk)
+  },
 }
 
 export default charge;

Strides-Admin/src/views/charge/Connectors.vue

@@ -153,12 +153,18 @@
             <i class="el-icon-more icon-action"></i>
             <el-dropdown-menu slot="dropdown">
               <el-dropdown-item
-                command="showConnectorQR">
+                command="showConnectorQR"
+                v-if="!isLumi">
                 QRCode
               </el-dropdown-item>
+              <el-dropdown-item
+                command="showLumiQR"
+                v-if="isLumi">
+                QR Code
+              </el-dropdown-item>
               <el-dropdown-item
                 command="showWebPosQR"
-                v-if="enableWebPos">
+                v-else-if="enableWebPos">
                 WebPosQR
               </el-dropdown-item>
               <el-dropdown-item
@@ -208,6 +214,9 @@
     <WebPosQR 
       v-bind="webPosDialog"
       @hide="hideConnectorQR"/>
+    <LumiQRCode
+      v-bind="lumiQRDialog"
+      @hide="hideConnectorQR"/>
   </div>
 </template>
 
@@ -216,12 +225,13 @@ import Pagination from '@/components/Pagination'
 import TableAction from '@/components/TableAction.vue'
 import ConnectorTags from './components/ConnectorTags.vue'
 import WebPosQR from './components/WebPosQR.vue'
+import LumiQRCode from './components/LumiQRCode.vue'
 import DialogRemoteOcpp from './components/DialogRemoteOcpp.vue'
 import api from '../../http/api/charge'
 import ocpp from '../../http/api/ocpp'
 import settings from '../../settings.js'
 export default {
-  components: { Pagination, TableAction, ConnectorTags, DialogRemoteOcpp,WebPosQR },
+  components: { Pagination, TableAction, ConnectorTags, DialogRemoteOcpp,WebPosQR,LumiQRCode },
   data() {
     return {
       filter: {
@@ -252,8 +262,13 @@ export default {
         visible: false,
         item: {}
       },
+      lumiQRDialog: {
+        visible: false,
+        item: {}
+      },
       enableWebPos: settings.enableWebPos,
-      enableEVCPID: settings.enableEVCPID
+      enableEVCPID: settings.enableEVCPID,
+      isLumi: settings.projectName == 'LUMI'
     }
   },
   created() {
@@ -325,6 +340,10 @@ export default {
       this.webPosDialog.item = row;
       this.webPosDialog.visible = true;
     },
+    showLumiQR(row) {
+      this.lumiQRDialog.item = row;
+      this.lumiQRDialog.visible = true;
+    },
     unlockConnector(row) {
       this.$confirm("Confirm unlock this connector?", "Unlock Connector",  {
         confirmButtonText: 'Confirm',
@@ -419,6 +438,7 @@ export default {
     hideConnectorQR() {
       this.printConnector.visible = false;
       this.webPosDialog.visible = false;
+      this.lumiQRDialog.visible = false;
     },
     hideActionDialog() {
       this.actionDialog.visible = false;

Strides-Admin/src/views/charge/components/LumiQRCode.vue

@@ -0,0 +1,116 @@
+<template>
+  <el-dialog
+    title="QR Code (2 in 1)"
+    :visible="visible"
+    width="320px"
+    top="100px"
+    :before-close="dialogBeforeClose">
+    <div class="qrcode" v-loading="loading" id="webPosQr">
+      <el-image class="qr-image" :src="qrcode"/>
+    </div>
+    <div class="footer">
+      <el-button @click="onPrint" type="primary">Print</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import api from '@/http/api/charge'
+export default {
+  name: "LumiQRCode",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    item: {
+      type: Object,
+      default: () => {}
+    }
+  },
+  data() {
+    return {
+      id: "",
+      qrcode: "",
+      loading: false
+    };
+  },
+  mounted() {
+    
+  },
+  watch: {
+    visible: {
+      handler(value) {
+        if (value) {
+          this.$nextTick(() => {
+            if (this.id !== this.item.connectorPk) {
+              this.loading = true;
+              this.getQRCode()
+            }
+          })
+        } else {
+          this.qrcode = ""
+        }
+      },
+    }
+  },
+  methods: {
+    dialogBeforeClose() {
+      this.$emit("hide")
+    },
+    getQRCode() {
+      if (this.item.connectorPk) {
+        this.id = this.item.connectorPk;
+        api.getLumiQrCode(this.item.connectorPk).then(res => {
+          if (res.data && res.data.base64WebposQr) {
+            this.qrcode = res.data.base64WebposQr;
+          }
+        }).catch(err => {
+          this.$message.error(err)
+        }).finally(() => {
+          this.loading = false;
+        })
+      }
+    },
+    onPrint() {
+      const contentHtmlString = document.querySelector('#webPosQr').outerHTML;
+      let iframe = document.getElementById('print-iframe');
+      if (!iframe) {
+        iframe = document.createElement('IFRAME')
+        iframe.setAttribute('id', 'print-iframe')
+        iframe.setAttribute(
+          'style',
+          'position:absolute;width:0px;height:0px;left:-500px;top:-500px;'
+        )
+        document.body.appendChild(iframe)
+      }
+      const doc = iframe.contentWindow.document
+      doc.write(contentHtmlString)
+      doc.close()
+      iframe.contentWindow.focus()
+      iframe.contentWindow.print()
+      if (navigator.userAgent.indexOf('MSIE') > 0) {
+        document.body.removeChild(iframe)
+      }
+      this.dialogBeforeClose()
+    }
+  }
+}
+</script>
+
+<style scoped>
+.qrcode {
+  display: flex;
+  margin-top: -10px;
+  align-items: center;
+  justify-content: center;
+}
+.footer {
+  text-align: center;
+  padding: 30px 0 0px;
+}
+.qr-image {
+  width: 280px;
+  height: 280px;
+}
+</style>