Explorar el Código

二维码显示数据调整

xy hace 2 semanas
padre
commit
e89ebc4ad5

+ 18 - 8
yudao-ui-admin-vue3/src/views/pressure2/qrReport/BoilerQrReport.vue

@@ -12,20 +12,30 @@ import QrReportView from './QrReportView.vue'
 defineOptions({ name: 'BoilerQrReport' })
 
 const boilerFields: Record<string, string> = {
+
+  useUnitCode: '单位代码',
+  useUnitName: '使用单位',
+  checkTypeName: '检验性质',
+  checkProject: '检验项目',
+  orderNo: '任务单号',
+  reportNo: '报告编号',
+  recordNo: '记录编号',
+  equipCode: '注册代码',
+  mainChecker: '主检验员',
+  checkers: '检验员',
+  checkDate: '检验日期',
+  mainConclusion: '检验结论',
+  approvalName: '审核员',
+  approvalTime: '审核日期',
+  ratifyName: '审批员',
+  ratifyTime: '审批日期',
   typeName: '设备类别',
   equipName: '设备名称',
-  equipCode: '设备代码',
   useRegisterNo: '使用登记证编号',
-  useUnitName: '使用单位',
   factoryCode: '出厂编号',
   productNo: '产品编号',
-  reportNo: '报告编号',
-  mainConclusion: '检验结论',
   nextInCheckDate: '下次内部检验日期',
   nextOutCheckDate: '下次外部检验日期',
-  // nextPressureCheckDate: '下次耐压检验日期',
-  checkDate: '检验日期',
-  // checkOrganization: '检验机构',
-  checkTypeName: '检验性质',
+
 }
 </script>

+ 18 - 8
yudao-ui-admin-vue3/src/views/pressure2/qrReport/PipeQrReport.vue

@@ -12,18 +12,28 @@ import QrReportView from './QrReportView.vue'
 defineOptions({ name: 'PipeQrReport' })
 
 const pipeFields: Record<string, string> = {
-  typeName: '管道类别',
-  equipName: '管道名称',
-  equipCode: '管道代码',
-  useRegisterNo: '使用登记证编号',
+
+  useUnitCode: '单位代码',
   useUnitName: '使用单位',
-  // pipeLevel: '管道级别',
+  checkTypeName: '检验性质',
+  checkProject: '检验项目',
+  orderNo: '任务单号',
   reportNo: '报告编号',
+  recordNo: '记录编号',
+  equipCode: '注册代码',
+  mainChecker: '主检验员',
+  checkers: '检验员',
+  checkDate: '检验日期',
   mainConclusion: '检验结论',
+  approvalName: '审核员',
+  approvalTime: '审核日期',
+  ratifyName: '审批员',
+  ratifyTime: '审批日期',
+
+  typeName: '管道类别',
+  equipName: '管道名称',
+  useRegisterNo: '使用登记证编号',
   nextCheckDate: '下次定期检验日期',
   nextYearCheckDate: '下次年度检查日期',
-  checkDate: '检验日期',
-  // checkOrganization: '检验机构',
-  checkTypeName: '检验性质',
 }
 </script>

+ 65 - 23
yudao-ui-admin-vue3/src/views/pressure2/qrReport/QrReportView.vue

@@ -1,16 +1,25 @@
 <template>
   <div class="qr-report-container">
     <div class="qr-report-header">
-      <div class="qr-report-header-title">特种设备检测研究院</div>
+      <div class="qr-report-header-title">
+        <img
+          class="h-[calc(var(--logo-height))] w-[calc(var(--logo-height))]"
+          src="@/assets/imgs/logo.png"
+        />
+        广州特种设备检测检验报告在线查验
+      </div>
       <div class="qr-report-header-desc">{{ reportTitle }}</div>
     </div>
 
     <div class="qr-report-content" v-loading="loading">
       <div v-if="errorMsg" class="qr-report-error">{{ errorMsg }}</div>
-      <div v-else-if="formData" class="qr-report-table">
-        <div class="table-row" v-for="(label, key) in displayFields" :key="key">
-          <div class="table-cell table-label">{{ label }}:</div>
-          <div class="table-cell table-value">{{ formData[key] }}</div>
+      <div v-else-if="formData">
+        <div class="qr-report-tip">查验结果如下:</div>
+        <div class="qr-report-table">
+          <div class="table-row" v-for="(label, key) in displayFields" :key="key">
+            <div class="table-cell table-label">{{ label }}:</div>
+            <div class="table-cell table-value">{{ formData[key] }}</div>
+          </div>
         </div>
       </div>
       <div v-else-if="!loading" class="qr-report-error">暂无报告数据</div>
@@ -77,10 +86,17 @@ onMounted(() => {
 
 <style scoped>
 .qr-report-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
   width: 100%;
   height: 100vh;
   overflow-y: auto;
-  background-color: #f5f5f5;
+  overflow-x: hidden;
+  background-color: #f0f0f0;
+  -webkit-overflow-scrolling: touch;
 }
 
 .qr-report-header {
@@ -88,31 +104,54 @@ onMounted(() => {
   flex-direction: column;
   justify-content: center;
   align-items: center;
-  gap: 12px;
+  gap: 8px;
   background-color: #26456a;
-  padding: 24px 0;
-  margin-bottom: 20px;
+  padding: 20px 0;
+  margin-bottom: 16px;
+}
+
+.qr-report-header-logo {
+  margin-bottom: 8px;
+}
+
+.logo-icon {
+  width: 56px;
+  height: 56px;
 }
 
 .qr-report-header-title {
-  font-weight: 500;
-  font-size: 18px;
+  font-weight: bold;
+  font-size: 17px;
   color: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
 }
 
 .qr-report-header-desc {
   font-weight: 500;
-  font-size: 15px;
+  font-size: 14px;
   color: #fff;
 }
 
 .qr-report-content {
   max-width: 720px;
   margin: 0 auto;
-  padding: 0 16px;
+  padding: 0 12px;
   box-sizing: border-box;
 }
 
+.qr-report-tip {
+  background-color: #e8f5e9;
+  color: #333;
+  font-weight: 500;
+  font-size: 14px;
+  padding: 10px 16px;
+  margin-bottom: 12px;
+  border-radius: 4px;
+}
+
 .qr-report-error {
   text-align: center;
   color: #999;
@@ -123,12 +162,14 @@ onMounted(() => {
 .qr-report-table {
   width: 100%;
   background-color: #fff;
-  border: 1px solid #d9d9d9;
+  border: 1px solid #ddd;
+  border-radius: 8px;
+  overflow: hidden;
 }
 
 .table-row {
   display: flex;
-  border-bottom: 1px solid #d9d9d9;
+  border-bottom: 1px solid #eee;
 }
 
 .table-row:last-child {
@@ -136,25 +177,26 @@ onMounted(() => {
 }
 
 .table-cell {
-  padding: 14px 16px;
-  font-size: 14px;
+  padding: 10px 14px;
+  font-size: 13px;
   line-height: 1.6;
   word-break: break-all;
 }
 
 .table-label {
-  width: 36%;
-  min-width: 140px;
-  background-color: #f7f8fa;
+  width: 38%;
+  min-width: 130px;
+  background-color: #f5f5f5;
   color: #333;
-  font-weight: 500;
-  border-right: 1px solid #d9d9d9;
+  font-weight: bold;
+  border-right: 1px solid #eee;
   flex-shrink: 0;
 }
 
 .table-value {
   flex: 1;
-  color: #666;
+  color: #333;
   background-color: #fff;
+  text-align: left;
 }
 </style>