fix: 悬浮显示样式修改

1Panel-dev · Mar 13, 2023 · 16b54a8 · 16b54a8
1 parent 95bc5cc
commit 16b54a8
Show file tree

Hide file tree

Showing 5 changed files with 22 additions and 22 deletions.
diff --git a/frontend/src/views/container/repo/index.vue b/frontend/src/views/container/repo/index.vue
@@ -54,7 +54,10 @@
                             <el-tag v-if="row.status === 'Success'" type="success">
                                 {{ $t('commons.status.success') }}
                             </el-tag>
-                            <el-tooltip v-else effect="dark" :content="row.message" placement="bottom">
+                            <el-tooltip v-else effect="dark" placement="bottom">
+                                <template #content>
+                                    <div style="width: 300px; word-break: break-all">{{ row.message }}</div>
+                                </template>
                                 <el-tag type="danger">{{ $t('commons.status.failed') }}</el-tag>
                             </el-tooltip>
                         </template>

diff --git a/frontend/src/views/container/volume/index.vue b/frontend/src/views/container/volume/index.vue
@@ -45,13 +45,10 @@
                     <el-table-column type="selection" fix />
                     <el-table-column :label="$t('commons.table.name')" min-width="80" prop="name" fix>
                         <template #default="{ row }">
-                            <el-tooltip
-                                v-if="row.name.length > 20"
-                                class="box-item"
-                                effect="dark"
-                                :content="row.name"
-                                placement="top"
-                            >
+                            <el-tooltip v-if="row.name.length > 20" effect="dark" placement="bottom">
+                                <template #content>
+                                    <div style="width: 300px; word-break: break-all">{{ row.name }}</div>
+                                </template>
                                 <el-link @click="onInspect(row.name)" type="primary">
                                     {{ row.name.substring(0, 20) }}...
                                 </el-link>

diff --git a/frontend/src/views/cronjob/index.vue b/frontend/src/views/cronjob/index.vue
@@ -45,7 +45,10 @@
                     <el-table-column type="selection" fix />
                     <el-table-column :label="$t('cronjob.taskName')" :min-width="120" prop="name">
                         <template #default="{ row }">
-                            <el-tooltip effect="dark" :content="row.name" v-if="row.name.length > 12" placement="top">
+                            <el-tooltip effect="dark" v-if="row.name.length > 12" placement="top">
+                                <template #content>
+                                    <div style="width: 300px; word-break: break-all">{{ row.name }}</div>
+                                </template>
                                 <el-link @click="loadDetail(row)" type="primary">
                                     {{ row.name.substring(0, 15) }}...
                                 </el-link>

diff --git a/frontend/src/views/cronjob/record/index.vue b/frontend/src/views/cronjob/record/index.vue
@@ -221,12 +221,12 @@
                                     <template #label>
                                         <span class="status-label">{{ $t('commons.table.status') }}</span>
                                     </template>
-                                    <el-tooltip
-                                        v-if="currentRecord?.status === 'Failed'"
-                                        class="box-item"
-                                        :content="currentRecord?.message"
-                                        placement="top"
-                                    >
+                                    <el-tooltip v-if="currentRecord?.status === 'Failed'" placement="top">
+                                        <template #content>
+                                            <div style="width: 300px; word-break: break-all">
+                                                {{ currentRecord?.message }}
+                                            </div>
+                                        </template>
                                         <el-tag type="danger">{{ $t('commons.table.statusFailed') }}</el-tag>
                                     </el-tooltip>
                                     <el-tag type="success" v-if="currentRecord?.status === 'Success'">

diff --git a/frontend/src/views/setting/snapshot/index.vue b/frontend/src/views/setting/snapshot/index.vue
@@ -63,13 +63,10 @@
                             <el-tag v-if="row.status === 'Uploading'" type="info">
                                 {{ $t('commons.status.uploading') }}...
                             </el-tag>
-                            <el-tooltip
-                                v-if="row.status === 'Failed'"
-                                class="box-item"
-                                effect="dark"
-                                :content="row.message"
-                                placement="top-start"
-                            >
+                            <el-tooltip v-if="row.status === 'Failed'" effect="dark" placement="top">
+                                <template #content>
+                                    <div style="width: 300px; word-break: break-all">{{ row.message }}</div>
+                                </template>
                                 <el-tag type="danger">{{ $t('commons.table.statusFailed') }}</el-tag>
                             </el-tooltip>
                         </template>