Browse Source

补全okr代码

朱鑫波 3 năm trước cách đây
mục cha
commit
1c55747fa3
6 tập tin đã thay đổi với 530 bổ sung53 xóa
  1. 1 1
      src/views/Login.vue
  2. 110 10
      src/views/MyConcerns.vue
  3. 104 11
      src/views/OKRList.vue
  4. 201 17
      src/views/OKRpage.vue
  5. 113 13
      src/views/myDepart.vue
  6. 1 1
      vue.config.js

+ 1 - 1
src/views/Login.vue

@@ -21,7 +21,7 @@
                 var url = '';
                 // console.log(process.env)
                 if (process.env.NODE_ENV === 'development') {
-                    url = 'http://localhost:3001'
+                    url = 'http://192.168.6.220:3001'
                 } else if (process.env.NODE_ENV === 'production') {
                     url = 'http://okr.c-top.com.cn'
                 }

+ 110 - 10
src/views/MyConcerns.vue

@@ -121,11 +121,19 @@
                 <div class="okrBody" v-if="okr.length>0">
                     <div class="okrBox first">
                         <div class="okrBox-title">
-                            <p class="top-title">本周工作</p>
+                            <p class="top-title">
+                                <el-radio-group v-model="taskInfoListKey" class="left-button" @change="changeWeek">
+                                <!-- taskInfoWeeks -->
+                                <el-radio-button v-for="(item, index) in taskInfoWeeks" :key="index" :label="item">{{'第'+item+'周'}}</el-radio-button>
+                                </el-radio-group>
+                                <span class="right-time">
+                                    {{currentDate}}
+                                </span>
+                            </p>
                         </div>
                         <div class="okrbox-list">
                             <ul>
-                                <li v-for="(item) in taskInfoList" :key='item.id'>                           
+                                <li v-for="(item) in taskInfoList[taskInfoListKey]" :key='item.id'>                           
                                     <el-popover
                                         placement="top-start"
                                         :title="'标题:'+item.taskTitle"
@@ -146,6 +154,20 @@
                                             </span>                                   
                                         </span>                      
                                     </el-popover>
+                                     <div class="list-opt continuation-btn" style="display:flex;" v-if="item.status == 3">
+                                        <el-tag
+                                            type="success"
+                                            effect="dark">
+                                            已完成
+                                        </el-tag>
+                                    </div>
+                                    <div class="list-opt continuation-btn" style="display:flex;"  v-if="item.status == 2">
+                                        <el-tag
+                                            color="#a611e4"
+                                            effect="dark">
+                                            延续
+                                        </el-tag>
+                                    </div>
                                 </li>
                             </ul>
                         </div>
@@ -193,11 +215,16 @@
                     </div>
                     <div class="okrBox third">
                         <div class="okrBox-title">
-                            <p class="top-title">未来四周计划</p>                           
+                             <p class="top-title">
+                                <el-radio-group v-model="taskFourWeekKey" class="left-button" @change="changeMonth">
+                                <!-- taskInfoWeeks -->
+                                <el-radio-button v-for="(item, index) in taskInfoMonth" :key="index" :label="item">{{item+'月计划'}}</el-radio-button>
+                                </el-radio-group>
+                            </p>                              
                         </div>
                         <div class="okrbox-list">
                             <ul>
-                                <li v-for="(item) in taskFourWeek" :key='item.id'>                           
+                                <li v-for="(item) in taskFourWeek[taskFourWeekKey]" :key='item.id'>                           
                                     <el-popover
                                         placement="top-start"
                                         :title="'标题:'+item.taskTitle"
@@ -217,7 +244,20 @@
                                             </span>                                   
                                         </span>                           
                                     </el-popover>
-                                    
+                                    <div class="list-opt continuation-btn" style="display:flex;" v-if="item.status == 3">
+                                        <el-tag
+                                            type="success"
+                                            effect="dark">
+                                            已完成
+                                        </el-tag>
+                                    </div>
+                                    <div class="list-opt continuation-btn" style="display:flex;"  v-if="item.status == 2">
+                                        <el-tag
+                                            color="#a611e4"
+                                            effect="dark">
+                                            延续
+                                        </el-tag>
+                                    </div>
                                 </li>
                             </ul>
                         </div>
@@ -292,6 +332,14 @@ export default {
             okrObject:{},
             taskInfoList:[],
             taskFourWeek:[],
+            taskInfoListKey:null,
+            taskFourWeekKey:null,
+            currentMonth:null,
+            currentWeek:null,
+            currentDate:null,
+            taskInfoWeeks:[],
+            taskInfoMonth:[],
+            taskFourWeek: [],
             status:[],
             time:{},
 
@@ -388,6 +436,20 @@ export default {
                 this.list=res.list
             })
         },
+        changeWeek(value){
+            var data = this.time.weeks[this.taskFourWeekKey].filter(item=>{
+                return item.week == value
+            })[0]
+            this.currentDate = data.startDate + '至' +data.endDate
+        },
+        changeMonth(value) {
+            console.log(value)
+            this.taskInfoWeeks = this.time.weeks[value].map(item=>{
+                return item.week
+            })
+            this.taskInfoListKey = this.taskInfoWeeks[0]
+            this.changeWeek(this.taskInfoListKey)
+        },
         getThisOKR(item){
             this.currentData={
                 object:{},
@@ -413,8 +475,38 @@ export default {
                         this.okr=res.result.okr;
                         this.taskInfoList=res.result.taskInfoList;
                         this.taskFourWeek=res.result.taskFourWeekList;
-                        
+
+                        this.currentMonth = res.result.time.currentMonth
+                        this.currentWeek = res.result.time.currentWeek;
                         this.time=res.result.time
+
+
+            
+                        this.taskFourWeekKey = res.result.time.currentMonth;
+                        this.taskInfoWeeks = res.result.time.weeks[res.result.time.currentMonth].map(item=>{
+                            return item.week
+                        })
+
+                        this.taskInfoListKey = this.currentWeek
+                        
+                        var data = this.time.weeks[this.taskFourWeekKey].filter(item=>{
+                            return item.week == this.taskInfoListKey
+                        })[0]
+                        this.currentDate = data.startDate + '至' +data.endDate
+                    
+                    
+                        this.taskInfoMonth = res.result.time.months
+            
+
+                        res.result.status.forEach((item,index)=>{
+                            if(item.type=='1'){
+                                item.color='#CC3300';
+                            }else if(item.type=='2'){
+                                item.color='#FFCC33';
+                            }else{
+                                item.color='#99CC99';
+                            }
+                        })
                         res.result.status.forEach((item,index)=>{
                             if(item.type=='1'){
                                 item.color='#CC3300';
@@ -856,12 +948,17 @@ ul,li{
             // overflow: auto;
             .okrBox-title{
                  text-align: left;
-                 max-height: 20%;
-                .top-title{
-                    font-size: 20px;
+                .top-title {
+                    font-size: 16px;
                     margin: 8px 0;
-                    padding:  0 20px;
+                    padding: 0 20px;
                     // text-align: left;
+                    display: flex;
+                    justify-content: space-between;
+                    flex-direction: column;
+                }
+                .right-time{
+                    margin-top: 10px;
                 }
                 .createTask{
                     font-size: 12px;
@@ -945,6 +1042,9 @@ ul,li{
                 li:hover .list-opt{
                     display: flex;
                 }
+                /deep/ .list-opt .el-tag--dark{
+                    border: 0px;
+                }
             }
            .status-list{
                 overflow: auto;

+ 104 - 11
src/views/OKRList.vue

@@ -135,11 +135,19 @@
                 <div class="okrBody" v-if="okr.length>0">
                     <div class="okrBox first">
                         <div class="okrBox-title">
-                            <p class="top-title">本周工作</p>
+                            <p class="top-title">
+                                <el-radio-group v-model="taskInfoListKey" class="left-button" @change="changeWeek">
+                                <!-- taskInfoWeeks -->
+                                <el-radio-button v-for="(item, index) in taskInfoWeeks" :key="index" :label="item">{{'第'+item+'周'}}</el-radio-button>
+                                </el-radio-group>
+                                <span class="right-time">
+                                    {{currentDate}}
+                                </span>
+                            </p>
                         </div>
                         <div class="okrbox-list">
                             <ul>
-                                <li v-for="(item) in taskInfoList" :key='item.id'>                           
+                                <li v-for="(item) in taskInfoList[taskInfoListKey]" :key='item.id'>                           
                                     <el-popover
                                         placement="top-start"
                                         :title="'标题:'+item.taskTitle"
@@ -160,6 +168,20 @@
                                             </span>                                   
                                         </span>                            
                                     </el-popover>
+                                    <div class="list-opt continuation-btn" style="display:flex;" v-if="item.status == 3">
+                                        <el-tag
+                                            type="success"
+                                            effect="dark">
+                                            已完成
+                                        </el-tag>
+                                    </div>
+                                    <div class="list-opt continuation-btn" style="display:flex;"  v-if="item.status == 2">
+                                        <el-tag
+                                            color="#a611e4"
+                                            effect="dark">
+                                            延续
+                                        </el-tag>
+                                    </div>
                                 </li>
                             </ul>
                         </div>
@@ -208,11 +230,16 @@
                     </div>
                     <div class="okrBox third">
                         <div class="okrBox-title">
-                            <p class="top-title">未来四周计划</p>                           
+                            <p class="top-title">
+                                <el-radio-group v-model="taskFourWeekKey" class="left-button" @change="changeMonth">
+                                <!-- taskInfoWeeks -->
+                                <el-radio-button v-for="(item, index) in taskInfoMonth" :key="index" :label="item">{{item+'月计划'}}</el-radio-button>
+                                </el-radio-group>
+                            </p>                           
                         </div>
                         <div class="okrbox-list">
                             <ul>
-                                <li v-for="(item) in taskFourWeek" :key='item.id'>                           
+                                <li v-for="(item) in taskFourWeek[taskFourWeekKey]" :key='item.id'>                           
                                     <el-popover
                                         placement="top-start"
                                         :title="'标题:'+item.taskTitle"
@@ -232,7 +259,20 @@
                                             </span>                                   
                                         </span>                            
                                     </el-popover>
-                                    
+                                    <div class="list-opt continuation-btn" style="display:flex;" v-if="item.status == 3">
+                                        <el-tag
+                                            type="success"
+                                            effect="dark">
+                                            已完成
+                                        </el-tag>
+                                    </div>
+                                    <div class="list-opt continuation-btn" style="display:flex;"  v-if="item.status == 2">
+                                        <el-tag
+                                            color="#a611e4"
+                                            effect="dark">
+                                            延续
+                                        </el-tag>
+                                    </div>
                                 </li>
                             </ul>
                         </div>
@@ -311,6 +351,14 @@ export default {
             okrObject:{},
             taskInfoList:[],
             taskFourWeek:[],
+            taskInfoListKey:null,
+            taskFourWeekKey:null,
+            currentMonth:null,
+            currentWeek:null,
+            currentDate:null,
+            taskInfoWeeks:[],
+            taskInfoMonth:[],
+            taskFourWeek: [],
             status:[],
             time:{},
 
@@ -415,7 +463,20 @@ export default {
                 this.list=res.result.list
             })
         },
-        
+        changeWeek(value){
+            var data = this.time.weeks[this.taskFourWeekKey].filter(item=>{
+                return item.week == value
+            })[0]
+            this.currentDate = data.startDate + '至' +data.endDate
+        },
+        changeMonth(value) {
+            console.log(value)
+            this.taskInfoWeeks = this.time.weeks[value].map(item=>{
+                return item.week
+            })
+            this.taskInfoListKey = this.taskInfoWeeks[0]
+            this.changeWeek(this.taskInfoListKey)
+        },
         getThisOKR(item){
             console.log(item)
             this.currentData={
@@ -442,8 +503,29 @@ export default {
                         this.okr=res.result.okr;
                         this.taskInfoList=res.result.taskInfoList;
                         this.taskFourWeek=res.result.taskFourWeekList;
-                        
+                        this.currentMonth = res.result.time.currentMonth
+                        this.currentWeek = res.result.time.currentWeek;
                         this.time=res.result.time
+
+
+            
+                        this.taskFourWeekKey = res.result.time.currentMonth;
+                        this.taskInfoWeeks = res.result.time.weeks[res.result.time.currentMonth].map(item=>{
+                            return item.week
+                        })
+
+                        this.taskInfoListKey = this.currentWeek
+                        
+                        
+                         var data = this.time.weeks[this.taskFourWeekKey].filter(item=>{
+                            return item.week == this.taskInfoListKey
+                        })[0]
+                        this.currentDate = data.startDate + '至' +data.endDate
+                    
+                    
+                        this.taskInfoMonth = res.result.time.months
+            
+
                         res.result.status.forEach((item,index)=>{
                             if(item.type=='1'){
                                 item.color='#CC3300';
@@ -909,13 +991,21 @@ ul,li{
             // overflow: auto;
             .okrBox-title{
                  text-align: left;
-                 max-height: 20%;
-                .top-title{
-                    font-size: 20px;
+
+                .top-title {
+                    font-size: 16px;
                     margin: 8px 0;
-                    padding:  0 20px;
+                    padding: 0 20px;
                     // text-align: left;
+                    display: flex;
+                    justify-content: space-between;
+                    flex-direction: column;
+                }
+                .right-time{
+                    margin-top: 10px;
                 }
+
+                
                 .createTask{
                     font-size: 12px;
                     margin: 5px 0;
@@ -999,6 +1089,9 @@ ul,li{
                 li:hover .list-opt{
                     display: flex;
                 }
+                /deep/ .list-opt .el-tag--dark{
+                    border: 0px;
+                }
             }
            .status-list{
                 overflow: auto;

+ 201 - 17
src/views/OKRpage.vue

@@ -94,7 +94,16 @@
     <div class="okrBody" v-if="okr.length > 0">
       <div class="okrBox first">
         <div class="okrBox-title">
-          <p class="top-title">本周工作</p>
+          <!-- taskInfoListKey -->
+          <p class="top-title">
+            <el-radio-group v-model="taskInfoListKey" class="left-button" @change="changeWeek">
+              <!-- taskInfoWeeks -->
+              <el-radio-button v-for="(item, index) in taskInfoWeeks" :key="index" :label="item">{{'第'+item+'周'}}</el-radio-button>
+            </el-radio-group>
+            <span class="right-time">
+                {{currentDate}}
+            </span>
+          </p>
           <!-- :disabled="
               time.year != time.currentYear ||
               time.quarter != time.currentQuarter
@@ -103,14 +112,15 @@
             type="text"
             class="createTask"
             @click="createTask(1)"
-            
+            v-if="taskFourWeekKey >= currentMonth"
           >
             <i class="el-icon-plus"></i>新建任务
           </el-button>
         </div>
         <div class="okrbox-list">
           <ul>
-            <li v-for="item in taskInfoList" :key="item.id">
+            <li v-for="item in taskInfoList[taskInfoListKey]" :key="item.id">
+
               <el-popover
                 placement="top-start"
                 :title="'标题:' + item.taskTitle"
@@ -156,14 +166,30 @@
                   time.year == time.currentYear &&
                   time.quarter == time.currentQuarter
                 " -->
+              <div class="list-opt continuation-btn" style="display:flex;" v-if="item.status == 3">
+                <el-tag
+                    type="success"
+                    effect="dark">
+                    已完成
+                </el-tag>
+              </div>
+              <div class="list-opt continuation-btn" style="display:flex;"  v-if="item.status == 2">
+                <el-tag
+                    color="#a611e4"
+                    effect="dark">
+                    延续
+                </el-tag>
+              </div>
+              
               <div
                 class="list-opt"
-               
+                v-if="taskFourWeekKey >= currentMonth"
               >
                 <!-- <el-progress :percentage="30"  ></el-progress> -->
                 <!-- <div style="width:30%">
                                     <el-progress :percentage="50" color='#cc9966'></el-progress>
                 </div>-->
+             
                 <el-button
                   type="warning"
                   icon="el-icon-edit"
@@ -404,7 +430,12 @@
       </div>
       <div class="okrBox third">
         <div class="okrBox-title">
-          <p class="top-title">未来四周计划</p>
+          <p class="top-title">
+            <el-radio-group v-model="taskFourWeekKey" class="left-button" @change="changeMonth">
+              <!-- taskInfoWeeks -->
+              <el-radio-button v-for="(item, index) in taskInfoMonth" :key="index" :label="item">{{item+'月计划'}}</el-radio-button>
+            </el-radio-group>
+          </p>
           <!-- :disabled="
               time.year != time.currentYear ||
               time.quarter != time.currentQuarter
@@ -413,14 +444,14 @@
             type="text"
             class="createTask"
             @click="createTask(2)"
-            
+            v-if="taskFourWeekKey >= currentMonth"
           >
             <i class="el-icon-plus"></i>新建任务
           </el-button>
         </div>
         <div class="okrbox-list">
           <ul>
-            <li v-for="item in taskFourWeek" :key="item.id">
+            <li v-for="item in taskFourWeek[taskFourWeekKey]" :key="item.id">
               <el-popover
                 placement="top-start"
                 :title="'标题:' + item.taskTitle"
@@ -461,8 +492,23 @@
                   </span>
                 </span>
               </el-popover>
+              <div class="list-opt continuation-btn" style="display:flex;" v-if="item.status == 3">
+                <el-tag
+                    type="success"
+                    effect="dark">
+                    已完成
+                </el-tag>
+              </div>
+              <div class="list-opt continuation-btn" style="display:flex;"  v-if="item.status == 2">
+                <el-tag
+                    color="#a611e4"
+                    effect="dark">
+                    延续
+                </el-tag>
+              </div>
               <div
                 class="list-opt"
+                v-if="taskFourWeekKey >= currentMonth"
                 
               >
                 <!-- <el-progress :percentage="30"  ></el-progress> -->
@@ -603,7 +649,7 @@
                   type="textarea"
                   placeholder="您可对KR做进一步详细描述"
                   v-model="item.krDesc"
-                  maxlength="100"
+                  maxlength="1000"
                   show-word-limit
                   clearable
                   size="small"
@@ -748,7 +794,7 @@
               type="textarea"
               placeholder="您可对任务做进一步详细描述"
               v-model="taskDesc"
-              maxlength="100"
+              maxlength="1000"
               show-word-limit
               clearable
               size="small"
@@ -811,6 +857,18 @@
               >
             </span>
           </div>
+          <div v-if="taskTitle == '修改任务'"  class="task-item">
+            <span class="item-name">当前状态:</span>
+            <el-radio-group
+              v-model="statusTask"
+              size="small"
+            >
+              <el-radio :label="1" border>正常</el-radio>
+              <el-radio :label="2" border>延续</el-radio>
+              <el-radio :label="3" border>已完成</el-radio>
+            </el-radio-group>
+
+          </div>
           <!-- 完成的进度 -->
           <!-- <div class="task-item">
                         <span class="item-name" >设置进度:</span>
@@ -827,12 +885,14 @@
             type="warning"
             @click="taskOk"
             v-if="taskTitle == '创建任务'"
+            :loading="taskVisibleLoading"
             >创 建</el-button
           >
           <el-button
             type="warning"
             @click="editTaskOk"
             v-if="taskTitle == '修改任务'"
+            :loading="taskVisibleLoading"
             >修 改</el-button
           >
         </span>
@@ -1072,7 +1132,7 @@
         <span slot="footer" class="dialog-footer">
           <el-button @click="KRVisible = false">取 消</el-button>
           <el-button type="warning" @click="KROk" v-if="KRTitle == '新建KR'"
-            >创 建</el-button
+            :loading="KROKVisible">创 建</el-button
           >
           <el-button type="warning" @click="editKROk" v-if="KRTitle == '修改KR'"
             >修 改</el-button
@@ -1228,6 +1288,8 @@ export default {
   components: { Treeselect },
   data() {
     return {
+      KROKVisible:false,
+      taskVisibleLoading:false,
       okLoading: false,
       optionsPerson: [],
       person: "",
@@ -1250,6 +1312,7 @@ export default {
       KRTag: [],
       remindValue: [], //@的人 任务
       visiblePerson: [], //指定可见人  任务
+      statusTask: 1,
       // SHOW_PARENT,
 
       KRPower: "1", //kr的权限
@@ -1265,7 +1328,15 @@ export default {
       okr: [],
       okrList: [],
       okrObject: {},
+      allTime: null,
       taskInfoList: [],
+      taskInfoListKey:null,
+      taskFourWeekKey:null,
+      currentMonth:null,
+      currentWeek:null,
+      currentDate:null,
+      taskInfoWeeks:[],
+      taskInfoMonth:[],
       taskFourWeek: [],
       status: [],
       time: {},
@@ -1744,6 +1815,7 @@ export default {
       this.visiblePerson = [];
       this.remindValue = [];
       this.taskTag = [];
+      this.statusTask = 1
       // this.taskProgress=0;
       // console.log(val,this.currentTask)
     },
@@ -1760,6 +1832,7 @@ export default {
             this.remindValue.push(item.id);
           });
         }
+        this.taskVisibleLoading = true
         postAction("/okr/okr/insertTaskInfo", {
           taskInfo: {
             taskTitle: this.taskName,
@@ -1769,9 +1842,13 @@ export default {
             permission: this.taskPower,
             publicIds: this.visiblePerson,
             remindIds: this.remindValue,
+            status: this.statusTask,
+            week: this.taskInfoListKey,
+            year: this.yearValue
           },
         }).then((res) => {
           // console.log(res)
+          this.taskVisibleLoading = false
           if (res.success) {
             this.taskVisible = false;
             this.getOkrPageList();
@@ -1818,6 +1895,7 @@ export default {
       this.taskRange = val.priority;
       this.taskId = val.id;
       this.taskPower = val.permission + "";
+      this.statusTask = val.status
 
       this.visiblePerson = val.publicIds;
       // this.remindValue=val.remindIds
@@ -1851,6 +1929,7 @@ export default {
             this.remindValue.push(item.id);
           });
         }
+        this.taskVisibleLoading = true
         postAction("/okr/okr/updateTaskInfo", {
           taskInfo: {
             id: this.taskId,
@@ -1860,8 +1939,10 @@ export default {
             permission: this.taskPower,
             publicIds: this.visiblePerson,
             remindIds: this.remindValue,
+            status: this.statusTask
           },
         }).then((res) => {
+          this.taskVisibleLoading = false
           // console.log(res)
           if (res.success) {
             this.$message({
@@ -2002,13 +2083,15 @@ export default {
     KROk() {
       this.checkKRName();
       if (!this.KRNameOk) {
+        this.KROKVisible = true
         if (this.KRPower == "3") {
           this.KRremindValue = [];
           this.KRTag.forEach((item) => {
             this.KRremindValue.push(item.id);
           });
         }
-        postAction("/okr/okr/insertOkrKrInfo ", {
+        console.log(this.taskInfoListKey)
+        postAction("/okr/okr/insertOkrKrInfo", {
           krInfo: {
             completion: this.KRProgress,
             krInfo: this.KRName,
@@ -2017,8 +2100,11 @@ export default {
             permission: this.KRPower,
             publicIds: this.KRvisiblePerson,
             remindIds: this.KRremindValue,
+            week: this.taskInfoListKey,
+            year: this.yearValue
           },
         }).then((res) => {
+          this.KROKVisible = false
           // console.log(res)
           if (res.success) {
             this.KRVisible = false;
@@ -2066,6 +2152,7 @@ export default {
             this.KRremindValue.push(item.id);
           });
         }
+        this.KROKVisible = true
         postAction("/okr/okr/updateKr", {
           krInfo: {
             completion: this.KRProgress,
@@ -2078,6 +2165,7 @@ export default {
           },
         }).then((res) => {
           // console.log(res)
+          this.KROKVisible = false
           if (res.success) {
             this.KRVisible = false;
             this.getOkrPageList();
@@ -2086,6 +2174,7 @@ export default {
       }
     },
     yearChange(key) {
+      this.taskInfoListKey = this.taskInfoWeeks[0]
       this.getOkrPageList();
     },
     cycleChange(key) {
@@ -2099,6 +2188,20 @@ export default {
         this.getOkrPageList();
       }
     },
+    changeWeek(value){
+      var data = this.allTime.weeks[this.taskFourWeekKey].filter(item=>{
+        return item.week == value
+      })[0]
+      this.currentDate = data.startDate + '至' +data.endDate
+    },
+    changeMonth(value) {
+      console.log(value)
+      this.taskInfoWeeks = this.allTime.weeks[value].map(item=>{
+        return item.week
+      })
+      this.taskInfoListKey = this.taskInfoWeeks[0]
+      this.changeWeek(this.taskInfoListKey)
+    },
     // 获取页面展示的list
     getOkrPageList() {
       this.loading = true;
@@ -2113,6 +2216,54 @@ export default {
             this.okr = res.result.okr;
             this.taskInfoList = res.result.taskInfoList;
             this.taskFourWeek = res.result.taskFourWeekList;
+            this.allTime = res.result.time;
+            this.currentMonth = res.result.time.currentMonth
+            this.currentWeek = res.result.time.currentWeek;
+            this.taskInfoMonth = res.result.time.months
+            if(res.result.time.currentQuarter == res.result.time.quarter){
+
+              
+              
+              this.taskInfoWeeks = res.result.time.weeks[res.result.time.currentMonth].map(item=>{
+                return item.week
+              })
+          
+              if(this.taskInfoMonth.includes(this.taskFourWeekKey)){
+
+                this.taskInfoWeeks = res.result.time.weeks[this.taskFourWeekKey].map(item=>{
+                  return item.week
+                })
+                
+              }else{
+                this.taskInfoWeeks = res.result.time.weeks[res.result.time.currentMonth].map(item=>{
+                  return item.week
+                })
+                this.taskFourWeekKey = res.result.time.currentMonth;
+                if(this.taskInfoWeeks.includes(this.taskInfoListKey)){
+
+                }else{
+                  this.taskInfoListKey = this.taskInfoWeeks[0]
+                }
+              }
+              
+              this.currentDate = res.result.time.currentDate
+            }else{
+              this.taskFourWeekKey = res.result.time.months[0];
+              this.taskInfoWeeks = res.result.time.weeks[this.taskFourWeekKey].map(item=>{
+                return item.week
+              })
+              
+              this.taskInfoListKey = this.taskInfoWeeks[0]
+              
+              
+              var data = this.allTime.weeks[this.taskFourWeekKey].filter(item=>{
+                return item.week == this.taskInfoListKey
+              })[0]
+              this.currentDate = data.startDate + '至' +data.endDate
+            }
+           
+
+            
 
             this.time = res.result.time;
             res.result.status.forEach((item, index) => {
@@ -2268,13 +2419,35 @@ li {
       // overflow: auto;
       .okrBox-title {
         text-align: left;
-        max-height: 20%;
-        .top-title {
-          font-size: 20px;
-          margin: 8px 0;
-          padding: 0 20px;
-          // text-align: left;
+        @media only screen and (min-width: 1315px) {
+          .top-title {
+            font-size: 16px;
+            margin: 8px 0;
+            padding: 0 20px;
+            // text-align: left;
+            display: flex;
+            justify-content: space-between;
+          }
+          .right-time{
+            margin-top: 10px;
+          }
         }
+        @media only screen and (max-width: 1314px) {
+          .top-title {
+            font-size: 16px;
+            margin: 8px 0;
+            padding: 0 20px;
+            // text-align: left;
+            display: flex;
+            justify-content: space-between;
+            flex-direction: column;
+          }
+          .right-time{
+            margin-top: 10px;
+          }
+
+        }
+        
         .createTask {
           font-size: 12px;
           margin: 5px 0;
@@ -2282,6 +2455,7 @@ li {
           text-align: left;
         }
       }
+    
       .okrbox-list {
         width: 100%;
         overflow: auto;
@@ -2356,6 +2530,13 @@ li {
         li:hover .list-opt {
           display: flex;
         }
+        li:hover .continuation-btn {
+          right:78px
+        }
+        /deep/ .continuation-btn .el-tag--dark{
+          border: 0px;
+        }
+        
       }
       .status-list {
         overflow: auto;
@@ -2497,6 +2678,9 @@ li {
             li:hover .list-opt {
               display: flex;
             }
+            li:hover .continuation-btn {
+              right:78px
+            }
           }
         }
       }

+ 113 - 13
src/views/myDepart.vue

@@ -121,11 +121,19 @@
                 <div class="okrBody" v-if="okr.length>0">
                     <div class="okrBox first">
                         <div class="okrBox-title">
-                            <p class="top-title">本周工作</p>
+                            <p class="top-title">
+                                <el-radio-group v-model="taskInfoListKey" class="left-button" @change="changeWeek">
+                                <!-- taskInfoWeeks -->
+                                <el-radio-button v-for="(item, index) in taskInfoWeeks" :key="index" :label="item">{{'第'+item+'周'}}</el-radio-button>
+                                </el-radio-group>
+                                <span class="right-time">
+                                    {{currentDate}}
+                                </span>
+                            </p>
                         </div>
                         <div class="okrbox-list">
                             <ul>
-                                <li v-for="(item) in taskInfoList" :key='item.id'>                           
+                                <li v-for="(item) in taskInfoList[taskInfoListKey]" :key='item.id'>                           
                                     <el-popover
                                         placement="top-start"
                                         :title="'标题:'+item.taskTitle"
@@ -144,8 +152,22 @@
                                                 {{item.taskTitle}}
                                                   <span v-for="(element) in item.remindVOS" :key="element.krId" class="remindSpan">@{{element.name}}</span>
                                             </span>                                   
-                                        </span>                             
+                                        </span>                      
                                     </el-popover>
+                                     <div class="list-opt continuation-btn" style="display:flex;" v-if="item.status == 3">
+                                        <el-tag
+                                            type="success"
+                                            effect="dark">
+                                            已完成
+                                        </el-tag>
+                                    </div>
+                                    <div class="list-opt continuation-btn" style="display:flex;"  v-if="item.status == 2">
+                                        <el-tag
+                                            color="#a611e4"
+                                            effect="dark">
+                                            延续
+                                        </el-tag>
+                                    </div>
                                 </li>
                             </ul>
                         </div>
@@ -196,11 +218,16 @@
                     </div>
                     <div class="okrBox third">
                         <div class="okrBox-title">
-                            <p class="top-title">未来四周计划</p>                           
+                             <p class="top-title">
+                                <el-radio-group v-model="taskFourWeekKey" class="left-button" @change="changeMonth">
+                                <!-- taskInfoWeeks -->
+                                <el-radio-button v-for="(item, index) in taskInfoMonth" :key="index" :label="item">{{item+'月计划'}}</el-radio-button>
+                                </el-radio-group>
+                            </p>                              
                         </div>
                         <div class="okrbox-list">
                             <ul>
-                                <li v-for="(item) in taskFourWeek" :key='item.id'>                           
+                                <li v-for="(item) in taskFourWeek[taskFourWeekKey]" :key='item.id'>                           
                                     <el-popover
                                         placement="top-start"
                                         :title="'标题:'+item.taskTitle"
@@ -210,7 +237,7 @@
                                         <span slot="reference" class="content">
                                             <span class="taskGrade">
                                                 <!-- P{{item.priority}} -->
-                                                 <img src="../assets/image/1.png" alt="" v-if="item.priority=='1'" class="priorityIMg">
+                                                <img src="../assets/image/1.png" alt="" v-if="item.priority=='1'" class="priorityIMg">
                                                 <img src="../assets/image/2.png" alt="" v-if="item.priority=='2'"  class="priorityIMg">
                                                 <img src="../assets/image/3.png" alt="" v-if="item.priority=='3'"  class="priorityIMg">
                                             </span> 
@@ -218,9 +245,22 @@
                                                 {{item.taskTitle}}
                                                   <span v-for="(element) in item.remindVOS" :key="element.krId" class="remindSpan">@{{element.name}}</span>
                                             </span>                                   
-                                        </span>                             
+                                        </span>                           
                                     </el-popover>
-                                    
+                                    <div class="list-opt continuation-btn" style="display:flex;" v-if="item.status == 3">
+                                        <el-tag
+                                            type="success"
+                                            effect="dark">
+                                            已完成
+                                        </el-tag>
+                                    </div>
+                                    <div class="list-opt continuation-btn" style="display:flex;"  v-if="item.status == 2">
+                                        <el-tag
+                                            color="#a611e4"
+                                            effect="dark">
+                                            延续
+                                        </el-tag>
+                                    </div>
                                 </li>
                             </ul>
                         </div>
@@ -295,6 +335,14 @@ export default {
             okrObject:{},
             taskInfoList:[],
             taskFourWeek:[],
+            taskInfoListKey:null,
+            taskFourWeekKey:null,
+            currentMonth:null,
+            currentWeek:null,
+            currentDate:null,
+            taskInfoWeeks:[],
+            taskInfoMonth:[],
+            taskFourWeek: [],
             status:[],
             time:{},
 
@@ -390,6 +438,20 @@ export default {
                 this.list=res.list
             })
         },
+        changeWeek(value){
+            var data = this.time.weeks[this.taskFourWeekKey].filter(item=>{
+                return item.week == value
+            })[0]
+            this.currentDate = data.startDate + '至' +data.endDate
+        },
+        changeMonth(value) {
+            console.log(value)
+            this.taskInfoWeeks = this.time.weeks[value].map(item=>{
+                return item.week
+            })
+            this.taskInfoListKey = this.taskInfoWeeks[0]
+            this.changeWeek(this.taskInfoListKey)
+        },
         getThisOKR(item){
             this.currentData={
                 object:{},
@@ -415,8 +477,38 @@ export default {
                         this.okr=res.result.okr;
                         this.taskInfoList=res.result.taskInfoList;
                         this.taskFourWeek=res.result.taskFourWeekList;
-                        
+
+                        this.currentMonth = res.result.time.currentMonth
+                        this.currentWeek = res.result.time.currentWeek;
                         this.time=res.result.time
+
+
+            
+                        this.taskFourWeekKey = res.result.time.currentMonth;
+                        this.taskInfoWeeks = res.result.time.weeks[res.result.time.currentMonth].map(item=>{
+                            return item.week
+                        })
+
+                        this.taskInfoListKey = this.currentWeek
+                        
+                        var data = this.time.weeks[this.taskFourWeekKey].filter(item=>{
+                            return item.week == this.taskInfoListKey
+                        })[0]
+                        this.currentDate = data.startDate + '至' +data.endDate
+                    
+                    
+                        this.taskInfoMonth = res.result.time.months
+            
+
+                        res.result.status.forEach((item,index)=>{
+                            if(item.type=='1'){
+                                item.color='#CC3300';
+                            }else if(item.type=='2'){
+                                item.color='#FFCC33';
+                            }else{
+                                item.color='#99CC99';
+                            }
+                        })
                         res.result.status.forEach((item,index)=>{
                             if(item.type=='1'){
                                 item.color='#CC3300';
@@ -856,12 +948,17 @@ ul,li{
             // overflow: auto;
             .okrBox-title{
                  text-align: left;
-                 max-height: 20%;
-                .top-title{
-                    font-size: 20px;
+                .top-title {
+                    font-size: 16px;
                     margin: 8px 0;
-                    padding:  0 20px;
+                    padding: 0 20px;
                     // text-align: left;
+                    display: flex;
+                    justify-content: space-between;
+                    flex-direction: column;
+                }
+                .right-time{
+                    margin-top: 10px;
                 }
                 .createTask{
                     font-size: 12px;
@@ -945,6 +1042,9 @@ ul,li{
                 li:hover .list-opt{
                     display: flex;
                 }
+                /deep/ .list-opt .el-tag--dark{
+                    border: 0px;
+                }
             }
            .status-list{
                 overflow: auto;

+ 1 - 1
vue.config.js

@@ -3,7 +3,7 @@ module.exports = {
         port: 3001,
         proxy: {
             "/api": {
-                // target: 'http://192.168.1.188:8910', // 要访问的接口域名
+                // target: 'http://192.168.1.3:8910', // 要访问的接口域名
                 target: 'http://okrapi.c-top.com.cn', // 要访问的接口域名
                 ws: true, // 是否启用websockets
                 changeOrigin: true, //开启代理:在本地会创建一个虚拟服务端,然后发送请求的数据,并同时接收请求的数据,这样服务端和服务端进行数据的交互就不会有跨域问题