小程序端扫门禁码跳转；门禁端调整；bugfix小程序端商品售价和划线价反了

backend/microservice-provider-access-8002/src/main/resources/static/access/renderer.js

@@ -1,3 +1,4 @@
+// 定义常量
 const url = "https://epp.only4.work/access/wechat/getUnlimitedQRCode"
 const page = "pages/index/index" // "pages/scan/entrance"
 const envVersion = "develop" // 正式版为 "release"，体验版为 "trial"，开发版为 "develop"
@@ -5,6 +6,36 @@ const autoColor = true
 const isHyaline = false
 const width = 500
 
+// 页面上的元素
+const image = document.getElementById('qrcode')
+const noQrInfo = document.getElementById('no-qrcode')
+const refreshTimeCountDown = document.getElementById('refreshTimeCountDown')
+const DOMGateList = document.getElementById('gate-list')
+
+// 大门列表
+window.gateList = []
+
+// 当前大门
+window.currentGate = null
+
+// 点击全屏
+document.getElementById("fullscreen-button").addEventListener("click", function () {
+    if (document.fullscreenElement) {
+        document.exitFullscreen();
+    } else {
+        if (inElectron) {
+            // electron 中
+            const message = JSON.stringify({
+                action: 'fullscreen'
+            });
+            window.parent.postMessage(message, '*');
+        } else {
+            // 浏览器中
+            document.body.requestFullscreen()
+        }
+    }
+})
+
 // 获取 Url 参数
 function getUrlParams() {
     let params = {}
@@ -18,46 +49,19 @@ function getUrlParams() {
     // console.log(params)
     return params
 }
-let urlParams = getUrlParams()
-console.log("urlParams", urlParams)
-
-// 是否在 electron 中
-const inElectron = urlParams['inElectron']
-
-// 当前的门禁端
-let gateId = urlParams['gateId'] || ""
-
-if (!gateId) {
-    // 弹出选择框
-}
-
-// 点击全屏
-document.getElementById("fullscreen-button").addEventListener("click", function () {
-    if (document.fullscreenElement) {
-        document.exitFullscreen();
-    } else {
-        if(inElectron) {
-            // electron 中
-            const message = JSON.stringify({
-                action: 'fullscreen'
-            });
-            window.parent.postMessage(message, '*');
-        } else {
-            // 浏览器中
-            document.body.requestFullscreen()
-        }
-    }
-})
-
-// 页面上的元素
-const image = document.getElementById('qrcode')
-const refreshTimeCountDown = document.getElementById('refreshTimeCountDown')
 
 // 定时更新页面上的小程序码
 let i = 0, refreshTime = 10 + 1
+
 function updateQRCode() {
+    // 取消图片隐藏
+    image.style.visibility = '';
+    image.style.display = '';
+    noQrInfo.style.display = 'none';
+
     if (i % refreshTime == 0) {
-        let scene = encodeURIComponent(`guard&${Date.now()}`);
+        // scene 最长支支持 32 位，所以这里不传入时间戳
+        let scene = encodeURIComponent(`guard&${window.currentGate.id}`); // &${Date.now()}
         image.src = `${url}?page=${page}&scene=${scene}&envVersion=${envVersion}&width=${width}&autoColor=${autoColor}&isHyaline=${isHyaline}`
         console.log(image.src)
         refreshTimeCountDown.innerHTML = ` `
@@ -67,5 +71,76 @@ function updateQRCode() {
     i = i % refreshTime + 1
 }
 
-updateQRCode()
-setInterval(updateQRCode, 1000)
+// 挂载到 window 上
+window.updateQRCode = updateQRCode
+
+// 弹窗中修改 item
+function changePanelSelectGate(gateId) {
+    // 删除旧的 active
+    let activeList = document.querySelectorAll('.gate-list-item.active')
+    for (let a of activeList) {
+        a.classList.remove('active')
+    }
+
+    // 添加新的 active
+    let newActiveItem = document.getElementById(`gate-list-${gateId}`)
+    if (newActiveItem) {
+        newActiveItem.classList.add('active')
+        window.selectGateId = gateId
+    }
+}
+
+// 挂载到 window 上
+window.changePanelSelectGate = changePanelSelectGate
+
+// 发送请求，获取大门列表
+async function getGateList() {
+    const response = await fetch('https://epp.only4.work/access/gate/guard-client/getGateList');
+    const data = await response.json();
+    return data.data;
+}
+
+window.onload = async function () {
+    // 获取 url 参数
+    let urlParams = getUrlParams()
+    console.log("urlParams", urlParams)
+
+    // 是否在 electron 中
+    const inElectron = urlParams['inElectron']
+
+    // 当前的门禁端
+    let gateId = urlParams['gateId'] || ""
+
+    // 获取大门列表
+    window.gateList = await getGateList()
+    console.log("gateList", window.gateList)
+
+    let domList = []
+    for (let gate of window.gateList) {
+        domList.push(`
+            <div id="gate-list-${gate.id}" class="gate-list-item" onclick="window.changePanelSelectGate('${gate.id}')">
+                <p>${gate.name}</p>
+                <p class="status ${gate.open ? 'open' : 'closed'}">
+                    ${gate.open ? '开放' : '封闭'}
+                </p>
+            </div>
+        `)
+    }
+    DOMGateList.innerHTML = domList.join('')
+
+    // 通过id 找门禁
+    window.currentGate = gateList.find((gate) => gate.id === gateId)
+
+    if (!window.currentGate) {
+        // 弹出选择框
+        window.showSettingPanel && window.showSettingPanel()
+    } else {
+        document.querySelector('#gate-name').textContent = window.currentGate.name
+        // 开始更新图片
+        updateQRCode()
+        setInterval(updateQRCode, 1000)
+    }
+}
+
+
+