From 0c445ac6d2a20153e5eac390555ba88f950d76b0 Mon Sep 17 00:00:00 2001
From: spring <2396852758@qq.com>
Date: 星期四, 14 八月 2025 17:16:16 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/dev_7004' into dev_7004
---
src/views/collaborativeApproval/meetingBoard/index.vue | 498 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 498 insertions(+), 0 deletions(-)
diff --git a/src/views/collaborativeApproval/meetingBoard/index.vue b/src/views/collaborativeApproval/meetingBoard/index.vue
new file mode 100644
index 0000000..63c74f9
--- /dev/null
+++ b/src/views/collaborativeApproval/meetingBoard/index.vue
@@ -0,0 +1,498 @@
+<template>
+ <div class="app-container">
+ <!-- 椤甸潰鏍囬 -->
+ <div class="page-header">
+ <h2>浼氳鐪嬫澘</h2>
+<!-- <el-button type="primary" @click="createMeeting">鍒涘缓浼氳</el-button>-->
+ </div>
+
+ <!-- 浼氳缁熻鍗＄墖 -->
+ <div class="stats-cards">
+ <el-card class="stat-card">
+ <div class="stat-content">
+ <div class="stat-number">{{ stats.total }}</div>
+ <div class="stat-label">鎬讳細璁暟</div>
+ </div>
+ </el-card>
+ <el-card class="stat-card">
+ <div class="stat-content">
+ <div class="stat-number">{{ stats.ongoing }}</div>
+ <div class="stat-label">杩涜涓�</div>
+ </div>
+ </el-card>
+ <el-card class="stat-card">
+ <div class="stat-content">
+ <div class="stat-number">{{ stats.completed }}</div>
+ <div class="stat-label">宸插畬鎴�</div>
+ </div>
+ </el-card>
+ <el-card class="stat-card">
+ <div class="stat-content">
+ <div class="stat-number">{{ stats.upcoming }}</div>
+ <div class="stat-label">鍗冲皢寮�濮�</div>
+ </div>
+ </el-card>
+ </div>
+
+ <!-- 浼氳鍒楄〃 -->
+ <div class="meeting-list">
+ <el-card v-for="meeting in meetings" :key="meeting.id" class="meeting-card">
+ <div class="meeting-header">
+ <div class="meeting-title">
+ <h3>{{ meeting.title }}</h3>
+ <el-tag :type="getStatusType(meeting.status)" size="small">
+ {{ getStatusText(meeting.status) }}
+ </el-tag>
+ </div>
+ <div class="meeting-time">
+ <el-icon><Clock /></el-icon>
+ {{ formatTime(meeting.startTime) }} - {{ formatTime(meeting.endTime) }}
+ </div>
+ </div>
+
+ <div class="meeting-info">
+ <div class="info-item">
+ <el-icon><Location /></el-icon>
+ <span>{{ meeting.location }}</span>
+ </div>
+ <div class="info-item">
+ <el-icon><User /></el-icon>
+ <span>涓绘寔浜�: {{ meeting.host }}</span>
+ </div>
+ <div class="info-item">
+ <el-icon><UserFilled /></el-icon>
+ <span>鍙備細浜烘暟: {{ meeting.participants.length }}浜�</span>
+ </div>
+ </div>
+
+ <div class="meeting-agenda">
+ <h4>璁▼瀹夋帓</h4>
+ <div class="agenda-list">
+ <div
+ v-for="(agenda, index) in meeting.agenda"
+ :key="index"
+ class="agenda-item"
+ :class="{ 'active': agenda.status === 'active', 'completed': agenda.status === 'completed' }"
+ >
+ <span class="agenda-time">{{ agenda.time }}</span>
+ <span class="agenda-content">{{ agenda.content }}</span>
+ <el-tag
+ :type="getAgendaStatusType(agenda.status)"
+ size="small"
+ >
+ {{ getAgendaStatusText(agenda.status) }}
+ </el-tag>
+ </div>
+ </div>
+ </div>
+
+<!-- <div class="meeting-actions">-->
+<!-- <el-button type="primary" size="small" @click="joinMeeting(meeting)">-->
+<!-- 鍔犲叆浼氳-->
+<!-- </el-button>-->
+<!-- <el-button type="info" size="small" @click="viewDetails(meeting)">-->
+<!-- 鏌ョ湅璇︽儏-->
+<!-- </el-button>-->
+<!-- <el-button type="warning" size="small" @click="editMeeting(meeting)">-->
+<!-- 缂栬緫-->
+<!-- </el-button>-->
+<!-- </div>-->
+ </el-card>
+ </div>
+
+ <!-- 鍒涘缓浼氳瀵硅瘽妗� -->
+ <el-dialog v-model="dialogVisible" title="鍒涘缓浼氳" width="600px">
+ <el-form :model="meetingForm" label-width="100px">
+ <el-form-item label="浼氳鏍囬">
+ <el-input v-model="meetingForm.title" placeholder="璇疯緭鍏ヤ細璁爣棰�" />
+ </el-form-item>
+ <el-form-item label="浼氳鏃堕棿">
+ <el-date-picker
+ v-model="meetingForm.timeRange"
+ type="datetimerange"
+ range-separator="鑷�"
+ start-placeholder="寮�濮嬫椂闂�"
+ end-placeholder="缁撴潫鏃堕棿"
+ format="YYYY-MM-DD HH:mm"
+ value-format="YYYY-MM-DD HH:mm:ss"
+ />
+ </el-form-item>
+ <el-form-item label="浼氳鍦扮偣">
+ <el-input v-model="meetingForm.location" placeholder="璇疯緭鍏ヤ細璁湴鐐�" />
+ </el-form-item>
+ <el-form-item label="涓绘寔浜�">
+ <el-input v-model="meetingForm.host" placeholder="璇疯緭鍏ヤ富鎸佷汉濮撳悕" />
+ </el-form-item>
+ <el-form-item label="浼氳鎻忚堪">
+ <el-input
+ v-model="meetingForm.description"
+ type="textarea"
+ :rows="3"
+ placeholder="璇疯緭鍏ヤ細璁弿杩�"
+ />
+ </el-form-item>
+ </el-form>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="dialogVisible = false">鍙栨秷</el-button>
+ <el-button type="primary" @click="submitMeeting">纭畾</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ </div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted } from 'vue'
+import { ElMessage } from 'element-plus'
+import { Clock, Location, User, UserFilled } from '@element-plus/icons-vue'
+
+// 缁熻鏁版嵁
+const stats = reactive({
+ total: 12,
+ ongoing: 3,
+ completed: 7,
+ upcoming: 2
+})
+
+// 浼氳鏁版嵁
+const meetings = ref([
+ {
+ id: 1,
+ title: '浜у搧寮�鍙戝懆浼�',
+ status: 'ongoing',
+ startTime: '2024-01-15 09:00:00',
+ endTime: '2024-01-15 10:30:00',
+ location: '浼氳瀹',
+ host: '寮犵粡鐞�',
+ participants: ['寮犵粡鐞�', '鏉庡伐绋嬪笀', '鐜嬭璁″笀', '璧垫祴璇曞憳'],
+ agenda: [
+ { time: '09:00-09:15', content: '涓婂懆宸ヤ綔鎬荤粨', status: 'completed' },
+ { time: '09:15-09:45', content: '鏈懆寮�鍙戣鍒�', status: 'active' },
+ { time: '09:45-10:00', content: '鎶�鏈毦鐐硅璁�', status: 'pending' },
+ { time: '10:00-10:30', content: '闂鍙嶉涓庤В鍐�', status: 'pending' }
+ ]
+ },
+ {
+ id: 2,
+ title: '瀹㈡埛闇�姹傝瘎瀹′細',
+ status: 'upcoming',
+ startTime: '2024-01-15 14:00:00',
+ endTime: '2024-01-15 15:00:00',
+ location: '绾夸笂浼氳',
+ host: '闄堟�荤洃',
+ participants: ['闄堟�荤洃', '鍒樹骇鍝佺粡鐞�', '瀛欏鎴风粡鐞�', '瀹㈡埛浠ｈ〃'],
+ agenda: [
+ { time: '14:00-14:20', content: '闇�姹傝儗鏅粙缁�', status: 'pending' },
+ { time: '14:20-14:40', content: '鍔熻兘闇�姹傚垎鏋�', status: 'pending' },
+ { time: '14:40-15:00', content: '鎶�鏈彲琛屾�ц瘎浼�', status: 'pending' }
+ ]
+ },
+ {
+ id: 3,
+ title: '鍥㈤槦寤鸿娲诲姩',
+ status: 'completed',
+ startTime: '2024-01-14 16:00:00',
+ endTime: '2024-01-14 18:00:00',
+ location: '鍏徃澶у巺',
+ host: '浜轰簨閮�',
+ participants: ['鍏ㄤ綋鍛樺伐'],
+ agenda: [
+ { time: '16:00-16:30', content: '鍥㈤槦娓告垙', status: 'completed' },
+ { time: '16:30-17:00', content: '缁忛獙鍒嗕韩', status: 'completed' },
+ { time: '17:00-18:00', content: '鑷敱浜ゆ祦', status: 'completed' }
+ ]
+ }
+])
+
+// 瀵硅瘽妗嗙浉鍏�
+const dialogVisible = ref(false)
+const meetingForm = reactive({
+ title: '',
+ timeRange: [],
+ location: '',
+ host: '',
+ description: ''
+})
+
+// 鑾峰彇鐘舵�佺被鍨�
+const getStatusType = (status) => {
+ const statusMap = {
+ 'ongoing': 'success',
+ 'upcoming': 'warning',
+ 'completed': 'info'
+ }
+ return statusMap[status] || 'info'
+}
+
+// 鑾峰彇鐘舵�佹枃鏈�
+const getStatusText = (status) => {
+ const statusMap = {
+ 'ongoing': '杩涜涓�',
+ 'upcoming': '鍗冲皢寮�濮�',
+ 'completed': '宸插畬鎴�'
+ }
+ return statusMap[status] || '鏈煡'
+}
+
+// 鑾峰彇璁▼鐘舵�佺被鍨�
+const getAgendaStatusType = (status) => {
+ const statusMap = {
+ 'completed': 'success',
+ 'active': 'warning',
+ 'pending': 'info'
+ }
+ return statusMap[status] || 'info'
+}
+
+// 鑾峰彇璁▼鐘舵�佹枃鏈�
+const getAgendaStatusText = (status) => {
+ const statusMap = {
+ 'completed': '宸插畬鎴�',
+ 'active': '杩涜涓�',
+ 'pending': '寰呭紑濮�'
+ }
+ return statusMap[status] || '鏈煡'
+}
+
+// 鏍煎紡鍖栨椂闂�
+const formatTime = (timeStr) => {
+ const date = new Date(timeStr)
+ return date.toLocaleTimeString('zh-CN', { hour: '2-digit', minute: '2-digit' })
+}
+
+// 鍒涘缓浼氳
+const createMeeting = () => {
+ dialogVisible.value = true
+ // 閲嶇疆琛ㄥ崟
+ Object.assign(meetingForm, {
+ title: '',
+ timeRange: [],
+ location: '',
+ host: '',
+ description: ''
+ })
+}
+
+// 鎻愪氦浼氳
+const submitMeeting = () => {
+ if (!meetingForm.title || !meetingForm.timeRange.length || !meetingForm.location || !meetingForm.host) {
+ ElMessage.warning('璇峰～鍐欏畬鏁寸殑浼氳淇℃伅')
+ return
+ }
+
+ // 鍒涘缓鏂颁細璁�
+ const newMeeting = {
+ id: Date.now(),
+ title: meetingForm.title,
+ status: 'upcoming',
+ startTime: meetingForm.timeRange[0],
+ endTime: meetingForm.timeRange[1],
+ location: meetingForm.location,
+ host: meetingForm.host,
+ participants: [meetingForm.host],
+ agenda: [
+ { time: '寰呭畾', content: '璁▼寰呭畾', status: 'pending' }
+ ]
+ }
+
+ meetings.value.unshift(newMeeting)
+ stats.total++
+ stats.upcoming++
+
+ ElMessage.success('浼氳鍒涘缓鎴愬姛')
+ dialogVisible.value = false
+}
+
+// 鍔犲叆浼氳
+const joinMeeting = (meeting) => {
+ ElMessage.success(`宸插姞鍏ヤ細璁細${meeting.title}`)
+}
+
+// 鏌ョ湅璇︽儏
+const viewDetails = (meeting) => {
+ ElMessage.info(`鏌ョ湅浼氳璇︽儏锛�${meeting.title}`)
+}
+
+// 缂栬緫浼氳
+const editMeeting = (meeting) => {
+ ElMessage.info(`缂栬緫浼氳锛�${meeting.title}`)
+}
+
+onMounted(() => {
+ console.log('浼氳鐪嬫澘椤甸潰鍔犺浇瀹屾垚')
+})
+</script>
+
+<style scoped>
+.app-container {
+ padding: 20px;
+}
+
+.page-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 20px;
+}
+
+.page-header h2 {
+ margin: 0;
+ color: #303133;
+}
+
+.stats-cards {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+ gap: 20px;
+ margin-bottom: 30px;
+}
+
+.stat-card {
+ text-align: center;
+}
+
+.stat-content {
+ padding: 10px;
+}
+
+.stat-number {
+ font-size: 32px;
+ font-weight: bold;
+ color: #409eff;
+ margin-bottom: 8px;
+}
+
+.stat-label {
+ font-size: 14px;
+ color: #606266;
+}
+
+.meeting-list {
+ display: grid;
+ gap: 20px;
+}
+
+.meeting-card {
+ border-radius: 8px;
+}
+
+.meeting-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: flex-start;
+ margin-bottom: 15px;
+}
+
+.meeting-title {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+}
+
+.meeting-title h3 {
+ margin: 0;
+ color: #303133;
+}
+
+.meeting-time {
+ display: flex;
+ align-items: center;
+ gap: 5px;
+ color: #606266;
+ font-size: 14px;
+}
+
+.meeting-info {
+ display: flex;
+ gap: 20px;
+ margin-bottom: 20px;
+ flex-wrap: wrap;
+}
+
+.info-item {
+ display: flex;
+ align-items: center;
+ gap: 5px;
+ color: #606266;
+ font-size: 14px;
+}
+
+.meeting-agenda {
+ margin-bottom: 20px;
+}
+
+.meeting-agenda h4 {
+ margin: 0 0 15px 0;
+ color: #303133;
+ font-size: 16px;
+}
+
+.agenda-list {
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+}
+
+.agenda-item {
+ display: flex;
+ align-items: center;
+ gap: 15px;
+ padding: 10px;
+ border-radius: 6px;
+ background-color: #f5f7fa;
+}
+
+.agenda-item.active {
+ background-color: #fdf6ec;
+ border-left: 3px solid #e6a23c;
+}
+
+.agenda-item.completed {
+ background-color: #f0f9ff;
+ border-left: 3px solid #409eff;
+}
+
+.agenda-time {
+ font-weight: bold;
+ color: #606266;
+ min-width: 80px;
+}
+
+.agenda-content {
+ flex: 1;
+ color: #303133;
+}
+
+.meeting-actions {
+ display: flex;
+ gap: 10px;
+ justify-content: flex-end;
+}
+
+.dialog-footer {
+ display: flex;
+ justify-content: flex-end;
+ gap: 10px;
+}
+
+@media (max-width: 768px) {
+ .stats-cards {
+ grid-template-columns: repeat(2, 1fr);
+ }
+
+ .meeting-header {
+ flex-direction: column;
+ gap: 10px;
+ }
+
+ .meeting-info {
+ flex-direction: column;
+ gap: 10px;
+ }
+
+ .meeting-actions {
+ flex-direction: column;
+ }
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3