feat: 我的数据页面日期筛选改为月度选择器+新建按钮移至筛选栏
- 替换固定周期(本周/本月/本年)为 el-date-picker type=month - 支持任意月份筛选,选完自动刷新 - 新建按钮移至筛选栏最右侧,与搜索框同行 - 各Tab内移除独立的创建按钮 Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -13,8 +13,9 @@ const activeTab = ref('visits')
|
|||||||
const loading = ref(false)
|
const loading = ref(false)
|
||||||
const allManagers = ref<any[]>([])
|
const allManagers = ref<any[]>([])
|
||||||
|
|
||||||
// Period filter
|
// Date range filter
|
||||||
const period = ref('month')
|
const dateFrom = ref('')
|
||||||
|
const dateTo = ref('')
|
||||||
const searchText = ref('')
|
const searchText = ref('')
|
||||||
const pageSize = ref(25)
|
const pageSize = ref(25)
|
||||||
|
|
||||||
@@ -29,17 +30,7 @@ const page = ref<Record<string, number>>({ visits: 1, notes: 1, plans: 1, mini:
|
|||||||
const total = ref<Record<string, number>>({ visits: 0, notes: 0, plans: 0, mini: 0, key: 0 })
|
const total = ref<Record<string, number>>({ visits: 0, notes: 0, plans: 0, mini: 0, key: 0 })
|
||||||
|
|
||||||
function getDateRange() {
|
function getDateRange() {
|
||||||
const now = new Date()
|
return { from: dateFrom.value, to: dateTo.value }
|
||||||
const today = now.toISOString().slice(0, 10)
|
|
||||||
if (period.value === 'week') {
|
|
||||||
const d = new Date(now); d.setDate(d.getDate() - d.getDay() + 1)
|
|
||||||
return { from: d.toISOString().slice(0, 10), to: today }
|
|
||||||
} else if (period.value === 'month') {
|
|
||||||
return { from: `${now.getFullYear()}-${String(now.getMonth()+1).padStart(2,'0')}-01`, to: today }
|
|
||||||
} else if (period.value === 'year') {
|
|
||||||
return { from: `${now.getFullYear()}-01-01`, to: today }
|
|
||||||
}
|
|
||||||
return { from: '', to: '' }
|
|
||||||
}
|
}
|
||||||
const customers = ref<any[]>([])
|
const customers = ref<any[]>([])
|
||||||
const allUsers = ref<any[]>([])
|
const allUsers = ref<any[]>([])
|
||||||
@@ -165,7 +156,7 @@ async function loadAll() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function onTabChange(tab: string) { activeTab.value = tab; loadAll() }
|
function onTabChange(tab: string) { activeTab.value = tab; loadAll() }
|
||||||
function onPeriodChange() { Object.keys(page.value).forEach(k => page.value[k] = 1); loadAll() }
|
function onFilterChange() { Object.keys(page.value).forEach(k => page.value[k] = 1); loadAll() }
|
||||||
function onPageChange(tabKey: string, p: number) { page.value[tabKey] = p; loadAll() }
|
function onPageChange(tabKey: string, p: number) { page.value[tabKey] = p; loadAll() }
|
||||||
function onSizeChange() { Object.keys(page.value).forEach(k => page.value[k] = 1); loadAll() }
|
function onSizeChange() { Object.keys(page.value).forEach(k => page.value[k] = 1); loadAll() }
|
||||||
|
|
||||||
@@ -360,15 +351,12 @@ const notesByDate = computed(() => {
|
|||||||
<!-- Filter Bar -->
|
<!-- Filter Bar -->
|
||||||
<div class="filter-bar">
|
<div class="filter-bar">
|
||||||
<div class="filter-row">
|
<div class="filter-row">
|
||||||
<el-radio-group v-model="period" @change="onPeriodChange" size="small">
|
<el-date-picker v-model="dateFrom" type="month" placeholder="开始月份" size="small" style="width:140px" value-format="YYYY-MM-DD" @change="onFilterChange" />
|
||||||
<el-radio-button value="week">本周</el-radio-button>
|
<span style="color:var(--warm-gray);font-size:13px">至</span>
|
||||||
<el-radio-button value="month">本月</el-radio-button>
|
<el-date-picker v-model="dateTo" type="month" placeholder="结束月份" size="small" style="width:140px" value-format="YYYY-MM-DD" @change="onFilterChange" />
|
||||||
<el-radio-button value="year">本年</el-radio-button>
|
<el-button v-if="dateFrom || dateTo" size="small" @click="dateFrom='';dateTo='';onFilterChange()">清除</el-button>
|
||||||
<el-radio-button value="all">全部</el-radio-button>
|
<el-input v-model="searchText" placeholder="搜索..." clearable size="small" style="width:180px" @keyup.enter="onFilterChange" @clear="onFilterChange" />
|
||||||
</el-radio-group>
|
<el-button type="primary" size="small" @click="openCreate(activeTab === 'notes' ? 'note' : activeTab === 'plans' ? 'plan' : activeTab === 'mini' ? 'mini' : activeTab === 'key' ? 'key' : 'visit')" style="margin-left:auto">+ 新建</el-button>
|
||||||
<el-input v-model="searchText" placeholder="搜索..." clearable size="small" style="width:200px" @keyup.enter="onPeriodChange" @clear="onPeriodChange">
|
|
||||||
<template #append><el-button @click="onPeriodChange" :icon="'Search'">🔍</el-button></template>
|
|
||||||
</el-input>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -376,8 +364,7 @@ const notesByDate = computed(() => {
|
|||||||
<el-tabs v-model="activeTab" @tab-change="onTabChange">
|
<el-tabs v-model="activeTab" @tab-change="onTabChange">
|
||||||
<!-- ═══ 拜访记录 ═══ -->
|
<!-- ═══ 拜访记录 ═══ -->
|
||||||
<el-tab-pane label="拜访记录" name="visits">
|
<el-tab-pane label="拜访记录" name="visits">
|
||||||
<div style="margin-bottom:12px"><el-button type="primary" size="small" @click="openCreate('visit')">+ 新建拜访</el-button></div>
|
<div v-for="[date, items] in visitsByDate" :key="date" class="date-group">
|
||||||
<div v-for="[date, items] in visitsByDate" :key="date" class="date-group">
|
|
||||||
<h4 class="date-title">
|
<h4 class="date-title">
|
||||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="margin-right:4px; color: var(--gold)">
|
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="margin-right:4px; color: var(--gold)">
|
||||||
<rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line>
|
<rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line>
|
||||||
@@ -409,7 +396,6 @@ const notesByDate = computed(() => {
|
|||||||
|
|
||||||
<!-- ═══ 今日纪要 ═══ -->
|
<!-- ═══ 今日纪要 ═══ -->
|
||||||
<el-tab-pane label="今日纪要" name="daily_notes">
|
<el-tab-pane label="今日纪要" name="daily_notes">
|
||||||
<div style="margin-bottom:12px"><el-button type="primary" size="small" @click="openCreate('note')">+ 新建纪要</el-button></div>
|
|
||||||
<div v-for="[date, items] in notesByDate" :key="date" class="date-group">
|
<div v-for="[date, items] in notesByDate" :key="date" class="date-group">
|
||||||
<h4 class="date-title">
|
<h4 class="date-title">
|
||||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="margin-right:4px; color: var(--gold)">
|
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="margin-right:4px; color: var(--gold)">
|
||||||
@@ -435,7 +421,6 @@ const notesByDate = computed(() => {
|
|||||||
|
|
||||||
<!-- ═══ 工作计划 ═══ -->
|
<!-- ═══ 工作计划 ═══ -->
|
||||||
<el-tab-pane label="工作计划" name="work_plans">
|
<el-tab-pane label="工作计划" name="work_plans">
|
||||||
<div style="margin-bottom:12px"><el-button type="primary" size="small" @click="openCreate('plan')">+ 新建计划</el-button></div>
|
|
||||||
<el-table :data="workPlans" stripe size="small" v-column-resize>
|
<el-table :data="workPlans" stripe size="small" v-column-resize>
|
||||||
<el-table-column prop="customer_name" label="客户" width="130">
|
<el-table-column prop="customer_name" label="客户" width="130">
|
||||||
<template #default="{ row }"><el-link type="primary" :underline="false" @click="openEdit('plan', row)">{{ row.customer_name }}</el-link></template>
|
<template #default="{ row }"><el-link type="primary" :underline="false" @click="openEdit('plan', row)">{{ row.customer_name }}</el-link></template>
|
||||||
@@ -467,7 +452,6 @@ const notesByDate = computed(() => {
|
|||||||
|
|
||||||
<!-- ═══ 小微商机 ═══ -->
|
<!-- ═══ 小微商机 ═══ -->
|
||||||
<el-tab-pane label="小微商机" name="mini_biz">
|
<el-tab-pane label="小微商机" name="mini_biz">
|
||||||
<div style="margin-bottom:12px"><el-button type="primary" size="small" @click="openCreate('mini')">+ 新建商机</el-button></div>
|
|
||||||
<el-table :data="miniBusiness" stripe size="small" v-column-resize>
|
<el-table :data="miniBusiness" stripe size="small" v-column-resize>
|
||||||
<el-table-column prop="customer_name" label="客户" width="130">
|
<el-table-column prop="customer_name" label="客户" width="130">
|
||||||
<template #default="{ row }"><el-link type="primary" :underline="false" @click="openEdit('mini', row)">{{ row.customer_name }}</el-link></template>
|
<template #default="{ row }"><el-link type="primary" :underline="false" @click="openEdit('mini', row)">{{ row.customer_name }}</el-link></template>
|
||||||
@@ -501,7 +485,6 @@ const notesByDate = computed(() => {
|
|||||||
|
|
||||||
<!-- ═══ 要客拜访 ═══ -->
|
<!-- ═══ 要客拜访 ═══ -->
|
||||||
<el-tab-pane label="要客拜访" name="key_visits">
|
<el-tab-pane label="要客拜访" name="key_visits">
|
||||||
<div style="margin-bottom:12px"><el-button type="primary" size="small" @click="openCreate('key')">+ 新建要客拜访</el-button></div>
|
|
||||||
<el-table :data="keyVisits" stripe size="small" v-column-resize>
|
<el-table :data="keyVisits" stripe size="small" v-column-resize>
|
||||||
<el-table-column prop="customer_name" label="客户" width="130">
|
<el-table-column prop="customer_name" label="客户" width="130">
|
||||||
<template #default="{ row }"><el-link type="primary" :underline="false" @click="openEdit('key', row)">{{ row.customer_name }}</el-link></template>
|
<template #default="{ row }"><el-link type="primary" :underline="false" @click="openEdit('key', row)">{{ row.customer_name }}</el-link></template>
|
||||||
|
|||||||
Reference in New Issue
Block a user