+
-
+
([])
const total = ref(0)
@@ -155,23 +158,42 @@ function formatTime(iso: string): string {
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
}
+function formatTimeShort(iso: string): string {
+ if (!iso) return '-'
+ const d = new Date(iso)
+ const now = new Date()
+ const sameYear = d.getFullYear() === now.getFullYear()
+ return sameYear
+ ? `${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')} ${String(d.getHours()).padStart(2, '0')}:${String(d.getMinutes()).padStart(2, '0')}`
+ : `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')} ${String(d.getHours()).padStart(2, '0')}:${String(d.getMinutes()).padStart(2, '0')}`
+}
+
function reset() {
typeFilter.value = ''
operatorFilter.value = ''
timeRange.value = null
}
+
+// 手机端筛选抽屉
+const filterOpen = ref(false)
+function openFilter() { filterOpen.value = true }
+function closeFilter() { filterOpen.value = false }
+function applyAndClose() {
+ closeFilter()
+ load()
+}
-
+
操作日志
- -
-
+
+
-
- ([])
const total = ref(0)
@@ -103,10 +106,33 @@ async function handleDelete(p: Position) {
if (e !== 'cancel') ElMessage.error(e?.message || '删除失败')
}
}
+
+// 手机端操作弹层
+const mobileActionPos = ref(null)
+const mobileActionOpen = ref(false)
+function openMobileActions(p: Position) {
+ mobileActionPos.value = p
+ mobileActionOpen.value = true
+}
+function closeMobileActions() {
+ mobileActionOpen.value = false
+}
+function mobileEdit() {
+ if (!mobileActionPos.value) return
+ const p = mobileActionPos.value
+ closeMobileActions()
+ openEdit(p)
+}
+async function mobileDelete() {
+ if (!mobileActionPos.value) return
+ const p = mobileActionPos.value
+ closeMobileActions()
+ await handleDelete(p)
+}
-
+
+
+
+
+
+
+
+
+
@@ -272,6 +412,10 @@ function reset() {
padding: $space-3 $space-4;
}
+.filter-type { width: 160px; }
+.filter-operator { width: 180px; }
+.filter-time { width: 360px; }
+
.table-card {
padding: 0;
overflow: hidden;
@@ -290,4 +434,130 @@ function reset() {
color: $color-text-tertiary;
border-top: 1px solid $color-border;
}
-
\ No newline at end of file
+
+/* ============ 移动端（≤767px） ============ */
+@media (max-width: 767px) {
+ .logs-page.page-container {
+ padding: $space-3;
+ min-height: auto;
+ }
+ .logs-page .page-title {
+ font-size: 20px;
+ margin-bottom: $space-3;
+ }
+ .mobile-filter-bar {
+ display: flex;
+ align-items: center;
+ gap: $space-3;
+ padding: $space-3;
+ margin-bottom: $space-3;
+ }
+ .mobile-filter-tags {
+ flex: 1;
+ display: flex;
+ flex-wrap: wrap;
+ gap: 6px;
+ align-items: center;
+ }
+
+ .mobile-list {
+ display: flex;
+ flex-direction: column;
+ gap: $space-3;
+ }
+ .log-card {
+ background: var(--app-card, $color-card);
+ border-radius: 10px;
+ padding: $space-3 $space-4;
+ box-shadow: $shadow-1;
+ border: 1px solid var(--app-border, $color-border);
+ }
+ .log-card-head {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: $space-2;
+ }
+ .log-card-time {
+ font-size: 12px;
+ color: $color-text-tertiary;
+ }
+ .log-card-body {
+ display: flex;
+ flex-direction: column;
+ gap: 6px;
+ }
+ .log-card-row {
+ display: flex;
+ align-items: flex-start;
+ font-size: 13px;
+ }
+ .meta-label {
+ width: 64px;
+ color: $color-text-tertiary;
+ flex-shrink: 0;
+ }
+ .meta-value {
+ flex: 1;
+ color: $color-text-primary;
+ word-break: break-all;
+ }
+ .mobile-empty {
+ background: var(--app-card, $color-card);
+ border-radius: 10px;
+ padding: $space-4;
+ }
+ .mobile-pagination {
+ margin-top: $space-3;
+ display: flex;
+ justify-content: center;
+ :deep(.el-pagination) {
+ flex-wrap: wrap;
+ justify-content: center;
+ }
+ }
+ .mobile-total {
+ margin-top: $space-3;
+ text-align: center;
+ font-size: 12px;
+ color: $color-text-tertiary;
+ }
+}
+
+/* 移动端筛选抽屉复写样式 */
+:deep(.mobile-filter-drawer .el-drawer__body) {
+ padding: 0;
+}
+.filter-drawer-header {
+ padding: $space-4;
+ border-bottom: 1px solid $color-border;
+}
+.filter-drawer-title {
+ font-size: 16px;
+ font-weight: 600;
+ color: $color-text-primary;
+}
+.filter-drawer-body {
+ padding: $space-4;
+ display: flex;
+ flex-direction: column;
+ gap: $space-4;
+}
+.filter-drawer-item {
+ display: flex;
+ flex-direction: column;
+ gap: $space-2;
+}
+.filter-drawer-label {
+ font-size: 13px;
+ color: $color-text-secondary;
+}
+.full-width { width: 100%; }
+.filter-drawer-footer {
+ padding: $space-3 $space-4;
+ border-top: 1px solid $color-border;
+ display: flex;
+ gap: $space-3;
+ :deep(.el-button) { flex: 1; }
+}
+
diff --git a/frontend/src/views/admin/Overview.vue b/frontend/src/views/admin/Overview.vue
index 77b98d04271e6fa8878966b06b01e16e8b9b75c4..5fec6e10671a2300c363ba51a3b7eea206fa945a 100644
--- a/frontend/src/views/admin/Overview.vue
+++ b/frontend/src/views/admin/Overview.vue
@@ -240,4 +240,56 @@ function formatDate(iso: string): string {
font-size: $font-size-caption;
color: $color-text-tertiary;
}
+
+/* ============ 移动端适配（≤767px） ============ */
+/* 策略：仅调整布局密度与字号，PC 端样式完全不变 */
+@media (max-width: 767px) {
+ .overview-page.page-container {
+ padding: $space-3;
+ min-height: auto;
+ }
+ .overview-page .page-title {
+ font-size: 20px;
+ margin-bottom: $space-3;
+ }
+ /* 基本信息：2 列 → 1 列 */
+ .basic-card {
+ grid-template-columns: 1fr;
+ gap: $space-3;
+ padding: $space-4;
+ margin-bottom: $space-3;
+ }
+ /* 统计卡片：3 列 → 2 列（390 屏宽 2 列比 1 列堆叠更美观） */
+ .stats-grid {
+ grid-template-columns: repeat(2, 1fr);
+ gap: $space-3;
+ margin-bottom: $space-3;
+ }
+ .stat-card {
+ padding: $space-3;
+ gap: $space-3;
+ }
+ .stat-icon {
+ width: 40px;
+ height: 40px;
+ font-size: 20px;
+ flex-shrink: 0;
+ }
+ .stat-value {
+ font-size: 20px;
+ line-height: 28px;
+ }
+ .stat-label {
+ /* 长 label（"在职员工" 4 字）在窄列里会被压缩 overflow hidden */
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ .recent-card {
+ padding: $space-4;
+ }
+ .recent-item {
+ padding: $space-2 0;
+ }
+}
\ No newline at end of file
diff --git a/frontend/src/views/admin/Positions.vue b/frontend/src/views/admin/Positions.vue
index c9fc39450b672219a3cca73ee6f8217a8af3403c..9a6726ab70a521af536c8b5ed6032845804b72ed 100644
--- a/frontend/src/views/admin/Positions.vue
+++ b/frontend/src/views/admin/Positions.vue
@@ -2,8 +2,11 @@
import { onMounted, ref, watch } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import * as adminApi from '@/api/admin'
+import { useBreakpoint } from '@/composables/useBreakpoint'
import type { Position } from '@/types/user'
+const { isMobile } = useBreakpoint()
+
const loading = ref(false)
const list = ref
+
+
+
+
+
+
+
+
+
+
+
+ {{ OperationTypeLabelMap[apiToType(row.operationType)] }}
+
+ {{ formatTimeShort(row.createdAt) }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 共 {{ total }} 条记录
+
+
+ 筛选日志
+
+
+
+
+
+
+
+ 操作类型
+
+
+
+
+ 操作人
+
+
+ 时间范围
+
+
+
+
+
@@ -198,7 +313,7 @@ async function handleDelete(p: Position) {
show-word-limit
/>
-
+
取消
@@ -221,6 +336,10 @@ async function handleDelete(p: Position) {
padding: $space-3 $space-4;
}
+.toolbar-input {
+ width: 280px;
+}
+
.table-card {
padding: 0;
overflow: hidden;
@@ -231,4 +350,132 @@ async function handleDelete(p: Position) {
display: flex;
justify-content: flex-end;
}
-
\ No newline at end of file
+
+.total-row {
+ padding: $space-3 $space-5;
+ text-align: right;
+ font-size: $font-size-caption;
+ color: $color-text-tertiary;
+ border-top: 1px solid $color-border;
+}
+
+/* ============ 移动端（≤767px） ============ */
+@media (max-width: 767px) {
+ .pos-page.page-container {
+ padding: $space-3;
+ min-height: auto;
+ }
+ .pos-page .page-title {
+ font-size: 20px;
+ margin-bottom: $space-3;
+ }
+ .toolbar {
+ flex-direction: column;
+ align-items: stretch;
+ gap: $space-3;
+ padding: $space-3;
+ margin-bottom: $space-3;
+ }
+ .toolbar-input {
+ width: 100%;
+ }
+ .toolbar :deep(.el-button) {
+ width: 100%;
+ }
+
+ .mobile-list {
+ display: flex;
+ flex-direction: column;
+ gap: $space-3;
+ }
+ .pos-card {
+ background: var(--app-card, $color-card);
+ border-radius: 10px;
+ padding: $space-3 $space-4;
+ box-shadow: $shadow-1;
+ border: 1px solid var(--app-border, $color-border);
+ cursor: pointer;
+ }
+ .pos-card-top {
+ display: flex;
+ align-items: center;
+ gap: $space-3;
+ }
+ .pos-card-icon {
+ width: 40px;
+ height: 40px;
+ border-radius: $radius-md;
+ background: $color-primary-light;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 20px;
+ flex-shrink: 0;
+ }
+ .pos-card-id { flex: 1; min-width: 0; }
+ .pos-card-name {
+ font-size: 16px;
+ font-weight: 600;
+ color: $color-text-primary;
+ display: flex;
+ align-items: center;
+ gap: $space-2;
+ }
+ .pos-card-sub {
+ font-size: 12px;
+ color: $color-text-tertiary;
+ margin-top: 2px;
+ }
+ .pos-card-arrow {
+ color: $color-text-tertiary;
+ flex-shrink: 0;
+ }
+ .pos-card-meta {
+ margin-top: $space-3;
+ padding-top: $space-3;
+ border-top: 1px solid $color-border;
+ display: flex;
+ flex-direction: column;
+ gap: 6px;
+ }
+ .meta-line {
+ display: flex;
+ align-items: center;
+ font-size: 13px;
+ }
+ .meta-label {
+ width: 72px;
+ color: $color-text-tertiary;
+ flex-shrink: 0;
+ }
+ .meta-value {
+ flex: 1;
+ color: $color-text-primary;
+ word-break: break-all;
+ }
+ .mobile-empty {
+ background: var(--app-card, $color-card);
+ border-radius: 10px;
+ padding: $space-4;
+ }
+ .mobile-pagination {
+ margin-top: $space-3;
+ display: flex;
+ justify-content: center;
+ :deep(.el-pagination) {
+ flex-wrap: wrap;
+ justify-content: center;
+ }
+ }
+ .mobile-total {
+ margin-top: $space-3;
+ text-align: center;
+ font-size: 12px;
+ color: $color-text-tertiary;
+ }
+}
+
+:deep(.mobile-action-drawer .el-drawer__body) {
+ padding: 0;
+}
+
diff --git a/frontend/src/views/admin/Users.vue b/frontend/src/views/admin/Users.vue
index 5815ccb7dbda0f817e59a5c597ecf5443d169e63..0f0c1f017d6a25d860bcd143063abc6d7677df00 100644
--- a/frontend/src/views/admin/Users.vue
+++ b/frontend/src/views/admin/Users.vue
@@ -4,12 +4,14 @@ import { useRoute } from 'vue-router'
import { ElMessage, ElMessageBox } from 'element-plus'
import * as adminApi from '@/api/admin'
import { useUserStore } from '@/stores/user'
+import { useBreakpoint } from '@/composables/useBreakpoint'
import type { UserProfile } from '@/types/user'
import UserDialogs from './components/UserDialogs.vue'
import ResetPasswordDialog from './components/ResetPasswordDialog.vue'
const userStore = useUserStore()
const route = useRoute()
+const { isMobile } = useBreakpoint()
const loading = ref(false)
const list = ref([])
@@ -105,10 +107,45 @@ function openResetPwd(u: UserProfile) {
function isCurrentUser(u: UserProfile): boolean {
return u.id === userStore.userId
}
+
+// 手机端操作菜单（点开底部弹层显示编辑/启用·禁用/重置）
+const mobileActionUser = ref(null)
+const mobileActionOpen = ref(false)
+function openMobileActions(u: UserProfile) {
+ mobileActionUser.value = u
+ mobileActionOpen.value = true
+}
+function closeMobileActions() {
+ mobileActionOpen.value = false
+}
+function mobileEdit() {
+ if (!mobileActionUser.value) return
+ const u = mobileActionUser.value
+ closeMobileActions()
+ openEdit(u)
+}
+async function mobileToggle() {
+ if (!mobileActionUser.value) return
+ const u = mobileActionUser.value
+ closeMobileActions()
+ await toggleDisabled(u)
+}
+function mobileResetPwd() {
+ if (!mobileActionUser.value) return
+ const u = mobileActionUser.value
+ closeMobileActions()
+ openResetPwd(u)
+}
+
+function roleTag(u: UserProfile): { type: 'danger' | 'warning' | ''; label: string } {
+ if (u.role === 'SuperAdmin') return { type: 'danger', label: '超级管理员' }
+ if (u.role === 'DepartmentManager' || u.isDepartmentManager) return { type: 'warning', label: '部门主管' }
+ return { type: '', label: '普通员工' }
+}
-
职位管理
-
+
+
+
+
+ 共 {{ total }} 条记录
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ p.name }}
+
+ {{ p.enabled ? '启用' : '禁用' }}
+
+
+
+ 所属部门：{{ p.departmentName || '-' }}
+
+
+
+ 共 {{ total }} 个职位
+
+ {{ mobileActionPos.name }}
+ {{ mobileActionPos.departmentName }} · {{ mobileActionPos.memberCount }} 人
+
+
+
+
+
+
+ 取消
+
+
+
+
新增员工
-
-
用户管理
@@ -119,9 +156,9 @@ function isCurrentUser(u: UserProfile): boolean { placeholder="搜索姓名/手机号" :prefix-icon="'Search'" clearable - style="width: 240px" + class="toolbar-input" /> -
+
+
-
- {{ (row as UserProfile).displayName }}
-
-
+
+ {{ (row as UserProfile).displayName }}
+
+
已禁用
@@ -214,6 +251,106 @@ function isCurrentUser(u: UserProfile): boolean {
+
+
+
+
+
\ No newline at end of file
+
+/* ============ 移动端（≤767px） ============ */
+/* 表格在手机端换为卡片列表；所有 PC 端样式保持不变 */
+@media (max-width: 767px) {
+ .users-page.page-container {
+ padding: $space-3;
+ min-height: auto;
+ }
+ .users-page .page-title {
+ font-size: 20px;
+ margin-bottom: $space-3;
+ }
+ .toolbar {
+ flex-direction: column;
+ align-items: stretch;
+ gap: $space-3;
+ padding: $space-3;
+ margin-bottom: $space-3;
+ }
+ .toolbar-left {
+ flex-direction: column;
+ align-items: stretch;
+ gap: $space-2;
+ }
+ .toolbar-input,
+ .toolbar-select {
+ width: 100%;
+ }
+ .toolbar :deep(.el-button) {
+ width: 100%;
+ }
+
+ /* 卡片列表 */
+ .mobile-list {
+ display: flex;
+ flex-direction: column;
+ gap: $space-3;
+ }
+ .user-card {
+ background: var(--app-card, $color-card);
+ border-radius: 10px;
+ padding: $space-3 $space-4;
+ box-shadow: $shadow-1;
+ border: 1px solid var(--app-border, $color-border);
+ cursor: pointer;
+ transition: transform 150ms ease;
+ &:active { transform: scale(0.99); }
+ }
+ .user-card-top {
+ display: flex;
+ align-items: center;
+ gap: $space-3;
+ }
+ .user-card-id {
+ flex: 1;
+ min-width: 0;
+ }
+ .user-card-name {
+ font-size: 16px;
+ font-weight: 600;
+ color: $color-text-primary;
+ display: flex;
+ align-items: center;
+ gap: $space-2;
+ }
+ .user-card-sub {
+ font-size: 12px;
+ color: $color-text-tertiary;
+ margin-top: 2px;
+ .dot { margin: 0 4px; }
+ }
+ .user-card-arrow {
+ color: $color-text-tertiary;
+ flex-shrink: 0;
+ }
+ .user-card-meta {
+ margin-top: $space-3;
+ padding-top: $space-3;
+ border-top: 1px solid $color-border;
+ display: flex;
+ flex-direction: column;
+ gap: 6px;
+ }
+ .meta-line {
+ display: flex;
+ align-items: center;
+ font-size: 13px;
+ }
+ .meta-label {
+ width: 64px;
+ color: $color-text-tertiary;
+ flex-shrink: 0;
+ }
+ .meta-value {
+ flex: 1;
+ color: $color-text-primary;
+ word-break: break-all;
+ }
+ .mobile-empty {
+ background: var(--app-card, $color-card);
+ border-radius: 10px;
+ padding: $space-4;
+ }
+ .mobile-pagination {
+ margin-top: $space-3;
+ display: flex;
+ justify-content: center;
+ :deep(.el-pagination) {
+ flex-wrap: wrap;
+ justify-content: center;
+ }
+ }
+ .mobile-total {
+ margin-top: $space-3;
+ text-align: center;
+ font-size: 12px;
+ color: $color-text-tertiary;
+ }
+}
+
+/* 移动端抽屉复写样式（drawer 默认放在 body 上，需 :deep） */
+:deep(.mobile-action-drawer .el-drawer__body) {
+ padding: 0;
+}
+
diff --git a/frontend/src/views/auth/Login.vue b/frontend/src/views/auth/Login.vue
index 1a9e4b8e08d093cbbd55691f4fed9ed8615c67b9..3251620eb47f8e93a5b9ecd84dee04cf01d3966b 100644
--- a/frontend/src/views/auth/Login.vue
+++ b/frontend/src/views/auth/Login.vue
@@ -64,8 +64,9 @@ async function submit() {
}
function fillDemo() {
- form.phone = '13800000001'
- form.password = 'ChangeMe123!'
+ // dev 演示账号：13812340001 / Test@1234（超管，DB 验证可登录）
+ form.phone = '13812340001'
+ form.password = 'Test@1234'
}
function goSignup() {
diff --git a/frontend/src/views/contact/ContactList.vue b/frontend/src/views/contact/ContactList.vue
index af8136d17cd6d25d29d85cba9cea24fb2354477c..9729bcc3b7041fbc719214aefe83b58a3318a5be 100644
--- a/frontend/src/views/contact/ContactList.vue
+++ b/frontend/src/views/contact/ContactList.vue
@@ -253,6 +253,12 @@ function showEmployeeCard(userId: string) {
showCard.value = true
}
+// 移动端：点击整个联系人卡片 → 进入员工名片页（带部门信息用于返回定位）
+// （PC 端行为保持原样：弹员工名片）
+function onCardClick(user: UserProfile) {
+ showEmployeeCard(user.id)
+}
+
async function startChat(user: UserProfile) {
if (user.isDisabled) {
ElMessage.warning('该员工已离职，无法发起聊天')
@@ -276,7 +282,7 @@ async function startChat(user: UserProfile) {
try {
const imApi = await import('@/api/im')
const conv = await imApi.createOrGetPrivateConversation(user.id)
- router.push({ path: '/main/messages', query: { conversationId: conv.id } })
+ router.push({ path: '/main/messages', query: { conv: conv.id, open: 1 } })
} catch (e: any) {
ElMessage.error(e?.message || '发起聊天失败')
}
@@ -408,7 +414,7 @@ watch(
:key="m.id"
class="member-card"
:class="{ disabled: m.isDisabled }"
- @click="showEmployeeCard(m.id)"
+ @click="onCardClick(m)"
>
{{ m.displayName?.charAt(0) }}
diff --git a/frontend/src/views/contact/ContactProfile.vue b/frontend/src/views/contact/ContactProfile.vue
index c6fd7874c4c2c45ae66db9a3c5404828b9117330..f18399c964e7fa508ca723266d798767c137902c 100644
--- a/frontend/src/views/contact/ContactProfile.vue
+++ b/frontend/src/views/contact/ContactProfile.vue
@@ -18,7 +18,10 @@ const fromDeptId = computed(() => (route.query.fromDeptId as string) || '')
const fromDeptName = computed(() => (route.query.fromDeptName as string) || '')
async function load() {
- const id = String(route.params.id)
+ // 关键：避免 keep-alive 缓存下，从本页跳回通讯录时 watch 误触发把 undefined 当 id 用
+ // （route.params.id 在 /main/contacts 路由下是 undefined，String(undefined) = "undefined" → 404）
+ const raw = route.params.id
+ const id = Array.isArray(raw) ? raw[0] : (raw ?? '')
if (!id) return
loading.value = true
try {
@@ -32,7 +35,11 @@ async function load() {
}
onMounted(load)
-watch(() => route.params.id, load)
+// watch 只在停留在本路由（员工名片）时才触发，跳回通讯录时 route.name 会变，
+// 这时 id 已变 undefined，guard 会直接 return，不会发无效请求
+watch(() => route.params.id, () => {
+ if (route.name === 'ContactProfile') load()
+})
function goBack() {
// 回到点该员工时的部门页面（如果有 fromDeptId），否则回通讯录首页
diff --git a/frontend/src/views/doc/DocList.vue b/frontend/src/views/doc/DocList.vue
index ef7a518ab3795a5dd36bbfb7f44fafd3d48cdc53..cde3e10ebc6ccfc31a1da69cace312545de63827 100644
--- a/frontend/src/views/doc/DocList.vue
+++ b/frontend/src/views/doc/DocList.vue
@@ -143,8 +143,10 @@ async function confirmNewDoc() {
+
+
-
共 {{ total }} 条记录
+
+
+
+
+
+
+
+
+
+
+
+
+ {{ u.displayName?.charAt(0) }}
+
+
+
+
+
+ {{ u.displayName }}
+ 已禁用
+ 正常
+
+
+ {{ u.departmentName || '未分配部门' }}
+ ·
+ {{ u.positionName || '未分配职位' }}
+
+
+
+ 共 {{ total }} 位员工
+
+
+ {{ mobileActionUser.displayName }}
+ {{ mobileActionUser.departmentName }} · {{ mobileActionUser.positionName }}
+
+
+
+
+
+
+
+
+ 取消
+
+
+
{{ avatarText }}
@@ -213,10 +215,36 @@ async function confirmNewDoc() {
>
+
+
+
+
+
+ 取消
+ 创建并编辑
+
+
+
+
-
+
-
-
-
-
-
-
+
+
\ No newline at end of file
+
diff --git a/frontend/src/views/profile/Me.vue b/frontend/src/views/profile/Me.vue
index d731ab02dd1555a66c14a776a83e7df4bf9f57b8..8041b7fb8e3af0a234ef86da33381242ad1ab073 100644
--- a/frontend/src/views/profile/Me.vue
+++ b/frontend/src/views/profile/Me.vue
@@ -5,16 +5,53 @@
* - 进入个人中心 / 设置 / 通知（PC 端既有路由）
* - 超管额外显示 管理后台 入口
*/
+import { onActivated, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { useUserStore } from '@/stores/user'
+import { useBreakpoint } from '@/composables/useBreakpoint'
const router = useRouter()
const userStore = useUserStore()
+const { isMobile } = useBreakpoint()
+
+// 进入页面时刷新 store.user，保证头像/姓名与个人中心同步
+function refreshUser() {
+ void userStore.refreshMyProfile()
+}
+onMounted(refreshUser)
+onActivated(refreshUser)
function go(path: string) {
router.push(path)
}
+// 移动端"个人中心"走 mobile-only 路由（含外观设置快捷入口），PC 端走原 PC 路由
+function goProfile() {
+ if (isMobile.value) {
+ router.push('/main/me/profile')
+ } else {
+ router.push('/main/profile')
+ }
+}
+
+// 移动端设置走 mobile-only 路由（菜单独立成页），PC 端走原 PC 路由
+function goSettings() {
+ if (isMobile.value) {
+ router.push('/main/me/settings')
+ } else {
+ router.push('/main/settings')
+ }
+}
+
+// 外观设置快捷入口：mobile 端直接到 mobile-only 子页，PC 端到原 PC 路由
+function goAppearance() {
+ if (isMobile.value) {
+ router.push('/main/me/settings/appearance')
+ } else {
+ router.push('/main/settings')
+ }
+}
+
async function onLogout() {
await userStore.logout()
router.replace('/login')
@@ -24,21 +61,26 @@ async function onLogout() {
-
+ {{ (userStore.displayName || '?').charAt(0) }}
+
云文档
@@ -285,38 +313,8 @@ async function confirmNewDoc() {
{{ (userStore.userName || '?').charAt(0) }}
+
-
{{ userStore.userName || '未登录' }}
+ {{ userStore.displayName || '未登录' }}
{{ userStore.phone || '' }}
-
-
- +
-
-
- +
-
+
-
-
@@ -75,6 +117,8 @@ async function onLogout() {
display: flex;
align-items: center;
justify-content: center;
+ overflow: hidden;
+ flex-shrink: 0;
}
.info {
flex: 1;
diff --git a/frontend/src/views/profile/MobileProfile.vue b/frontend/src/views/profile/MobileProfile.vue
new file mode 100644
index 0000000000000000000000000000000000000000..73f37814a3407995dafcaf26c4fd7bb376b5954d
--- /dev/null
+++ b/frontend/src/views/profile/MobileProfile.vue
@@ -0,0 +1,387 @@
+
+
+
+ ++ + + diff --git a/frontend/src/views/profile/MobileSettingsAbout.vue b/frontend/src/views/profile/MobileSettingsAbout.vue new file mode 100644 index 0000000000000000000000000000000000000000..3bf412232432c02f54b3d23d7eb71109b67b2cfc --- /dev/null +++ b/frontend/src/views/profile/MobileSettingsAbout.vue @@ -0,0 +1,153 @@ + + + +
个人中心
+ + +++ + ++++++ {{ user?.displayName?.charAt(0) }} + +++ ++ 保存 +取消 + ++ 用户ID + {{ user?.id }} ++++ + ++ 企业 + {{ tenantName }} ++企业级信息 ++ 部门 + {{ user?.departmentName }} +++ +仅管理员可改 +可在「用户管理」编辑 ++ 职位 + {{ user?.positionName }} +++ +仅管理员可改 +可在「用户管理」编辑 +++ + + +个人资料++ 邮箱 + + {{ user?.email || '未设置' }} +++ 保存 +取消 + ++ 个性签名 + + {{ user?.signature || '这个人很懒，什么都没留下' }} +++ 保存 +取消 + +++ + + diff --git a/frontend/src/views/profile/MobileSettingsAccount.vue b/frontend/src/views/profile/MobileSettingsAccount.vue new file mode 100644 index 0000000000000000000000000000000000000000..903d232f1b4827bf6f4d8008a61589ec655cf43e --- /dev/null +++ b/frontend/src/views/profile/MobileSettingsAccount.vue @@ -0,0 +1,115 @@ + + + +++ +
+ FF-Lite 仿飞书协同办公平台+{{ appInfo.version }}++ + +应用信息+-
+
- + 构建时间 + {{ appInfo.buildDate }} + +
- + 前端框架 + {{ appInfo.vue }} + {{ appInfo.elementPlus }} + +
- + 编辑器 + {{ appInfo.editor }} + +
- + 数据存储 + {{ appInfo.storage }} + +
- + 业务模块 + {{ appInfo.modes }} + +
-
+ 功能完成度
+
+
{{ appInfo.features }} + +
+
+ + + +技术栈+ ++ + +账号信息+-
+
-
+ 用户ID+{{ user?.id || '-' }}+
+
-
+ 手机号+{{ user?.phone || '-' }}+
+
-
+ 修改手机号+
+ + + + diff --git a/frontend/src/views/profile/MobileSettingsAppearance.vue b/frontend/src/views/profile/MobileSettingsAppearance.vue new file mode 100644 index 0000000000000000000000000000000000000000..93141c0055651b8919a0e399a7f36d6c8125b359 --- /dev/null +++ b/frontend/src/views/profile/MobileSettingsAppearance.vue @@ -0,0 +1,168 @@ + + + +账号与安全+-
+
-
+ 登录密码+建议每 90 天更换一次+
-
+ 当前会话+Chrome / Web+
+
+ + +主题模式++++ ++{{ t.label }}+{{ t.desc }}++ + + + diff --git a/frontend/src/views/profile/MobileSettingsList.vue b/frontend/src/views/profile/MobileSettingsList.vue new file mode 100644 index 0000000000000000000000000000000000000000..465855c3581079e1b005a0d2d533e87eff4ab22b --- /dev/null +++ b/frontend/src/views/profile/MobileSettingsList.vue @@ -0,0 +1,86 @@ + + + +字体大小+++++++-
+
-
+
+ + + +消息通知+-
+
-
+ ++新消息提醒+收到新消息时显示通知+
+
+ -
+ ++声音提醒+收到消息时播放提示音+
+
+ -
+ ++桌面通知+在浏览器桌面显示系统通知+
+
+ -
+ ++陌生人消息提醒+非好友发来消息时也提醒（V1.0 默认关闭）+
+
+
++