9/5會議時間

src/content/Homepage/WorkCollaboration/ConferenceManagement/ConferenceOverview/Overview/index.vue

@@ -21,76 +21,96 @@
         >
         <!-- TABLE -->
         <b-table
-        :items="fullList"
+        :items="sortedList"
         :fields="fields"
         :filter="filter"
         thead-class="thClass"
+        small
         class="text-center"
         responsive="sm"
         striped
         bordered
         :per-page="perPage"
         :current-page="currentPage"
+        :sort-desc.sync="sortDesc"
+        :sort-by.sync="sortBy"
         style="overflow-x: hidden; margin-left: 10px"
         >
         <!-- HEAD -->
-        <template #head()="{label}">
-          <span style="font-weight: normal; color: white; font-size: 15px">{{
-            label
-          }}</span>
+        <template #head()="{ label, field: { key, sortable }}">
+            <span style="font-weight: normal; color: white; font-size: 1.9vh">{{ label }}</span>
+            <template v-if="sortable && key !== 'combined_datetime'">
+                <b-icon font-scale="1.3" v-if="sortBy !== key" icon="arrow-down-up"></b-icon>
+                <b-icon font-scale="1.3" v-else-if="sortDesc" icon="arrow-down"></b-icon>
+                <b-icon font-scale="1.3" v-else icon="arrow-up"></b-icon>
+            </template>
         </template>
         <!-- BODY -->
-        <!-- 會議日期 -->
-        <template #cell(date)="data">
-            <span style="font-weight: normal; color: black; font-size: 15px">
-              {{ getFormattedDate(data.item.conference_date) }}
-              <!-- {{ data.item.conference_time }} -->
-              <!-- {{ getFormattedTime(data.item.conference_time) }} -->
+        <!-- 會議時間 -->
+        <template #cell(combined_datetime)="data">
+          <span style="font-weight: normal; color: black; font-size: 1.9vh">
+            {{ formatCombinedDateTime(data.value, 'combined_datetime', data.item) }}
+          </span>
+        </template>
+        <!-- <template v-slot:cell(conference_date)="data">
+           <span style="font-weight: normal; color: black; font-size: 1.9vh">
+            {{ getFormattedDateTime(data.value) }} -->
+             <!-- {{ getFormattedDateTime(data.item.conference_date, data.item.conference_time) }} -->
+           <!-- </span>
+        </template> -->
+        <!-- <template v-slot:cell(conference_date)="data">
+            <span style="font-weight: normal; color: black; font-size: 1.9vh">
+              {{ getFormattedDate(data.value) }}
+            </span>
+        </template> -->
+        <!-- 會議結束時間 -->
+        <template #cell(end_time)="data">
+            <span style="font-weight: normal; color: black; font-size: 1.9vh">
+              {{ getFormattedTime(data.value) }}
             </span>
-          </template>
-          <!-- 會議名稱 -->
-          <template #cell(conference_name)="data">
+        </template>
+        <!-- 會議名稱 -->
+        <template #cell(conference_name)="data">
             <router-link
               :to="{
                 name: 'ConferenceDetail',
                 query: { fid: data.item._id },
               }"
-              style="font-weight: normal; color: blue; font-size: 15px"
+              style="font-weight: normal; color: blue; font-size: 1.9vh"
             >
-              <span v-b-popover.hover="{content: `${data.value}`, placement: 'left' , title: '會議名稱'}"
-                >{{ data.value | ellipsis }}
+            <span v-b-popover.hover="{content: `${getFormattedTime(data.item.conference_time)} ${data.value}`, placement: 'left' , title: '會議名稱'}">{{ getFormattedTime(data.item.conference_time) }} - {{ data.value | ellipsis }}
               </span>
             </router-link>
-          </template>
-          <!-- 會議類別 -->
-          <template #cell(conference_classification)="data">
-            <span style="font-weight: normal; color: black; font-size: 15px">
+        </template>
+        <!-- 會議類別 -->
+        <template #cell(conference_classification)="data">
+            <span style="font-weight: normal; color: black; font-size: 1.9vh">
               {{ data.value }}
             </span>
-          </template>
-          <!-- 會議地點 -->
-          <template #cell(venue)="data">
-            <span style="font-weight: normal; color: black; font-size: 15px">
+        </template>
+        <!-- 會議地點 -->
+        <template #cell(venue)="data">
+            <span style="font-weight: normal; color: black; font-size: 1.9vh">
               {{ data.value }}
             </span>
-          </template>
-          <!-- 相關說明 -->
-          <template #cell(description)="data">
+        </template>
+        <!-- 相關說明 -->
+        <template #cell(description)="data">
             <span
-            style="font-weight: normal; color: black; font-size: 15px"
+            style="font-weight: normal; color: black; font-size: 1.9vh"
             v-b-popover.hover="{content: `${data.value}`, placement: 'left' , title: '相關說明'}"
             >
               說明:{{ data.value | ellipsis }}
             </span>
-          </template>
-          <!-- 列管數 -->
-          <template #cell(issueId)="data">
-            <span style="font-weight: normal; color: black; font-size: 15px">
+        </template>
+        <!-- 列管數 -->
+        <template #cell(issueId)="data">
+            <span style="font-weight: normal; color: black; font-size: 1.9vh">
               {{ data.value.length }}
             </span>
-          </template>
-        </b-table>
-        </div>
+        </template>
+       </b-table>
+       </div>
        </div>
         <!-- 分頁符號 -->
         <b-pagination
@@ -101,7 +121,7 @@
           aria-controls="my-table"
           style="margin-top:4vh"
         >
-      </b-pagination>
+        </b-pagination>
   </div>
 </template>
 
@@ -114,12 +134,23 @@ export default {
   data () {
     return {
       filter: null,
-      perPage: 8,
+      perPage: 13,
       currentPage: 1,
+      sortBy: null,
+      sortDesc: false,
       fields: [
         {
-          key: 'date',
-          label: '會議時間',
+          key: 'combined_datetime',
+          label: '會議日期和時間',
+          sortable: true,
+          sortBy: ['combined_datetime'],
+          tdClass: 'align-middle',
+          thStyle: { background: '#1d325f', color: '#ffffff' },
+          formatter: this.formatCombinedDateTime
+        },
+        {
+          key: 'end_time',
+          label: '會議結束時間',
           sortable: false,
           tdClass: 'align-middle',
           thStyle: {background: '#1d325f', color: '#ffffff'}
@@ -155,7 +186,7 @@ export default {
         {
           key: 'issueId',
           label: '列管數',
-          sortable: false,
+          sortable: true,
           tdClass: 'align-middle',
           thStyle: {background: '#1d325f', color: '#ffffff'}
         }],
@@ -170,18 +201,32 @@ export default {
     try {
       await this.getConferenceList()
       await this.getNewConferenceList()
+      console.log(this.fullList)
     } catch (err) {
       console.log(err)
     }
   },
   methods: {
     ...mapActions('conference', ['getConferenceList', 'deleteConference']),
-    getFormattedTime (data) {
-      const time = data.conference_time
-      return time.substr(0, time.length - 3)
+    formatCombinedDateTime (value, key, item) {
+      if (key === 'combined_datetime') {
+        const formattedDate = this.getFormattedDate(item.conference_date)
+        const formattedTime = this.getFormattedTime(item.conference_time)
+        return `${formattedDate} ${formattedTime}`
+      }
+      return value
+    },
+    getFormattedTime (time) {
+      return this.formatTime(time)
+    },
+    formatTime (time) {
+      if (time && time.length >= 3) {
+        return time.substr(0, time.length - 3)
+      } else {
+        return ''
+      }
     },
     getFormattedDate (date) {
-      // 轉換日期格式
       let d = null
       if (date) {
         return moment(date).format('YYYY-MM-DD')
@@ -189,41 +234,96 @@ export default {
         return d
       }
     },
+    getTimeObject (time) {
+      const [hours, minutes] = time.split(':')
+      return {
+        hour: parseInt(hours),
+        minute: parseInt(minutes)
+      }
+    },
     async reload () {
       await this.getConferenceList()
       this.getNewConferenceList()
     },
-    getNewConferenceList () { // 先簡單處理，要優化地方太多有閒時間再說
+    async getNewConferenceList () {
       this.fullList = []
       for (let i = 0; i < this.conferenceList.length; i++) {
-        const ele = this.conferenceList[i]
-        const element = this.conferenceList[i].issueId
-        this.issueIdList = []
-        for (let i = 0; i < element.length; i++) {
-          const ele = element[i]
-          if (ele.issue_status !== '解除列管') {
-            this.issueIdList.push(ele)
+        const conference = this.conferenceList[i]
+        const issueIdList = []
+        for (let j = 0; j < conference.issueId.length; j++) {
+          const issue = conference.issueId[j]
+          if (issue.issue_status !== '解除列管') {
+            issueIdList.push(issue)
           }
         }
         this.fullList.push({
-          conference_date: ele.conference_date,
-          conference_name: ele.conference_name,
-          description: ele.description,
-          issueId: this.issueIdList,
-          venue: ele.venue,
-          conference_classification: ele.conference_classification,
-          _id: ele._id
+          conference_date: conference.conference_date,
+          conference_time: conference.conference_time,
+          conference_name: conference.conference_name,
+          end_date: conference.end_date,
+          end_time: conference.end_time,
+          description: conference.description,
+          issueId: issueIdList,
+          venue: conference.venue,
+          conference_classification: conference.conference_classification,
+          _id: conference._id
         })
       }
+    },
+    getSortValue (item, key) {
+      if (key === 'combined_datetime') {
+        const formattedDate = this.getFormattedDate(item.conference_date)
+        const formattedTime = this.getFormattedTime(item.conference_time)
+        return formattedDate + ' ' + formattedTime
+      } else if (key === 'issueId') {
+        return item[key].length
+      }
+      return item[key]
     }
+    // getNewConferenceList () {
+    //   this.fullList = []
+    //   for (let i = 0; i < this.conferenceList.length; i++) {
+    //     const ele = this.conferenceList[i]
+    //     const element = this.conferenceList[i].issueId
+    //     this.issueIdList = []
+    //     for (let i = 0; i < element.length; i++) {
+    //       const ele = element[i]
+    //       if (ele.issue_status !== '解除列管') {
+    //         this.issueIdList.push(ele)
+    //       }
+    //     }
+    //     this.fullList.push({
+    //       conference_date: ele.conference_date,
+    //       conference_name: ele.conference_name,
+    //       end_time: ele.end_time,
+    //       description: ele.description,
+    //       issueId: this.issueIdList,
+    //       venue: ele.venue,
+    //       conference_classification: ele.conference_classification,
+    //       _id: ele._id
+    //     })
+    //   }
+    // }
   },
   filters: {
     ellipsis (value) {
-      if ((value && value.length) || value > 18) { return value.slice(0, 10) + '...' }
+      if (value.length > 18) { return value.slice(0, 10) + '...' }
       return value
     }
   },
   computed: {
+    sortedList () {
+      const sortedData = [...this.fullList]
+
+      // Sort by combined_datetime in ascending order
+      sortedData.sort((a, b) => {
+        const aValue = this.getSortValue(a, 'combined_datetime')
+        const bValue = this.getSortValue(b, 'combined_datetime')
+        return aValue.localeCompare(bValue)
+      })
+
+      return sortedData
+    },
     rows () {
       return this.conferenceList.length
     },
@@ -236,7 +336,7 @@ export default {
 
 <style>
 .thClass /deep/ {
-  font-size: 16px;
+  font-size: 2vh;
   background-color: #1d325f;
   color: white;
 }
@@ -258,39 +358,39 @@ export default {
   display: flex;
   align-items: center;
   justify-content: center;
-  padding-bottom: 20px;
-  margin-top: 20px;
+  padding-bottom: 2.5vh;
+  margin-top: 2.5vh;
   color: #383838;
 }
 .text-center {
   color: #f7fafc;
-  width: 100%;
-  height: 100%;
-  padding-left: 5%;
-  padding-right: 5%;
-  margin-top: -10px;
+  width: 80vw;
+  height: 68.5vh;
+  padding-left: 0.5vw;
+  padding-right: 0.5vw;
+  margin-top: 0.5vh;
 }
 .btn1 {
   background-color: rgb(75, 102, 255);
-  font-size: 16px;
-  margin-left: 5px;
-  padding-left: 7px;
-  padding-right: 7px;
-  padding-top: 5px;
-  padding-bottom: 5px;
+  font-size: 2vh;
+  margin-left: 2vw;
+  padding-left: 2vw;
+  padding-right: 1vw;
+  padding-top: 0.8vh;
+  padding-bottom: 0.5vh;
   color: #ffffff;
-  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
+  box-shadow: 0.25vw 0.25vw 1.25vw rgba(0, 0, 0, 0.3);
   border: none;
 }
 .del {
   background-color: rgb(245, 19, 19);
-  font-size: 16px;
-  padding-left: 7px;
-  padding-right: 7px;
-  padding-top: 5px;
-  padding-bottom: 5px;
+  font-size: 2vh;
+  padding-left: 2vw;
+  padding-right: 1vw;
+  padding-top: 0.8vh;
+  padding-bottom: 0.5vh;
   color: #ffffff;
-  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
+  box-shadow: 0.25vw 0.25vw 1.25vw rgba(0, 0, 0, 0.3);
   border: none;
 }
 /deep/ .align-middle {

src/store/conference.js

@@ -63,6 +63,7 @@ export default {
         conference_date: currentToday, // 會議日期
         conference_time: '', // 會議時間
         conference_name: '', // 會議名稱
+        end_time: '', // 會議結束時間
         venue: '', // 會議地點
         host: '', // 會議主持人
         recorder: currentUser._id, // 會議記錄人
@@ -92,32 +93,28 @@ export default {
     async patchSchedule ({state, dispatch}, id) { // 編輯會議 | 修改行事曆
       await axios.patch(`/conference/${state.Conference.id}`, state.Conference)
       let time = new Date(state.Conference.conference_date)
+      let endDate
       if (String(time.getDate()).padStart(2, '0') === '31') {
         let firstDate = new Date(time.getFullYear(), time.getMonth() + 1, 1)
-        let endTime = firstDate.getFullYear() + '-' + String(firstDate.getMonth() + 1).padStart(2, '0') + '-' + String(firstDate.getDate()).padStart(2, '0')
-        let endDate = endTime.slice(0, 8) + String(Number(endTime.slice(-2)))
-        await dispatch('schedule/patchConferenceSchedule', {
-          scheduleId: id,
-          obj: {
-            title: state.Conference.conference_name,
-            start: state.Conference.conference_date,
-            end: endDate,
-            thing: state.Conference.description
-          }
-        }, { root: true })
+        let endDateDay = String(firstDate.getDate()).padStart(2, '0')
+        endDate = `${firstDate.getFullYear()}-${String(firstDate.getMonth() + 1).padStart(2, '0')}-${endDateDay}`
       } else {
-        let endTime = time.getFullYear() + '-' + String(time.getMonth() + 1).padStart(2, '0') + '-' + String(time.getDate()).padStart(2, '0')
-        let endDate = endTime.slice(0, 8) + String(Number(endTime.slice(-2)) + 1)
-        await dispatch('schedule/patchConferenceSchedule', {
-          scheduleId: id,
-          obj: {
-            title: state.Conference.conference_name,
-            start: state.Conference.conference_date,
-            end: endDate,
-            thing: state.Conference.description
-          }
-        }, { root: true })
+        let nextDay = new Date(time)
+        nextDay.setDate(nextDay.getDate() + 1)
+        let endDateMonth = String(nextDay.getMonth() + 1).padStart(2, '0')
+        let endDateDate = String(nextDay.getDate()).padStart(2, '0')
+        endDate = `${nextDay.getFullYear()}-${endDateMonth}-${endDateDate}`
       }
+
+      await dispatch('schedule/patchConferenceSchedule', {
+        scheduleId: id,
+        obj: {
+          title: state.Conference.conference_name,
+          start: state.Conference.conference_date,
+          end: endDate,
+          thing: state.Conference.description
+        }
+      }, { root: true })
     },
     async deleteConference ({state}, ConferenceId) { // 刪除會議
       await axios.delete(`/conference/${ConferenceId}`, state.Conference)

src/store/schedule.js

@@ -29,9 +29,9 @@ export default {
         state.Schedule.end = endToday
       } else {
         if (state.Schedule.end.length === 9) {
-          state.Schedule.end = state.Schedule.end.slice(0, 8) + String(Number(state.Schedule.end.slice(-1)) + 1).padStart(2, '0')
+          state.Schedule.end = state.Schedule.end.slice(0, 8) + String(Number(state.Schedule.end.slice(-1))).padStart(2, '0')
         } else {
-          state.Schedule.end = state.Schedule.end.slice(0, 8) + String(Number(state.Schedule.end.slice(-2)) + 1)
+          state.Schedule.end = state.Schedule.end.slice(0, 8) + String(Number(state.Schedule.end.slice(-2)))
         }
       }
       const event = { // 先不存照片
@@ -142,12 +142,11 @@ export default {
         state.Schedule.end = endToday
       } else {
         if (state.Schedule.end.length === 9) {
-          state.Schedule.end = state.Schedule.end.slice(0, 8) + String(Number(state.Schedule.end.slice(-1)) + 1).padStart(2, '0')
+          state.Schedule.end = state.Schedule.end.slice(0, 8) + String(Number(state.Schedule.end.slice(-1))).padStart(2, '0')
         } else {
-          state.Schedule.end = state.Schedule.end.slice(0, 8) + String(Number(state.Schedule.end.slice(-2)) + 1)
+          state.Schedule.end = state.Schedule.end.slice(0, 8) + String(Number(state.Schedule.end.slice(-2)))
         }
       }
-      // 下面寫不好，你行你上
       let old = []
       for (const image of state.Schedule.imageFile) {
         if (image.mime !== undefined && image.name !== undefined) old.push(image)

src/views/Calendar/Memorabilla/chronology.vue

@@ -352,38 +352,26 @@ export default {
       }
     },
     async handleEventClick (clickInfo) {
-      this.ChronologyEventModalOpen = true
-      if (String(Number(clickInfo.end.slice(-2))).length === 1) {
-        let endDate =
-          clickInfo.end.slice(0, 8) +
-          String(Number(clickInfo.end.slice(-2)) - 1).padStart(2, '0')
-        if (String(endDate.slice(-2)) === '00') {
-          let day = new Date(
-            endDate.slice(0, 4),
-            String(Number(endDate.slice(5, 7)) - 1).padStart(2, '0')
-          )
-          let end = new Date(day.getFullYear(), day.getMonth(), 0)
-          let endToday =
-            end.getFullYear() +
-            '-' +
-            String(end.getMonth() + 1).padStart(2, '0') +
-            '-' +
-            String(end.getDate()).padStart(2, '0')
-          await this.lookSchedule(clickInfo, endToday, clickInfo.id)
-        } else {
-          await this.lookSchedule(clickInfo, endDate, clickInfo.id)
+      this.content = clickInfo.event.extendedProps.scheduleId
+
+      if (clickInfo.event.backgroundColor === '#eb9114') {
+        // 會議另開
+        await this.$store.dispatch('schedule/getScheduleContent', this.content)
+        const conference = this.conference.find(conf => conf._id === this.schedule.conferenceId)
+
+        if (conference) {
+          this.$router.push({
+            name: 'ConferenceDetail',
+            query: { fid: conference._id }
+          })
         }
       } else {
-        let endDate =
-          clickInfo.end.slice(0, 8) +
-          String(Number(clickInfo.end.slice(-2)) - 1)
-        if (String(endDate.slice(7)).length === 2) {
-          let end =
-            endDate.slice(0, 8) + String(endDate.slice(-1)).padStart(2, '0')
-          await this.lookSchedule(clickInfo, end, clickInfo.id)
-        } else {
-          await this.lookSchedule(clickInfo, endDate, clickInfo.id)
-        }
+        this.EditEventModalOpen = true
+
+        // 不需要对结束时间进行处理，直接使用clickInfo.event.end
+        const formattedEndDate = clickInfo.event.endStr
+
+        await this.lookSchedule(clickInfo, formattedEndDate, this.content)
       }
     },
     addUnderline (event) {

src/views/Calendar/ModalContent/editEvent.vue

@@ -15,7 +15,7 @@
             />
             <div v-else style="margin-top: 10px">
               <span style="font-weight: normal; color: black">
-                {{ schedule.start }}
+                {{ schedule.start.split('T')[0] }}
               </span>
             </div>
           </div>
@@ -34,7 +34,7 @@
             />
             <div v-else style="margin-top: 10px">
               <span style="font-weight: normal; color: black">
-                {{ schedule.end }}
+                {{ schedule.end.split('T')[0] }}
               </span>
             </div>
           </div>
@@ -244,6 +244,7 @@
 import { mapActions, mapState } from 'vuex'
 import Multiselect from 'vue-multiselect'
 import 'vue-multiselect/dist/vue-multiselect.min.css'
+import moment from 'moment'
 
 export default {
   props: ['getContent'],
@@ -251,6 +252,7 @@ export default {
     return {
       isEdit: false,
       isHavePermission: false,
+      adjustedEndDate01: '',
       eventCategory: {
         _id: '',
         paramsItems: []
@@ -380,6 +382,19 @@ export default {
     }
   },
   computed: {
+    adjustedEndDate () {
+      if (this.schedule.end) {
+        if (this.isEdit) {
+          const adjustedDate = moment(this.schedule.end).subtract(1, 'days')
+          return adjustedDate.format('YYYY-MM-DD HH')
+        } else {
+          const adjustedDate = moment(this.schedule.end).subtract(1, 'days')
+          return adjustedDate.format('YYYY-MM-DD')
+        }
+      } else {
+        return ''
+      }
+    },
     ...mapState({
       schedule: (state) => state.schedule.Schedule,
       scheduleList: (state) => state.schedule.ScheduleList,
@@ -398,6 +413,11 @@ export default {
         }
       },
       immediate: true
+    },
+    adjustedDate: {
+      handler (newVal) {
+        console.log(newVal)
+      }
     }
   }
 }

src/views/ConferenceManagement/ConferenceEdit/basicInformation.vue

@@ -1,256 +1,309 @@
 <template>
-  <div>
-    <div class="container" style="margin-left: 20px; margin-top: 50px">
-      <b-row style="height: 60px; margin-top: 20px">
-        <b-col cols="10">
-          <span style="font-size: 20px; font-weight: 800">會議基本資訊:</span>
-          <b-button v-if="isedit" @click="Save()" class="btn2">
-            <b-icon-pencil /> 儲存
-          </b-button>
-          <b-button
-            class="btn1"
-            size="sm"
-            @click="Edit"
-            v-else
-            v-show="conferenceManagement.permission === 2"
-          >
-            <b-icon icon="pencil-square" /> 編輯
-          </b-button>
-        </b-col>
-      </b-row>
-      <div style="margin-top: -15px">
-        <b-row>
-          <b-col cols="12">
-            <!-- 會議時間 -->
-            <b-list-group horizontal>
-              <b-list-group-item class="word" style="background-color: #9393ff">
-                <div>會議時間</div>
-              </b-list-group-item>
-              <!-- 時間 -->
-              <b-list-group-item class="grclass1">
-                <b-row v-if="isedit">
-                  <b-col cols="6">
-                    <b-form-datepicker
-                      v-model="conference.conference_date"
-                      placeholder="mm/dd"
+  <div class="container">
+    <b-row style="height: 60px; margin-top: 20px">
+      <b-col cols="10">
+        <span style="font-size: 20px; font-weight: 800">會議基本資訊:</span>
+        <b-button v-if="isedit" @click="Save()" class="btn2">
+          <b-icon-pencil /> 儲存
+        </b-button>
+        <b-button
+          class="btn1"
+          size="sm"
+          @click="Edit"
+          v-else
+          v-show="conferenceManagement.permission === 2"
+        >
+          <b-icon icon="pencil-square" /> 編輯
+        </b-button>
+      </b-col>
+    </b-row>
+    <div style="margin-top: -15px">
+      <b-row>
+        <b-col cols="12">
+          <!-- 會議開始時間 -->
+          <b-list-group horizontal>
+            <b-list-group-item class="word">
+              <div class="label">會議開始時間</div>
+            </b-list-group-item>
+            <!-- 日期 -->
+            <b-list-group-item class="grclass">
+              <b-row v-if="isedit">
+                <b-col cols="5">
+                  <b-form-datepicker
+                    v-model="conference.conference_date"
+                    placeholder="mm/dd"
+                    style="
+                      text-align: left;
+                      height: 40px;
+                      width: 220px;
+                    "
+                    @input="syncDates('start')"
+                  ></b-form-datepicker>
+                </b-col>
+                <!-- 時間 -->
+                <b-col cols="3">
+                  <div style="margin-left: 40px; margin-top: 10px">時間:</div>
+                </b-col>
+                <b-col cols="4">
+                  <div style="margin-left: -35px">
+                    <b-form-timepicker
+                      v-model="conference.conference_time"
+                      placeholder="hh/mm"
                       style="
                         text-align: left;
+                        margin-left: 15px
                         margin-top: -10px;
                         height: 40px;
-                        width: 240px;
+                        width: 140px;
                       "
-                    ></b-form-datepicker>
-                  </b-col>
-                  <b-col cols="2">
-                    <div style="margin-left: 0px; margin-top: 0px">時間:</div>
-                  </b-col>
-                  <b-col cols="4">
-                    <div style="margin-left: -50px">
-                      <b-form-timepicker
-                        v-model="conference.conference_time"
-                        placeholder="hh/mm"
-                        style="
-                          text-align: left;
-                          margin-top: -10px;
-                          height: 40px;
-                          width: 150px;
-                        "
-                      ></b-form-timepicker>
-                    </div>
-                  </b-col>
-                </b-row>
-                <span v-else
-                  >{{ getFormattedDate(conference.conference_date) }}
-                  {{ getFormattedTime(conference.conference_time) }}
-                </span>
-              </b-list-group-item>
-            </b-list-group>
-            <!-- 會議名稱 -->
-            <b-list-group horizontal>
-              <b-list-group-item class="word" style="background-color: #9393ff">
-                <div>會議名稱</div>
-              </b-list-group-item>
-              <b-list-group-item class="grclass">
-                <b-form-input
-                  v-model="conference.conference_name"
-                  type="text"
-                  v-if="isedit"
-                  style="margin-top: -10px; height: 35px"
-                ></b-form-input>
-                <span
-                  v-else
-                  v-b-popover.hover="{
-                    content: `${conference.conference_name}`,
-                    placement: 'left',
-                    title: '會議名稱',
-                  }"
-                >
-                  {{ conference.conference_name | ellipsis }}</span
-                >
-              </b-list-group-item>
-            </b-list-group>
-            <!-- 會議地點 -->
-            <b-list-group horizontal>
-              <b-list-group-item class="word" style="background-color: #9393ff">
-                <div>會議地點</div>
-              </b-list-group-item>
-              <b-list-group-item class="grclass">
-                <b-form-input
-                  v-model="conference.venue"
-                  type="text"
-                  v-if="isedit"
-                  style="margin-top: -10px; height: 35px"
-                ></b-form-input>
-                <span v-else>{{ conference.venue }}</span>
-              </b-list-group-item>
-            </b-list-group>
-            <!-- 會議類別 -->
-            <b-list-group horizontal>
-              <b-list-group-item class="word" style="background-color: #9393ff">
-                <div>會議類別</div>
-              </b-list-group-item>
-              <b-list-group-item class="grclass1">
-                <div v-if="isedit" style="margin-top: -10px">
-                  <b-form-select
-                    v-model="conference.conference_classification"
-                    :options="conference_classifications.paramsValue"
-                  ></b-form-select>
-                </div>
-                <div v-else>
-                  <span>{{ conference.conference_classification }}</span>
-                </div>
-              </b-list-group-item>
-            </b-list-group>
-            <!-- 相關說明 -->
-            <b-list-group horizontal>
-              <b-list-group-item class="word" style="background-color: #9393ff">
-                <span>相關說明</span>
-              </b-list-group-item>
-              <b-list-group-item class="grclass">
-                <b-form-textarea
-                  v-model="conference.description"
-                  type="text"
-                  v-if="isedit"
-                  style="height: 120px"
-                ></b-form-textarea>
-                <div v-else style="word-wrap: break-word">
-                  {{ conference.description }}
-                </div>
-              </b-list-group-item>
-            </b-list-group>
-            <!-- 出席人員 -->
-            <b-list-group horizontal>
-              <b-list-group-item class="word" style="background-color: #9393ff">
-                <div>出席人員</div>
-              </b-list-group-item>
-              <b-list-group-item class="grclass1">
-                <div v-if="isedit" style="margin-top: -10px">
-                  <multiselect
-                    v-model="conference.member"
-                    placeholder="請選擇參與人員"
-                    :multiple="true"
-                    :taggable="true"
-                    :searchable="false"
-                    :options="staffs"
-                    :close-on-select="false"
-                    :clear-on-select="false"
-                    selectLabel="請選擇"
-                    selectedLabel="已選擇"
-                    deselectLabel="取消選擇"
-                    label="name"
-                    track-by="_id"
-                  >
-                  </multiselect>
-                </div>
-                <div v-else style="word-wrap: break-word">
-                  <span>{{ conferenceMemberName }}</span>
-                </div>
-              </b-list-group-item>
-            </b-list-group>
-            <!-- 主持人 -->
-            <b-list-group horizontal>
-              <b-list-group-item
-                class="word"
-                style="background-color: #9393ff; width: 98px"
-              >
-                <div>主持人</div>
-              </b-list-group-item>
-              <b-list-group-item class="grclass">
+                    ></b-form-timepicker>
+                  </div>
+                </b-col>
+              </b-row>
+              <span v-else
+                >{{ getFormattedDate(conference.conference_date) }}
+                {{ getFormattedTime(conference.conference_time) }}
+              </span>
+            </b-list-group-item>
+          </b-list-group>
+          <!-- 結束日期 -->
+          <b-list-group horizontal>
+            <b-list-group-item class="word">
+              <div class="label">會議結束時間</div>
+            </b-list-group-item>
+            <b-list-group-item class="grclass">
+              <b-row v-if="isedit">
+                <b-col cols="5">
+                  <b-form-datepicker
+                    v-model="conference.end_date"
+                    placeholder="mm/dd"
+                    style="
+                      text-align: left;
+                      height: 40px;
+                      width: 220px;
+                    "
+                    @input="syncDates('end')"
+                  ></b-form-datepicker>
+                </b-col>
+                <!-- 時間 -->
+                <b-col cols="3">
+                  <div style="margin-left: 40px; margin-top: 10px">時間:</div>
+                </b-col>
+                <b-col cols="4">
+                  <div style="margin-left: -35px">
+                    <b-form-timepicker
+                      v-model="conference.end_time"
+                      placeholder="hh/mm"
+                      style="
+                        text-align: left;
+                        margin-left: 15px
+                        margin-top: -10px;
+                        height: 40px;
+                        width: 140px;
+                      "
+                    ></b-form-timepicker>
+                  </div>
+                </b-col>
+              </b-row>
+              <span v-else
+                >{{ getFormattedDate(conference.end_date) }}
+                {{ getFormattedTime(conference.end_time) }}
+              </span>
+            </b-list-group-item>
+          </b-list-group>
+          <!-- 會議名稱 -->
+          <b-list-group horizontal>
+            <b-list-group-item class="word">
+              <div class="label">會議名稱</div>
+            </b-list-group-item>
+            <b-list-group-item class="grclass">
               <b-form-input
-                v-model="conference.host"
+                v-model="conference.conference_name"
                 type="text"
                 v-if="isedit"
                 style="margin-top: -10px; height: 35px"
               ></b-form-input>
-              <span v-else>{{ conference.host }}</span>
-            </b-list-group-item>
-            </b-list-group>
-            <!-- 紀錄 -->
-            <b-list-group horizontal>
-              <b-list-group-item
-                class="word"
-                style="background-color: #9393ff; width: 98px"
+              <span
+                v-else
+                v-b-popover.hover="{
+                  content: `${conference.conference_name}`,
+                  placement: 'left',
+                  title: '會議名稱',
+                }"
               >
-                <div>紀錄</div>
-              </b-list-group-item>
-              <b-list-group-item class="grclass1">
-                <div v-if="isedit" style="margin-top: -10px">
-                  <multiselect
-                    v-model="conference.recorder"
-                    placeholder="請選擇紀錄人員"
-                    tag-placeholder="新增人員"
-                    :taggable="true"
-                    :options="staffs"
-                    :clear-on-select="false"
-                    selectLabel="請選擇"
-                    selectedLabel="已選擇"
-                    deselectLabel="取消選擇"
-                    label="name"
-                    track-by="_id"
-                  >
-                  </multiselect>
-                </div>
-                <div v-else style="word-wrap: break-word">
-                  <span v-if="conference.recorder != null">
-                    {{ conference.recorder.name }}
-                  </span>
-                  <span v-else></span>
-                </div>
-              </b-list-group-item>
-            </b-list-group>
-            <!-- 會議議題 -->
-            <b-list-group horizontal>
-              <b-list-group-item style="background-color: #9393ff" class="word">
-                <div>會議議題</div>
-              </b-list-group-item>
-              <b-list-group-item
-                style="height: auto; background-color: #ddddff; width: 600px"
+                {{ conference.conference_name}}</span
               >
+            </b-list-group-item>
+          </b-list-group>
+          <!-- 會議地點 -->
+          <b-list-group horizontal>
+            <b-list-group-item class="word">
+              <div class="label">會議地點</div>
+            </b-list-group-item>
+            <b-list-group-item class="grclass0">
+              <b-form-input
+                v-model="conference.venue"
+                type="text"
+                v-if="isedit"
+                style="margin-top: -10px; height: 35px"
+              ></b-form-input>
+              <span v-else>{{ conference.venue }}</span>
+            </b-list-group-item>
+          </b-list-group>
+          <!-- 會議類別 -->
+          <b-list-group horizontal>
+            <b-list-group-item class="word">
+              <div class="label">會議類別</div>
+            </b-list-group-item>
+            <b-list-group-item class="grclass">
+              <div v-if="isedit" style="margin-top: -10px">
+                <b-form-select
+                  v-model="conference.conference_classification"
+                  :options="conference_classifications.paramsValue"
+                ></b-form-select>
+              </div>
+              <div v-else>
+                <span>{{ conference.conference_classification }}</span>
+              </div>
+            </b-list-group-item>
+          </b-list-group>
+          <!-- 相關說明 -->
+          <b-list-group horizontal>
+            <b-list-group-item class="word">
+              <div class="label">相關說明</div>
+            </b-list-group-item>
+            <b-list-group-item class="grclass">
+              <b-form-textarea
+                v-model="conference.description"
+                type="text"
+                v-if="isedit"
+                style="height: 120px"
+              ></b-form-textarea>
+              <div v-else style="word-wrap: break-word">
+                {{ conference.description }}
+              </div>
+            </b-list-group-item>
+          </b-list-group>
+          <!-- 出席人員 -->
+          <b-list-group horizontal>
+            <b-list-group-item class="word">
+              <div class="label">出席人員</div>
+            </b-list-group-item>
+            <b-list-group-item class="grclass">
+              <div v-if="isedit" style="margin-top: -10px">
+                <multiselect
+                  v-model="conference.member"
+                  placeholder="請選擇參與人員"
+                  :multiple="true"
+                  :taggable="true"
+                  :searchable="false"
+                  :options="staffs"
+                  :close-on-select="false"
+                  :clear-on-select="false"
+                  selectLabel="請選擇"
+                  selectedLabel="已選擇"
+                  deselectLabel="取消選擇"
+                  label="name"
+                  track-by="_id"
+                >
+                </multiselect>
+              </div>
+              <div v-else style="word-wrap: break-word">
+                <span>{{ conferenceMemberName }}</span>
+              </div>
+            </b-list-group-item>
+          </b-list-group>
+          <!-- 主持人 -->
+          <b-list-group horizontal>
+            <b-list-group-item class="word">
+              <div class="label">主持人</div>
+            </b-list-group-item>
+            <b-list-group-item class="grclass">
+              <div v-if="isedit" style="margin-top: -10px">
                 <multiselect
-                  v-model="conference.issueId"
-                  placeholder="請選擇議題"
+                  v-model="conference.host"
+                  placeholder="請選擇主持人"
                   :multiple="true"
-                  :options="content"
                   :taggable="true"
                   :searchable="false"
+                  :options="staffs"
                   :close-on-select="false"
                   :clear-on-select="false"
                   selectLabel="請選擇"
                   selectedLabel="已選擇"
                   deselectLabel="取消選擇"
-                  label="description"
-                  track-by="id"
-                  v-if="isedit"
+                  label="name"
+                  track-by="_id"
                 >
                 </multiselect>
-                <div style="word-wrap: break-word" v-else>
-                  <span>{{ conferenceContent }}</span>
-                </div>
-              </b-list-group-item>
-            </b-list-group>
-          </b-col>
-        </b-row>
-      </div>
+              </div>
+              <div v-else style="word-wrap: break-word">
+                <span>{{ conferenceHostName }}</span>
+              </div>
+            </b-list-group-item>
+          </b-list-group>
+          <!-- 紀錄 -->
+          <b-list-group horizontal>
+            <b-list-group-item class="word">
+              <div class="label">紀錄</div>
+            </b-list-group-item>
+            <b-list-group-item class="grclass">
+              <div v-if="isedit" style="margin-top: -10px">
+                <multiselect
+                  v-model="conference.recorder"
+                  placeholder="請選擇紀錄人員"
+                  tag-placeholder="新增人員"
+                  :taggable="true"
+                  :options="staffs"
+                  :clear-on-select="false"
+                  selectLabel="請選擇"
+                  selectedLabel="已選擇"
+                  deselectLabel="取消選擇"
+                  label="name"
+                  track-by="_id"
+                >
+                </multiselect>
+              </div>
+              <div v-else style="word-wrap: break-word">
+                <span v-if="conference.recorder != null">
+                  {{ conference.recorder.name }}
+                </span>
+                <span v-else></span>
+              </div>
+            </b-list-group-item>
+          </b-list-group>
+          <!-- 會議議題 -->
+          <b-list-group horizontal>
+            <b-list-group-item class="word">
+              <div class="label">會議議題</div>
+            </b-list-group-item>
+            <b-list-group-item
+              style="height: auto; background-color: #ddddff; width: 600px"
+            >
+              <multiselect
+                v-model="conference.issueId"
+                placeholder="請選擇議題"
+                :multiple="true"
+                :options="content"
+                :taggable="true"
+                :searchable="false"
+                :close-on-select="false"
+                :clear-on-select="false"
+                selectLabel="請選擇"
+                selectedLabel="已選擇"
+                deselectLabel="取消選擇"
+                label="description"
+                track-by="id"
+                v-if="isedit"
+              >
+              </multiselect>
+              <div style="word-wrap: break-word" v-else>
+                <span>{{ conferenceContent }}</span>
+              </div>
+            </b-list-group-item>
+          </b-list-group>
+        </b-col>
+      </b-row>
     </div>
   </div>
 </template>
@@ -263,6 +316,7 @@ import 'vue-multiselect/dist/vue-multiselect.min.css'
 export default {
   data () {
     return {
+      lastModified: '', // 添加這個變量來標記最後修改的是開始日期還是結束日期
       isedit: false,
       staffs: [],
       content: [],
@@ -326,13 +380,25 @@ export default {
       this.isedit = true
     },
     async Save () {
-      let yes = confirm('確定儲存?')
-      if (yes) {
-        this.$emit('ispatch')
-        this.isedit = false
-        alert('修改成功！')
-        await this.patchSchedule(this.conferenceSchedule._id)
-        this.$emit('reload')
+      let wasNull = false
+      const startFormattedDate = this.getFormattedDate(this.conference.conference_date)
+      const endFormattedDate = this.getFormattedDate(this.conference.end_date)
+
+      const startTime = new Date(startFormattedDate + ' ' + this.conference.conference_time)
+      const endTime = new Date(endFormattedDate + ' ' + this.conference.end_time)
+      if (startTime > endTime) wasNull = true
+      if (wasNull) alert('會議時間不能晚於會議結束時間！')
+      else {
+        let yes = (window.confirm('確定儲存？'))
+        if (yes) {
+          this.isedit = false
+          this.$emit('ispatch')
+          await this.patchSchedule(this.conferenceSchedule._id)
+          alert('修改成功！')
+          this.$emit('reload')
+        } else {
+          alert('取消儲存')
+        }
       }
     },
     getFormattedDate (date) {
@@ -344,19 +410,38 @@ export default {
         return d
       }
     },
-    getFormattedTime (string) {
-      const time = this.conference.conference_time
-      return time.substr(0, time.length - 3)
+    getFormattedTime (time) {
+      return this.formatTime(time)
+    },
+    formatTime (time) {
+      if (time && time.length >= 3) {
+        return time.substr(0, time.length - 3)
+      } else {
+        return ''
+      }
     },
     async issueList () {
       this.content = await this.$store.dispatch('issue/lookupIssueList')
     },
-    usePermission () { // 確認權限
-      Object.values(this.currentUser.tenderPermissions).forEach(obj => {
+    syncDates (lastModified) {
+      this.lastModified = lastModified // 紀錄最後修改的日期類型
+
+      if (lastModified === 'start') {
+        this.conference.end_date = this.conference.conference_date
+      } else {
+        this.conference.conference_date = this.conference.end_date
+      }
+    },
+
+    usePermission () {
+      // 確認權限
+      Object.values(this.currentUser.tenderPermissions).forEach((obj) => {
         if (obj.tenderId === this.currentUser.defaultTender) {
           let permission = obj.permission
-            .filter(name => name.title === '工作協同')
-            .map(val => { return val.functionItem })
+            .filter((name) => name.title === '工作協同')
+            .map((val) => {
+              return val.functionItem
+            })
           for (const element of permission) {
             for (const a of element) {
               if (a.name === '會議管理') this.conferenceManagement = a
@@ -374,26 +459,33 @@ export default {
     }),
     ...mapGetters('conference', [
       'conferenceMemberName',
-      'conferenceContent'
+      'conferenceContent',
+      'conferenceHostName'
     ])
   }
 }
 </script>
 <style lang="scss" scoped>
+
 .container {
-  margin-top: 10px;
+  margin-top: 60px;
   width: 75%;
   height: 95%;
+  margin-left: 20px;
 }
 .grclass {
   height: auto;
   background-color: #ddddff;
-  width: 600px;
+  width: 650px;
+
 }
-.grclass1 {
+.grclass0 {
   height: auto;
   background-color: #ddddff;
-  width: 600px;
+  width: 650px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 .form-control {
   color: black;
@@ -424,24 +516,17 @@ export default {
   box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
   border: none;
 }
-.btn3 {
-  background-color: rgb(75, 102, 255);
-  font-size: 16px;
-  margin-top: 5px;
-  margin-left: 15px;
-  padding-left: 7px;
-  padding-right: 7px;
-  padding-top: 3px;
-  padding-bottom: 3px;
-  color: #ffffff;
-  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
-  border: none;
-}
 .word {
   text-align: center;
   color: white;
   position: relative;
   display: flex;
   align-items: center;
+  white-space: nowrap;
+  background-color: #9393ff;
+}
+.label {
+  width: 100px;
+  display: inline-block;
 }
 </style>

src/views/ConferenceManagement/ModalContent/addConference.vue

@@ -2,10 +2,10 @@
   <!-- 建立會議 -->
   <div>
     <b-card no-body>
-      <!-- 會議日期 -->
+      <!-- 會議日期和時間 -->
       <b-list-group horizontal>
         <b-list-group-item style="background-color: #9393ff">
-          <div style="margin-top: 10px; color: white">會議時間</div>
+          <div style="margin-top: 10px; color: white">會議日期</div>
         </b-list-group-item>
         <b-list-group-item class="grclass">
           <b-row>
@@ -14,6 +14,7 @@
                 v-model="conference.conference_date"
                 placeholder="mm/dd"
                 style="text-align: left; width: 240px"
+                @input="syncDates('start')"
               ></b-form-datepicker>
             </b-col>
             <b-col cols="2">
@@ -30,6 +31,35 @@
             </b-col> </b-row
         ></b-list-group-item>
       </b-list-group>
+      <!-- 會議結束時間 -->
+      <b-list-group horizontal>
+        <b-list-group-item style="background-color: #9393ff">
+          <div style="margin-top: 10px; color: white">結束時間</div>
+        </b-list-group-item>
+        <b-list-group-item class="grclass">
+          <b-row>
+            <b-col cols="4">
+              <b-form-datepicker
+                v-model="conference.end_date"
+                placeholder="mm/dd"
+                style="text-align: left; width: 240px"
+                @input="syncDates('end')"
+              ></b-form-datepicker>
+            </b-col>
+            <b-col cols="2">
+              <div style="margin-top: 10px">時間:</div>
+            </b-col>
+            <b-col cols="2"
+              ><div style="margin-left: -85px">
+                <b-form-timepicker
+                  v-model="conference.end_time"
+                  placeholder="hh/mm"
+                  style="text-align: left; width: 150px"
+                ></b-form-timepicker>
+              </div>
+            </b-col> </b-row
+        ></b-list-group-item>
+      </b-list-group>
       <!-- 會議名稱 -->
       <b-list-group horizontal>
         <b-list-group-item style="background-color: #9393ff"
@@ -74,7 +104,14 @@
           </div></b-list-group-item
         >
         <b-list-group-item class="grclass">
-          <b-form-input v-model="conference.host"></b-form-input>
+          <b-form-select
+            :options="
+              staffs.map((staff) => {
+                return { text: staff.name, value: staff._id };
+              })
+            "
+            v-model="conference.host"
+          ></b-form-select>
         </b-list-group-item>
       </b-list-group>
       <!-- 紀錄 -->
@@ -145,6 +182,7 @@ import { mapActions, mapState } from 'vuex'
 export default {
   data () {
     return {
+      lastModified: '', // 添加這個變量來標記最後修改的是開始日期還是結束日期
       staffs: [],
       selected: '',
       options: [
@@ -158,6 +196,8 @@ export default {
     }
   },
   async mounted () {
+    // 將日期設為空
+    this.conference.conference_date = null
     try {
       this.staffs = await this.$store.dispatch('project/lookupStaffs', {
         selects: ['_id', 'name']
@@ -173,16 +213,30 @@ export default {
     ...mapActions('conference', [
       'post',
       'getConferenceList',
+      'patch',
       'patchSchedule'
     ]),
     ...mapActions('paramsSetting', ['lookupParam']),
+    ...mapActions('officialDocument', ['conferencePatch']),
     // 建立會議按鈕
     async conferenceSave () {
       let wasNull = false
       if (
         this.conference.conference_name === '' ||
-        this.conference.founder === '' || this.conference.host === ''
+        this.conference.founder === ''
       ) { wasNull = true }
+      // 判斷會議時間是否晚於會議結束時間
+      const startTime = new Date(
+        this.conference.conference_date + ' ' + this.conference.conference_time
+      )
+      const endTime = new Date(
+        this.conference.end_date + ' ' + this.conference.end_time
+      )
+
+      if (startTime > endTime) {
+        alert('會議時間不能晚於會議結束時間')
+        return
+      }
       if (wasNull) alert('會議名稱、建立人員尚需填寫!')
       else {
         let yes = window.confirm('確定建立?')
@@ -198,17 +252,15 @@ export default {
       let wasNull = false
       if (
         this.conference.conference_name === '' ||
-        this.conference.founder === '' || this.conference.host === ''
+        this.conference.founder === ''
       ) { wasNull = true }
       if (wasNull) alert('會議名稱、建立人員尚需填寫!')
       else {
         let yes = window.confirm('確定建立?')
         if (yes) {
-          await Promise.all([
-            this.postConferenceForDoc(),
-            this.saveConference()
-          ])
-          alert('會議建立成功!')
+          await this.postConference()
+          await this.saveOfficialDoc()
+          await this.saveConference()
         } else {
           alert('取消建立')
         }
@@ -216,20 +268,10 @@ export default {
     },
     async postConference () {
       await this.post()
+      alert('建立成功')
       this.$emit('closeEvent')
       await this.getConferenceList()
     },
-    async postConferenceForDoc () {
-      await this.post()
-      // 公文存入會議Id
-      await this.$store.dispatch(
-        'conference/lookupConference',
-        this.conference._id
-      )
-      this.OfficialDoc.conferenceId = this.conference._id
-      await this.$store.dispatch('officialDocument/conferencePatch', this.OfficialDoc._id)
-      this.$emit('closeEvent')
-    },
     async saveConference () {
       // 會議存入公文Id
       await this.$store.dispatch(
@@ -237,7 +279,35 @@ export default {
         this.OfficialDoc._id
       )
       this.conference.officialDocId = this.OfficialDoc._id
-      await this.$store.dispatch('conference/patch', this.conference._id)
+      console.log(this.conference.officialDocId)
+      await this.patch(this.conference.officialDocId)
+    },
+    async saveOfficialDoc () {
+      // 公文存入會議Id
+      await this.$store.dispatch(
+        'conference/lookupConference',
+        this.conference._id
+      )
+      this.OfficialDoc.conferenceId = this.conference._id
+      await this.conferencePatch(this.OfficialDoc._id)
+    },
+    syncDates (lastModified) {
+      this.lastModified = lastModified // 紀錄最後修改的日期類型
+
+      if (this.conference.conference_date && this.conference.end_date) {
+        // 如果開始日期和結束日期都有值，將同步到最後填值的日期
+        if (lastModified === 'start') {
+          this.conference.end_date = this.conference.conference_date
+        } else {
+          this.conference.conference_date = this.conference.end_date
+        }
+      } else if (!this.conference.conference_date && this.conference.end_date) {
+        // 如果開始日期為空而結束日期有值，將開始日期同步為結束日期
+        this.conference.conference_date = this.conference.end_date
+      } else if (!this.conference.end_date && this.conference.conference_date) {
+        // 如果結束日期為空而開始日期有值，將結束日期同步為開始日期
+        this.conference.end_date = this.conference.conference_date
+      }
     }
   },
   computed: {