fix: Search mode select dropdown + People debug log
This commit is contained in:
@@ -144,6 +144,7 @@ const filteredPeople = computed(() => {
|
||||
onMounted(async () => {
|
||||
try {
|
||||
const result: any = await invoke('get_people', { page: 1, per_page: 1000 })
|
||||
console.log('get_people result:', result, Array.isArray(result), result?.length)
|
||||
people.value = Array.isArray(result) ? result : []
|
||||
} catch (e) {
|
||||
console.error('Failed to load people:', e)
|
||||
|
||||
@@ -1,20 +1,14 @@
|
||||
<template>
|
||||
<div class="search-view">
|
||||
<div class="search-header">
|
||||
<h1>Search</h1>
|
||||
<div class="mode-selector">
|
||||
<button v-for="m in modes" :key="m.value"
|
||||
:class="['mode-btn', { active: mode === m.value }]"
|
||||
@click="mode = m.value">
|
||||
{{ m.label }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<h1>Search</h1>
|
||||
|
||||
<div class="search-bar">
|
||||
<input v-model="query" @keyup.enter="search"
|
||||
placeholder="Enter search query..."
|
||||
:disabled="loading" />
|
||||
<select v-model="mode" class="mode-select">
|
||||
<option v-for="m in modes" :key="m.value" :value="m.value">{{ m.label }}</option>
|
||||
</select>
|
||||
<button class="ms-fm-btn ms-fm-btn-primary" @click="search" :disabled="loading || !query">
|
||||
<span v-if="loading" class="spinner"></span>
|
||||
{{ loading ? 'Searching...' : 'Search' }}
|
||||
@@ -120,16 +114,12 @@ function playVideo(r: any) {
|
||||
|
||||
<style scoped>
|
||||
.search-view { max-width: 900px; }
|
||||
.search-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }
|
||||
h1 { font-size: 1.5rem; }
|
||||
.mode-selector { display: flex; gap: 8px; }
|
||||
.mode-btn { padding: 8px 16px; border: 1.5px solid #d1d5db; background: #fff; border-radius: 10px; cursor: pointer; font-size: 0.85rem; font-weight: 500; transition: all 0.15s; }
|
||||
.mode-btn:hover { background: #f3f4f6; }
|
||||
.mode-btn.active { background: #202124; color: #fff; border-color: #202124; }
|
||||
h1 { font-size: 1.5rem; margin-bottom: 24px; }
|
||||
.search-bar { display: flex; gap: 10px; margin-bottom: 24px; }
|
||||
.search-bar input { flex: 1; padding: 12px 16px; border: 1.5px solid #d1d5db; border-radius: 10px; font-size: 1rem; outline: none; transition: border-color 0.15s; }
|
||||
.search-bar input:focus { border-color: #202124; }
|
||||
.search-bar input:disabled { background: #f3f4f6; }
|
||||
.mode-select { padding: 12px 16px; border: 1.5px solid #d1d5db; border-radius: 10px; font-size: 0.9rem; background: #fff; cursor: pointer; outline: none; }
|
||||
.result-card { display: flex; gap: 16px; background: #fff; border: 1px solid #e8eaed; border-radius: 12px; padding: 16px; margin-bottom: 12px; cursor: pointer; transition: transform 0.15s, box-shadow 0.15s; }
|
||||
.result-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,0.1); }
|
||||
.result-thumb { width: 120px; height: 68px; border-radius: 8px; overflow: hidden; flex-shrink: 0; background: #e8eaed; }
|
||||
|
||||
Reference in New Issue
Block a user