feat: add group management - create, join, member panel with owner controls

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

frontend/src/views/Layout.vue

@@ -8,6 +8,8 @@ import { useNotificationStore } from '@/stores/notification'
 import StatusToggle from '@/components/team/StatusToggle.vue'
 import WorkScheduleModal from '@/components/team/WorkScheduleModal.vue'
 import NotificationPanel from '@/components/common/NotificationPanel.vue'
+import CreateGroupDialog from '@/components/group/CreateGroupDialog.vue'
+import JoinGroupDialog from '@/components/group/JoinGroupDialog.vue'
 
 const router = useRouter()
 const route = useRoute()
@@ -17,6 +19,8 @@ const teamStore = useTeamStore()
 const notificationStore = useNotificationStore()
 
 const showScheduleModal = ref(false)
+const showCreateGroup = ref(false)
+const showJoinGroup = ref(false)
 
 onMounted(async () => {
   await userStore.initUser()
@@ -67,6 +71,10 @@ function goHome() {
       <div class="sidebar-groups">
         <div class="section-header">
           <span class="section-title">我的群组</span>
+          <div class="section-actions">
+            <button class="section-btn" @click="showCreateGroup = true" title="创建群组">+</button>
+            <button class="section-btn" @click="showJoinGroup = true" title="加入群组">&#x1F517;</button>
+          </div>
         </div>
         <div v-if="groupStore.groups.length === 0" class="empty-groups">
           暂无群组
@@ -129,6 +137,8 @@ function goHome() {
     <!-- 弹窗 -->
     <WorkScheduleModal v-model="showScheduleModal" />
     <NotificationPanel />
+    <CreateGroupDialog v-model="showCreateGroup" />
+    <JoinGroupDialog v-model="showJoinGroup" />
   </div>
 </template>
 
@@ -242,6 +252,27 @@ function goHome() {
   letter-spacing: 0.5px;
 }
 
+.section-actions {
+  display: flex;
+  gap: 4px;
+}
+
+.section-btn {
+  background: none;
+  border: 1px solid var(--gg-border);
+  border-radius: 6px;
+  color: var(--gg-text-secondary);
+  font-size: 14px;
+  cursor: pointer;
+  padding: 2px 8px;
+  transition: all 0.2s;
+}
+
+.section-btn:hover {
+  border-color: var(--gg-primary);
+  color: var(--gg-primary);
+}
+
 .empty-groups {
   text-align: center;
   color: var(--gg-text-muted);