|
@@ -1,9 +1,10 @@
|
|
|
<template>
|
|
|
<window-size>
|
|
|
- <div style="height: 200px; width: 100%">
|
|
|
- <div style="height: 12px"></div>
|
|
|
+ <div style="margin-top: 12px">
|
|
|
<div id="qrcode" :style="qrMargin"></div>
|
|
|
- <div style="width: 100%; text-align: center; font-size: 14px; color: gray">就诊时出示此二维码</div>
|
|
|
+ </div>
|
|
|
+ <div class="barcode-wrapper">
|
|
|
+ <svg id="barcode"></svg>
|
|
|
</div>
|
|
|
<div style="height: 10px"></div>
|
|
|
<van-cell title="姓名" icon="user-o" :value="card.name" />
|
|
@@ -41,6 +42,7 @@ import {
|
|
|
import {checkPatientId, getLocalOpenId} from '../../../utils/check-patient-id'
|
|
|
import {isValidIdcard, isValidPhone} from '../../../utils/validate'
|
|
|
import {qrcanvas} from 'qrcanvas'
|
|
|
+import JsBarcode from "jsbarcode";
|
|
|
|
|
|
export default {
|
|
|
name: 'PatientCardInfo',
|
|
@@ -129,12 +131,29 @@ export default {
|
|
|
relieveBindCardButCanceled(card.value)
|
|
|
})
|
|
|
}
|
|
|
- onMounted(() => {
|
|
|
+
|
|
|
+ const drawQrcode = (patNo) => {
|
|
|
const canvas = qrcanvas({
|
|
|
- data: paramId,
|
|
|
+ data: patNo,
|
|
|
size: 164,
|
|
|
})
|
|
|
document.getElementById('qrcode').appendChild(canvas)
|
|
|
+ }
|
|
|
+
|
|
|
+ const drawBarcode = (patNo) => {
|
|
|
+ JsBarcode('#barcode', '317452-0', {
|
|
|
+ lineColor: 'rgb(0, 80, 100)',
|
|
|
+ width: 2, //线宽
|
|
|
+ height: 50, //条码高度
|
|
|
+ displayValue: true,
|
|
|
+ fontSize: 16,
|
|
|
+ background: 'rgb(251, 251, 255)',
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ onMounted(() => {
|
|
|
+ drawQrcode(paramId)
|
|
|
+ drawBarcode(paramId)
|
|
|
})
|
|
|
return {
|
|
|
qrMargin,
|
|
@@ -146,4 +165,12 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
}
|
|
|
-</script>
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+.barcode-wrapper {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+}
|
|
|
+</style>
|