Преглед на файлове

看板字体缩放问题

yanghao преди 19 часа
родител
ревизия
266c90d66d
променени са 2 файла, в които са добавени 21 реда и са изтрити 11 реда
  1. 1 1
      .env.local
  2. 20 10
      src/views/pms/stat/rykb/ryProductionBriefs.vue

+ 1 - 1
.env.local

@@ -4,7 +4,7 @@ NODE_ENV=development
 VITE_DEV=true
 VITE_DEV=true
 
 
 # 请求路径  http://192.168.188.86:48080  https://iot.deepoil.cc:5443  http://172.26.0.56:48080  http://192.168.188.198:48080
 # 请求路径  http://192.168.188.86:48080  https://iot.deepoil.cc:5443  http://172.26.0.56:48080  http://192.168.188.198:48080
-VITE_BASE_URL='https://iot.deepoil.cc:5443'
+VITE_BASE_URL='https://aims.deepoil.cc'
 
 
 # 文件上传类型:server - 后端上传, client - 前端直连上传,仅支持 S3 服务
 # 文件上传类型:server - 后端上传, client - 前端直连上传,仅支持 S3 服务
 VITE_UPLOAD_TYPE=server
 VITE_UPLOAD_TYPE=server

+ 20 - 10
src/views/pms/stat/rykb/ryProductionBriefs.vue

@@ -44,10 +44,16 @@ const selectedDate = ref(DEFAULT_DATE)
 const loading = ref(false)
 const loading = ref(false)
 const list = ref<RyProductionBriefRow[]>([])
 const list = ref<RyProductionBriefRow[]>([])
 const kbScale = inject<Ref<number>>('ryKbScale', ref(1))
 const kbScale = inject<Ref<number>>('ryKbScale', ref(1))
+const initialDevicePixelRatio = window.devicePixelRatio || 1
+const browserZoom = ref(1)
 const tableHeight = computed<number | string>(() =>
 const tableHeight = computed<number | string>(() =>
   props.pageMode === 'full' ? '100%' : Math.round(TABLE_HEIGHT * kbScale.value)
   props.pageMode === 'full' ? '100%' : Math.round(TABLE_HEIGHT * kbScale.value)
 )
 )
 
 
+function updateBrowserZoom() {
+  browserZoom.value = (window.devicePixelRatio || initialDevicePixelRatio) / initialDevicePixelRatio
+}
+
 const tableData = computed(() => {
 const tableData = computed(() => {
   return [...list.value].sort((a, b) => {
   return [...list.value].sort((a, b) => {
     const companySort =
     const companySort =
@@ -172,13 +178,20 @@ async function getList() {
 }
 }
 
 
 onMounted(() => {
 onMounted(() => {
+  updateBrowserZoom()
+  window.addEventListener('resize', updateBrowserZoom)
   getList()
   getList()
 })
 })
+
+onUnmounted(() => {
+  window.removeEventListener('resize', updateBrowserZoom)
+})
 </script>
 </script>
 
 
 <template>
 <template>
   <div
   <div
     class="panel device-list-panel production-brief-panel w-full min-h-0 flex flex-col"
     class="panel device-list-panel production-brief-panel w-full min-h-0 flex flex-col"
+    :style="{ '--production-brief-browser-zoom': browserZoom }"
     :class="{ 'production-brief-panel--full': props.pageMode === 'full' }">
     :class="{ 'production-brief-panel--full': props.pageMode === 'full' }">
     <div class="panel-title device-list-panel__title flex items-center justify-between">
     <div class="panel-title device-list-panel__title flex items-center justify-between">
       <div class="kb-panel-title-text flex items-center">
       <div class="kb-panel-title-text flex items-center">
@@ -220,7 +233,6 @@ onMounted(() => {
           min-width="88"
           min-width="88"
           align="center" />
           align="center" />
 
 
-        <el-table-column prop="nextPlan" label="下步任务" min-width="130" align="center" />
         <el-table-column
         <el-table-column
           prop="constructionBrief"
           prop="constructionBrief"
           label="当日生产简况"
           label="当日生产简况"
@@ -231,6 +243,8 @@ onMounted(() => {
           </template>
           </template>
         </el-table-column>
         </el-table-column>
 
 
+        <el-table-column prop="nextPlan" label="下步任务" min-width="130" align="center" />
+
         <el-table-column label="当日进尺(m)/当日井次" min-width="150" align="center">
         <el-table-column label="当日进尺(m)/当日井次" min-width="150" align="center">
           <template #default="{ row }">
           <template #default="{ row }">
             {{ formatFootageOrWell(row) }}
             {{ formatFootageOrWell(row) }}
@@ -294,7 +308,7 @@ onMounted(() => {
   width: 100%;
   width: 100%;
 
 
   :deep(.el-table__header-wrapper th.el-table__cell) {
   :deep(.el-table__header-wrapper th.el-table__cell) {
-    font-size: calc(16px * var(--kb-scale, 1));
+    font-size: calc(16px * var(--production-brief-browser-zoom, 1));
     line-height: 1.2;
     line-height: 1.2;
     color: #0e3f8a;
     color: #0e3f8a;
     background: #7fb5ff;
     background: #7fb5ff;
@@ -302,14 +316,9 @@ onMounted(() => {
     font-weight: 600;
     font-weight: 600;
   }
   }
 
 
-  // :deep(.el-table__body td.el-table__cell) {
-  //   height: calc(58px * var(--kb-scale, 1));
-  //   padding: calc(7px * var(--kb-scale, 1)) 0;
-  //   font-size: calc(14px * var(--kb-scale, 1));
-  //   color: #07192c !important;
-  //   background: #89b3de !important;
-  //   border-color: #fff !important;
-  // }
+  :deep(.el-table__body td.el-table__cell) {
+    font-size: calc(14px * var(--production-brief-browser-zoom, 1));
+  }
 
 
   // :deep(.el-table__body tr:nth-child(2n) td.el-table__cell) {
   // :deep(.el-table__body tr:nth-child(2n) td.el-table__cell) {
   //   background: #b8cee5 !important;
   //   background: #b8cee5 !important;
@@ -321,6 +330,7 @@ onMounted(() => {
 }
 }
 
 
 .production-brief-table__summary {
 .production-brief-table__summary {
+  font-size: calc(14px * var(--production-brief-browser-zoom, 1));
   line-height: 1.5;
   line-height: 1.5;
   white-space: pre-wrap;
   white-space: pre-wrap;
   overflow-wrap: anywhere;
   overflow-wrap: anywhere;