签名:
-
-

+
+
+

+
+
`;
// 显示二维码
- const sessionId = getSessionId();
- const viewUrl = `http://8.137.125.67:3008/view.html?sessionId=${encodeURIComponent(sessionId)}`;
- displayQRCodeOnPage(viewUrl);
+ setTimeout(() => {
+ const sessionId = getSessionId();
+ const viewUrl = `http://8.137.125.67:3008/view.html?sessionId=${encodeURIComponent(sessionId)}`;
+ displayQRCodeOnPage(viewUrl);
+ }, 100);
}
container.innerHTML = html;
@@ -1183,15 +1231,21 @@
qrContainer.appendChild(qrText);
// 找到合适的位置插入二维码容器
- // 在certificate元素内插入
- const certificateElement = document.querySelector('.certificate');
- if (certificateElement) {
- certificateElement.appendChild(qrContainer);
+ // 优先插入到qrCodeContainer元素中
+ const qrCodeContainer = document.getElementById('qrCodeContainer');
+ if (qrCodeContainer) {
+ qrCodeContainer.appendChild(qrContainer);
} else {
- // 如果没有certificate元素,就在container末尾插入
- const container = document.querySelector('.container');
- if (container) {
- container.appendChild(qrContainer);
+ // 如果没有qrCodeContainer元素,就在certificate元素内插入
+ const certificateElement = document.querySelector('.certificate');
+ if (certificateElement) {
+ certificateElement.appendChild(qrContainer);
+ } else {
+ // 如果都没有,就在container末尾插入
+ const container = document.querySelector('.container');
+ if (container) {
+ container.appendChild(qrContainer);
+ }
}
}
}
diff --git a/view.html b/view.html
index 4e748e0..5e5d031 100644
--- a/view.html
+++ b/view.html
@@ -141,37 +141,78 @@
background-color: white;
}
+ /* 签名和二维码同行显示样式 */
+ .signature-qr-container {
+ align-items: flex-start;
+ }
+
+ .signature-qr-content {
+ flex: 1;
+ display: flex;
+ align-items: center;
+ gap: 15px;
+ flex-wrap: wrap;
+ }
+
+ .signature-qr-content .signature-display {
+ flex: 1;
+ min-width: 120px;
+ }
+
+ .signature-qr-content #qrCodeContainer {
+ flex: 1;
+ min-width: 120px;
+ }
+
+ .signature-qr-content #qrCodeDisplay {
+ margin: 0;
+ padding: 8px;
+ }
+
+ .signature-qr-content #qrCodeImage {
+ max-width: 120px;
+ max-height: 120px;
+ }
+
+ .signature-qr-content #qrCodeDisplay h3 {
+ font-size: 12px;
+ margin-bottom: 6px;
+ }
+
+ .signature-qr-content #qrCodeDisplay div {
+ font-size: 10px;
+ }
+
/* 二维码展示样式 */
#qrCodeDisplay {
- margin: 20px 16px;
- padding: 16px;
- background-color: white;
- border-radius: 8px;
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+ margin: 10px 0;
+ padding: 10px;
+ background-color: #f8f9fa;
+ border-radius: 6px;
text-align: center;
}
#qrCodeDisplay h3 {
color: #28a745;
- margin-bottom: 15px;
- font-size: 18px;
+ margin-bottom: 8px;
+ font-size: 14px;
}
#qrCodeImage {
- max-width: 250px;
- max-height: 250px;
- margin-bottom: 15px;
+ max-width: 140px;
+ max-height: 140px;
+ margin-bottom: 8px;
background-color: white;
- padding: 10px;
- border-radius: 8px;
+ padding: 6px;
+ border-radius: 4px;
border: 1px solid #e0e0e0;
}
#qrCodeDisplay div {
color: #666;
- font-size: 14px;
+ font-size: 11px;
text-align: center;
- line-height: 1.5;
+ line-height: 1.3;
}
.footer {
@@ -303,12 +344,16 @@
`;
+ // 创建签名和二维码的容器
if (certificate.signature) {
html += `
-
+
签名:
-
-

+
+
+

+
+
`;
@@ -317,7 +362,9 @@
container.innerHTML = html;
// 显示二维码
- displayQRCode();
+ setTimeout(() => {
+ displayQRCode();
+ }, 100);
}
// 显示二维码
@@ -387,15 +434,21 @@
qrContainer.appendChild(qrText);
// 找到合适的位置插入二维码容器
- // 在certificate元素内插入
- const certificateElement = document.querySelector('.certificate');
- if (certificateElement) {
- certificateElement.appendChild(qrContainer);
+ // 优先插入到qrCodeContainer元素中
+ const qrCodeContainer = document.getElementById('qrCodeContainer');
+ if (qrCodeContainer) {
+ qrCodeContainer.appendChild(qrContainer);
} else {
- // 如果没有certificate元素,就在container末尾插入
- const container = document.querySelector('.container');
- if (container) {
- container.appendChild(qrContainer);
+ // 如果没有qrCodeContainer元素,就在certificate元素内插入
+ const certificateElement = document.querySelector('.certificate');
+ if (certificateElement) {
+ certificateElement.appendChild(qrContainer);
+ } else {
+ // 如果都没有,就在container末尾插入
+ const container = document.querySelector('.container');
+ if (container) {
+ container.appendChild(qrContainer);
+ }
}
}
}