新增销冠排名

src/components/personalCenter.vue

+<template>
+    <div class="personal">
+        <div class="u-box ">
+            <div class="left-point"></div>
+            <div class="right-point"></div>
+            <div class="h-info-box">
+                <div class="h-info">
+                    <div class="k">姓名</div>
+                    <div class="v">{{u.emName}}</div>
+                     <div class="k">职务</div>
+                    <div class="v">{{u.PostName}}</div>
+                </div>
+                <div class="h-img">
+                    <div class="left-point-samll"></div>
+                    <div class="right-point-samll"></div>
+                    <img :src="u.Icon" :onerror='defaultHeadImg'/>
+                </div>
+            </div>
+            <div class="u-info">
+
+            </div>
+        </div>
+
+    </div>
+</template>
+<script>
+export default {
+    data() {
+        return {
+            u:{},
+            defaultHeadImg: `this.src="${require("../assets/img/default_head_img.jpg")}"`,
+        }
+    },
+    mounted() {
+        this.u = this.getLocalStorage();
+    },
+}
+</script>
+<style>
+.personal{
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    /* background: #000; */
+    background: #0a0919 url('../assets/img/persion/bg.png') 100% 100%;
+    position: relative;
+}
+.personal .u-box{
+    width:300px;
+    position: absolute;
+    background: #19133e6e;
+    left: 30px;
+    top: 30px;
+    bottom: 30px;
+    border:1px solid #2c2739;
+}
+.personal .u-box .h-info-box{
+    margin: 15px;
+    display: flex;
+}
+.personal .u-box .h-info-box .h-info{
+    flex:1;
+}
+.personal .u-box .h-info-box .h-info .k{
+    color: #8a8894;
+    height: 20px;
+    line-height: 20px;
+    font-size: 16px;
+    font-family: "pingfangR";
+    text-align: right;
+    display: block;
+    margin-top: 10px;
+}
+.personal .u-box .h-info-box .h-info .v{
+    color: #DDD;
+    height: 20;
+    line-height: 20px;
+    font-size: 20px;
+    font-family: "pingfangR";
+    text-align: right;
+    display: block;
+    margin-top: 10px;
+}
+
+.personal .u-box .h-info-box .h-img{
+    width: 120px;
+    height: 120px;
+    border: 1px solid #2c2739;
+    position: relative;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    justify-content: center;
+    margin-left: 20px;
+    display: flex;
+}
+.personal .u-box .h-info-box .h-img img{
+    width: 82px;
+    height: 82px;
+}
+.personal .u-box .u-info{
+    
+}
+.personal .left-point::after{
+    position: absolute;
+    width: 9px;
+    height: 9px;
+    left: -2px;
+    top: -2px;
+    content: ' ';
+    border-left: 3px solid #8a8894;
+    border-top: 3px solid #8a8894;
+}
+.personal .left-point::before{
+    position: absolute;
+    width: 9px;
+    height: 9px;
+    left: -2px;
+    bottom: -2px;
+    content: ' ';
+    border-left: 3px solid #8a8894;
+    border-bottom: 3px solid #8a8894;
+}
+.personal .right-point::after{
+    position: absolute;
+    width: 9px;
+    height: 9px;
+    right: -2px;
+    top: -2px;
+    content: ' ';
+    border-right: 3px solid #8a8894;
+    border-top: 3px solid #8a8894;
+}
+.personal .right-point::before{
+    position: absolute;
+    width: 9px;
+    height: 9px;
+    right: -2px;
+    bottom: -2px;
+    content: ' ';
+    border-right: 3px solid #8a8894;
+    border-bottom: 3px solid #8a8894;
+}
+
+.personal .left-point-samll::after{
+    position: absolute;
+    width: 5px;
+    height: 5px;
+    left: -1px;
+    top: -1px;
+    content: ' ';
+    border-left: 2px solid #8a8894;
+    border-top: 2px solid #8a8894;
+}
+.personal .left-point-samll::before{
+    position: absolute;
+    width: 5px;
+    height: 5px;
+    left: -1px;
+    bottom: -1px;
+    content: ' ';
+    border-left: 2px solid #8a8894;
+    border-bottom: 2px solid #8a8894;
+}
+.personal .right-point-samll::after{
+    position: absolute;
+    width: 5px;
+    height: 5px;
+    right: -1px;
+    top: -1px;
+    content: ' ';
+    border-right: 2px solid #8a8894;
+    border-top: 2px solid #8a8894;
+}
+.personal .right-point-samll::before{
+    position: absolute;
+    width: 5px;
+    height: 5px;
+    right: -1px;
+    bottom: -1px;
+    content: ' ';
+    border-right: 2px solid #8a8894;
+    border-bottom: 2px solid #8a8894;
+}
+</style>

src/components/rank/salesVolumeRank.vue

@@ -4,11 +4,12 @@
       <el-tab-pane label="个人排行榜" name="first"></el-tab-pane>
       <el-tab-pane label="部门排行榜" name="second"></el-tab-pane>
       <el-tab-pane label="公司排行榜" name="third" v-if="authority.indexOf('Sales_Volume_Rank_Show')!=-1"></el-tab-pane>
+      <el-tab-pane label="销冠排行榜" name="four"></el-tab-pane>
     </el-tabs>
     <div class="query-box">
       <el-form class="_info_box clearfix" label-width="110px">
         <el-row style="padding:15px 0px 0 0;">
-          <el-col :span="4">
+          <el-col :span="4"  v-show="activeName!='four'">
             <el-form-item label="公司：">
               <el-select filterable v-model="msg.RB_Branch_Id" @change="getDepartment" class>
                 <el-option :value="-1" label="不限"></el-option>
@@ -21,7 +22,7 @@
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :span="4" v-show="activeName!='third'">
+          <el-col :span="4" v-show="activeName!='third'&&activeName!='four'">
             <el-form-item label="部门：">
               <el-select filterable v-model="msg.RB_Department_Id" @change="getEmployee" class>
                 <el-option :value="0" label="不限"></el-option>
@@ -124,7 +125,8 @@ export default {
         EnterID: 0,
         tStartDates: [],
         qStartDates: [],
-        GroupBy: "EnterID"
+        GroupBy: "EnterID",
+        QueryType:0
       },
       getCompanyMsg: {
         // 公司
@@ -347,7 +349,8 @@ export default {
           this.msg.qStartDates && this.msg.qStartDates.length == 2
             ? this.msg.qStartDates[1]
             : null,
-        GroupBy: this.msg.GroupBy
+        GroupBy: this.msg.GroupBy,
+        QueryType: this.msg.QueryType
       };
       if (!param.QStartDate) {
         param.QStartDate = "2019-01-01";
@@ -422,12 +425,18 @@ export default {
     },
     handleClick(tab, event) {
       this.msg.EnterID = 0;
+      this.msg.QueryType=0;
       if (this.activeName == "first") this.msg.GroupBy = "EnterID";
       else if (this.activeName == "second")
         this.msg.GroupBy = "RB_Department_Id";
-      else {
+      else if (this.activeName == "third"){
         this.msg.GroupBy = "RB_Branch_Id";
         this.msg.RB_Department_Id = 0;
+      } else {
+        this.msg.RB_Department_Id = 0;
+        this.msg.RB_Branch_Id = -1;
+        this.msg.GroupBy = "EnterID";
+        this.msg.QueryType=4;
       }
       this.initColumns();
       this.initData();