魏志佳 4 년 전
부모
커밋
d9600b4301
3개의 변경된 파일36개의 추가작업 그리고 14개의 파일을 삭제
  1. BIN
      dist.zip
  2. 21 11
      src/views/OKRList.vue
  3. 15 3
      src/views/OKRpage.vue

BIN
dist.zip


+ 21 - 11
src/views/OKRList.vue

@@ -52,7 +52,7 @@
                             </div>
                             <div class="krlist">
                                 <span class="tip">KR</span>
-                                <span class="num">关键果<span style="width:10px;display:inline-block"></span> <span class="nums"> {{item.krList.length}}</span> </span>
+                                <span class="num">关键果<span style="width:10px;display:inline-block"></span> <span class="nums"> {{item.krList.length}}</span> </span>
                             </div>
                         </div>
                         <div class="item-bottom">
@@ -64,7 +64,7 @@
             <div v-else>
                <div class="noListData">
                    <img src="../assets/image/nodata.png" alt="" class="nodata">
-                   <p class="tip">周几了,快喊人给你同步OKR吧</p>
+                   <p class="tip">咦,没有OKR哎~</p>
                </div>
             </div>
         </div>
@@ -93,8 +93,12 @@
                            
                             <span class="progress">
                                 <span class="progressBar">
-                                    <span class="krtitle">KR的完成进度:{{item.completion}}</span>
-                                    
+                                    <span class="krtitle">KR的完成进度:</span>
+                                    <span class="KR-opt"> 
+                                        <span style="width:90%">
+                                            <el-progress :percentage="item.completion"  color='#cc9966'></el-progress>
+                                        </span>                                                                            
+                                    </span>
                                 </span>
                             </span>
                         </div>                       
@@ -146,10 +150,10 @@
                             <div class="KRBox">
                                 <ul>
                                     <li v-for="(ele,index) in item.krList" :key="index">
-                                        <span class="KR-tip">KR{{index+1}}</span>
+                                        <span class="KR-tip">KR</span>
                                         <span class="KR-content">{{ele.krInfo}}</span>
                                         <span class="KR-opt"> 
-                                            <span style="width:80%">
+                                            <span style="width:90%;">
                                                 <el-progress :percentage="ele.completion"  color='#cc9966'></el-progress>
                                             </span>                                
                                             
@@ -161,8 +165,7 @@
                     </div>
                     <div class="okrBox third">
                         <div class="okrBox-title">
-                            <p class="top-title">未来四周计划</p>
-                            
+                            <p class="top-title">未来四周计划</p>                           
                         </div>
                         <div class="okrbox-list">
                             <ul>
@@ -400,7 +403,7 @@ export default {
             text-align: left;
             position: relative;
             .year,.cycle{
-                width: 100px;
+                width: 120px;
                 display: inline-block;
                 margin-right: 15px;
                 // height: 20px;
@@ -660,7 +663,12 @@ export default {
                 .krtitle{
                     line-height: 40px;
                     display: inline-block;
-                    width: 80%;
+                    width: 30%;
+                    text-align: right;
+                }
+                .KR-opt{
+                    width: 60%;
+                    padding-left: 30px;
                     text-align: left;
                 }
             }
@@ -898,12 +906,14 @@ ul,li{
                                 padding-left: 45px;
                             }
                             .KR-opt{
+                                display: inline-block;
+                                width: 20%;
                                 position: absolute;                              
                                 right: 20px;
                                 top:5px;
                                 display: flex;
                                 // display: none;
-                                width: 30%;
+                                
                                 position: absolute;
                                 justify-content:flex-end;
                                 align-items:center

+ 15 - 3
src/views/OKRpage.vue

@@ -95,7 +95,11 @@
                 <div class="objectList" v-for="(item,index) in okr" :key="index">
                     <div class="OBox">
                         <span class="O-tip">目标</span>
-                        <span class="O-content" @click="changeObject(item.objectInfo)">{{item.objectInfo.objectInfo}}</span>
+                        <span class="O-content" @click="changeObject(item.objectInfo)">{{item.objectInfo.objectInfo}}  
+                             <!-- <el-button type="warning" icon="el-icon-edit" size='mini' circle></el-button> -->
+                            <span class="edit"><i class="el-icon-edit"></i></span>
+                        </span>
+                        
                         <span class="O-opt">
                             <el-progress type="circle" :width='60' :height='60' :percentage="item.objectInfo.completion" :color="colors"></el-progress>                          
                         </span>
@@ -117,7 +121,7 @@
                                 </el-popover>
                                 
                                 <span class="KR-opt"> 
-                                    <span style="width:35%">
+                                    <span style="width:50%">
                                          <el-progress :percentage="ele.completion"  color='#cc9966'></el-progress>
                                     </span>                                
                                     <el-button type="warning" icon="el-icon-edit" size='mini' circle @click="editKR(ele)" style='margin-right:5px'></el-button>
@@ -424,7 +428,7 @@
                         <span class="info">
                             <el-input
                                 type="text"
-                                placeholder="请输入目标名称"
+                                placeholder="请输入关键结果"
                                 v-model="KRName"                             
                                 clearable                            
                                 maxlength="50"
@@ -484,6 +488,7 @@
                                 maxlength="30"
                                 show-word-limit
                                 clearable
+                                focus
                                 @blur="checkedObjectName"
                                 ></el-input>                                
                         </span>    
@@ -1201,6 +1206,13 @@ ul,li{
                         top: 5px;
                         left: 70px;
                         cursor: pointer;
+                        .edit{
+                            margin-left: 5px;
+                            display: none;
+                        }
+                    }
+                    .O-content:hover .edit{
+                        display: inline-block;
                     }
                     .O-opt{
                         position: absolute;