fix: 1

src/components/tex-tooltip.vue

@@ -8,19 +8,28 @@
 <script setup lang="ts">
 import { onMounted, onUnmounted, ref } from "vue";
 
-defineProps<{ text: string }>();
+defineProps<{ text?: any }>();
 
 const dom = ref<HTMLSpanElement>();
 const sample = ref(false);
+let timeId: NodeJS.Timeout;
 const initSample = () => {
+  clearTimeout(timeId);
   if (dom.value) {
-    sample.value = dom.value!.offsetHeight > 50;
+    timeId = setTimeout(() => {
+      sample.value = dom.value!.offsetHeight > 50;
+      if (sample.value) {
+        console.log(dom.value);
+      }
+      console.log(sample.value);
+    }, 100);
   }
 };
 
 onMounted(initSample);
 onUnmounted(() => {
   window.removeEventListener("resize", initSample);
+  console.log("remove");
 });
 window.addEventListener("resize", initSample);
 </script>
@@ -29,6 +38,7 @@ window.addEventListener("resize", initSample);
 .text {
   display: inline-block;
   line-height: 23px;
+  word-break: break-all;
 }
 .sample {
   display: -webkit-box;

src/view/relics.vue

@@ -55,35 +55,39 @@
           </a>
         </el-table-column>
 
-        <el-table-column prop="unicode" label="文物编号" />
         <el-table-column
-          prop="name"
-          label="文物级别"
+          prop="unicode"
+          label="文物编号"
           v-slot:default="{ row }: { row: Relics }"
         >
-          {{ relicsLevelDesc[row.level!] }}
+          <TexToolTip :text="row.unicode" v-if="row.unicode" />
         </el-table-column>
-        <el-table-column
-          prop="name"
-          label="类别"
-          v-slot:default="{ row }: { row: Relics }"
-        >
-          {{ relicsTypeDesc[row.category!] }}
+
+        <el-table-column label="文物级别" v-slot:default="{ row }: { row: Relics }">
+          <TexToolTip :text="relicsLevelDesc[row.level!]" />
+        </el-table-column>
+        <el-table-column label="类别" v-slot:default="{ row }: { row: Relics }">
+          <TexToolTip :text="relicsTypeDesc[row.category!]" />
         </el-table-column>
         <el-table-column label="文物地址" v-slot:default="{ row }: { row: Relics }">
-          <TexToolTip :text="row.address" v-if="row.address" />
+          <TexToolTip :text="row.address" />
         </el-table-column>
 
-        <el-table-column label="创建时间" prop="createTime" v-slot:default="{ row }">
-          {{ row.createTime && row.createTime.substr(0, 16) }}
+        <el-table-column label="创建时间" v-slot:default="{ row }">
+          <TexToolTip :text="row.createTime.substr(0, 16)" v-if="row.createTime" />
+        </el-table-column>
+        <el-table-column prop="userName" label="创建人账号" v-slot:default="{ row }">
+          <TexToolTip :text="row.userName" />
         </el-table-column>
-        <el-table-column prop="userName" label="创建人" />
         <el-table-column
           prop="creationMethod"
           label="创建方式"
           v-slot:default="{ row }: { row: Relics }"
         >
-          {{ creationMethodDesc[row.creationMethod!] }}
+          <TexToolTip
+            :text="creationMethodDesc[row.creationMethod!]"
+            v-if="row.creationMethod"
+          />
         </el-table-column>
         <el-table-column label="操作" width="240" fixed="right">
           <template #default="{ row }">
@@ -222,5 +226,4 @@ onActivated(refresh);
     text-align: right;
   }
 }
-
 </style>

src/view/scene.vue

@@ -76,32 +76,45 @@
         :ref="(table) => tableProps && (tableProps.tableRef.value = table)"
       >
         <slot name="table"></slot>
-        <el-table-column label="场景标题" prop="sceneName" v-slot:default="{ row }">
+        <el-table-column label="场景标题" v-slot:default="{ row }">
           <a class="link" @click="gotoScene(row, false)">
-            {{ row.sceneName }}
+            <TexToolTip :text="row.sceneName" />
           </a>
         </el-table-column>
 
-        <el-table-column label="场景类型" prop="snCode" v-slot:default="{ row }">
-          {{ SceneTypeDesc[row.cameraType as SceneType] }}
+        <el-table-column label="场景类型" v-slot:default="{ row }">
+          <TexToolTip :text="SceneTypeDesc[row.cameraType as SceneType]" />
         </el-table-column>
-        <el-table-column label="场景码" prop="sceneCode"></el-table-column>
-        <el-table-column label="SN码" prop="snCode"></el-table-column>
+        <el-table-column label="场景码" v-slot:default="{ row }">
+          <TexToolTip :text="row.sceneCode" />
+        </el-table-column>
+        <el-table-column label="SN码" v-slot:default="{ row }">
+          <TexToolTip :text="row.snCode" />
+        </el-table-column>
+
         <el-table-column label="设备类型" prop="snCode" v-slot:default="{ row }">
-          {{ DeviceTypeDesc[row.cameraType as DeviceType] }}
+          <TexToolTip :text="DeviceTypeDesc[row.cameraType as DeviceType]" />
         </el-table-column>
         <el-table-column label="拍摄时间" prop="algorithmTime" v-slot:default="{ row }">
-          {{ row.shootTime && row.shootTime.substr(0, 16) }}
+          <TexToolTip :text="row.shootTime && row.shootTime.substr(0, 16)" />
         </el-table-column>
+
         <el-table-column label="计算完成时间" prop="createTime" v-slot:default="{ row }">
-          {{ row.algorithmTime && row.algorithmTime.substr(0, 16) }}
+          <TexToolTip :text="row.algorithmTime && row.algorithmTime.substr(0, 16)" />
         </el-table-column>
-        <el-table-column label="点位数量" prop="shootCount"></el-table-column>
-        <el-table-column label="拍摄位置" prop="gpsInfo"></el-table-column>
+
+        <el-table-column label="点位数量" v-slot:default="{ row }">
+          <TexToolTip :text="row.shootCount" />
+        </el-table-column>
+        <el-table-column label="拍摄位置" v-slot:default="{ row }">
+          <TexToolTip :text="row.gpsInfo" />
+        </el-table-column>
+
         <!-- <el-table-column label="绑定账号" prop="userName"></el-table-column> -->
         <el-table-column label="状态" v-slot:default="{ row }">
-          {{ SceneStatusDesc[(row.calcStatus as SceneStatus)] }}
+          <TexToolTip :text="SceneStatusDesc[(row.calcStatus as SceneStatus)]" />
         </el-table-column>
+
         <el-table-column label="操作" width="150" fixed="right" v-if="!simple">
           <template #default="{ row }">
             <el-button link type="primary" size="small" @click="gotoScene(row, false)">
@@ -144,6 +157,7 @@ import {
 import { DeviceTypeDesc, DeviceType } from "@/store/device";
 import { ElMessageBox } from "element-plus";
 import { gotoScene } from "@/store/scene";
+import TexToolTip from "@/components/tex-tooltip.vue";
 
 const props = defineProps<{ tableProps?: { [key in string]: any }; simple?: boolean }>();