增加时间日期组件,调整会议模块功能

package.json

@@ -20,7 +20,7 @@
     "dhtmlx-gantt": "^8.0.6",
     "element-ui": "2.15.14",
     "js-cookie": "2.2.0",
-    "moment": "^2.29.4",
+    "moment": "^2.30.1",
     "normalize.css": "7.0.0",
     "nprogress": "0.2.0",
     "path-to-regexp": "2.4.0",

src/main.js

@@ -31,9 +31,12 @@ import {
   handleTree,
   getMonthDate
 } from "@/utils/common";
+//时间转换主键
+import * as moment from 'moment'
 
 Vue.prototype.getDicts = getDictData
 
+Vue.prototype.$moment = moment
 Vue.prototype.parseTime = parseTime
 Vue.prototype.resetForm = resetForm
 Vue.prototype.addDateRange = addDateRange
@@ -45,6 +48,7 @@ Vue.prototype.getMonthDate = getMonthDate
 Vue.component('DictTag', DictTag)
 
 
+
 // set ElementUI lang to EN
 // Vue.use(ElementUI, { locale })
 // 如果想要中文版 element-ui，按如下方式声明

src/views/meeting/meeting.vue

@@ -12,7 +12,7 @@
       </el-form-item>
       <el-form-item label="会议类型：">
         <el-select v-model="formInline.meetingType" placeholder="会议类型" clearable>
-          <el-option label="周例会" value="1" key="周例会">周例会</el-option>
+          <el-option label="周例会" value="1" key="周例会" >周例会</el-option>
           <el-option label="项目会议" value="2" key="项目会议">项目会议</el-option>
           <el-option label="实施会议" value="3" key="实施会议">实施会议</el-option>
           <el-option label="其他会议" value="4" key="其他会议">其他会议</el-option>
@@ -81,14 +81,14 @@
           <span>{{ parseTime(scope.row.createTime) }}</span>
         </template>
       </el-table-column>-->
-      <el-table-column label="操作" prop="op" width="200">
+      <el-table-column label="操作" prop="op" width="250">
         <template slot-scope="scope">
 
           <el-button v-if="scope.row.status!==2" size="mini" type="primary" @click="handleEdit(scope.row)">编辑
           </el-button>
           <el-button v-if="scope.row.status===0" size="mini" type="danger" @click="deleteMeeting( scope.row)">删除
           </el-button>
-          <el-button v-if="scope.row.status===0" size="mini" type="danger" @click="startMeeting( scope.row)">开始会议
+          <el-button v-if="scope.row.status===0" size="mini" type="success" @click="startMeeting( scope.row)">开始会议
           </el-button>
           <el-button v-if="scope.row.status!==0 " type="success" size="mini" @click="meetingDetail(scope.row)">会议详情
           </el-button>
@@ -106,7 +106,7 @@
           <el-input v-model="editForm.meetingName"></el-input>
         </el-form-item>
         <el-form-item label="会议类别:">
-          <el-radio-group v-model="editForm.external">
+          <el-radio-group v-model="editForm.external" @input="changeMeetingExternal">
             <el-radio :label="1">外部会议</el-radio>
             <el-radio :label="0">内部会议</el-radio>
           </el-radio-group>
@@ -116,9 +116,9 @@
             <el-form-item label="会议类型:" prop="meetingType"
                           :rules="[{required:true,message: '请选择会议类型', trigger: 'blur'}]">
               <el-select v-model="editForm.meetingType" placeholder="会议类型" clearable>
-                <el-option label="周例会" :value="1" key="周例会">周例会</el-option>
+                <el-option label="周例会" :value="1" key="周例会" v-if="editForm.external===0">周例会</el-option>
                 <el-option label="项目会议" :value="2" key="项目会议">项目会议</el-option>
-                <el-option label="实施会议" :value="3" key="实施会议">实施会议</el-option>
+                <el-option label="实施会议" :value="3" key="实施会议" v-if="editForm.external===0">实施会议</el-option>
                 <el-option label="其他会议" :value="4" key="其他会议">其他会议</el-option>
               </el-select>
             </el-form-item>
@@ -138,7 +138,7 @@
         <el-form-item label="会议地点:" prop="meetingPlace" :rules="[{required:true,message: '请输入会议地点', trigger: 'blur'}]">
           <el-input size="mini" v-model="editForm.meetingPlace"></el-input>
         </el-form-item>
-        <el-form-item label="会议时间:" prop="time" :rules="[{required:true,message: '请选择会议时间', trigger: 'blur'}]">
+        <el-form-item v-show="false" label="会议时间:">
           <el-date-picker
             v-model="editForm.time"
             value-format="yyyy-MM-dd HH:mm:ss"
@@ -149,6 +149,34 @@
             end-placeholder="结束日期">
           </el-date-picker>
         </el-form-item>
+        <el-form-item label="会议时间:" prop="time">
+          <el-date-picker
+            v-model="editForm.startTime"
+            type="datetime"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            format="yyyy-MM-dd HH:mm:ss" default-time="12:00:00"
+            placeholder="选择会议开始时间" @change="chooseMeetingStartTime">
+          </el-date-picker>
+          <el-date-picker
+            v-show="endTimeShow"
+            v-model="editForm.endTime"
+            type="datetime"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            format="yyyy-MM-dd HH:mm:ss" default-time="12:00:00"
+            placeholder="选择会议结束时间" @change="chooseMeetingEndTime">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="会议时长:" >
+          <el-select v-model="editForm.duration"   placeholder="请选择会议时长" clearable @change="chooseMeetingTime">
+              <el-option label="15分钟" :value="15" key="15分钟">15分钟</el-option>
+              <el-option label="30分钟" :value="30" key="30分钟">30分钟</el-option>
+              <el-option label="45分钟" :value="45" key="45分钟">45分钟</el-option>
+              <el-option label="1小时" :value="60" key="15分钟">1小时</el-option>
+              <el-option label="2小时" :value="120" key="2小时">2小时</el-option>
+              <el-option label="3小时" :value="180" key="3小时">3小时</el-option>
+              <el-option label="其他" :value="0" key="其他">其他</el-option>
+          </el-select>
+        </el-form-item>
         <el-form-item label="外部参会人员:">
           <el-input size="mini" v-model="editForm.outAttendees"></el-input>
         </el-form-item>
@@ -164,8 +192,7 @@
           </el-input>
         </el-form-item>
         <el-form-item label="记录人:" prop="recorder" :rules="[{required:true,message: '请选择会议记录人', trigger: 'change'}]">
-          <el-input size="mini" v-model="editForm.recorder" readonly="true"
-                    @keyup.enter.native="openUsers1('recorder')">
+          <el-input size="mini" v-model="editForm.recorder" readonly="true" @keyup.enter.native="openUsers1('recorder')">
             <el-button @click="openUsers1('recorder')" icon="el-icon-search" slot="append"></el-button>
           </el-input>
         </el-form-item>
@@ -173,8 +200,7 @@
           <el-input  type="textarea" :rows="2" size="mini" v-model="editForm.remark"></el-input>
         </el-form-item>
         <el-form-item label="会议内容:">
-          <el-table
-            style="width: 100%" border stripe :show-header="false" :data="editForm.meetingContents">
+          <el-table style="width: 100%" border stripe :show-header="false" :data="editForm.meetingContents">
             <el-table-column type="index" label="序号" width="40">
             </el-table-column>
             <el-table-column label="工作内容" prop="content">
@@ -265,13 +291,13 @@
         <el-table-column label="会议问题" prop="question">
           <template slot-scope="scope">
             <el-input size="mini" v-model="scope.row.question" type="textarea"
-                      :autosize="{ minRows: 4, maxRows: 10}" :disabled="pro.status=='2'"></el-input>
+                      :autosize="{ minRows: 4, maxRows: 10}" ></el-input>
           </template>
         </el-table-column>
         <el-table-column label="会议方案" prop="optionss">
           <template slot-scope="scope">
             <el-input size="mini" v-model="scope.row.optionss" type="textarea"
-                      :autosize="{ minRows: 4, maxRows: 10}" :disabled="pro.status=='2'"></el-input>
+                      :autosize="{ minRows: 4, maxRows: 10}"></el-input>
           </template>
 
         </el-table-column>
@@ -279,7 +305,7 @@
           <template slot-scope="scope">
             <el-input size="mini" v-model="scope.row.executorName" readonly
                       @keyup.enter.native="openUsers1('executorName',scope.row)">
-              <el-button @click="openUsers1('executorName',scope.row)" icon="el-icon-search" slot="append" :disabled="pro.status=='2'"></el-button>
+              <el-button @click="openUsers1('executorName',scope.row)" icon="el-icon-search" slot="append" ></el-button>
             </el-input>
           </template>
         </el-table-column>
@@ -290,7 +316,6 @@
                             value-format="yyyy-MM-dd"
                             format="yyyy-MM-dd"
                             type="daterange"
-                            :disabled="pro.status=='2'"
                             style="width: 100%"
                             range-separator="至"
                             start-placeholder="开始日期"
@@ -388,6 +413,7 @@ export default {
       },
       editFormVisible: false,
       title: '创建会议',
+      endTimeShow:false,
       editForm: {
         id: null,
         meetingName: '',
@@ -396,6 +422,8 @@ export default {
         projectId: null,
         meetingPlace: '',
         time: null,
+        startTime:null,
+        endTime:null,
         outAttendees: '',
         innerAttendees: '',
         innerAttendesss: null,
@@ -403,6 +431,7 @@ export default {
         remark: '',
         emcee: '',
         recorder: '',
+        duration:null,
         meetingContents: [
           {content: '会议内容', 'op': ''}
         ]
@@ -424,6 +453,8 @@ export default {
         recorder: '',
         remark: '',
         status: null,
+        beginTime:null,
+        endTime:null,
         meetingContents: [{
           id: null,
           meetingId: null,
@@ -519,6 +550,10 @@ export default {
       this.$refs["form"].validate((valid) => {
         if (valid) {
           let data = this.editForm;
+          let times=[]
+          times.push(this.editForm.startTime)
+          times.push(this.editForm.endTime)
+          this.editForm.time=times
           addMeeting(data).then(response => {
             this.$message({
               message: '操作成功!',
@@ -602,6 +637,8 @@ export default {
         this.pro.innerAttendees = row.innerAttendees
         this.pro.recorder = row.recorder
         this.pro.times = row.beginTime + '至' + row.endTime
+        this.pro.beginTime=row.beginTime
+        this.pro.endTime=row.endTime
         this.pro.meetingPlace = row.meetingPlace
         let meetingType = row.meetingType
         //1-周例会，2-项目会议，3-实施会议，4-其他会议
@@ -635,6 +672,7 @@ export default {
         this.pro.id = row.id
         getMeetingDetailsById(meetingId).then(res => {
           let data = res.data.meetingContents
+
           this.pro.meetingContents = data
         });
       }
@@ -759,6 +797,9 @@ export default {
         time.push(data.beginTime);
         time.push(data.endTime);
         this.editForm.time = time;
+        this.editForm.startTime=data.beginTime
+        this.editForm.endTime=data.endTime
+        this.editForm.duration=data.duration
         this.title = '修改会议'
         this.editFormVisible = true
       });
@@ -794,6 +835,74 @@ export default {
     },
     closeotherMeetingDailog() {
       this.otherMeetingDetailVisble = false;
+    },
+    changeMeetingExternal(){
+
+    },
+    chooseMeetingTime(){
+      //选择会议时长
+      let duration=this.editForm.duration
+      if(duration===0){
+        this.endTimeShow=true
+      }else{
+        this.endTimeShow=false
+        //计算会议结束日期
+        let startTime=this.editForm.startTime
+        if(startTime===undefined || startTime===null){
+          let currentDate = new Date();
+          let newDate = new Date(currentDate.getTime() + duration * 60000);
+          let now = this.$moment(newDate).format('YYYY-MM-DD HH:mm:ss')
+          this.editForm.endTime=now
+        }else{
+          let currentDate = new Date(startTime);
+          let newDate = new Date(currentDate.getTime() + duration * 60000);
+          let now = this.$moment(newDate).format('YYYY-MM-DD HH:mm:ss')
+          this.editForm.endTime=now
+        }
+      }
+    },
+    addMinutesToCurrentTime(minutes) {
+      let currentDate = new Date();
+      let newDate = new Date(currentDate.getTime() + minutes * 60000);
+      return newDate;
+    },
+    chooseMeetingStartTime(){
+      let startTime=this.editForm.startTime
+      if(startTime===undefined || startTime===null){
+        this.$message.error("请选择会议开始时间!")
+        return
+      }
+      let duration=this.editForm.duration
+      let currentDate = new Date(startTime);
+      let newDate = new Date(currentDate.getTime() + duration * 60000);
+      let now = this.$moment(newDate).format('YYYY-MM-DD HH:mm:ss')
+      this.editForm.endTime=now
+
+    },
+    chooseMeetingEndTime(){
+      let startTime=this.editForm.startTime
+      let endTime=this.editForm.endTime
+      if(startTime===undefined || startTime===null){
+        this.$message.error("请选择会议开始时间!")
+        return
+      }
+      if(endTime===undefined || endTime===null){
+        this.$message.error("请选择会议结束时间!")
+        return
+      }
+      if(startTime>endTime){
+        this.$message.error("会议开始时间不能大于会议结束时间!")
+        return
+      }
+      //计算时长
+      let calculateTimeDuration=this.calculateTimeDuration(startTime,endTime);
+      this.editForm.duration=calculateTimeDuration
+    },
+    calculateTimeDuration(time1, time2) {
+      let date1 = new Date(time1);
+      let date2 = new Date(time2);
+      let duration = Math.abs(date1.getTime() - date2.getTime());
+      return duration;
     }
   }