From 5c1594105702d284b116be6fa1c6ebde58f327d5 Mon Sep 17 00:00:00 2001
From: lion <120344285@qq.com>
Date: Sat, 9 Aug 2025 20:54:26 +0800
Subject: [PATCH] =?UTF-8?q?=E8=AF=BE=E7=A8=8B=E6=97=A5=E5=8E=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/calendar/components/addCalendar.vue |  200 ++-
 src/views/calendar/index.vue                  | 1460 +++++++++--------
 src/views/course/components/addCourse.vue     |   42 +-
 src/views/courseQr/index.vue                  |   14 +-
 4 files changed, 906 insertions(+), 810 deletions(-)

diff --git a/src/views/calendar/components/addCalendar.vue b/src/views/calendar/components/addCalendar.vue
index c338ede..791796b 100644
--- a/src/views/calendar/components/addCalendar.vue
+++ b/src/views/calendar/components/addCalendar.vue
@@ -54,28 +54,31 @@
           </div>
         </div>
       </template>
-      <template v-if="form.type===4" v-slot:url>
+      <template v-if="form.type===4 || form.type===1" v-slot:url>
         <div class="xy-table-item">
           <div class="xy-table-item-label" style="font-weight: bold">
             <span style="color: red;font-weight: bold;padding-right: 4px;"></span>资讯链接：
           </div>
           <div class="xy-table-item-content">
-            <el-input v-model="form.url" placeholder="请输入跳转链接,例：/news/2025-07-02/146.html" clearable
-              style="width: 100%;"></el-input>
+            <el-select filterable remote v-model="form.url" :remote-method="remoteMethod" :loading="loading"
+              placeholder="请输入关键词查询资讯" clearable style="width: 100%;">
+              <el-option v-for="item in zixunList" :key="item.id" :label="item.title" :value="item.titleurl">
+              </el-option>
+            </el-select>
+          </div>
+        </div>
+      </template>
+      <!-- <template v-slot:date>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label" style="font-weight: bold">
+            <span style="color: red;font-weight: bold;padding-right: 4px;">*</span>日期：
+          </div>
+          <div class="xy-table-item-content">
+            <el-date-picker v-model="form.date"  style="width: 100%;"
+             type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="选择日期时间" align="right">
+            </el-date-picker>
           </div>
         </div>
-      </template>
-      <!-- <template v-slot:date>
-        <div class="xy-table-item">
-          <div class="xy-table-item-label" style="font-weight: bold">
-            <span style="color: red;font-weight: bold;padding-right: 4px;">*</span>日期：
-          </div>
-          <div class="xy-table-item-content">
-            <el-date-picker v-model="form.date"  style="width: 100%;"
-             type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd" placeholder="选择日期时间" align="right">
-            </el-date-picker>
-          </div>
-        </div>
       </template> -->
       <template v-slot:start_time>
         <div class="xy-table-item">
@@ -83,10 +86,8 @@
             <span style="color: red;font-weight: bold;padding-right: 4px;">*</span>开始时间：
           </div>
           <div class="xy-table-item-content">
-            <el-date-picker v-model="form.start_time"
-             style="width: 100%;"
-              value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss"
-             type="datetime" placeholder="选择日期时间" align="right"
+            <el-date-picker v-model="form.start_time" style="width: 100%;" value-format="yyyy-MM-dd HH:mm:ss"
+              format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="选择日期时间" align="right"
               :picker-options="pickerOptions">
             </el-date-picker>
           </div>
@@ -98,16 +99,14 @@
             <span style="color: red;font-weight: bold;padding-right: 4px;"></span>截止时间：
           </div>
           <div class="xy-table-item-content">
-            <el-date-picker v-model="form.end_time"
-             style="width: 100%;"
-            value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss"
-            type="datetime" placeholder="选择日期时间" align="right"
+            <el-date-picker v-model="form.end_time" style="width: 100%;" value-format="yyyy-MM-dd HH:mm:ss"
+              format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="选择日期时间" align="right"
               :picker-options="pickerOptions">
             </el-date-picker>
           </div>
         </div>
       </template>
-      <template v-slot:content v-if="form.type===3 || form.type===4">
+      <template v-slot:content v-if="form.type===3">
         <div class="xy-table-item">
           <div class="xy-table-item-label" style="font-weight: bold">
             <span style="color: red;font-weight: bold;padding-right: 4px;"></span>内容：
@@ -141,7 +140,7 @@
       return {
         isShow: false,
         type: 'add',
-        id: '',
+        id: '',
         showTinymce: false,
         pickerOptions: {
           shortcuts: [{
@@ -166,21 +165,22 @@
           }]
         },
         type_options: [{
-          id: 1,
-          value: '课程'
-        },
-        // {
-        //   id: 2,
-        //   value: '课表'
-        // },
-        {
-          id: 3,
-          value: '自定义事件'
-        }, {
-          id: 4,
-          value: '资讯'
-        }],
-        course_content_options:[],
+            id: 1,
+            value: '课程'
+          },
+          // {
+          //   id: 2,
+          //   value: '课表'
+          // },
+          {
+            id: 3,
+            value: '自定义事件'
+          }, {
+            id: 4,
+            value: '资讯'
+          }
+        ],
+        course_content_options: [],
         course_options: [],
         canSelect: false,
         form: {
@@ -191,7 +191,7 @@
           url: '',
           // date: '',
           start_time: '',
-          end_time: '',
+          end_time: '',
           content: '',
         },
         rules: {
@@ -203,17 +203,52 @@
             required: true,
             message: '请选择开始时间'
           }],
-          end_time: [{
-            required: true,
-            message: '请选择结束时间'
-          }],
-        }
+          // end_time: [{
+          //   required: true,
+          //   message: '请选择结束时间'
+          // }],
+        },
+        zixunList:[],
       }
     },
     created() {
-      this.getCourseList()
+      this.getCourseList()
+      this.getZxList()
     },
     methods: {
+      remoteMethod(query) {
+        if (query !== '') {
+          this.loading = true;
+          this.getZxList(query)
+        } else {
+          this.zixunList = [];
+        }
+      },
+      async getZxList(query) {
+        const proUrl = `${process.env.VUE_APP_PRO_API}`
+        var baseUrl = proUrl + '/e/extend/news.php'
+        try {
+          // 直接调用 axios.get()，传入接口地址和参数
+          const response = await axios.get(baseUrl, {
+            params: {
+              page: 1,
+              pagesize: 999,
+              keyword: query
+            }, // GET 参数（拼在 URL 后）
+            timeout: 5000 // 超时时间（毫秒）
+          });
+          // 请求成功，存储结果
+          if (response.status === 200) {
+            this.zixunList = response.data.rows;
+          }
+          this.loading = false
+          console.log('GET 请求成功：', response);
+        } catch (error) {
+          // 请求失败，处理错误
+          console.error('GET 请求失败：', error);
+          alert('请求失败：' + (error.response?.data?.msg || '网络错误'));
+        }
+      },
       async getCourseList() {
         const res = await courseIndex({
           page: 1,
@@ -239,44 +274,45 @@
           return
         }
         this.course_content_options = res.data
-      },
-      saveContent(e) {
-        this.form.content = e
+      },
+      saveContent(e) {
+        this.form.content = e
       },
       changeType(e) {
         console.log("type", e)
 
       },
       changeCourse(e) {
-        console.log("course", e)
+        console.log("course", e)
         // 获取课表
         if (this.form.type == 2) {
           this.form.course_content_id = ''
           this.getCourseContentList(e)
-        }
-        // 选择课程 自动填充
-        if(this.form.type==1){
-          this.course_options.map(item=>{
-            if(item.id===e){
-              this.form.title = item.name
-              this.form.start_time = item.start_date
-              this.form.end_time = item.end_date
+        }
+        // 选择课程 自动填充
+        if (this.form.type == 1) {
+          this.course_options.map(item => {
+            if (item.id === e) {
+              this.form.title = item.name
+              this.form.start_time = item.start_date?item.start_date+' 00:00:00':''
+              this.form.end_time = item.end_date?item.end_date+' 00:00:00':''
               this.form.date = item.start_date
-            }
-          })
+              this.form.url = item.url
+            }
+          })
         }
       },
       changeCourseContent(e) {
-        // 选择课表 自动填充
-        if(this.form.type==2){
-          this.course_content_options.map(item=>{
-            if(item.id===e){
-              this.form.title = item.theme
+        // 选择课表 自动填充
+        if (this.form.type == 2) {
+          this.course_content_options.map(item => {
+            if (item.id === e) {
+              this.form.title = item.theme
               this.form.start_time = item.start_date
-              this.form.end_time = item.end_date
-              this.form.date = item.start_date
-            }
-          })
+              this.form.end_time = item.end_date
+              this.form.date = item.start_date
+            }
+          })
         }
       },
       submit() {
@@ -310,24 +346,24 @@
     watch: {
       isShow(newVal) {
         if (newVal) {
-          if (this.type === 'editor') {
-            console.log("id",this.id)
+          if (this.type === 'editor') {
+            console.log("id", this.id)
             this.getDetail()
-          }else{
-            this.showTinymce = true
+          } else {
+            this.showTinymce = true
           }
         } else {
           this.id = ''
           this.showTinymce = false
           this.form = {
-            type: '',
-            course_id: '',
-            course_content_id: '',
-            title: '',
-            url: '',
-            date: '',
-            start_time: '',
-            end_time: '',
+            type: '',
+            course_id: '',
+            course_content_id: '',
+            title: '',
+            url: '',
+            date: '',
+            start_time: '',
+            end_time: '',
             content: '',
           }
           this.$refs['dialog'].reset()
diff --git a/src/views/calendar/index.vue b/src/views/calendar/index.vue
index eb4797a..44328af 100644
--- a/src/views/calendar/index.vue
+++ b/src/views/calendar/index.vue
@@ -1,709 +1,751 @@
-<template>
-  <div class="admin-calendar">
-    <!-- 顶部操作区 -->
-    <div class="admin-header">
-      <el-button type="success" icon="el-icon-plus" @click="openCreateModal('add')">新建日历事件</el-button>
-    </div>
-    <!-- 日历预览区 -->
-    <div class="admin-main">
-      <div class="calendar-panel">
-        <div class="calendar-wrapper">
-        <el-calendar v-model="calendarDate" :first-day-of-week="7">
-          <template slot="dateCell" slot-scope="{date}">
-            <div class="cell-content">
-                <span class="date-number">{{ date.getDate() }}</span>
-                <div class="event-list">
-                  <div 
-                    v-for="ev in eventsForDate(date)" 
-                    :key="ev._id" 
-                    :class="['event-item', getEventClass(ev, date)]"
-                    :title="getEventTooltip(ev, date)"
-                    @click.stop="openCreateModal('editor', ev.id)"
-                  >
-                    <span class="event-title">{{ ev.title }}</span>
-                  </div>
-                </div>
-              </div>
-            </template>
-          </el-calendar>
-          <!-- 连续事件覆盖层 -->
-          <div class="continuous-events-overlay">
-            <div 
-              v-for="event in getContinuousEvents()" 
-              :key="`continuous-${event.id}-${event.weekStart}`"
-              :class="['continuous-event', `event-type-${event.type || 'default'}`]"
-              :style="getContinuousEventStyle(event)"
-              :title="getEventTooltip(event, new Date(event.weekStart))"
-              @click.stop="openCreateModal('editor', event.id)"
-            >
-              {{ event.title }}
-            </div>
-              </div>
-        </div>
-      </div>
-    </div>
-    <addCalendar ref="addCalendar" @refresh="getList"></addCalendar>
-  </div>
-</template>
-
-<script>
-
-import addCalendar from './components/addCalendar.vue'
-  import {
-    index
-} from '@/api/calendars/index.js'
-  export default {
-  components: {
-      addCalendar
-    },
-    data() {
-      return {
-      list: [],
-      calendarDate: new Date()
-      }
-    },
-    computed: {
-    selectMonth() {
-      const now = this.calendarDate instanceof Date ? this.calendarDate : new Date(this.calendarDate)
-      const month = now.getMonth() + 1 < 10 ? '0' + (now.getMonth() + 1) : now.getMonth() + 1
-      const year = now.getFullYear()
-      return year + '-' + month
-      }
-    },
-    watch: {
-    calendarDate: {
-      handler() {
-        this.getList()
-      },
-      deep: true
-    }
-    },
-    created() {
-      this.getList()
-    },
-    methods: {
-    async getList() {
-        const res = await index({
-        month: this.selectMonth
-        })
-        this.list = res
-      },
-    openCreateModal(type, id) {
-      if (type === 'editor') {
-          this.$refs.addCalendar.id = id
-        }
-        this.$refs.addCalendar.type = type
-        this.$refs.addCalendar.isShow = true
-      },
-
-    eventsForDate(date) {
-      const d = new Date(date)
-      return this.list.filter(ev => {
-        const startDate = this.parseDateTime(ev.start_time)
-        
-        // 如果没有end_time，只在start_time的日期显示
-        if (!ev.end_time) {
-          const currentDate = new Date(d.getFullYear(), d.getMonth(), d.getDate())
-          const eventStartDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate())
-          return currentDate.getTime() === eventStartDate.getTime()
-        }
-        
-        const endDate = this.parseDateTime(ev.end_time)
-        
-        // 判断是否是跨天事件
-        const isMultiDay = startDate.getDate() !== endDate.getDate() || 
-                          startDate.getMonth() !== endDate.getMonth() || 
-                          startDate.getFullYear() !== endDate.getFullYear()
-        
-        // 跨天事件不在单元格中显示，只在覆盖层显示
-        if (isMultiDay) {
-          return false
-        }
-        
-        // 单天事件正常显示
-        const currentDate = new Date(d.getFullYear(), d.getMonth(), d.getDate())
-        const eventStartDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate())
-        return currentDate.getTime() === eventStartDate.getTime()
-      })
-    },
-    getEventClass(event, date) {
-      const startDate = new Date(event.start_time)
-      const currentDate = new Date(date)
-      
-      // 如果没有end_time，直接返回单天事件样式
-      if (!event.end_time) {
-        return `single-day event-type-${event.type || 'default'}`
-      }
-      
-      const endDate = new Date(event.end_time)
-      
-      // 判断是否是跨天事件
-      const isMultiDay = startDate.getDate() !== endDate.getDate() || 
-                        startDate.getMonth() !== endDate.getMonth() || 
-                        startDate.getFullYear() !== endDate.getFullYear()
-      
-      if (!isMultiDay) {
-        return `single-day event-type-${event.type || 'default'}`
-      }
-      
-      // 判断当前日期在跨天事件中的位置
-      const eventStartDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate())
-      const eventEndDate = new Date(endDate.getFullYear(), endDate.getMonth(), endDate.getDate())
-      const currentDateOnly = new Date(currentDate.getFullYear(), currentDate.getMonth(), currentDate.getDate())
-      
-      if (currentDateOnly.getTime() === eventStartDate.getTime()) {
-        return `multi-day-start event-type-${event.type || 'default'}`
-      } else if (currentDateOnly.getTime() === eventEndDate.getTime()) {
-        return `multi-day-end event-type-${event.type || 'default'}`
-      } else {
-        return `multi-day-middle event-type-${event.type || 'default'}`
-      }
-    },
-    getEventTooltip(event, date) {
-      const startDate = new Date(event.start_time)
-      
-      // 如果没有end_time，只显示事件标题和开始时间
-      if (!event.end_time) {
-        return `${event.title}\n时间：${this.formatDateTime(event.start_time)}`
-      }
-      
-      const endDate = new Date(event.end_time)
-      
-      const isMultiDay = startDate.getDate() !== endDate.getDate() || 
-                        startDate.getMonth() !== endDate.getMonth() || 
-                        startDate.getFullYear() !== endDate.getFullYear()
-      
-      if (isMultiDay) {
-        return `${event.title}\n时间：${this.formatDateTime(event.start_time)} ~ ${this.formatDateTime(event.end_time)}`
-        } else {
-        return `${event.title}\n时间：${this.formatDateTime(event.start_time)} ~ ${this.formatDateTime(event.end_time)}`
-      }
-    },
-    getContinuousEvents() {
-      const FIRST_DOW = 0 // 0=Sunday to match :first-day-of-week="7" on el-calendar
-      const continuousEvents = []
-
-      // 仅选择跨天事件
-      const multiDayEvents = this.list.filter(ev => {
-        if (!ev.end_time) return false
-        const s = this.parseDateTime(ev.start_time)
-        const e = this.parseDateTime(ev.end_time)
-        return s.toDateString() !== e.toDateString()
-      })
-
-      const currentMonth = this.calendarDate.getMonth()
-      const currentYear = this.calendarDate.getFullYear()
-      const monthStart = new Date(currentYear, currentMonth, 1)
-      const monthEnd = new Date(currentYear, currentMonth + 1, 0)
-
-      function getWeekStart(date) {
-        const d = new Date(date)
-        const jsDow = d.getDay() // 0..6 (Sun..Sat)
-        const offset = (jsDow - FIRST_DOW + 7) % 7
-        d.setDate(d.getDate() - offset)
-        return d
-      }
-
-      multiDayEvents.forEach(ev => {
-        const eventStart = this.parseDateTime(ev.start_time)
-        const eventEnd = this.parseDateTime(ev.end_time)
-
-        if (eventEnd < monthStart || eventStart > monthEnd) return
-
-        // Clamp to month range so we only render in current month viewport
-        const clampedStart = eventStart < monthStart ? monthStart : eventStart
-        const clampedEnd = eventEnd > monthEnd ? monthEnd : eventEnd
-
-        let cursor = getWeekStart(clampedStart)
-        while (cursor <= clampedEnd) {
-          const weekStart = new Date(cursor)
-          const weekEnd = new Date(cursor)
-          weekEnd.setDate(weekEnd.getDate() + 6)
-
-          // Segment inside this week
-          const segStart = clampedStart > weekStart ? clampedStart : weekStart
-          const segEnd = clampedEnd < weekEnd ? clampedEnd : weekEnd
-          if (segStart <= segEnd) {
-            const startCol = (segStart.getDay() - FIRST_DOW + 7) % 7
-            const endCol = (segEnd.getDay() - FIRST_DOW + 7) % 7
-            const spanCols = endCol - startCol + 1
-            continuousEvents.push({
-              ...ev,
-              weekStartISO: weekStart.toISOString(),
-              segStartISO: segStart.toISOString(),
-              segEndISO: segEnd.toISOString(),
-              startCol,
-              spanCols,
-              endCol
-            })
-          }
-          cursor.setDate(cursor.getDate() + 7)
-        }
-      })
-
-      // 为同一周的分段分配“轨道”（lane），避免垂直重叠
-      const byWeek = {}
-      continuousEvents.forEach(seg => {
-        const key = seg.weekStartISO
-        if (!byWeek[key]) byWeek[key] = []
-        byWeek[key].push(seg)
-      })
-
-      Object.values(byWeek).forEach(segs => {
-        // 按开始列排序，开始相同则优先更长的，减少冲突
-        segs.sort((a, b) => (a.startCol - b.startCol) || (b.spanCols - a.spanCols))
-        const laneEndCols = [] // 每个轨道当前占据的最后列
-        segs.forEach(seg => {
-          let placed = false
-          for (let i = 0; i < laneEndCols.length; i += 1) {
-            if (laneEndCols[i] < seg.startCol) {
-              seg.laneIndex = i
-              laneEndCols[i] = seg.endCol
-              placed = true
-              break
-            }
-          }
-          if (!placed) {
-            seg.laneIndex = laneEndCols.length
-            laneEndCols.push(seg.endCol)
-          }
-        })
-      })
-
-      return continuousEvents
-    },
-    getContinuousEventStyle(event) {
-      const FIRST_DOW = 0
-      const currentMonth = this.calendarDate.getMonth()
-      const currentYear = this.calendarDate.getFullYear()
-      const firstDay = new Date(currentYear, currentMonth, 1)
-
-      // 可控的视觉偏移：将分段起始向后顺延 7 天
-      const adjStart = new Date(event.segStartISO)
-      adjStart.setDate(adjStart.getDate() + 7)
-
-      const msPerDay = 1000 * 60 * 60 * 24
-      const daysFromFirstOfMonth = Math.floor((adjStart - firstDay) / msPerDay)
-      const firstDayOffset = (firstDay.getDay() - FIRST_DOW + 7) % 7
-      const totalDaysFromCalendarStart = daysFromFirstOfMonth + firstDayOffset
-      const weekRow = Math.floor(totalDaysFromCalendarStart / 7)
-
-      // 起始列使用偏移后的日期重新计算
-      const startColAdjusted = (adjStart.getDay() - FIRST_DOW + 7) % 7
-
-      const cellWidth = 100 / 7
-      const cellHeight = 100
-      const headerHeight = 50
-      const dateNumberHeight = 25
-      const eventHeight = 16
-      const eventSpacing = 2
-      const verticalOffset = (event.laneIndex || 0) * (eventHeight + eventSpacing)
-
-      return {
-        position: 'absolute',
-        left: `calc(${startColAdjusted * cellWidth}% + 2px)`,
-        top: `${headerHeight + weekRow * cellHeight + dateNumberHeight + verticalOffset}px`,
-        width: `calc(${event.spanCols * cellWidth}% - 4px)`,
-        height: `${eventHeight}px`,
-        zIndex: 1000,
-        background: `linear-gradient(90deg, ${this.getEventTypeColor(event.type)} 0%, ${this.darkenColor(this.getEventTypeColor(event.type))} 100%)`,
-        borderRadius: '3px',
-        fontSize: '11px',
-        lineHeight: `${eventHeight}px`,
-        color: 'white',
-        padding: '0 4px',
-        whiteSpace: 'nowrap',
-        overflow: 'hidden',
-        textOverflow: 'ellipsis',
-        cursor: 'pointer',
-        boxShadow: '0 1px 3px rgba(0, 0, 0, 0.3)'
-      }
-    },
-    getEventStyle(event, date) {
-      const startDate = new Date(event.start_time)
-      const currentDate = new Date(date)
-      
-      // 如果没有end_time，使用默认样式
-      if (!event.end_time) {
-        return {}
-      }
-      
-      const endDate = new Date(event.end_time)
-      
-      // 判断是否是跨天事件
-      const isMultiDay = startDate.getDate() !== endDate.getDate() || 
-                        startDate.getMonth() !== endDate.getMonth() || 
-                        startDate.getFullYear() !== endDate.getFullYear()
-      
-      if (!isMultiDay) {
-        return {}
-      }
-      
-      // 获取当前周的开始日期（周日）
-      const currentWeekStart = new Date(currentDate)
-      const dayOfWeek = currentDate.getDay()
-      currentWeekStart.setDate(currentDate.getDate() - dayOfWeek)
-      
-      // 计算事件在当前周的开始和结束位置
-      const eventStartDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate())
-      const eventEndDate = new Date(endDate.getFullYear(), endDate.getMonth(), endDate.getDate())
-      const currentDateOnly = new Date(currentDate.getFullYear(), currentDate.getMonth(), currentDate.getDate())
-      
-      // 计算当前周内事件的开始和结束天数
-      const weekStart = new Date(currentWeekStart)
-      const weekEnd = new Date(currentWeekStart)
-      weekEnd.setDate(weekEnd.getDate() + 6)
-      
-      // 事件在当前周的实际开始和结束日期
-      const eventWeekStart = eventStartDate < weekStart ? weekStart : eventStartDate
-      const eventWeekEnd = eventEndDate > weekEnd ? weekEnd : eventEndDate
-      
-      // 如果当前日期不在事件范围内，不应用特殊样式
-      if (currentDateOnly < eventWeekStart || currentDateOnly > eventWeekEnd) {
-        return {}
-      }
-      
-      // 如果是事件在当前周的第一天，显示标题并延伸到周末尾或事件结束
-      if (currentDateOnly.getTime() === eventWeekStart.getTime()) {
-        const startDayOfWeek = eventWeekStart.getDay()
-        const endDayOfWeek = eventWeekEnd.getDay()
-        const spanDays = endDayOfWeek - startDayOfWeek + 1
-        
-        // 根据事件类型设置背景色
-        const bgColor = this.getEventTypeColor(event.type)
-        
-        return {
-          position: 'absolute',
-          left: '0',
-          top: '1px',
-          width: `calc(${spanDays * 100}% - 2px)`,
-          zIndex: 10,
-          background: `linear-gradient(90deg, ${bgColor} 0%, ${this.darkenColor(bgColor)} 100%)`,
-          boxShadow: '0 1px 3px rgba(0, 0, 0, 0.2)',
-          border: '1px solid rgba(255, 255, 255, 0.3)',
-          borderRadius: '3px'
-        }
-      } else if (currentDateOnly > eventWeekStart && currentDateOnly <= eventWeekEnd) {
-        // 其他天完全隐藏内容，保留占位
-        return {
-          opacity: '0',
-          pointerEvents: 'none'
-        }
-      }
-      
-      return {}
-    },
-    getEventDisplayTitle(event, date) {
-      const startDate = new Date(event.start_time)
-      const currentDate = new Date(date)
-      
-      // 如果没有end_time，显示完整标题
-      if (!event.end_time) {
-        return event.title
-      }
-      
-      const endDate = new Date(event.end_time)
-      
-      // 判断是否是跨天事件
-      const isMultiDay = startDate.getDate() !== endDate.getDate() || 
-                        startDate.getMonth() !== endDate.getMonth() || 
-                        startDate.getFullYear() !== endDate.getFullYear()
-      
-      if (!isMultiDay) {
-        return event.title
-      }
-      
-      // 对于跨天事件，只在开始日期显示标题
-      const eventStartDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate())
-      const currentDateOnly = new Date(currentDate.getFullYear(), currentDate.getMonth(), currentDate.getDate())
-      
-      // 获取当前周的开始日期
-      const currentWeekStart = new Date(currentDate)
-      const dayOfWeek = currentDate.getDay()
-      currentWeekStart.setDate(currentDate.getDate() - dayOfWeek)
-      
-      const weekStart = new Date(currentWeekStart)
-      const eventWeekStart = eventStartDate < weekStart ? weekStart : eventStartDate
-      
-      if (currentDateOnly.getTime() === eventWeekStart.getTime()) {
-        return event.title
-      }
-      
-      return '' // 其他日期不显示标题
-    },
-    getEventTypeColor(type) {
-      // 根据事件类型返回不同颜色
-      const colorMap = {
-        1: '#67C23A', // 课程 - 绿色
-        2: '#409EFF', // 会议 - 蓝色
-        3: '#E6A23C', // 自定义事件 - 橙色
-        4: '#F56C6C', // 资讯 - 红色
-        5: '#909399', // 其他 - 灰色
-        default: '#409EFF' // 默认蓝色
-      }
-      return colorMap[type] || colorMap.default
-    },
-    // 可靠的日期解析：避免 Safari/时区导致的偏移
-    parseDateTime(dateTimeStr) {
-      if (!dateTimeStr) return null
-      // 支持 "YYYY-MM-DD HH:mm:ss" 或 "YYYY-MM-DD" 形式
-      const [datePart, timePart = '00:00:00'] = dateTimeStr.trim().split(/\s+/)
-      const [y, m, d] = datePart.split('-').map(n => parseInt(n, 10))
-      const [hh = 0, mm = 0, ss = 0] = timePart.split(':').map(n => parseInt(n, 10))
-      return new Date(y, (m || 1) - 1, d || 1, hh || 0, mm || 0, ss || 0)
-    },
-    darkenColor(color) {
-      // 将颜色变暗，用于渐变效果
-      const colorMap = {
-        '#67C23A': '#5CB85C', // 绿色变暗
-        '#409EFF': '#337ecc', // 蓝色变暗
-        '#E6A23C': '#D4952B', // 橙色变暗
-        '#F56C6C': '#E85555', // 红色变暗
-        '#909399': '#73767A'  // 灰色变暗
-      }
-      return colorMap[color] || '#337ecc'
-    },
-    formatDateTime(val) {
-      if (!val) return ''
-      return val.replace('T', ' ')
-      },
-      typeText(className) {
-      if (!className) return ''
-      if (className === 1) return '课程'
-      if (className === 3) return '自定义事件'
-      if (className === 4) return '资讯'
-      return ''
-      }
-    },
-    filters: {
-      formatDateTime(val) {
-      if (!val) return ''
-      return val.replace('T', ' ')
-      }
-    }
-  }
-</script>
-
-<style scoped lang="scss">
-  ::v-deep .el-calendar__body{
-    padding-left:0;
-    padding-right:0;
-  }
-  .admin-calendar {
-    background: #f4f6fa;
-    min-height: 100vh;
-    display: flex;
-    flex-direction: column;
-  }
-
-  .admin-header {
-    background: transparent;
-    padding: 20px 30px 10px 30px;
-    border-bottom: none;
-    box-shadow: none;
-  }
-
-  .admin-main {
-    flex: 1;
-    padding: 20px 30px;
-    overflow: hidden;
-  }
-
-  .calendar-panel {
-    background: #fff;
-    border-radius: 12px;
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
-    padding: 24px;
-    height: 100%;
-    overflow: auto;
-  }
-
-  .calendar-wrapper {
-    position: relative;
-  }
-
-  .continuous-events-overlay {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    pointer-events: none;
-    z-index: 100;
-  }
-
-  .continuous-event {
-    pointer-events: auto;
-    transition: all 0.2s ease;
-  }
-
-  .continuous-event:hover {
-    transform: translateY(-1px);
-    filter: brightness(1.1);
-    z-index: 101;
-  }
-
-  /* Element UI 日历样式覆盖 */
-  .calendar-panel ::v-deep .el-calendar-table {
-    overflow: visible;
-  }
-
-  .calendar-panel ::v-deep .el-calendar-table .el-calendar-day {
-    position: relative;
-    overflow: visible;
-    height: auto;
-    min-height: 100px;
-    padding: 4px;
-  }
-
-  .calendar-panel ::v-deep .el-calendar-table td {
-    position: relative;
-    overflow: visible;
-    border: 1px solid #ebeef5;
-  }
-
-  .calendar-panel ::v-deep .el-calendar-table tbody tr {
-    overflow: visible;
-  }
-
-  .calendar-panel ::v-deep .el-calendar-table tbody {
-    overflow: visible;
-  }
-
-  .cell-content {
-    position: relative;
-    min-height: 100px;
-    display: flex;
-    flex-direction: column;
-    padding: 2px;
-    overflow: visible;
-  }
-
-  .date-number {
-    font-weight: bold;
-    color: #333;
-    margin-bottom: 2px;
-    position: relative;
-    z-index: 1;
-  }
-
-  .event-list {
-    flex: 1;
-    overflow: visible;
-    position: relative;
-    z-index: 5;
-  }
-
-  .event-item {
-    font-size: 11px;
-    line-height: 14px;
-    padding: 1px 3px;
-    margin: 1px 0;
-    background: #409EFF;
-    color: white;
-    border-radius: 3px;
-    cursor: pointer;
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    transition: background-color 0.2s;
-    position: relative;
-  }
-
-  .event-title {
-    display: block;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  .event-item:hover {
-    background: #337ecc;
-  }
-
-  /* 不同事件类型的颜色 */
-  .event-item.event-type-1 {
-    background: #67C23A; /* 课程 - 绿色 */
-  }
-
-  .event-item.event-type-2 {
-    background: #409EFF; /* 会议 - 蓝色 */
-  }
-
-  .event-item.event-type-3 {
-    background: #E6A23C; /* 自定义事件 - 橙色 */
-  }
-
-  .event-item.event-type-4 {
-    background: #F56C6C; /* 资讯 - 红色 */
-  }
-
-  .event-item.event-type-5 {
-    background: #909399; /* 其他 - 灰色 */
-  }
-
-  .event-item.event-type-default {
-    background: #409EFF; /* 默认 - 蓝色 */
-  }
-
-  /* 悬停效果 */
-  .event-item.event-type-1:hover {
-    background: #5CB85C;
-  }
-
-  .event-item.event-type-2:hover {
-    background: #337ecc;
-  }
-
-  .event-item.event-type-3:hover {
-    background: #D4952B;
-  }
-
-  .event-item.event-type-4:hover {
-    background: #E85555;
-  }
-
-  .event-item.event-type-5:hover {
-    background: #73767A;
-  }
-
-  .event-item.event-type-default:hover {
-    background: #337ecc;
-  }
-
-  /* 连续事件的特殊样式 */
-  .event-item[style*="position: absolute"] {
-    border-radius: 3px !important;
-    font-weight: 500;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-  }
-
-  .event-item[style*="position: absolute"]:hover {
-    transform: translateY(-1px);
-    filter: brightness(1.1);
-  }
-
-  .mt-4 {
-    margin-top: 24px;
-  }
-
-  .mb-2 {
-    margin-bottom: 8px;
-  }
-
-  @media (max-width: 1200px) {
-    .admin-header {
-      padding: 15px 20px;
-    }
-    
-    .admin-main {
-      padding: 15px 20px;
-    }
-    
-    .calendar-panel {
-      padding: 16px;
-    }
-  }
-</style>
+<template>
+  <div class="admin-calendar">
+    <!-- 顶部操作区 -->
+    <div class="admin-header">
+      <el-button type="success" icon="el-icon-plus" @click="openCreateModal('add')">新建日历事件</el-button>
+      </div>
+      <!-- 日历预览区 -->
+    <div class="admin-main">
+      <div class="calendar-panel">
+        <div class="calendar-wrapper">
+        <el-calendar v-model="calendarDate" :first-day-of-week="1">
+          <template slot="dateCell" slot-scope="{date}">
+            <div class="cell-content">
+                <span class="date-number">{{ date.getDate() }}</span>
+                <div class="event-list">
+                  <div 
+                    v-for="ev in eventsForDate(date)" 
+                    :key="ev._id" 
+                    :class="['event-item', getEventClass(ev, date)]"
+                    :title="getEventTooltip(ev, date)"
+                    @click.stop="openCreateModal('editor', ev.id)"
+                  >
+                    <span class="event-title">{{ ev.title }}</span>
+                  </div>
+              </div>
+            </div>
+          </template>
+        </el-calendar>
+          <!-- 连续事件覆盖层 -->
+          <div class="continuous-events-overlay">
+            <div 
+              v-for="event in getContinuousEvents()" 
+              :key="`continuous-${event.id}-${event.segStartISO}`"
+              :class="['continuous-event', `event-type-${event.type || 'default'}`]"
+              :style="getContinuousEventStyle(event)"
+              :title="getEventTooltip(event, new Date(event.segStartISO))"
+              @click.stop="openCreateModal('editor', event.id)"
+            >
+              {{ event.title }}
+              </div>
+              </div>
+        </div>
+      </div>
+    </div>
+    <addCalendar ref="addCalendar" @refresh="getList"></addCalendar>
+  </div>
+</template>
+
+<script>
+
+import addCalendar from './components/addCalendar.vue'
+  import {
+    index
+} from '@/api/calendars/index.js'
+  export default {
+  components: {
+      addCalendar
+    },
+    data() {
+      return {
+      list: [],
+      calendarDate: new Date()
+      }
+    },
+    computed: {
+    selectMonth() {
+      const now = this.calendarDate instanceof Date ? this.calendarDate : new Date(this.calendarDate)
+      const month = now.getMonth() + 1 < 10 ? '0' + (now.getMonth() + 1) : now.getMonth() + 1
+      const year = now.getFullYear()
+      return year + '-' + month
+      }
+    },
+    watch: {
+    calendarDate: {
+      handler() {
+        this.getList()
+      },
+      deep: true
+    }
+    },
+    created() {
+      this.getList()
+    },
+    methods: {
+    async getList() {
+        const res = await index({
+        month: this.selectMonth
+        })
+        this.list = res
+      },
+    openCreateModal(type, id) {
+      if (type === 'editor') {
+          this.$refs.addCalendar.id = id
+        }
+        this.$refs.addCalendar.type = type
+        this.$refs.addCalendar.isShow = true
+      },
+
+    eventsForDate(date) {
+      const d = new Date(date)
+      return this.list.filter(ev => {
+        const startDate = this.parseDateTime(ev.start_time)
+        
+        // 如果没有end_time，只在start_time的日期显示
+        if (!ev.end_time) {
+          const currentDate = new Date(d.getFullYear(), d.getMonth(), d.getDate())
+          const eventStartDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate())
+          return currentDate.getTime() === eventStartDate.getTime()
+        }
+        
+        const endDate = this.parseDateTime(ev.end_time)
+        
+        // 判断是否是跨天事件
+        const isMultiDay = startDate.getDate() !== endDate.getDate() || 
+                          startDate.getMonth() !== endDate.getMonth() || 
+                          startDate.getFullYear() !== endDate.getFullYear()
+        
+        // 跨天事件不在单元格中显示，只在覆盖层显示
+        if (isMultiDay) {
+          return false
+        }
+        
+        // 单天事件正常显示
+        const currentDate = new Date(d.getFullYear(), d.getMonth(), d.getDate())
+        const eventStartDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate())
+        return currentDate.getTime() === eventStartDate.getTime()
+      })
+    },
+    getEventClass(event, date) {
+      const startDate = new Date(event.start_time)
+      const currentDate = new Date(date)
+      
+      // 如果没有end_time，直接返回单天事件样式
+      if (!event.end_time) {
+        return `single-day event-type-${event.type || 'default'}`
+      }
+      
+      const endDate = new Date(event.end_time)
+      
+      // 判断是否是跨天事件
+      const isMultiDay = startDate.getDate() !== endDate.getDate() || 
+                        startDate.getMonth() !== endDate.getMonth() || 
+                        startDate.getFullYear() !== endDate.getFullYear()
+      
+      if (!isMultiDay) {
+        return `single-day event-type-${event.type || 'default'}`
+      }
+      
+      // 判断当前日期在跨天事件中的位置
+      const eventStartDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate())
+      const eventEndDate = new Date(endDate.getFullYear(), endDate.getMonth(), endDate.getDate())
+      const currentDateOnly = new Date(currentDate.getFullYear(), currentDate.getMonth(), currentDate.getDate())
+      
+      if (currentDateOnly.getTime() === eventStartDate.getTime()) {
+        return `multi-day-start event-type-${event.type || 'default'}`
+      } else if (currentDateOnly.getTime() === eventEndDate.getTime()) {
+        return `multi-day-end event-type-${event.type || 'default'}`
+      } else {
+        return `multi-day-middle event-type-${event.type || 'default'}`
+      }
+    },
+    getEventTooltip(event, date) {
+      const startDate = new Date(event.start_time)
+      
+      // 如果没有end_time，只显示事件标题和开始时间
+      if (!event.end_time) {
+        return `${event.title}\n时间：${this.formatDateTime(event.start_time)}`
+      }
+      
+      const endDate = new Date(event.end_time)
+      
+      const isMultiDay = startDate.getDate() !== endDate.getDate() || 
+                        startDate.getMonth() !== endDate.getMonth() || 
+                        startDate.getFullYear() !== endDate.getFullYear()
+      
+      if (isMultiDay) {
+        return `${event.title}\n时间：${this.formatDateTime(event.start_time)} ~ ${this.formatDateTime(event.end_time)}`
+        } else {
+        return `${event.title}\n时间：${this.formatDateTime(event.start_time)} ~ ${this.formatDateTime(event.end_time)}`
+      }
+    },
+    getContinuousEvents() {
+      const FIRST_DOW = 1 // 1=Monday to match :first-day-of-week="1"
+      const OFFSET_DAYS = 0 // 不做任何全局偏移
+      const continuousEvents = []
+
+      // 仅选择跨天事件
+      const multiDayEvents = this.list.filter(ev => {
+        if (!ev.end_time) return false
+        const s = this.parseDateTime(ev.start_time)
+        const e = this.parseDateTime(ev.end_time)
+        return s.toDateString() !== e.toDateString()
+      })
+
+      const currentMonth = this.calendarDate.getMonth()
+      const currentYear = this.calendarDate.getFullYear()
+      const monthStart = new Date(currentYear, currentMonth, 1)
+      const monthEnd = new Date(currentYear, currentMonth + 1, 0)
+
+      function getWeekStart(date) {
+        const d = new Date(date)
+        const jsDow = d.getDay() // 0..6 (Sun..Sat)
+        const offset = (jsDow - FIRST_DOW + 7) % 7
+        d.setDate(d.getDate() - offset)
+        return d
+      }
+
+      function adjustEndForDisplay(d) {
+        // 若结束时间恰好为 00:00:00，则视为不包含该天（显示到前一日），避免与下一事件在同日重叠
+        const end = new Date(d)
+        if (end.getHours() === 0 && end.getMinutes() === 0 && end.getSeconds() === 0) {
+          end.setSeconds(end.getSeconds() - 1)
+        }
+        return end
+      }
+
+      multiDayEvents.forEach(ev => {
+        const eventStart = this.parseDateTime(ev.start_time)
+        const eventEndRaw = this.parseDateTime(ev.end_time)
+        const eventEnd = adjustEndForDisplay(eventEndRaw)
+
+        if (eventEnd < monthStart || eventStart > monthEnd) return
+
+        // Clamp to month range so we only render in current month viewport
+        const clampedStart = eventStart < monthStart ? monthStart : eventStart
+        const clampedEnd = eventEnd > monthEnd ? monthEnd : eventEnd
+
+        let cursor = getWeekStart(clampedStart)
+        while (cursor <= clampedEnd) {
+          const weekStart = new Date(cursor)
+          const weekEnd = new Date(cursor)
+          weekEnd.setDate(weekEnd.getDate() + 6)
+
+          // Segment inside this week
+          const segStart = clampedStart > weekStart ? clampedStart : weekStart
+          const segEnd = clampedEnd < weekEnd ? clampedEnd : weekEnd
+          if (segStart <= segEnd) {
+            const startCol = (segStart.getDay() - FIRST_DOW + 7) % 7
+            const endCol = (segEnd.getDay() - FIRST_DOW + 7) % 7
+            const spanCols = endCol - startCol + 1
+
+            // 计算用于显示的偏移后起点与周键
+            const adjStart = new Date(segStart)
+            adjStart.setDate(adjStart.getDate() + OFFSET_DAYS)
+            const displayWeekStart = getWeekStart(adjStart)
+            const displayStartCol = (adjStart.getDay() - FIRST_DOW + 7) % 7
+            const displayEndCol = displayStartCol + spanCols - 1
+
+            continuousEvents.push({
+              ...ev,
+              weekStartISO: weekStart.toISOString(),
+              segStartISO: segStart.toISOString(),
+              segEndISO: segEnd.toISOString(),
+              startCol,
+              spanCols,
+              endCol,
+              // 显示用字段（含偏移）
+              adjSegStartISO: adjStart.toISOString(),
+              displayWeekStartISO: displayWeekStart.toISOString(),
+              displayStartCol,
+              displayEndCol,
+              laneIndex: 0
+            })
+          }
+          cursor.setDate(cursor.getDate() + 7)
+        }
+      })
+
+      // 为同一周的分段分配“轨道”（lane），避免垂直重叠
+      const byWeek = {}
+      continuousEvents.forEach(seg => {
+        const key = seg.displayWeekStartISO || seg.weekStartISO
+        if (!byWeek[key]) byWeek[key] = []
+        byWeek[key].push(seg)
+      })
+
+      Object.values(byWeek).forEach(segs => {
+        // 按开始列排序，开始相同则优先更长的，减少冲突；开始与长度都相同再按 id 稳定排序
+        segs.sort((a, b) => (a.displayStartCol - b.displayStartCol) || (b.spanCols - a.spanCols) || String(a.id).localeCompare(String(b.id)))
+        const laneEndCols = [] // 每个轨道当前占据的最后列（显示列）
+        const placedSegs = []
+        segs.forEach(seg => {
+          let placed = false
+          for (let i = 0; i < laneEndCols.length; i += 1) {
+              // 只要前一个轨道的结束列 < 当前分段的开始列，就可复用该轨道
+            if (laneEndCols[i] < seg.displayStartCol) {
+              seg.laneIndex = i
+              laneEndCols[i] = seg.displayEndCol
+              placed = true
+              break
+            }
+          }
+          if (!placed) {
+            seg.laneIndex = laneEndCols.length
+            laneEndCols.push(seg.displayEndCol)
+          }
+          placedSegs.push(seg)
+        })
+        // 同一轨道再做“同起始列”的细分：将完全同起止的切片平移到新轨道
+        const seen = {}
+        placedSegs.forEach(seg => {
+          const k = `${seg.displayStartCol}-${seg.displayEndCol}-${seg.laneIndex}`
+          if (seen[k]) {
+            // 已存在相同起止且同轨道，放到新轨道
+            seg.laneIndex = ++seen[k].maxLane
+        } else {
+            seen[k] = { maxLane: seg.laneIndex }
+          }
+        })
+      })
+
+      return continuousEvents
+    },
+    getContinuousEventStyle(event) {
+      const FIRST_DOW = 1
+      const currentMonth = this.calendarDate.getMonth()
+      const currentYear = this.calendarDate.getFullYear()
+      const firstDay = new Date(currentYear, currentMonth, 1)
+
+      // 可控的视觉偏移：使用预计算的偏移起点
+      const adjStart = new Date(event.adjSegStartISO || event.segStartISO)
+
+      const msPerDay = 1000 * 60 * 60 * 24
+      const firstDayOffset = (firstDay.getDay() - FIRST_DOW + 7) % 7
+      // 使用显示用周起点来确定行，确保与分组一致
+      const displayWeekStart = new Date(event.displayWeekStartISO || adjStart)
+      const daysFromFirstOfMonth = Math.floor((displayWeekStart - firstDay) / msPerDay)
+      const totalDaysFromCalendarStart = daysFromFirstOfMonth + firstDayOffset
+      const weekRow = Math.floor(totalDaysFromCalendarStart / 7)
+
+      // 起始列使用偏移后的日期重新计算（若已携带显示列则直接用）
+      const startColAdjusted = (event.displayStartCol != null)
+        ? event.displayStartCol
+        : (adjStart.getDay() - FIRST_DOW + 7) % 7
+
+      const cellWidth = 100 / 7
+      const cellHeight = 100
+      const headerHeight = 50
+      const dateNumberHeight = 25
+      const eventHeight = 16
+      const eventSpacing = 2
+      const verticalOffset = (event.laneIndex || 0) * (eventHeight + eventSpacing)
+
+      return {
+        position: 'absolute',
+        left: `calc(${startColAdjusted * cellWidth}% + 2px)`,
+        top: `${headerHeight + weekRow * cellHeight + dateNumberHeight + verticalOffset}px`,
+        width: `calc(${event.spanCols * cellWidth}% - 4px)`,
+        height: `${eventHeight}px`,
+        zIndex: 1000,
+        background: `linear-gradient(90deg, ${this.getEventTypeColor(event.type)} 0%, ${this.darkenColor(this.getEventTypeColor(event.type))} 100%)`,
+        borderRadius: '3px',
+        fontSize: '11px',
+        lineHeight: `${eventHeight}px`,
+        color: 'white',
+        padding: '0 4px',
+        whiteSpace: 'nowrap',
+        overflow: 'hidden',
+        textOverflow: 'ellipsis',
+        cursor: 'pointer',
+        boxShadow: '0 1px 3px rgba(0, 0, 0, 0.3)'
+      }
+    },
+    getEventStyle(event, date) {
+      const startDate = new Date(event.start_time)
+      const currentDate = new Date(date)
+      
+      // 如果没有end_time，使用默认样式
+      if (!event.end_time) {
+        return {}
+      }
+      
+      const endDate = new Date(event.end_time)
+      
+      // 判断是否是跨天事件
+      const isMultiDay = startDate.getDate() !== endDate.getDate() || 
+                        startDate.getMonth() !== endDate.getMonth() || 
+                        startDate.getFullYear() !== endDate.getFullYear()
+      
+      if (!isMultiDay) {
+        return {}
+      }
+      
+      // 获取当前周的开始日期（周日）
+      const currentWeekStart = new Date(currentDate)
+      const dayOfWeek = currentDate.getDay()
+      currentWeekStart.setDate(currentDate.getDate() - dayOfWeek)
+      
+      // 计算事件在当前周的开始和结束位置
+      const eventStartDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate())
+      const eventEndDate = new Date(endDate.getFullYear(), endDate.getMonth(), endDate.getDate())
+      const currentDateOnly = new Date(currentDate.getFullYear(), currentDate.getMonth(), currentDate.getDate())
+      
+      // 计算当前周内事件的开始和结束天数
+      const weekStart = new Date(currentWeekStart)
+      const weekEnd = new Date(currentWeekStart)
+      weekEnd.setDate(weekEnd.getDate() + 6)
+      
+      // 事件在当前周的实际开始和结束日期
+      const eventWeekStart = eventStartDate < weekStart ? weekStart : eventStartDate
+      const eventWeekEnd = eventEndDate > weekEnd ? weekEnd : eventEndDate
+      
+      // 如果当前日期不在事件范围内，不应用特殊样式
+      if (currentDateOnly < eventWeekStart || currentDateOnly > eventWeekEnd) {
+        return {}
+      }
+      
+      // 如果是事件在当前周的第一天，显示标题并延伸到周末尾或事件结束
+      if (currentDateOnly.getTime() === eventWeekStart.getTime()) {
+        const startDayOfWeek = eventWeekStart.getDay()
+        const endDayOfWeek = eventWeekEnd.getDay()
+        const spanDays = endDayOfWeek - startDayOfWeek + 1
+        
+        // 根据事件类型设置背景色
+        const bgColor = this.getEventTypeColor(event.type)
+        
+        return {
+          position: 'absolute',
+          left: '0',
+          top: '1px',
+          width: `calc(${spanDays * 100}% - 2px)`,
+          zIndex: 10,
+          background: `linear-gradient(90deg, ${bgColor} 0%, ${this.darkenColor(bgColor)} 100%)`,
+          boxShadow: '0 1px 3px rgba(0, 0, 0, 0.2)',
+          border: '1px solid rgba(255, 255, 255, 0.3)',
+          borderRadius: '3px'
+        }
+      } else if (currentDateOnly > eventWeekStart && currentDateOnly <= eventWeekEnd) {
+        // 其他天完全隐藏内容，保留占位
+        return {
+          opacity: '0',
+          pointerEvents: 'none'
+        }
+      }
+      
+      return {}
+    },
+    getEventDisplayTitle(event, date) {
+      const startDate = new Date(event.start_time)
+      const currentDate = new Date(date)
+      
+      // 如果没有end_time，显示完整标题
+      if (!event.end_time) {
+        return event.title
+      }
+      
+      const endDate = new Date(event.end_time)
+      
+      // 判断是否是跨天事件
+      const isMultiDay = startDate.getDate() !== endDate.getDate() || 
+                        startDate.getMonth() !== endDate.getMonth() || 
+                        startDate.getFullYear() !== endDate.getFullYear()
+      
+      if (!isMultiDay) {
+        return event.title
+      }
+      
+      // 对于跨天事件，只在开始日期显示标题
+      const eventStartDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate())
+      const currentDateOnly = new Date(currentDate.getFullYear(), currentDate.getMonth(), currentDate.getDate())
+      
+      // 获取当前周的开始日期
+      const currentWeekStart = new Date(currentDate)
+      const dayOfWeek = currentDate.getDay()
+      currentWeekStart.setDate(currentDate.getDate() - dayOfWeek)
+      
+      const weekStart = new Date(currentWeekStart)
+      const eventWeekStart = eventStartDate < weekStart ? weekStart : eventStartDate
+      
+      if (currentDateOnly.getTime() === eventWeekStart.getTime()) {
+        return event.title
+      }
+      
+      return '' // 其他日期不显示标题
+    },
+    getEventTypeColor(type) {
+      // 根据事件类型返回不同颜色
+      const colorMap = {
+        1: '#67C23A', // 课程 - 绿色
+        2: '#409EFF', // 会议 - 蓝色
+        3: '#E6A23C', // 自定义事件 - 橙色
+        4: '#F56C6C', // 资讯 - 红色
+        5: '#909399', // 其他 - 灰色
+        default: '#409EFF' // 默认蓝色
+      }
+      return colorMap[type] || colorMap.default
+    },
+    // 可靠的日期解析：避免 Safari/时区导致的偏移
+    parseDateTime(dateTimeStr) {
+      if (!dateTimeStr) return null
+      // 支持 "YYYY-MM-DD HH:mm:ss" 或 "YYYY-MM-DD" 形式
+      const [datePart, timePart = '00:00:00'] = dateTimeStr.trim().split(/\s+/)
+      const [y, m, d] = datePart.split('-').map(n => parseInt(n, 10))
+      const [hh = 0, mm = 0, ss = 0] = timePart.split(':').map(n => parseInt(n, 10))
+      return new Date(y, (m || 1) - 1, d || 1, hh || 0, mm || 0, ss || 0)
+    },
+    darkenColor(color) {
+      // 将颜色变暗，用于渐变效果
+      const colorMap = {
+        '#67C23A': '#5CB85C', // 绿色变暗
+        '#409EFF': '#337ecc', // 蓝色变暗
+        '#E6A23C': '#D4952B', // 橙色变暗
+        '#F56C6C': '#E85555', // 红色变暗
+        '#909399': '#73767A'  // 灰色变暗
+      }
+      return colorMap[color] || '#337ecc'
+    },
+    formatDateTime(val) {
+      if (!val) return ''
+      return val.replace('T', ' ')
+      },
+      typeText(className) {
+      if (!className) return ''
+      if (className === 1) return '课程'
+      if (className === 3) return '自定义事件'
+      if (className === 4) return '资讯'
+      return ''
+      }
+    },
+    filters: {
+      formatDateTime(val) {
+      if (!val) return ''
+      return val.replace('T', ' ')
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  ::v-deep .el-calendar__body{
+    padding-left:0;
+    padding-right:0;
+  }
+  .admin-calendar {
+    background: #f4f6fa;
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+  }
+
+  .admin-header {
+    background: transparent;
+    padding: 20px 30px 10px 30px;
+    border-bottom: none;
+    box-shadow: none;
+  }
+
+  .admin-main {
+    flex: 1;
+    padding: 20px 30px;
+    overflow: hidden;
+  }
+
+  .calendar-panel {
+    background: #fff;
+    border-radius: 12px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+    padding: 24px;
+    height: 100%;
+    overflow: auto;
+  }
+
+  .calendar-wrapper {
+    position: relative;
+  }
+
+  .continuous-events-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    pointer-events: none;
+    z-index: 100;
+  }
+
+  .continuous-event {
+    pointer-events: auto;
+    transition: all 0.2s ease;
+  }
+
+  .continuous-event:hover {
+    transform: translateY(-1px);
+    filter: brightness(1.1);
+    z-index: 101;
+  }
+
+  /* Element UI 日历样式覆盖 */
+  .calendar-panel ::v-deep .el-calendar-table {
+    overflow: visible;
+  }
+
+  .calendar-panel ::v-deep .el-calendar-table .el-calendar-day {
+    position: relative;
+    overflow: visible;
+    height: auto;
+    min-height: 100px;
+    padding: 4px;
+  }
+
+  .calendar-panel ::v-deep .el-calendar-table td {
+    position: relative;
+    overflow: visible;
+    border: 1px solid #ebeef5;
+  }
+
+  .calendar-panel ::v-deep .el-calendar-table tbody tr {
+    overflow: visible;
+  }
+
+  .calendar-panel ::v-deep .el-calendar-table tbody {
+    overflow: visible;
+  }
+
+  .cell-content {
+    position: relative;
+    min-height: 100px;
+    display: flex;
+    flex-direction: column;
+    padding: 2px;
+    overflow: visible;
+  }
+
+  .date-number {
+    font-weight: bold;
+    color: #333;
+    margin-bottom: 2px;
+    position: relative;
+    z-index: 1;
+  }
+
+  .event-list {
+    flex: 1;
+    overflow: visible;
+    position: relative;
+    z-index: 5;
+  }
+
+  .event-item {
+    font-size: 11px;
+    line-height: 14px;
+    padding: 1px 3px;
+    margin: 1px 0;
+    background: #409EFF;
+    color: white;
+    border-radius: 3px;
+    cursor: pointer;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    transition: background-color 0.2s;
+    position: relative;
+  }
+
+  .event-title {
+    display: block;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .event-item:hover {
+    background: #337ecc;
+  }
+
+  /* 不同事件类型的颜色 */
+  .event-item.event-type-1 {
+    background: #67C23A; /* 课程 - 绿色 */
+  }
+
+  .event-item.event-type-2 {
+    background: #409EFF; /* 会议 - 蓝色 */
+  }
+
+  .event-item.event-type-3 {
+    background: #E6A23C; /* 自定义事件 - 橙色 */
+  }
+
+  .event-item.event-type-4 {
+    background: #F56C6C; /* 资讯 - 红色 */
+  }
+
+  .event-item.event-type-5 {
+    background: #909399; /* 其他 - 灰色 */
+  }
+
+  .event-item.event-type-default {
+    background: #409EFF; /* 默认 - 蓝色 */
+  }
+
+  /* 悬停效果 */
+  .event-item.event-type-1:hover {
+    background: #5CB85C;
+  }
+
+  .event-item.event-type-2:hover {
+    background: #337ecc;
+  }
+
+  .event-item.event-type-3:hover {
+    background: #D4952B;
+  }
+
+  .event-item.event-type-4:hover {
+    background: #E85555;
+  }
+
+  .event-item.event-type-5:hover {
+    background: #73767A;
+  }
+
+  .event-item.event-type-default:hover {
+    background: #337ecc;
+  }
+
+  /* 连续事件的特殊样式 */
+  .event-item[style*="position: absolute"] {
+    border-radius: 3px !important;
+    font-weight: 500;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .event-item[style*="position: absolute"]:hover {
+    transform: translateY(-1px);
+    filter: brightness(1.1);
+  }
+
+  .mt-4 {
+    margin-top: 24px;
+  }
+
+  .mb-2 {
+    margin-bottom: 8px;
+  }
+
+  @media (max-width: 1200px) {
+    .admin-header {
+      padding: 15px 20px;
+  }
+
+    .admin-main {
+      padding: 15px 20px;
+    }
+    
+    .calendar-panel {
+      padding: 16px;
+    }
+  }
+</style>
diff --git a/src/views/course/components/addCourse.vue b/src/views/course/components/addCourse.vue
index df3659c..2015a5f 100644
--- a/src/views/course/components/addCourse.vue
+++ b/src/views/course/components/addCourse.vue
@@ -57,8 +57,9 @@
             <span style="color: red;font-weight: bold;padding-right: 4px;"></span>资讯链接：
           </div>
           <div class="xy-table-item-content">
-            <el-select v-model="form.url" placeholder="请选择" clearable style="width: 100%;">
-              <el-option v-for="item in false_or_true" :key="item.id" :label="item.value" :value="item.id">
+            <el-select filterable remote v-model="form.url" :remote-method="remoteMethod" :loading="loading"
+              placeholder="请输入关键词查询资讯" clearable style="width: 100%;">
+              <el-option v-for="item in zixunList" :key="item.id" :label="item.title" :value="item.titleurl">
               </el-option>
             </el-select>
           </div>
@@ -405,31 +406,42 @@
           sort_name: 'sort',
           sort_type: 'ASC'
         },
-        formList: [],
-        zxkeyword:'',
-        zixunList:[]
+        formList: [],
+        loading: false,
+        zixunList: []
       }
     },
-    created() {
-      this.getZxList()
+    created() {
+      this.getZxList()
     },
     methods: {
-      async getZxList() {
+      remoteMethod(query) {
+        if (query !== '') {
+          this.loading = true;
+          this.getZxList(query)
+        } else {
+          this.zixunList = [];
+        }
+      },
+      async getZxList(query) {
         const proUrl = `${process.env.VUE_APP_PRO_API}`
-        var baseUrl  = proUrl + '/e/extend/news.php'
+        var baseUrl = proUrl + '/e/extend/news.php'
         try {
           // 直接调用 axios.get()，传入接口地址和参数
           const response = await axios.get(baseUrl, {
             params: {
-              page:1,
-              pagesize:5,
-              keyword:this.zxkeyword
+              page: 1,
+              pagesize: 999,
+              keyword: query
             }, // GET 参数（拼在 URL 后）
             timeout: 5000 // 超时时间（毫秒）
           });
-          // 请求成功，存储结果
-          this.zixunList = response.data;
-          console.log('GET 请求成功：', response.data);
+          // 请求成功，存储结果
+          if(response.status===200){
+            this.zixunList = response.data.rows;
+          }
+          this.loading = false
+          console.log('GET 请求成功：', response);
         } catch (error) {
           // 请求失败，处理错误
           console.error('GET 请求失败：', error);
diff --git a/src/views/courseQr/index.vue b/src/views/courseQr/index.vue
index 1f6eb1e..0cc5ad8 100644
--- a/src/views/courseQr/index.vue
+++ b/src/views/courseQr/index.vue
@@ -31,7 +31,7 @@
               <div class="course-info">
                 <span><i class="el-icon-date"></i> {{ course.date }} - {{course.period}}</span>
                 <span><i class="el-icon-location"></i> {{ course.address }}</span>
-                <span><i class="el-icon-user"></i> {{ course.teacher.name }}</span>
+                <span><i class="el-icon-user"></i> {{ course.teacher?course.teacher.name:'' }}</span>
               </div>
             </div>
           </template>
@@ -64,7 +64,7 @@
                 <div><strong>主题：</strong>{{ selectedCourse.theme }}</div>
                 <div><strong>时间：</strong>{{ selectedCourse.date }} - {{selectedCourse.period}}</div>
                 <div><strong>地点：</strong>{{ selectedCourse.address }}</div>
-                <div><strong>主讲：</strong>{{ selectedCourse.teacher.name }}</div>
+                <div><strong>主讲：</strong>{{ selectedCourse.teacher?selectedCourse.teacher.name:'' }}</div>
               </div>
             </div>
             <div class="qr-actions">
@@ -185,8 +185,14 @@
             op: 'eq',
             value: date ? date : ''
           }]
-        })
-        this.courseContentList = res.data
+        })
+        if(res.data.length>0){
+
+          this.courseContentList = res.data
+        }else{
+          this.courseContentList = []
+          this.$message.warning("该课程还未添加课表");
+        }
       },
       getCousreContent(){
         this.getCourseContent(this.course_id,this.course_date)