fix table button

This commit is contained in:
Chuck1sn
2025-06-15 17:10:16 +08:00
parent f011086fcf
commit fe3ebdf931
3 changed files with 68 additions and 67 deletions

View File

@@ -1,6 +1,7 @@
<template> <template>
<div class="flex flex-col sm:flex-row sm:justify-between sm:items-center mb-4 gap-y-3 sm:gap-y-0"> <div class="flex flex-col sm:flex-row sm:justify-between sm:items-center mb-4 gap-y-3 sm:gap-y-0">
<form class="w-full min-w-[200px] sm:w-auto flex flex-col xs:flex-row gap-2 xs:gap-3 items-stretch xs:items-center"> <form
class="grid grid-cols-2 sm:grid-cols-1 w-full min-w-[200px] sm:w-auto gap-2 xs:gap-3 items-stretch xs:items-center">
<template v-for="(filter, index) in filters" :key="index"> <template v-for="(filter, index) in filters" :key="index">
<!-- 输入框类型 --> <!-- 输入框类型 -->
<div v-if="filter.type === 'input'" class="flex-grow"> <div v-if="filter.type === 'input'" class="flex-grow">
@@ -32,7 +33,6 @@
</select> </select>
</div> </div>
</template> </template>
<button type="submit" <button type="submit"
class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-3 py-2 min-w-[70px] flex items-center justify-center" class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-3 py-2 min-w-[70px] flex items-center justify-center"
@click.prevent="handleSearch"> @click.prevent="handleSearch">
@@ -45,7 +45,7 @@
</form> </form>
<!-- 额外操作按钮插槽 --> <!-- 额外操作按钮插槽 -->
<div class="w-full sm:w-auto"> <div class="flex justify-end">
<slot name="actions"></slot> <slot name="actions"></slot>
</div> </div>
</div> </div>

View File

@@ -8,12 +8,12 @@
<TableFilterForm :filters="filterConfig" :initialValues="filterValues" @search="handleSearch" <TableFilterForm :filters="filterConfig" :initialValues="filterValues" @search="handleSearch"
@update:values="updateFilterValues"> @update:values="updateFilterValues">
<template #actions> <template #actions>
<Button :handleClick="() => handleUpsertUserClick(undefined)" :isLoading="false" :abortable="false" <TableButton variant="primary" @click="() => handleUpsertUserClick(undefined)">
submitContent="新增用户" class="w-full sm:w-auto">
<template #icon> <template #icon>
<PlusIcon class="w-4 h-4 me-2" /> <PlusIcon class="w-4 h-4 me-2" />
</template> </template>
</Button> 新增用户
</TableButton>
</template> </template>
</TableFilterForm> </TableFilterForm>
@@ -185,6 +185,7 @@ import { useRouter } from "vue-router";
import type { components } from "../api/types/schema"; import type { components } from "../api/types/schema";
import useAlertStore from "../composables/store/useAlertStore"; import useAlertStore from "../composables/store/useAlertStore";
import { useUserUpsert } from "../composables/user/useUserUpsert"; import { useUserUpsert } from "../composables/user/useUserUpsert";
import TableButton from "@/components/TableButton.vue";
const filterConfig: FilterItem[] = [ const filterConfig: FilterItem[] = [
{ {