Auto Commit

src/components/content/index.vue

@@ -24,7 +24,7 @@
                     </span>
                     <button v-if="data?.total === 0" class="bg-green-600 px-2 text-sm hover:bg-green-700 rounded-lg text-gray-100 h-6" @click="showLoadDataDialog=true">添加样例数据</button>
                 </div>
-                <table class="table-auto w-full bg-gray-200 text-left">
+                <table class=" w-full bg-gray-200 text-left">
                     <thead>
                         <tr class="h-10 *:border-b *:border-slate-300 *:pl-2 *:bold">
                             <th >#</th>
@@ -34,14 +34,17 @@
                     </thead>
                     <tbody>
                         <tr v-for="(item, index) in data.list" class="*:h-16 *:border-b *:border-slate-300 *:pl-2 *:hover:bg-gray-300">
-                            <td class="w-[80px]">{{ index + 1 }}</td>
+                            <td class="w-10 md:w-14">{{ index + 1 }}</td>
                             <td>
                                 <textarea class="my-2 w-full bg-gray-100 h-32 max-h-64 border-gray-300 text-slate-600 text-sm" v-model="item.content" maxLength="512"></textarea>
                             </td>
-                            <td class="*:py-1  *:px-4 *:rounded-md *:mr-2 *:text-gray-100 w-[160px]">
+                            <td class="w-16 md:w-24 lg:w-64">
+                                <div class="flex gap-2 flex-col md:flex-row justify-center items-center *:rounded ">
+                                    <button  @click="deleteItem(item)" class="text-gray-100 bg-orange-800 hover:bg-orange-900 w-14 md:w-16"> 删除</button>
+                                    <button  @click="updateItem(item)" class="text-gray-100 bg-slate-700 hover:bg-slate-800 w-14 md:w-16"> 更新</button>
+                                </div>
+                                
                                 
-                                <button  @click="deleteItem(item)" class="bg-orange-800 hover:bg-orange-900 sm:inline"> 删除</button>
-                                <button  @click="updateItem(item)" class="bg-slate-700 hover:bg-slate-800"> 更新</button>
                             </td>
                         </tr>
                     </tbody>