v6ole/qiji
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 历史周报+图片预览+照片管理+导入优化+用户合并

Browse Source 
新增:
- 历史周报: Dashboard/周报详情支持周选择器翻看往周，归档只读
- 图片预览: 全屏大图(移动端+PC端)，点击遮罩关闭
- PC端照片管理: 编辑时可上传/删除照片
- 客户导入改为更新模式: 重名自动更新信息，显示操作明细
- 导入跳过原因: 旧周报导入也显示每条跳过原因

优化:
- 填报进度权限: 经理只看到自己，支局长/领导看全员
- 客户经理暖灰色hash标签列
- 用户去重合并(4组)，数据完整迁移
- CLAUDE.md 更新到最新状态

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
v6ole
2026-06-23 16:59:31 +08:00
parent 8926475b20
commit aa3fbca710
15 changed files with 323 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/App.vue
+19
View File
@@ -258,4 +258,23 @@ h1, h2, h3, h4, h5, h6 {
font-family: 'ZCOOL XiaoWei', STSong, serif;
color: var(--warm-gray);
}
/* ── Image Preview Overlay ── */
.image-preview-overlay {
position: fixed; inset: 0; z-index: 9999;
background: rgba(0,0,0,0.88);
display: flex; align-items: center; justify-content: center;
cursor: zoom-out;
}
.image-preview-full {
max-width: 95vw; max-height: 95vh;
object-fit: contain; cursor: default;
}
.image-preview-close {
position: absolute; top: 16px; right: 16px;
background: rgba(255,255,255,0.15); color: #fff;
border: none; width: 40px; height: 40px; font-size: 20px;
cursor: pointer; border-radius: 50%; transition: background 0.2s;
}
.image-preview-close:hover { background: rgba(255,255,255,0.35); }
</style>
frontend/src/api/dashboard.ts
+4 -4
View File
@@ -1,11 +1,11 @@
import api from './index'
export const dashboardApi = {
getStats() {
return api.get('/dashboard/stats')
getStats(params?: any) {
return api.get('/dashboard/stats', { params })
},
getProgress() {
return api.get('/dashboard/progress')
getProgress(params?: any) {
return api.get('/dashboard/progress', { params })
},
getWeeklyReport(params?: any) {
return api.get('/dashboard/weekly-report', { params })
frontend/src/views/desktop/CustomerManage.vue
+9 -3
View File
@@ -202,7 +202,7 @@ async function handleImport() {
try {
const res = await api.post('/customers/import', fd, { headers: { 'Content-Type': 'multipart/form-data' } })
importResult.value = res.data
ElMessage.success(`导入完成：新增 ${res.data.created} 条，跳过 ${res.data.skipped} 条`)
ElMessage.success(`导入完成：新增 ${res.data.created} 条，更新 ${res.data.updated || 0} 条`)
await loadCustomers()
} catch (e: any) { ElMessage.error('导入失败: ' + (e.response?.data?.detail || e.message)) }
finally { importLoading.value = false }
@@ -384,8 +384,14 @@ async function handleImport() {
</el-form>
<div v-if="importResult" style="margin-top:12px">
<el-alert type="success" :closable="false">
新增 {{ importResult.created }} 条，跳过 {{ importResult.skipped }} 条
<template v-if="importResult.errors?.length"><br/>错误：{{ importResult.errors.join('; ') }}</template>
新增 {{ importResult.created }} 条，更新 {{ importResult.updated || 0 }} 条
<template v-if="importResult.reasons?.length">
<div style="margin-top:8px;font-size:12px;max-height:200px;overflow-y:auto">
<div v-for="(r,i) in importResult.reasons.slice(0,20)" :key="i">• {{ r }}</div>
<div v-if="importResult.reasons.length > 20" style="color:var(--c-text-muted)">...还有 {{ importResult.reasons.length - 20 }} 条</div>
</div>
</template>
<template v-if="importResult.errors?.length"><br/>⚠ 错误：{{ importResult.errors.join('; ') }}</template>
</el-alert>
</div>
<template #footer>
frontend/src/views/desktop/Dashboard.vue
+45 -11
View File
@@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { ref, onMounted, computed } from 'vue'
import { useRouter } from 'vue-router'
import { useAuthStore } from '@/stores/auth'
import { dashboardApi } from '@/api/dashboard'
@@ -10,13 +10,37 @@ const auth = useAuthStore()
const loading = ref(false)
const stats = ref({ week_visits: 0, work_plans: 0, mini_business: 0, key_visits: 0, week_start: '', week_end: '' })
const progress = ref<any[]>([])
const weekOffset = ref(0) // 0 = current week, -1 = last week, etc.
onMounted(async () => {
const isHistoricalWeek = computed(() => weekOffset.value < 0)
const weekPickerDate = computed({
get: () => {
const d = new Date()
d.setDate(d.getDate() + weekOffset.value * 7)
return d.toISOString().slice(0, 10)
},
set: (_val: string) => {} // placeholder, actual change via buttons
})
function changeWeek(delta: number) {
weekOffset.value += delta
loadData()
}
function goCurrentWeek() {
weekOffset.value = 0
loadData()
}
async function loadData() {
loading.value = true
try {
const refDate = new Date()
refDate.setDate(refDate.getDate() + weekOffset.value * 7)
const refStr = refDate.toISOString().slice(0, 10)
const [sRes, pRes] = await Promise.all([
dashboardApi.getStats(),
dashboardApi.getProgress(),
dashboardApi.getStats({ reference_date: refStr }),
dashboardApi.getProgress({ reference_date: refStr }),
])
stats.value = sRes.data
progress.value = pRes.data
@@ -25,7 +49,9 @@ onMounted(async () => {
} finally {
loading.value = false
}
})
}
onMounted(loadData)
function goWeeklyReport(managerId?: string) {
if (managerId) router.push({ path: '/weekly-report', query: { manager_id: managerId } })
@@ -44,7 +70,13 @@ function rowState(p: any): 'full' | 'catching' | 'missing' {
<!-- ═══ Editorial Page Header ═══ -->
<div class="page-head">
<h2 class="page-title">仪表盘</h2>
<p class="page-sub">{{ stats.week_start }} — {{ stats.week_end }}</p>
<div class="week-nav">
<button class="week-nav-btn" @click="changeWeek(-1)" title="上一周">◀</button>
<span class="week-label">{{ stats.week_start }} — {{ stats.week_end }}</span>
<button class="week-nav-btn" @click="changeWeek(1)" :disabled="weekOffset >= 0" title="下一周">▶</button>
<button v-if="isHistoricalWeek" class="week-nav-reset" @click="goCurrentWeek">回到本周</button>
<el-tag v-if="isHistoricalWeek" type="info" size="small" style="margin-left:8px">📦 历史归档 · 只读</el-tag>
</div>
<div class="page-rule"></div>
</div>
@@ -182,11 +214,13 @@ function rowState(p: any): 'full' | 'catching' | 'missing' {
font-size: 22px; font-weight: 400;
color: var(--ink); letter-spacing: 0.06em;
}
.page-sub {
margin: 2px 0 0;
font-family: 'JetBrains Mono', 'SF Mono', monospace;
font-size: 11px; color: var(--gold); letter-spacing: 0.08em;
}
.week-nav { display: flex; align-items: center; gap: 10px; margin: 6px 0 4px; }
.week-nav-btn { background: var(--surface); border: 1px solid var(--warm-border); padding: 4px 10px; cursor: pointer; color: var(--warm-gray); font-size: 12px; }
.week-nav-btn:hover:not(:disabled) { color: var(--ink); border-color: var(--ink); }
.week-nav-btn:disabled { opacity: 0.3; cursor: not-allowed; }
.week-label { font-family: 'JetBrains Mono', 'SF Mono', monospace; font-size: 12px; color: var(--ink); letter-spacing: 0.04em; }
.week-nav-reset { background: none; border: 1px solid var(--gold); color: var(--gold); padding: 4px 10px; cursor: pointer; font-size: 12px; }
.week-nav-reset:hover { background: var(--gold); color: #fff; }
.page-rule { width: 32px; height: 3px; background: var(--gold); margin-top: 12px; }
/* ═══ Stat Grid ═══ */
frontend/src/views/desktop/ManagerWorkspace.vue
+101
View File
@@ -16,6 +16,10 @@ const customers = ref<any[]>([])
const allUsers = ref<any[]>([])
const plannedVisitors = ref<string[]>([])
const dialogTimeRange = ref<any>(null)
const previewImageUrl = ref('')
const uploading = ref(false)
const previewDialogVisible = ref(false)
const photoUrls = ref<Record<string, string>>({})
const dialogVisible = ref(false)
const dialogMode = ref<'create' | 'edit'>('create')
@@ -66,6 +70,19 @@ async function loadAll() {
visits.value = v.data; workPlans.value = w.data
miniBusiness.value = m.data; dailyNotes.value = d.data
keyVisits.value = k.data
// Load photo previews
for (const visit of visits.value) {
if (visit.photos?.length) {
for (const key of visit.photos) {
if (!photoUrls.value[key]) {
try {
const urlRes = await api.get('/upload/download-url', { params: { object_key: key } })
photoUrls.value[key] = urlRes.data.download_url
} catch (_) {}
}
}
}
}
} catch (e: any) { ElMessage.error('加载失败') }
finally { loading.value = false }
}
@@ -92,9 +109,62 @@ function openEdit(type: string, item: any) {
if (type === 'key') {
plannedVisitors.value = item.planned_visitor ? item.planned_visitor.split('、') : []
}
// Load photo URLs for visit editing
if (type === 'visit' && item.photos?.length) {
for (const key of item.photos) {
if (!photoUrls.value[key]) {
api.get('/upload/download-url', { params: { object_key: key } }).then(r => {
photoUrls.value[key] = r.data.download_url
}).catch(() => {})
}
}
}
dialogVisible.value = true
}
function previewPhoto(url: string) { previewImageUrl.value = url; previewDialogVisible.value = true }
async function handleDialogPhotoUpload(event: Event) {
const target = event.target as HTMLInputElement
if (!target.files?.length) return
if ((form.value.photos || []).length >= 9) { ElMessage.warning('最多9张照片'); return }
uploading.value = true
for (const file of Array.from(target.files)) {
if ((form.value.photos || []).length >= 9) break
try {
// Get presigned URL
const presignRes = await api.post('/upload/presigned-url', null, { params: { filename: file.name, content_type: file.type || 'image/jpeg' } })
// Upload directly to MinIO (not through our API)
const axios = (await import('axios')).default
await axios.put(presignRes.data.upload_url, file, { headers: { 'Content-Type': file.type || 'image/jpeg' } })
const key = presignRes.data.object_key
if (!form.value.photos) form.value.photos = []
form.value.photos.push(key)
form.value.photos = [...form.value.photos]
// Load preview
try {
const urlRes = await api.get('/upload/download-url', { params: { object_key: key } })
photoUrls.value[key] = urlRes.data.download_url
} catch (_) {}
} catch (e: any) {
ElMessage.error('上传失败: ' + (e.response?.data?.detail || e.message))
}
}
uploading.value = false
target.value = ''
}
function removePhotoFromEdit(idx: number) {
if (!form.value.photos) return
const key = form.value.photos[idx]
form.value.photos.splice(idx, 1)
form.value.photos = [...form.value.photos]
// Clean up preview URL
if (photoUrls.value[key]) {
delete photoUrls.value[key]
}
}
async function handleSave() {
const t = dialogType.value; const d = form.value
try {
@@ -203,6 +273,12 @@ const notesByDate = computed(() => {
</el-table-column>
<el-table-column prop="visit_method" label="方式" width="60" />
<el-table-column prop="time_range" label="时间" width="100" />
<el-table-column label="照片" width="60">
<template #default="{ row }">
<span v-if="row.photos?.length">📷{{ row.photos.length }}</span>
<span v-else style="color:var(--c-text-muted)">-</span>
</template>
</el-table-column>
<el-table-column prop="communication_content" label="沟通内容" min-width="200" show-overflow-tooltip />
<el-table-column label="操作" width="70">
<template #default="{ row }">
@@ -367,6 +443,23 @@ const notesByDate = computed(() => {
<el-form-item label="拜访人电话"><el-input v-model="form.visitor_phone" placeholder="联系电话（可选）" /></el-form-item>
<el-form-item label="沟通内容"><el-input v-model="form.communication_content" type="textarea" :rows="3" /></el-form-item>
<el-form-item label="客户需求"><el-input v-model="form.customer_demand" type="textarea" :rows="2" /></el-form-item>
<el-form-item v-if="dialogMode === 'edit' && form.photos?.length" label="照片">
<div style="display:flex;gap:8px;flex-wrap:wrap">
<div v-for="(key, idx) in form.photos" :key="key" style="position:relative">
<img :src="photoUrls[key]" style="width:80px;height:80px;object-fit:cover;border:1px solid var(--warm-border);cursor:pointer" v-if="photoUrls[key]" @click.stop="previewPhoto(photoUrls[key])" />
<span v-else style="width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:var(--paper);border:1px solid var(--warm-border);font-size:11px;color:var(--warm-gray)">加载中...</span>
<button type="button" style="position:absolute;top:-6px;right:-6px;background:var(--vermilion);color:#fff;border:none;width:18px;height:18px;font-size:12px;cursor:pointer;line-height:1;border-radius:50%" @click="removePhotoFromEdit(idx)" title="删除照片">×</button>
</div>
</div>
<div style="margin-top:4px;font-size:11px;color:var(--warm-gray)">点击 × 移除照片，点击「保存」提交更改</div>
</el-form-item>
<el-form-item v-if="dialogType === 'visit'" label="添加照片">
<label style="cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px dashed var(--warm-border);color:var(--warm-gray);font-size:13px">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="17 8 12 3 7 8"/><line x1="12" y1="3" x2="12" y2="15"/></svg>
{{ uploading ? '上传中...' : '上传照片（最多9张）' }}
<input type="file" accept="image/*" multiple style="display:none" @change="handleDialogPhotoUpload" />
</label>
</el-form-item>
</template>
<template v-if="dialogType === 'note'">
<el-form-item label="分类"><div style="display:flex;flex-wrap:wrap;gap:6px"><el-button v-for="c in categories" :key="c" :type="form.category===c?'primary':''" size="small" @click="form.category=c">{{ c }}</el-button></div></el-form-item>
@@ -408,6 +501,14 @@ const notesByDate = computed(() => {
<el-button type="primary" @click="handleSave">保存</el-button>
</template>
</el-dialog>
<!-- Image Preview -->
<teleport to="body">
<div v-if="previewDialogVisible" class="image-preview-overlay" @click="previewDialogVisible = false">
<img :src="previewImageUrl" class="image-preview-full" @click.stop />
<button class="image-preview-close" @click="previewDialogVisible = false">✕</button>
</div>
</teleport>
</div>
</template>
frontend/src/views/desktop/Settings.vue
+8
View File
@@ -179,6 +179,14 @@ async function handleImportPreview() {
<div v-if="importResult" style="margin-top:12px">
<el-alert type="success" :closable="false">
导入完成：拜访 {{ importResult.visits }} 条，跳过 {{ importResult.skipped }} 条
<template v-if="importResult.skip_reasons?.length">
<div style="margin-top:8px; font-size:12px; max-height:200px; overflow-y:auto">
<div v-for="(r, i) in importResult.skip_reasons.slice(0, 20)" :key="i">• {{ r }}</div>
<div v-if="importResult.skip_reasons.length > 20" style="color:var(--c-text-muted)">
...还有 {{ importResult.skip_reasons.length - 20 }} 条
</div>
</div>
</template>
</el-alert>
</div>
</el-card>
frontend/src/views/desktop/WeeklyReport.vue
+29 -7
View File
@@ -14,6 +14,9 @@ const activeTab = ref('visits')
const filterManagerId = ref('')
const filterCustomerId = ref('')
const managers = ref<any[]>([])
const weekOffset = ref(0)
const isHistoricalWeek = computed(() => weekOffset.value < 0)
const report = ref({
week_start: '', week_end: '',
@@ -37,12 +40,22 @@ onMounted(async () => {
} catch (_) {}
})
function changeWeek(delta: number) { weekOffset.value += delta; loadReport() }
function goCurrentWeek() { weekOffset.value = 0; loadReport() }
function getRefDate(): string {
const d = new Date()
d.setDate(d.getDate() + weekOffset.value * 7)
return d.toISOString().slice(0, 10)
}
async function loadReport() {
loading.value = true
try {
const params: any = {}
if (filterManagerId.value) params.manager_id = filterManagerId.value
if (filterCustomerId.value) params.customer_id = filterCustomerId.value
params.reference_date = getRefDate()
const res = await dashboardApi.getWeeklyReport(params)
report.value = res.data
for (const v of report.value.visits) {
@@ -66,7 +79,7 @@ async function loadReport() {
async function handleExport() {
try {
const res = await api.get('/export/weekly-report', { responseType: 'blob' })
const res = await api.get('/export/weekly-report', { params: { reference_date: getRefDate() }, responseType: 'blob' })
const url = URL.createObjectURL(res.data)
const a = document.createElement('a')
a.href = url; a.download = 'weekly_report.xlsx'; a.click()
@@ -108,7 +121,13 @@ const notesByDate = computed(() => {
<div class="page-head-row">
<div>
<h2 class="page-title">周报详情</h2>
<p class="page-sub">{{ report.week_start }} — {{ report.week_end }}</p>
<div class="week-nav">
<button class="week-nav-btn" @click="changeWeek(-1)">◀</button>
<span class="week-label">{{ report.week_start }} — {{ report.week_end }}</span>
<button class="week-nav-btn" @click="changeWeek(1)" :disabled="weekOffset >= 0">▶</button>
<button v-if="isHistoricalWeek" class="week-nav-reset" @click="goCurrentWeek">回到本周</button>
<el-tag v-if="isHistoricalWeek" type="info" size="small">📦 已归档</el-tag>
</div>
</div>
<div>
<el-button v-if="auth.isDirector" type="success" @click="handleExport">
@@ -271,11 +290,14 @@ const notesByDate = computed(() => {
font-size: 22px; font-weight: 400;
color: var(--ink); letter-spacing: 0.06em;
}
.page-sub {
margin: 2px 0 0;
font-family: 'JetBrains Mono', 'SF Mono', monospace;
font-size: 11px; color: var(--gold); letter-spacing: 0.08em;
}
.week-nav { display: flex; align-items: center; gap: 8px; margin: 4px 0 6px; }
.week-nav-btn { background: var(--surface); border: 1px solid var(--warm-border); padding: 3px 8px; cursor: pointer; color: var(--warm-gray); font-size: 12px; }
.week-nav-btn:hover:not(:disabled) { color: var(--ink); border-color: var(--ink); }
.week-nav-btn:disabled { opacity: 0.3; cursor: not-allowed; }
.week-label { font-family: 'JetBrains Mono', 'SF Mono', monospace; font-size: 12px; color: var(--ink); }
.week-nav-reset { background: none; border: 1px solid var(--gold); color: var(--gold); padding: 3px 8px; cursor: pointer; font-size: 12px; }
.week-nav-reset:hover { background: var(--gold); color: #fff; }
.page-rule { width: 32px; height: 3px; background: var(--gold); margin-top: 12px; }
/* ═══ Content ═══ */
frontend/src/views/mobile/Home.vue
+12 -1
View File
@@ -11,6 +11,8 @@ const todayVisitCount = ref(0)
const visits = ref<any[]>([])
const todayNoteCount = ref(0)
const dailyNotes = ref<any[]>([])
const previewImageUrl = ref('')
const previewDialogVisible = ref(false)
const photoUrls = ref<Record<string, string>>({})
const loading = ref(false)
@@ -52,6 +54,8 @@ async function loadToday() {
} finally { loading.value = false }
}
function previewPhoto(url: string) { previewImageUrl.value = url; previewDialogVisible.value = true }
onMounted(loadToday)
</script>
@@ -174,7 +178,7 @@ onMounted(loadToday)
<span class="demand-marker">◆</span> {{ v.customer_demand }}
</p>
<div v-if="v.photos?.length" class="record-photos">
<img v-for="key in v.photos" :key="key" :src="photoUrls[key] || ''" class="record-photo" />
<img v-for="key in v.photos" :key="key" :src="photoUrls[key] || ''" class="record-photo" @click.stop="previewPhoto(photoUrls[key])" />
</div>
<div class="record-footer" v-if="v.time_range">
<span class="record-time">{{ v.time_range }}</span>
@@ -190,6 +194,13 @@ onMounted(loadToday)
<p class="empty-hint">点击上方按钮开始填报</p>
</div>
</div>
<teleport to="body">
<div v-if="previewDialogVisible" class="image-preview-overlay" @click="previewDialogVisible = false">
<img :src="previewImageUrl" class="image-preview-full" @click.stop />
<button class="image-preview-close" @click="previewDialogVisible = false">✕</button>
</div>
</teleport>
</div>
</template>
frontend/src/views/mobile/VisitForm.vue
+16 -1
View File
@@ -34,6 +34,8 @@ const customers = ref<any[]>([])
const managers = ref<any[]>([])
const uploadedPhotos = ref<string[]>([])
const photoPreviews = ref<string[]>([])
const previewDialogVisible = ref(false)
const previewImageUrl = ref('')
const uploading = ref(false)
const customerSearch = ref('')
@@ -136,6 +138,11 @@ function onTimeRangeChange(val: [string, string] | null) {
form.value.time_range = val ? val.join('-') : ''
}
function previewPhoto(url: string) {
previewImageUrl.value = url
previewDialogVisible.value = true
}
function removePhoto(index: number) {
if (index < photoPreviews.value.length) {
URL.revokeObjectURL(photoPreviews.value[index])
@@ -301,7 +308,7 @@ async function handleDelete() {
</template>
<div class="photo-area">
<div v-for="(key, idx) in uploadedPhotos" :key="key" class="photo-item">
<img :src="photoPreviews[idx]" class="photo-thumb" v-if="photoPreviews[idx]" />
<img :src="photoPreviews[idx]" class="photo-thumb" v-if="photoPreviews[idx]" @click.stop="previewPhoto(photoPreviews[idx])" />
<span class="photo-label">照片{{ idx + 1 }}</span>
<button type="button" class="photo-remove-btn" @click="removePhoto(idx)">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
@@ -338,6 +345,14 @@ async function handleDelete() {
</button>
</div>
</el-form>
<!-- Image Preview Dialog -->
<teleport to="body">
<div v-if="previewDialogVisible" class="image-preview-overlay" @click="previewDialogVisible = false">
<img :src="previewImageUrl" class="image-preview-full" @click.stop />
<button class="image-preview-close" @click="previewDialogVisible = false">✕</button>
</div>
</teleport>
</div>
</template>