Bläddra i källkod

Merge branch 'wangzi_dev' of git.xiaojukeji.com:jacklijiajia/thoth-frontend into http_test

PrinceLee 5 år sedan
förälder
incheckning
a01436e816

+ 4 - 4
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

+ 112 - 39
src/views/workbench/person/components/calenderList.vue

@@ -1,74 +1,102 @@
 <template>
-  <article>
+  <article ref="calender-list">
     <div class="table-top">
-      <el-radio-group v-model="busy" size="small">
-        <el-radio-button :label="Number(0)">忙碌</el-radio-button>
-        <el-radio-button :label="Number(1)">空闲</el-radio-button>
+      <el-radio-group v-model="busy" size="small" @change="queryWorkList">
+        <el-radio-button :label="1">忙碌</el-radio-button>
+        <el-radio-button :label="0">空闲</el-radio-button>
       </el-radio-group>
-      <el-select v-model="form.searchScheduleInfo.status" placeholder="请选择" size="small" class="status" @change="queryWorkList">
-        <el-option
-          v-for="item in statusOptions"
-          :key="item.value"
-          :label="item.label"
-          :value="item.value"
+      <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"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+        <el-checkbox-group v-model="form_busy_1.searchScheduleInfo.origin" class="origin">
+          <el-checkbox :label="Number(0)" @change="queryWorkList">任务排期</el-checkbox>
+          <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"
         />
-      </el-select>
-      <el-checkbox-group v-model="form.searchScheduleInfo.origin" class="origin">
-        <el-checkbox :label="Number(0)" @change="queryWorkList">任务排期</el-checkbox>
-        <el-checkbox :label="Number(1)" @change="queryWorkList">日程</el-checkbox>
-      </el-checkbox-group>
+      </template>
       <el-button type="primary" size="small" class="add" @click="add()">添加日程</el-button>
     </div>
     <el-table
       :data="tableData"
       style="width: 100%"
-      row-key="id"
       :header-cell-style="{ backgroundColor: 'rgba(240,242,244,0.7)' ,color: '#333B4A', fontSize: '14px', fontWeight: '550', textAlign: 'center' }"
       show-overflow-tooltip="true"
       :header-row-style="{height: '61px'}"
     >
       <el-table-column label="日程名称" prop="name" width="250" align="center" show-overflow-tooltip />
-      <el-table-column label="日期" width="250" align="center" prop="seperateDaysHasHoliday" />
-      <el-table-column label="参与人" align="center" width="120">
+      <el-table-column label="日期" width="250" align="center" prop="seperateDaysHasHoliday" show-overflow-tooltip />
+      <el-table-column label="参与人" align="center" width="120" show-overflow-tooltip>
         <template slot-scope="scope">
           {{ scope.row.peopleObjectList | peopleListHandler }}
         </template>
       </el-table-column>
-      <el-table-column label="业务线" align="center" width="120">
+      <el-table-column label="业务线" align="center" width="120" show-overflow-tooltip>
         <template slot-scope="scope">
           {{ scope.row.bizName }}
         </template>
       </el-table-column>
-      <el-table-column label="使用/工作日/全部" align="center" width="150">
+      <el-table-column label="使用/工作日/全部" align="center" width="150" show-overflow-tooltip>
         <template slot-scope="scope">
           {{ scope.row.needDays }}/
           {{ scope.row.legalDays }}/
           {{ scope.row.allDays }}
         </template>
       </el-table-column>
-      <el-table-column label="是否同步团队日程" align="center" width="150">
+      <el-table-column label="是否同步团队日程" align="center" width="150" show-overflow-tooltip>
         <template slot-scope="scope">
           {{ scope.row.syncTeam === 1?'是':'否' }}
         </template>
       </el-table-column>
-      <el-table-column align="center" label="操作" min-width="150">
+      <el-table-column align="center" label="操作" min-width="150" show-overflow-tooltip>
         <template slot-scope="scope">
           <el-button
             size="mini"
-            @click="handleEdit(scope.row)"
+            @click="control.update=scope.row"
           >编辑</el-button>
           <el-button
             size="mini"
             type="danger"
-            @click="handleDelete(scope.row)"
+            @click="control.delete=scope.row"
           >删除</el-button>
         </template>
       </el-table-column>
     </el-table>
+    <el-col :span="24">
+      <div align="right">
+        <el-pagination
+          :page-sizes="[10, 20, 30, total]"
+          :current-page="pages.curIndex"
+          :page-size="pages.pageSize"
+          background
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+        />
+      </div>
+    </el-col>
   </article>
 </template>
 <script>
-import { queryWorkList } from '@/api/workSchedule.js'
+import moment from 'moment'
+import { queryWorkList, queryIdleList } from '@/api/workSchedule.js'
 export default {
   filters: {
     peopleListHandler(val) {
@@ -79,19 +107,34 @@ export default {
       return newArr.join(',')
     }
   },
+  inject: {
+    control: {
+      default: () => ({})
+    }
+  },
   data() {
     return {
+      total: 0,
+      pages: {
+        curIndex: 1,
+        pageSize: 10
+      },
       form_busy_1: {
         searchScheduleInfo: {
           status: 0, // 进行中 0、未开始 1、过去的 2
           origin: [0, 1]// 任务排期 0、个人日程1
         },
         teamSearchInfo: { bizId: localStorage.getItem('bizId') || null },
-        pageInfoDO: {
-          curIndex: 1,
-          pageSize: 10
-        }
+        pageInfoDO: null
       },
+      form_busy_0: {
+        timeInfo: {
+          startTime: moment().startOf('year').format('YYYY.MM.DD'),
+          endTime: moment().endOf('year').format('YYYY.MM.DD')
+        },
+        pageInfoDO: null
+      },
+      rangeTime: [],
       statusOptions: [{
         value: 0,
         label: '进行中'
@@ -102,29 +145,59 @@ export default {
         value: 2,
         label: '过去的'
       }],
-      busy: 0,
+      busy: 1,
       tableData: []
     }
   },
+  watch: {
+    control: {
+      handler(newV, oldV) {
+        this.queryWorkList()
+      },
+      deep: true
+    },
+    rangeTime: {
+      handler(newV, oldV) {
+        this.form_busy_0.timeInfo = {
+          startTime: newV[0],
+          endTime: newV[1]
+        }
+        this.queryWorkList()
+      },
+      deep: true
+    }
+  },
   created() {
     this.queryWorkList()
   },
   methods: {
-    async queryWorkList() {
+    handleSizeChange(e) {
+      this.pageSize = e
+      this.queryWorkList()
+    },
+    handleCurrentChange(e) {
+      this.curIndex = e
+      this.queryWorkList()
+    },
+    async queryWorkList() { // 获取列表
       if (this.busy === 1) {
-        const res = await queryWorkList(this.form)
+        this.form_busy_1.pageInfoDO = this.pages
+        const res = await queryWorkList(this.form_busy_1)
         if (res.code === 200) {
           this.tableData = res.data.list
+          this.total = res.data.total
         }
       } else {
-
+        this.form_busy_0.pageInfoDO = this.pages
+        const res = await queryIdleList(this.form_busy_0)
+        if (res.code === 200) {
+          this.tableData = res.data.list
+          this.total = res.data.total
+        }
       }
     },
-    handleEdit() {
-
-    },
-    handleDelete() {
-
+    add() {
+      this.$emit('add')
     }
   }
 }
@@ -144,7 +217,7 @@ article{
       right: 0;
       transform: translateY(-50%);
     }
-    .origin {
+    .origin,.range-time {
       margin-left: 20px;
     }
     .status {

+ 46 - 5
src/views/workbench/person/index.vue

@@ -97,12 +97,15 @@
       <el-container>
         <section class="main-section">
           <MyFullCalendar
+            ref="my-FullCalendar"
             :events="calendarEvents"
             @dateClick="dateClick"
             @change="queryWorkListByTime"
             @select="select"
             @eventClick="showSchedule"
             @add="dateClick"
+            @edit="handleEdit"
+            @delete="handleDelete"
           />
         </section>
         <article v-show="showDetail" ref="show-schedule-detail" class="show-schedule-detail">
@@ -142,7 +145,7 @@
         :title="'编辑日程'"
         :visible.sync="updateSchedule.visible"
         :data="updateSchedule.data"
-        @confirm="queryWorkListByTime(calendarView)"
+        @confirm="queryWorkListByTime(calendarView);changeSuccess('update')"
       />
       <calendar-dialog
         :title="'新建日程'"
@@ -157,7 +160,7 @@
         :visible.sync="visibleSchedule"
         :detail-data="updateSchedule.data"
         :title="'修改排期'"
-        @update="queryWorkListByTime(calendarView)"
+        @update="queryWorkListByTime(calendarView);changeSuccess('update')"
       />
     <!-- 排期操作弹框 -->
     </el-container>
@@ -189,6 +192,11 @@ export default {
       return Array.isArray(val) ? val.join(',') : val
     }
   },
+  provide() {
+    return {
+      control: this.control
+    }
+  },
   data() {
     return {
       activeName: '1',
@@ -217,7 +225,23 @@ export default {
       realname: localStorage.getItem('realname'),
       nowDetailData: null, // 当前日程详情
       showDetail: false,
-      visibleSchedule: false // 排期任务弹框
+      visibleSchedule: false, // 排期任务弹框
+      control: {
+        update: null,
+        delete: null
+      }
+    }
+  },
+  watch: {
+    control: {
+      handler(newV, oldV) {
+        if (newV.update) {
+          this.handleEdit(newV.update)
+        } else if (newV.delete) {
+          this.handleDelete(newV.delete)
+        }
+      },
+      deep: true
     }
   },
   created() {
@@ -225,7 +249,7 @@ export default {
   },
   mounted() {
     this.$store.state.data.status = false
-    document.body.addEventListener('click', e => {
+    document.body.addEventListener('click', e => { // 日历弹出层操作
       const event = document.querySelector('.show-schedule-detail')
       const isIn = e.target.className === 'fc-content' || e.target.className === 'fc-time' || e.target.className === 'fc-title'
       if (!event || isIn) {
@@ -305,6 +329,7 @@ export default {
         this.showDetail = false
         this.queryWorkListByTime(this.calendarView)
         this.$message({ type: 'success', message: '删除成功!' })
+        this.changeSuccess('delete')
       }
     },
     async deleteSchedule_0() { // 删除排期
@@ -313,6 +338,7 @@ export default {
         this.showDetail = false
         this.queryWorkListByTime(this.calendarView)
         this.$message({ message: '删除成功', type: 'success', duration: 1000, offset: 150 })
+        this.changeSuccess('delete')
       }
     },
     async queryWorkListByTime(view) { // 获取指定时间段用户日程信息
@@ -379,6 +405,21 @@ export default {
         item => item.memberName
       )
       return [...newArr1, ...newArr2].join('、')
+    },
+    handleEdit(data) { // 日程列表中的编辑
+      this.nowDetailData = data
+      this.editSchedule()
+    },
+    handleDelete(data) { // 日程列表中的删除
+      this.nowDetailData = data
+      this.deleteSchedule()
+    },
+    changeSuccess(control) {
+      if (control === 'update') {
+        this.control.update = null
+      } else if (control === 'delete') {
+        this.control.delete = null
+      }
     }
   }
 }
@@ -422,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;

+ 5 - 1
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'"
@@ -246,6 +246,10 @@ export default {
 >>>.fc-event {
   line-height: auto !important;
 }
+>>>.fc-day-header {
+  height: 52px;
+  line-height: 52px;
+}
 </style>
 
 // fullcalendar