个人日历完成

src/views/workbench/person/calendarFormDialog.vue

@@ -162,13 +162,13 @@ export default {
     isExistDetail() { // 当新建的时候存在详细日期时候的数据处理
       if (this.data) {
         this.form.dayList = Array.from(new Set([this.data.startStr, this.data.endStr]))
+        this.getDetailDayByDayList(this.data.startStr, this.data.endStr)
+        this.schedule = this.data.startStr === this.data.endStr
+          ? `${this.data.startStr}`
+          : `${this.data.startStr}-${this.data.endStr}`
       } else {
         this.form.dayList = []
       }
-      this.getDetailDayByDayList(this.data.startStr, this.data.endStr)
-      this.schedule = this.data.startStr === this.data.endStr
-        ? `${this.data.startStr}`
-        : `${this.data.startStr}-${this.data.endStr}`
     },
     getDetailDay(e) { // 获取详细排期日期
       this.detailDayList = e

src/views/workbench/person/components/calenderList.vue

@@ -2,10 +2,10 @@
   <article ref="calender-list">
     <div class="table-top">
       <el-radio-group v-model="busy" size="small" @change="queryWorkList">
-        <el-radio-button :label="Number(1)">忙碌</el-radio-button>
-        <el-radio-button :label="Number(0)">空闲</el-radio-button>
+        <el-radio-button :label="1">忙碌</el-radio-button>
+        <el-radio-button :label="0">空闲</el-radio-button>
       </el-radio-group>
-      <template v-show="busy === 1">
+      <template v-if="busy === 1">
         <el-select v-model="form_busy_1.searchScheduleInfo.status" placeholder="请选择" size="small" class="status" @change="queryWorkList">
           <el-option
             v-for="item in statusOptions"
@@ -19,6 +19,18 @@
           <el-checkbox :label="Number(1)" @change="queryWorkList">日程</el-checkbox>
         </el-checkbox-group>
       </template>
+      <template v-if="busy === 0">
+        <el-date-picker
+          v-model="rangeTime"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          value-format="yyyy.MM.dd"
+          size="small"
+          class="range-time"
+        />
+      </template>
       <el-button type="primary" size="small" class="add" @click="add()">添加日程</el-button>
     </div>
     <el-table
@@ -122,6 +134,7 @@ export default {
         },
         pageInfoDO: null
       },
+      rangeTime: [],
       statusOptions: [{
         value: 0,
         label: '进行中'
@@ -142,6 +155,16 @@ export default {
         this.queryWorkList()
       },
       deep: true
+    },
+    rangeTime: {
+      handler(newV, oldV) {
+        this.form_busy_0.timeInfo = {
+          startTime: newV[0],
+          endTime: newV[1]
+        }
+        this.queryWorkList()
+      },
+      deep: true
     }
   },
   created() {
@@ -172,6 +195,9 @@ export default {
           this.total = res.data.total
         }
       }
+    },
+    add() {
+      this.$emit('add')
     }
   }
 }
@@ -191,7 +217,7 @@ article{
       right: 0;
       transform: translateY(-50%);
     }
-    .origin {
+    .origin,.range-time {
       margin-left: 20px;
     }
     .status {

src/views/workbench/person/index.vue

@@ -463,7 +463,7 @@ export default {
   .detail-info {
     padding: 0 30px 20px 30px;
     .team-content {
-      z-index: 2;
+      z-index: 100;
       border-radius: 4px;
       border: 1px solid rgba(155, 155, 155, 1);
       padding: 10px 20px 20px 20px;

src/views/workbench/person/myFullCalendar.vue

@@ -23,7 +23,7 @@
         <div class="calender-top-title">{{ calendarTitle }}</div>
         <div><el-button type="primary" size="small" @click="add()">添加日程</el-button></div>
       </article>
-      <calender-list v-show="activeName === '2'" />
+      <calender-list v-show="activeName === '2'" @add="add" />
     </div>
     <FullCalendar
       v-show="activeName === '1'"