perf: width

gkd-kit · Feb 13, 2024 · 38916c7 · 38916c7
1 parent a3566a9
commit 38916c7
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 19 deletions.
diff --git a/src/components/AttrCard.vue b/src/components/AttrCard.vue
@@ -110,16 +110,12 @@ const qfAttrs = [`id`, `vid`, `text`];
           <NTd>
             <NEllipsis
               v-if="attrx.name == 'id'"
-              style="
-                width: 180px;
-                min-width: max(12vw, 180px);
-                direction: rtl;
-                text-align: left;
-              "
+              class="w-180px min-w-[max(12vw,180px)] text-left"
+              style="direction: rtl"
             >
               {{ attrx.value }}
             </NEllipsis>
-            <NEllipsis v-else style="width: 180px; min-width: max(12vw, 180px)">
+            <NEllipsis v-else class="w-180px min-w-[max(12vw,180px)]">
               {{ attrx.value }}
             </NEllipsis>
           </NTd>

diff --git a/src/components/WindowCard.vue b/src/components/WindowCard.vue
@@ -92,21 +92,20 @@ const renderLabel = (info: {
       size="small"
       striped
       :singleLine="false"
-      class="table-fixed"
       :themeOverrides="{
         thPaddingSmall: '2px 4px',
         tdPaddingSmall: '2px 4px',
       }"
     >
       <NThead>
         <NTr>
-          <NTh class="w-140px"> Device </NTh>
-          <NTh class="w-100px"> Name </NTh>
-          <NTh class="w-100px"> VersionName </NTh>
-          <NTh class="w-100px"> VersionCode </NTh>
-          <NTh class="w-150px"> AppId </NTh>
-          <NTh> ActivityId </NTh>
-          <NTh class="w-175px"> 操作 </NTh>
+          <NTh> 设备 </NTh>
+          <NTh> 应用名称 </NTh>
+          <NTh> 版本名称 </NTh>
+          <NTh> 版本代码 </NTh>
+          <NTh> 应用ID </NTh>
+          <NTh> 界面ID </NTh>
+          <NTh> 操作 </NTh>
         </NTr>
       </NThead>
       <NTbody>
@@ -141,12 +140,15 @@ const renderLabel = (info: {
               {{ snapshot.appId }}
             </NEllipsis>
           </NTd>
-          <NTd @click="copy(snapshot.activityId)" class="break-words">
+          <NTd
+            @click="copy(snapshot.activityId)"
+            class="break-words max-w-[max(15vw,200px)]"
+          >
             <NEllipsis>
               {{ snapshot.activityId }}
             </NEllipsis>
           </NTd>
-          <NTd>
+          <NTd class="min-w-175px">
             <slot></slot>
           </NTd>
         </NTr>

diff --git a/src/utils/table.tsx b/src/utils/table.tsx
@@ -59,7 +59,7 @@ export const useSnapshotColumns = () => {
   const appNameCol = useAutoWrapWidthColumn<Snapshot>({
     key: `appName`,
     minWidth: 100,
-    title: `APP名称`,
+    title: `应用名称`,
     filterMultiple: true,
     filter(value, row) {
       return value.toString() == row.appName;
@@ -70,7 +70,7 @@ export const useSnapshotColumns = () => {
   });
   const appIdCol = useAutoWrapWidthColumn<Snapshot>({
     key: `appId`,
-    title: `ID`,
+    title: `应用ID`,
     minWidth: 100,
     render(row) {
       return row.appId;