Compare commits

..

4 Commits

Author SHA1 Message Date
Li1304553726 8c3bfc9b4a 1 2025-11-17 19:35:22 +08:00
Li1304553726 bfeea2dc3f 1 2025-11-17 19:31:25 +08:00
Li1304553726 8bd719f564 1 2025-11-17 19:30:23 +08:00
Li1304553726 aa2a0e63a0 1 2025-11-17 19:28:54 +08:00
3 changed files with 60 additions and 782 deletions

View File

@ -45,8 +45,6 @@ function WeatherIcon({ description, isDay, className = "w-16 h-16 md:w-20 md:h-2
} }
return isDaytime ? <Sun className={className} /> : <Moon className={className} />; return isDaytime ? <Sun className={className} /> : <Moon className={className} />;
} }
export function WeatherDisplay(){ export function WeatherDisplay(){
const {currentWeather} = useWeatherStore(); const {currentWeather} = useWeatherStore();
if(!currentWeather) return null; if(!currentWeather) return null;

View File

@ -8,10 +8,8 @@ import { useWeatherStore } from '@/store/weatherStore';
export function WeatherSearchForm() { export function WeatherSearchForm() {
const {isLoading, currentWeather, searchWeather, refreshWeather} = useWeatherStore(); const {isLoading, currentWeather, searchWeather, refreshWeather} = useWeatherStore();
const [city, setCity] = useState(''); const [city, setCity] = useState('');
const [inputError, setInputError] = useState(''); const [inputError, setInputError] = useState('');
const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => { const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {
setCity(e.target.value); setCity(e.target.value);
if (inputError) { if (inputError) {
@ -25,12 +23,10 @@ export function WeatherSearchForm() {
setInputError('请输入城市名称'); setInputError('请输入城市名称');
return; return;
} }
if (trimmedCity.length < 2) { if (trimmedCity.length < 2) {
setInputError('请输入至少2个字符'); setInputError('请输入至少2个字符');
return; return;
} }
if (!/^[a-zA-Z\s]+$/.test(trimmedCity)) { if (!/^[a-zA-Z\s]+$/.test(trimmedCity)) {
setInputError('请输入字母和空格'); setInputError('请输入字母和空格');
return; return;
@ -58,16 +54,10 @@ export function WeatherSearchForm() {
<AlertCircle className="inline w-4 h-4 text-red-500 mt-0.5" /> <AlertCircle className="inline w-4 h-4 text-red-500 mt-0.5" />
<p className="text-red-500 text-xs">{inputError}</p> <p className="text-red-500 text-xs">{inputError}</p>
</div> </div>
) )
} }
<div className='flex gap-2'> <div className='flex gap-2'>
<Button type="submit" disabled={isLoading || !city.trim()} className="mt-4 w-full"> <Button type="submit" disabled={isLoading || !city.trim()} className="mt-4 w-full">
{isLoading ? <> {isLoading ? <>
<Loader2 className="animate-spin w-5 h-5 text-white" /> <Loader2 className="animate-spin w-5 h-5 text-white" />
<span>...</span> <span>...</span>
@ -76,23 +66,15 @@ export function WeatherSearchForm() {
<span></span> <span></span>
</>)} </>)}
</Button> </Button>
{currentWeather && ( {currentWeather && (
<Button type="button" variant="outline" onClick={refreshWeather} disabled={isLoading} className="mt-4 w-full" title='刷新数据'> <Button type="button" variant="outline" onClick={refreshWeather} disabled={isLoading} className="mt-4 w-full" title='刷新数据'>
<RefreshCw className={cn("w-5 h-5", isLoading && "animate-spin")} /> <RefreshCw className={cn("w-5 h-5", isLoading && "animate-spin")} />
</Button> </Button>
)} )}
</div> </div>
</form> </form>
</div> </div>
) )
} }
} }
} }

File diff suppressed because it is too large Load Diff