chore: fix mobile style

This commit is contained in:
engigu
2025-09-20 18:46:46 +08:00
parent 31a88207bb
commit 369afe8696
3 changed files with 23 additions and 9 deletions
+15 -1
View File
@@ -133,7 +133,21 @@ let clickLogin = async () => {
<CardContent class="grid p-0 md:grid-cols-2">
<form class="p-6 md:p-8">
<div class="flex flex-col gap-6">
<div class="flex flex-col items-center text-center">
<!-- 小屏时显示logo和标题 -->
<div class="flex flex-col items-center text-center md:hidden">
<div class="w-20 h-20 mb-4 flex justify-center items-center bg-white rounded-full shadow-sm">
<img :src="logo" alt="logo" class="w-12 h-12 object-contain" />
</div>
<h1 class="text-2xl font-bold text-gray-900">
欢迎回来
</h1>
<p class="text-sm text-gray-600 mt-1">
{{ slogan }}
</p>
</div>
<!-- 大屏时显示标题 -->
<div class="hidden md:flex flex-col items-center text-center">
<h1 class="text-2xl font-bold">
欢迎回来
</h1>
@@ -131,15 +131,15 @@ onMounted(async () => {
<template>
<div class="p-4 w-full max-w-6xl mx-auto space-y-2">
<div class="flex flex-col sm:flex-row sm:items-center gap-2 sm:gap-4">
<div class="flex-1 sm:flex-initial">
<div class="flex flex-row sm:flex-row sm:items-center gap-2 sm:gap-4 -mx-4 px-4 sm:mx-0 sm:px-0">
<div class="flex-[3] sm:flex-initial min-w-0">
<Input v-model="state.search" placeholder="搜索任务..." class="w-full sm:w-64" @keyup.enter="filterFunc"
@blur="filterFunc" />
</div>
<div class="flex-1 sm:flex-initial">
<div class="flex-[2] sm:flex-initial min-w-0">
<Select v-model="selectedStatus" class="w-full" @update:model-value="filterByStatus">
<SelectTrigger>
<SelectTrigger class="w-full">
<SelectValue placeholder="选择状态" />
</SelectTrigger>
<SelectContent>
@@ -160,15 +160,15 @@ onMounted(async () => {
<template>
<div class="p-4 w-full max-w-6xl mx-auto space-y-2">
<div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-2 sm:gap-4">
<div class="flex flex-col sm:flex-row gap-2 sm:gap-4">
<div class="flex-1 sm:flex-initial">
<div class="flex flex-row sm:flex-row gap-2 sm:gap-4 -mx-4 px-4 sm:mx-0 sm:px-0">
<div class="flex-[3] sm:flex-initial min-w-0">
<Input v-model="state.search" placeholder="搜索发信方式名称..." class="w-full sm:w-64" @keyup.enter="filterFunc"
@blur="filterFunc" />
</div>
<div class="flex-1 sm:flex-initial">
<div class="flex-[2] sm:flex-initial min-w-0">
<Select v-model="selectedChannelType" class="w-full" @update:model-value="filterByChannelType">
<SelectTrigger>
<SelectTrigger class="w-full">
<SelectValue placeholder="选择渠道类型" />
</SelectTrigger>
<SelectContent>