Merge remote-tracking branch 'origin/master'

src/Manager/components/Carousel.vue

@@ -8,7 +8,7 @@
         </a-space>
     </div>
 
-    <a-table :row-selection="rowSelection" :columns="columns"  :data-source="states.data" :pagination="pagination" :scroll="{ x: 1000, y: 430}" style="width: 85vw;">
+    <a-table :row-selection="rowSelection" :columns="columns"  :data-source="states.data" :pagination="pagination" :scroll="{ x:0,y: 430}" style="width: 85vw;">
 
 
         <template #bodyCell="{ column, record }">
@@ -28,6 +28,13 @@
             <template v-else-if="column.key === 'photo'">
                     <img :src="record.image" alt="" style="width: 50px;height: 50px;text-align: center">
             </template>
+            <template v-else-if="column.key === 'image'">
+                <div :style="ellipsis ? { width: '250px' } : {}" class="image-cell">
+                    <a-tooltip v-if="ellipsis" :title="record.image">
+                        <div class="ellipsis-text">{{ record.image }}</div>
+                    </a-tooltip>
+                </div>
+            </template>
 
         </template>
     </a-table>
@@ -107,6 +114,23 @@
         </a-form-item>
     </a-modal>
 </template>
+<style>
+
+.image-cell {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 3; /* 设置显示的行数 */
+    overflow: hidden;
+}
+
+.ellipsis-text {
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2; /* 设置显示的行数 */
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+</style>
 <script setup>
 import {computed, createVNode, onMounted, reactive, ref} from 'vue';
 import {
@@ -123,6 +147,7 @@ import requests from "../../public/request.js";
 // const onChange = pageNumber => {
 //     console.log('Page: ', pageNumber);
 // };
+const ellipsis = ref(true);
 const open = ref(false);
 const addopen = ref(false);
 
@@ -154,7 +179,7 @@ const columns = [
         dataIndex: 'photo',
         resizable: true,
         width: 150,
-        // maxWidth: 150,
+        maxWidth: 150,
 
     },
     {
@@ -162,20 +187,21 @@ const columns = [
         dataIndex: 'title',
         key: 'title',
         width:150,
-        // maxWidth: 150,
+        maxWidth: 150,
     },
     {
         title: '创建时间',
         dataIndex: 'createdAt',
         key: 'createdAt',
         width:200,
-        // maxWidth: 150,
+        maxWidth: 200,
     },
     {
         title: '图片地址',
         dataIndex: 'image',
         key: 'image',
         width:250,
+        maxWidth: 250
 
     },
     {
@@ -183,14 +209,14 @@ const columns = [
         dataIndex: 'displayOrder',
         key: 'displayOrder',
         width:80,
-        // maxWidth: 80,
+        maxWidth: 80,
     },
     {
         title: '状态',
         key: 'isActive',
         dataIndex: 'isActive',
         width: 80,
-        // maxWidth: 80,
+        maxWidth: 80,
     },
     {
         title: '操作',