dd_pc/src/home.vue

<template>
  <div class="">
    <!-- <div class="data-all"> -->
    <!-- <img src="./assets/image/init.gif" class="appImg" />
			<div>管理执行难，就用功道云</div> -->
    <el-row style="min-width:1160px;">
      <el-col :span="18" style="min-width:780px;">
        <el-row class="home-left-header">
          <el-col :span="7" class="hlheader-user" v-loading="">
            <el-row :gutter="40">
              <el-col :span="24" class="hlheader-user-info">
                <div
                  class="headimg"
                  style=" margin-right: 0px;cursor:pointer;"
                  @click=""
                >
                  <userImage
                    :user_name="user_info.name"
                    :img_url="user_info.img_url"
                    fontSize="1.1"
                    width="60px"
                    height="60px"
                  ></userImage>
                </div>
                <div class="headtext">
                  <div class="greetings" style="margin-top:7px;">
                    <div style="margin-top:2px;">{{ user_info.name }}</div>
                    &nbsp;
                    <span style="margin-top:2px;">{{
                      time <= 4
                        ? "夜深了"
                        : time > 4 && time <= 11
                        ? "早上好"
                        : time > 11 && time <= 14
                        ? "中午好"
                        : time > 14 && time <= 19
                        ? "下午好"
                        : time > 19 && time <= 24
                        ? "晚上好"
                        : ""
                    }}</span>
                  </div>
                  <p style="margin-top: 14px; color: #666;">
                    <span>{{
                      time <= 4
                        ? "烦恼尽退散"
                        : time > 4 && time <= 11
                        ? "又是美好的一天"
                        : time > 11 && time <= 14
                        ? "吃饱睡好更有动力"
                        : time > 14 && time <= 19
                        ? "致敬奋斗中的自己"
                        : time > 19 && time <= 24
                        ? "该养精蓄锐了"
                        : ""
                    }}</span>
                  </p>
                </div>
              </el-col>
            </el-row>
          </el-col>

          <el-col :span="17" style="margin:0;padding:0;" v-if="creatorJurisdiction">
            <el-col
              :gutter="50"
              style="margin:0;padding:34px 0 0 0;"
              class="quick_button_box"
            >
              <div style="display:flex;justify-content: space-around;">
                <div
                  v-for="(item, index) in fits"
                  :key="index"
                  @click="openGzd(item.url)"
                  style="display:flex;cursor:pointer;padding:0 5px 0 5px"
                >
                  <img
                    :src="item.img"
                    style="width:46px;height:46px;margin:10px 5px 0 0"
                  />
                  <p style="display: inline-block;width:100%;">
                    <b
                      style="display: inline-block;color:#303133;font-size:16px;margin-top:11px;"
                      >{{ item.name }}</b
                    ><br />
                    <span
                      style="color:#606266;font-size:12px;display: inline-block;margin-top:8px;"
                      >{{ item.value }}</span
                    >
                  </p>
                </div>
              </div>
            </el-col>
          </el-col>
          <el-col v-else  :span="17" style="margin-top:34px;padding:0 0 10px 0;height:58px;" v-loading="authorityManagerHeaderLoad">
            <el-col :gutter="50" style="margin:0;padding:0;" class="quick_button_box">
              <div style="display:flex;justify-content: space-around;">
                <p style="text-align:center;cursor:pointer;margin: 0;" @click="$router.push({ path: '/individual_statistics' })"><b style="color:#26A2FF;font-size:27px;">{{authorityManagerHeaders.b?authorityManagerHeaders.b:'0'}}</b><br><span style="color:#606266;font-size:14px;padding-top:8px;display: inline-block;">本月B分</span></p>
                <p style="text-align:center;cursor:pointer;margin: 0;" @click="$router.push({ path: '/individual_statistics' })"><b style="color:#26A2FF;font-size:27px;">{{authorityManagerHeaders.a?authorityManagerHeaders.a:'0'}}</b><br><span style="color:#606266;font-size:14px;padding-top:8px;display: inline-block;">本月A分</span></p>
                <!-- <p style="text-align:center;cursor:pointer;margin: 0;" @click="$router.push({ path: '/my_performance' })"><b style="color:#26A2FF;font-size:27px;">{{authorityManagerHeaders.performance?authorityManagerHeaders.performance.review_point:'0'}}</b><br><span style="color:#606266;font-size:14px;padding-top:8px;display: inline-block;">绩效分</span></p> -->
                <p style="text-align:center;cursor:pointer;margin: 0;" @click="Administrator"><b style="color:#26A2FF;font-size:27px;">{{authorityManagerHeaders.performance?authorityManagerHeaders.performance.total_count + '/' + authorityManagerHeaders.performance.complete_count : '0/0'}}</b><br><span style="color:#606266;font-size:14px;padding-top:8px;display: inline-block;">任务进度</span></p>
              </div>

            </el-col>
          </el-col>
          <!-- 7.0原版
          <div v-else>
            <el-col :span="8" style="margin-top:34px;padding:0;border-right: 1px #cecccc solid;height:58px;" v-loading="authorityManagerHeaderLoad">
              <el-col :gutter="50" style="margin:0;padding:0;" class="quick_button_box">
                <div style="display:flex;justify-content: space-around;">
                  <p style="text-align:center;cursor:pointer;margin: 0;" @click="$router.push({ path: '/integral_statistics' })"><b style="color:#26A2FF;font-size:27px;">{{authorityManagerHeaders.b?authorityManagerHeaders.b:'0'}}</b><br><span style="color:#606266;font-size:14px;padding-top:8px;display: inline-block;">本月B分</span></p>
                  <p style="text-align:center;cursor:pointer;margin: 0;" @click="$router.push({ path: '/integral_statistics' })"><b style="color:#26A2FF;font-size:27px;">{{authorityManagerHeaders.a?authorityManagerHeaders.a:'0'}}</b><br><span style="color:#606266;font-size:14px;padding-top:8px;display: inline-block;">本月A分</span></p>
                </div>

              </el-col>
            </el-col>
            <el-col :span="8" style="margin:0;padding:0;">
              <el-col :gutter="50" style="margin:0;padding:34px 0 0 0;" class="quick_button_box">
                <div style="display:flex;justify-content: space-around;" v-loading="authorityManagerHeaderLoad">
                  <p style="text-align:center;cursor:pointer;margin: 0;" @click="$router.push({ path: '/my_performance' })"><b style="color:#26A2FF;font-size:27px;">{{authorityManagerHeaders.performance?authorityManagerHeaders.performance.review_point:'0'}}</b><br><span style="color:#606266;font-size:14px;padding-top:8px;display: inline-block;">绩效分</span></p>
                  <p style="text-align:center;cursor:pointer;margin: 0;" @click="$router.push({ path: '/my_performance' })"><b style="color:#26A2FF;font-size:27px;">{{authorityManagerHeaders.performance?authorityManagerHeaders.performance.total_count + '/' + authorityManagerHeaders.performance.complete_count : '0/0'}}</b><br><span style="color:#606266;font-size:14px;padding-top:8px;display: inline-block;">任务进度</span></p>
                </div>

              </el-col>
            </el-col>
          </div> -->

        </el-row>

        <el-row class="left-all-style">
          <el-row>
            <el-col :span="22">
              <span class="title">排行榜</span>
            </el-col>
            <el-col :span="2">
              <span
                class="noremind"
                @click="$router.push({ path: RankingPush })"
                >查看详情</span
              >
            </el-col>
          </el-row>
          <div v-loading="tabPositionLoad">
            <div style="width:100%;height:30px;margin-top:20px;">
              <el-radio-group
                v-model="tabPosition"
                style="margin-bottom: 30px;display:flex"
              >
                <div v-for="(item, index) in rankingList" :key="index" style="">
                  <el-radio-button
                    :label="item.val"
                    @click.native="tabPositions($event, item)"
                    ><span
                      style="width:84px;coloe:#606266;display: block;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;"
                      >{{ item.group_name }}</span
                    ></el-radio-button
                  >
                </div>
              </el-radio-group>
            </div>
            <div
              style="display:flex;margin-top:16px;padding-top:24px;height:100%;"
              v-loading="addUpRankingLoad"
            >
              <div
                class="nopoint_box"
                style=""
                v-if="rankingListDetails.length == 0"
              >
                <div class="noimg" style="margin:0;"></div>
                <span class="title1" style="margin:0;">暂无积分数据</span>
              </div>
              <!-- <div  v-else v-for="(item,index) in rankingListDetails" :key="index" style="text-align:center;width:80px;cursor:pointer;margin:0 20px;" @click="$router.push({ path: RankingPush })"> -->
              <div
                v-else
                v-for="(item, index) in rankingListDetails"
                :key="index"
                style="text-align:center;width:80px;cursor:pointer;margin:0 20px;"
              >
                <div class="" style="cursor:pointer;position: relative;height: 60px;">
                  <svg-icon
                    v-if="item.rank <= 3"
                    :icon-class="
                      item.rank == 1
                        ? 'first'
                        : item.rank == 2
                        ? 'secondPlace'
                        : item.rank == 3
                        ? 'third'
                        : ''
                    "
                    style="z-index:1;position: absolute;left: 26px;top: -18px;font-size:28px;"
                  />
                  <div
                    v-if="item.rank == 4 || item.rank == 5"
                    style="z-index:1;position: absolute;left: 27px;top: -14px;width:24px;height:24px;border:1px solid #C0C4CC;border-radius:50%;background-color:#fff;font-size:12px;text-align-center;line-height:24px;color:#303133;"
                  >
                    <b style="">{{ item.rank }}</b>
                  </div>
                  <div
                    v-if="
                      item.employee_id == user_info.id &&
                        index == 0 &&
                        item.rank > 3
                    "
                    style="z-index:1;position: absolute;left: 26px;top: -14px;width:25px;height:25px;border:1px solid #C0C4CC;border-radius:50%;background-color:#fff;font-size:12px;text-align-center;line-height:24px;color:#303133;"
                  >
                  <!-- <div
                    v-if="
                      
                        index == 0 &&
                        item.rank > 3
                    "
                    style="z-index:1;position: absolute;left: 28px;top: -14px;width:24px;height:24px;border:1px solid #C0C4CC;border-radius:50%;background-color:#fff;font-size:12px;text-align-center;line-height:24px;color:#303133;"
                  > -->
                    <b>{{ item.rank }}</b>
                  </div>
                  <div
                    style="position: absolute;left: 8px;top: -16px;z-index:2;"
                  >
                    <div
                      v-if="index == 5 || index == 6"
                      style="width:60px;height:24px;border:1px solid #C0C4CC;background-color:#fff;border-radius:20px;font-size:12px;color:#303133;text-align:center;line-height:24px"
                    >
                      <b>{{
                        index == 5 ? "倒数第2" : index == 6 ? "倒数第1" : ""
                      }}</b>
                    </div>
                  </div>
                  <userImage
                    :id="item.employee_id"
                    :img_url="item.employee_img_url"
                    fontSize="1"
                    :user_name="item.employee_name"
                    width="60px"
                    height="60px"
                  ></userImage>
                </div>
                <span
                  style="color:#303133;font-size:14px;text-align:center;margin-top:10px;display: inline-block;width:100%;display: block;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;"
                  >{{ item.employee_name
                  }}
                  <span v-if="item.employee_id == user_info.id"
                    >(我)</span
                  >
                  </span
                >
              </div>
            </div>
          </div>
        </el-row>

        <el-row class="left-all-style">
          <el-row style="">
            <el-col :span="24">
              <b class="title" style="margin-bottom:15px;display:block"
                >积分构成</b
              >
            </el-col>

            <div v-loading="IntegralFormChartLoad">
              <el-col
                :span="5"
                style="position: relative;left:10px;z-index:1;margin-top:10px;"
              >
                <el-cascader
                  v-model="dept_name1"
                  :options="dept_tree"
                  @change="dept1_null"
                  :props="{ checkStrictly: true,value:'id',label:'name',children:'_child'}"
                  ref="dept1"
                  filterable
                  change-on-select
                  placeholder="请选择部门"
                  clearable
                ></el-cascader>
              </el-col>
              <div
                class="nopoint_box"
                style="height:325px;"
                v-show="IntegralFormnone"
              >
                <div
                  class="noimg"
                  style="width: 150px;height: 150px;margin-top:94px;"
                ></div>
                <span class="title1"
                  >暂无积分数据，<span
                    @click="$router.push({ path: '/award_punish' })"
                    style="color:#409EFF;cursor:pointer;"
                    >去奖扣积分></span
                  ></span
                >
              </div>
              <div v-show="!IntegralFormnone" style="margin-top:20px;">
                <div
                  ref="IntegralFormChart"
                  :style="{ width: '100%', height: '400px' }"
                ></div>
              </div>
            </div>
          </el-row>
        </el-row>

        
        <el-row class="left-all-style">
          <el-row style="">
            <el-col :span="24" style="display:flex">
              <b class="title" style="margin:0 20px 15px 0;display:block">本月积分情况</b>
              <el-checkbox v-model="exclusiveMonthChecked">不包含自动积分加分项</el-checkbox>
            </el-col>
            <div v-loading="monthlyIntegralloading">
              <el-col :span="5" style="position: relative;left:10px;z-index:1;">
                <el-cascader
                  v-model="dept_name2"
                  :options="dept_tree"
                  @change="monthlyIntegralchange"
				  	      :props="{ checkStrictly: true,value:'id',label:'name',children:'_child'}"
                  ref="dept2"
                  filterable
                  change-on-select
                  placeholder="请选择部门"
                  clearable
                ></el-cascader>
              </el-col>

              <div class="nopoint_box" style="height:381px;" v-if="monthlyIntegralnone">
                <div class="noimg" style="width: 150px;height: 150px;margin-top:90px;"></div>
                <span class="title1">暂无积分数据</span>
              </div>

              <div v-show="!monthlyIntegralnone">
                <div ref="monthlyIntegralChart" :style="{width: '100%', height: '350px' ,marginTop:'40px'}"></div>
                <div style="width:90%;display:flex;justify-content: space-around;margin-top:30px;padding-left:40px">
                  <p v-for="(item,index) in monthlyIntegralList" :key="index" style="text-align:center">
                    <b style="display:block;color:#303133;font-size:18px;" v-if="index<3">{{index==0?item.total_point:index==1?item.reward_point:index==2?item.deduction_point:''}}</b>
                    <b style="display:block;color:#303133;font-size:18px;" v-else-if="index==3">{{item.ratio==-1?'—':item.ratio+':1'}}</b>
                    <b style="display:block;color:#303133;font-size:18px;" v-else>{{item.toRatio.ratio+'%'}}
                      <svg-icon :icon-class="item.toRatio.type==1?'litrearrows':item.toRatio.type==2?'droparrows':''" style="font-size:10px;margin-bottom:2px"/>
                    </b>
                    <span style="color:rgb(48, 49, 51);font-size:14px;margin-top:5px;display:block;">{{item.name}}</span>
                  </p>
                </div>
              </div>
            </div>
          </el-row>
        </el-row>


        
        <el-row class="left-all-style" style="">
          <el-row style="">
            <el-col :span="24">
              <b class="title" style="margin-bottom:15px;display:block">管理者奖扣任务执行情况</b>
            </el-col>
            <div v-loading="ManagerSAwardloading">
              <el-col :span="5" style="position: relative;left:10px;z-index:1;">
                <el-cascader
                  v-model="dept_name3"
                  :options="dept_tree"
                  @change="ManagerSAwardlchange"
				  	      :props="{ checkStrictly: true,value:'id',label:'name',children:'_child'}"
                  ref="dept3"
                  filterable
                  change-on-select
                  placeholder="请选择部门"
                  clearable
                ></el-cascader>
              </el-col>
              <div class="nopoint_box" style="height:401px;" v-if="ManagerSAwardnone">
                <div class="noimg" style="width: 150px;height: 170px;margin-top:90px;"></div>
                <span class="title1">暂无积分数据</span>
              </div>
              <div v-show="!ManagerSAwardnone" :style="{width:widths}">
                <div ref="ManagerSAwardChart" :style="{width: widths, height: '400px' ,marginTop:'40px'}"></div>
                <div style="width:90%;display:flex;justify-content: space-around;padding-left:40px">
                  <p v-for="(item,index) in ManagerSAwardlList" :key="index" style="z-index:1;" class="ManagerSAwardlStyle" @click="$router.push({ path: '/manager_statistics' })">
                    <b class="ManagerSAwardlStyleB" v-if="index!=2">{{item.val}}</b>
                    <b class="ManagerSAwardlStyleB" v-else-if="index==2">{{item.val==-1?'—':item.val+':1'}}</b>
                    <span class="ManagerSAwardlStyleSpan">{{item.name}}</span>
                  </p>
                </div>
              </div>
            </div>
          </el-row>
        </el-row>

      </el-col>
      <el-col :span="6" style="min-width:280px;">
        <el-row>
          <div
            class="right-all-style"
            v-loading="highestPrizeBuckleloading"
            style="background:#fff;padding: 20px 20px 0;"
          >
            <span class="title">本周奖分最高</span>

            <div class="nopoint_box" v-if="!prize.id">
              <div class="noimg"></div>
              <span class="title1" style="padding-bottom:20px;"
                >暂无积分数据</span
              >
            </div>

            <div v-else style="display:flex;padding:20px 0 20px 0;">
              <userImage
                width="45px"
                height="45px"
                :id="prize.id"
                :user_name="prize.name"
                fontSize=".9"
                style="margin-right:8px"
              ></userImage>
              <div class="rightexamineAndApproveList" style="border:0px">
                <p
                  style="width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#73767c;font-size:16px;display:flex;justify-content: space-between;"
                >
                  <b style="color:#303133;font-size:16px;margin:0px 0 0 5px;">{{ prize.name }}</b
                  ><span style="color:#26A2FF;font-size:16px;"
                    ><span v-if="prize.point > 0">+</span
                    >{{ prize.point }} B分</span
                  >
                </p>
                <p
                  style="margin:8px 0 0 5px;font-size:13px;line-height:20px;color:rgb(48, 49, 51);overflow:hidden; text-overflow:ellipsis;display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;padding-bottom:10px; "
                >
                  {{ prize.remark ? prize.remark.customize : "" }}
                </p>
              </div>
            </div>
          </div>
        </el-row>

        <el-row>
          <div
            class="right-all-style"
            v-loading="highestPrizeBuckleloading"
            style="background:#fff;padding: 20px 20px 0;"
          >
            <span class="title">本周扣分最多</span>

            <div class="nopoint_box" v-if="!buckle.id">
              <div class="noimg"></div>
              <span class="title1" style="padding-bottom:10px;"
                >暂无积分数据</span
              >
            </div>

            <div v-else style="display:flex;padding:20px 0 20px 0;">
              <userImage
                width="45px"
                height="45px"
                :id="buckle.id"
                :user_name="buckle.name"
                fontSize=".9"
                style="margin-right:8px"
              ></userImage>
              <div class="rightexamineAndApproveList">
                <p
                  style="width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#73767c;font-size:16px;display:flex;justify-content: space-between;"
                >
                  <b style="color:#303133;font-size:16px;margin:0px 0 0 5px;">{{ buckle.name }}</b
                  ><span style="color:#FF9600;font-size:16px;"
                    >{{ buckle.point }} B分</span
                  >
                </p>
                <p
                  style="margin:8px 0 0 5px;font-size:13px;line-height:20px;color:rgb(48, 49, 51);overflow:hidden; text-overflow:ellipsis;display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;padding-bottom:10px; "
                >
                  {{ buckle.remark ? buckle.remark.customize : "" }}
                </p>
              </div>
            </div>
          </div>
        </el-row>
      </el-col>
    </el-row>
    <!-- </div> -->
  </div>
</template>

<script>

import ECharts from "echarts";
var bool = true// 五秒执行一次变量
export default {
  data() {
    return {
      authorityManagerHeaderLoad:false,//管理员头部loading
      authorityManagerHeaders:{},//管理员头部 数据
      creatorJurisdiction:this.$getIsCreator("creator"),//是否创始人

      widths:'100%',
      time: this.$moment().format("HH"),
      user_info: this.$getUserData(),
      fits: [
        {
          name: "奖扣A/B分",
          value: "表现好坏，有奖有罚",
          img: require("./assets/image/prizeBuckle.png"),
          url: "/award_punish",
        },
        // {
        //   name: "绩效",
        //   value: "工作目标与价值的体现",
        //   img: require("./assets/image/performance.png"),
        //   url: "/award_punish",
        // },
        {
          name: "管理者奖扣",
          value: "管理执行到位，奖罚分明",
          img: require("./assets/image/performance.png"),
          url: "/manager_statistics",
        },
        {
          name: "任务",
          value: "认可积极完成任务的人",
          img: require("./assets/image/task.png"),
          url: "/my_issue",
        },
      ],

      //排行榜
      RankingPush: "", //查看更多跳转
      tabPositionLoad: false, //排名分类loading
      addUpRankingLoad: false, //排名人员loading
      tabPosition: "0",
      rankingList: [], //排行榜数据
      rankingListDetails: [], //排行榜人员列表

      //积分构成
      IntegralFormnone: false, //积分构成为空或报错，展示的开关
      dept_name1: [], //积分构成--部门
      IntegralFormChartLoad: false, //积分构成loading

      //本月积分情况
      exclusiveMonthBranch:0,//本月积分情况--部门
      exclusiveMonthChecked:true,//本月积分情况--不包含自动积分加分项
			dept_name2:[],//本月积分情况--部门
      monthlyIntegralList:[//本月积分情况数据
        {total_point:'0',name:'本月总积分'},
        {reward_point:'0',name:'本月总奖分'},
        {deduction_point:'0',name:'本月总扣分'},
        {ratio:'0',name:'奖扣分比例'},
        {toRatio:{ratio:'0',type:0},name:'对比上月总分'},
        {toRatio:{ratio:'0',type:0},name:'对比上月奖分'},
        {toRatio:{ratio:'0',type:0},name:'对比上月扣分'},
      ],
      monthlyIntegralloading:false,//本月积分情况loading
      monthlyIntegralnone:false,//本月积分情况为空或报错，展示的开关
      

      //管理者奖扣
			dept_name3:[],//管理者统计数据--部门
      ManagerSAwardloading:false,//管理者统计 loading
      ManagerSAwardnone:false,//管理者奖扣执行情况为空或报错，展示的开关
      ManagerSAwardlList:[//管理者统计数据
        {val:'0',name:'总奖分'},
        {val:'0',name:'总扣分'},
        {val:'0',name:'奖扣分比例'},
        {val:'0',name:'奖扣人次'},
        {val:'0',name:'奖扣执行人数'},
        {val:'0',name:'达标人数'},
        {val:'0',name:'未达标人数'},
      ],


      dept_tree: [], //部门列表



      
      //奖扣分
      highestPrizeBuckleloading: false, //奖扣分最高loading
      prize: {}, //奖分
      buckle: {}, //扣分
    };
  },
  watch: {
    // dept_name(val, old_val) {},
    exclusiveMonthChecked(){
      this.monthlyIntegral()
    },
  },
  mounted() {
    this.function_All();
    window.addEventListener('resize',this.selfAdaption); 
  },
  methods: {
    function_All() {
      if(this.$getIsCreator("creator")){//是否是创始人

      }else{
        this.authorityManagerHeader()
      }
      this.integralForm(); //积分构成
      this.getDepartment(); //获取部门列表
      this.rankingListname()//获取自定义排行榜名
      this.monthlyIntegral()//本月积分情况
      this.ManagerSAward()//管理者奖扣任务执行情况
      this.highestPrizeBuckle()//奖扣分最高积分事件
    },

  //echarts自适应
    selfAdaption () {
      var myChart1 = ECharts.init(this.$refs.monthlyIntegralChart)
      var myChart2 = ECharts.init(this.$refs.IntegralFormChart)
      var myChart3 = ECharts.init(this.$refs.ManagerSAwardChart)
      // myChart.setOption(option);
      // setTimeout(function (){
      //     window.onresize = function () {
            myChart1.resize();
            myChart2.resize();
            myChart3.resize();
      //     }
      // },20)
    },
    openGzd(val) {
      if(val == '/my_issue'){
        this.popout()
      }else{
        val?this.$router.push({path: val}):''
			  // localStorage.setItem("path",'2-1');
      }
    },
    popout(){
      if (bool) {
        const h = this.$createElement;
        this.$notify({
          message: h('b', { style: 'color:rgb(38, 162, 255)'}, '任务功能将在近期开放，敬请期待')
        });
        
        // this.$message({
        //   message: '任务功能将在近期开放，敬请期待',
        //   type: 'success'
        // });
        bool = false
        setTimeout(() => {
          bool = true
        }, 5000)
      } else {
      }
    },
    Administrator(){
      this.popout()
    },
  
    //管理员头部
    authorityManagerHeader(){
      this.authorityManagerHeaderLoad = true
      let params = {
        employee_id:this.user_info.id,
        month:this.$moment().format('YYYY-MM')
      }
      this.$axios('get','/api/integral/statistics/',params,'v2').then((res)=>{
        if(res.data.code == 1){
          this.authorityManagerHeaders = res.data.data
        }
      }).finally(()=>{
        this.authorityManagerHeaderLoad = false
      })
    },
	
    //排行榜
    customRanking(target_id, date_interval) {
      //自定义排名   date_interval=时间
      let data = {
        group_id: target_id,
        pt_id: 3,
        index_ranking: 1,
      };
      data.date =
        date_interval == 1
          ? this.$moment().format("YYYYMM")
          : date_interval == 2
          ? this.$moment().format("YYYYQ")
          : date_interval == 3
          ? this.$moment().format("YYYY")
          : "0";
      // request.get("/api/integral/statistics/ranking", { params: params })
      this.$axios("get", "/api/integral/statistics/groups/rank", data)
        .then((res) => {
          let lists = res.data.data.list;
          let rankingList = [];
          let arr = false;
          for (let i in lists) {
            let rankingJson = {};
            if (lists[i].employee_name) {
              arr = true;
            } else {
              arr = false;
              rankingJson.employee_id = lists[i].employee_id;
              rankingJson.employee_img_url = lists[i].img_url;
              rankingJson.employee_name = lists[i].name;
              rankingJson.point = lists[i].point;
              rankingJson.rank = lists[i].rank;
              rankingJson.status_remark = "";
              rankingList.push(rankingJson);
            }
          }
          if (arr) {
            this.rankingListDetails = lists;
          } else {
            this.rankingListDetails = rankingList;
          }
        })
        .finally(() => {
          this.addUpRankingLoad = false;
        });
    },
    addUpRanking() {
      //累计B分排名
      let params = {
        dept_id: 0,
        sort: "DESC",
        page: 1,
        page_size: 10,
        pt_id: 3,
        type: "all",
        index_ranking: 1,
      };
      this.$axios("get", "/api/integral/statistics/ranking", params, "v2")
        .then((res) => {
          this.rankingListDetails = res.data.data.list;
        })
        .finally(() => {
          this.addUpRankingLoad = false;
        });
    },
    departmentOfRanking() {
      //部门B分排名
      this.RankingPush = "/dept_rank";
      let params = {
        dept_id: 0,
        sort: "DESC",
        pt_id: 3,
        time_type: 1,
        page: 1,
        page_size: 10,
        position: "all",
        month: this.$moment().format("YYYY-MM"),
        index_ranking: 1,
      };
      this.$axios("get", "/api/integral/statistics/ranking", params, "v2")
        .then((res) => {
          this.rankingListDetails = res.data.data.list;
        })
        .finally(() => {
          this.addUpRankingLoad = false;
        });
    },
    rankingListname() {
      //获取排名列表
      this.tabPositionLoad = true;
      let params = {
        page: 1,
        page_size: 7,
      };
      this.$axios("get", "/api/integral/statistics/ranking/list", params)
        .then((res) => {
          if (res.data.code == 1) {
            let lists = res.data.data.list;
            for (let i in lists) {
              lists[i].val = i;
              if (lists[i].type == "normal") {
                lists[i].group_name = "阶段排名(月)";
              }
              if (lists[i].type == "all") {
                lists[i].group_name = "累计B分排名";
              }
              this.rankingList.push(lists[i]);
            }

            this.addUpRankingLoad = true;
            this.departmentOfRanking(); //进入获取部门B分排名数据
          } else {
            self.$message.error(res.data.data.msg);
          }
        })
        .finally(() => {
          this.tabPositionLoad = false;
          // self.item_loading = false;
        });
    },
    tabPositions(e, item) {//排行榜点击分类
      if (e.target.tagName === "INPUT") return;
      if (item) {
        this.addUpRankingLoad = true;
      }
      if (item.type == "normal") {
        this.RankingPush = "/dept_rank";
        this.departmentOfRanking();
      } else if (item.type == "all") {
        this.RankingPush = "/total_rank";
        this.addUpRanking();
      } else if (item.type == "custom") {
        this.RankingPush = "/custom_rank";
        this.customRanking(item.target_id, item.date_interval);
      }
    },

    //积分构成
    dept1_null(val) {
      let valItem = 0;
      for (let i in val) {
        valItem = val[i];
      }
      this.integralForm(valItem);
      this.$nextTick(() => {
        this.$refs.dept1.dropDownVisible = false;
      });
    },
    integralForm(item) {
      this.IntegralFormChartLoad = true;
      let listslength = [];
      let params = {};
      if (item) {
        (params.dept_id = item),
          (params.month = this.$moment().format("YYYY-MM"));
      } else {
        (params.dept_id = null),
          (params.month = this.$moment().format("YYYY-MM"));
      }
      this.$axios("get", "/api/integral/statistics/pie/b", params, "v2")
        .then((res) => {
          let lists = res.data.data.list;
          listslength = lists;
          let legendData1 = [];
          let legendData2 = [];
          let dadalist = [];
          //分为两列展示
          // let listLeng = Math.ceil((lists.length)/2)

          for (let i in lists) {
            if(lists[i].name.length>15){
              lists[i].name = lists[i].name.slice(0,15)+'...'
            }

            //分为两列展示
            // if(i<listLeng){
            //   legendData1.push(lists[i].name+' '+'奖'+lists[i].reward+' '+'扣'+lists[i].deduction+' '+lists[i].ratio+'%')
            // }else{
            //   legendData2.push(lists[i].name+' '+'奖'+lists[i].reward+' '+'扣'+lists[i].deduction+' '+lists[i].ratio+'%')
            // }
            if (i < 8) {
              legendData1.push(
                lists[i].name +
                  " " +
                  "奖" +
                  lists[i].reward +
                  " " +
                  "扣" +
                  lists[i].deduction +
                  " " +
                  lists[i].ratio +
                  "%"
              );
            } else {
              legendData2.push(
                lists[i].name +
                  " " +
                  "奖" +
                  lists[i].reward +
                  " " +
                  "扣" +
                  lists[i].deduction +
                  " " +
                  lists[i].ratio +
                  "%"
              );
            }
            // console.log(lists.length/2)

            let dataListDx = {};
            if (lists[i].ratio < 0) {
              dataListDx.value = 0;
            } else {
              dataListDx.value = lists[i].ratio;
            }
            dataListDx.name =
              lists[i].name +
              " " +
              "奖" +
              lists[i].reward +
              " " +
              "扣" +
              lists[i].deduction +
              " " +
              lists[i].ratio +
              "%";
            // dataListDx.name = lists[i].name
            dadalist.push(dataListDx);
          }
          //分为两列展示，多传legendData2
          // this.drawLine(legendData1, legendData2, dadalist); //图表
          this.drawLine(legendData1,dadalist)//图表
        })
        .finally(() => {
          if (listslength.length == 0) {
            this.IntegralFormnone = true;
          } else {
            this.IntegralFormnone = false;
          }
          this.IntegralFormChartLoad = false;
        });
    },
    //分为两列展示，多传legendDataTwo
    // drawLine(legendDataOne, legendDataTwo, dadalist) {
      drawLine(legendDataOne,dadalist){
      const chart = this.$refs.IntegralFormChart;

      //此处可给固定颜色，不给就所有颜色随机
      let colors = [
        'rgb(38, 162, 255)',
        "#f36f2a",
        "#fecb09",
        "#00b6bd",
        "#e85d53",
        "#fecb09",
        "#725197",
        "#fcb814",
        "#41a08d",
        "#425a95",
        "#ea8b84",
        "#9d1d62",
        "#fcb814",
      ];
      // let colors = [];
      // let legendDataLeng = legendDataOne.length + legendDataTwo.length;
      let legendDataLeng = legendDataOne.length;
      if (legendDataLeng > colors.length) {
        //当列表大于固定颜色时，给随机颜色
        let colorsLeng = colors.length;
        for (let i = 0; i <= legendDataLeng - colorsLeng; i++) {
          // colors.push('#' + Math.random().toString(16).substr(2, 6).toUpperCase());//也是随机色
          colors.push(
            "rgb(" +
              Math.round(Math.random() * 255) +
              "," +
              Math.round(Math.random() * 255) +
              "," +
              Math.round(Math.random() * 255) +
              ")"
          );
        }
      }

      //只显示 N 条标题，多余隐藏，但是饼图不会隐藏
      let DataLengths = [];
      // for (let i in legendDataTwo) {
      //   if (i < 8) {
      //     DataLengths.push(legendDataTwo[i]);
      //   }
      // }
      let left1 = "45%";
      let left2 = "45%";
      let leftBT = "25%";
      // if (legendDataTwo.length != 0) {
      //   left1 = "28%";
      //   leftBT = "10%";
      // }

      if (chart) {
        const myChart = ECharts.init(chart);
        var legendData1 = legendDataOne;
        // var legendData2 = DataLengths;
        const option = {
          tooltip: {
            trigger: "item",
            formatter: "{b}",
          },
          legend: [
            {
              type: "scroll",
              orient: "vertical",
              icon: "square",
              left: left1,
              align: "left",
              top: "23%",
              itemGap: 20,
              // bottom:'50%',
              textStyle: {
                fontSize: 14,
                color: "rgb(48, 49, 51)",
              },
              data: legendData1,
            },
            //分为两列展示
            // {
            //   type: "scroll",
            //   orient: "vertical",
            //   icon: "square",
            //   left: "62%",
            //   align: "left",
            //   top: "23%",
            //   itemGap: 20,
            //   // bottom:'50%',
            //   textStyle: {
            //     fontSize: 14,
            //     color: "rgb(48, 49, 51)",
            //   },
            //   data: legendData2,
            // },
          ],
          color: colors,
          grid: {
            x: 25,
            y: 45,
            x2: 5,
            y2: 20,
            borderWidth: 1,
          },
          toolbox: {
            show: true,
            feature: {
              mark: { show: true },
              magicType: {
                show: true,
                type: ["pie", "funnel"],
              },
            },
          },
          series: [
            {
              name: "",
              type: "pie",
              radius: [20, 110],
              center: [leftBT, "50%"],
              roseType: "radius",
              label: {
                show: false,
              },
              emphasis: {
                label: {
                  show: false,
                },
              },
              data: dadalist,
            },
          ],
        };
        myChart.setOption(option);
      }
    },


    
    //月度积分
    monthlyIntegralRanking(date,total,reward,deduction){
      const chart = this.$refs.monthlyIntegralChart
      if(chart){
        const myChart = ECharts.init(chart)
        const option = {
          tooltip: {
              trigger: 'axis'
          },
          color:['#F56C6C','#26A2FF','#FFC100'],
          legend: {
              right: '0%',
              data: ['总积分', '奖分', '扣分']
          },
          grid: {
              left: '3%',
              right: '4%',
              bottom: '3%',
              containLabel: true
          },
          toolbox: {
              feature: {
              }
          },
          xAxis: {
              type: 'category',
              boundaryGap: false,
              data: date
          },
          yAxis: {
            type: 'value',
            axisLine:{
                show:false
            },
            axisTick:{
                show:false
            },
          },
          // dataZoom: [
          //     {
          //         type: 'slider',
          //         fillerColor : 'rgba(255, 255, 255, 0)',
          //         show: true,
          //         xAxisIndex: [0],
          //         start: 0,
          //         end: 100
          //     },
          //     {
          //         type: 'slider',
          //         fillerColor : 'rgba(255, 255, 255, 0)',
          //         show: true,
          //         yAxisIndex: [0],
          //         start: 0,
          //         end: 100
          //     },
          //     {
          //         type: 'slider',
          //         xAxisIndex: [0],
          //         start: 1,
          //         end: 35
          //     },
          //     {
          //         type: 'slider',
          //         yAxisIndex: [0],
          //         start: 29,
          //         end: 36
          //     }
          // ],
          series: [
              {
                  name: '总积分',
                  type: 'line',
                  data: total
              },
              {
                  name: '奖分',
                  type: 'line',
                  data: reward
              },
              {
                  name: '扣分',
                  type: 'line',
                  data:deduction
              }
          ]
        };
        myChart.setOption(option)
      }
    },
    //月度积分
    monthlyIntegralchange(val){
      if(val.length == 0){
        this.exclusiveMonthBranch = 0
      }else{
        let valItem = 0
        for(let i in val){
          valItem = val[i]
        }
        this.exclusiveMonthBranch = valItem
      }
      this.monthlyIntegral()
      this.$nextTick(()=>{
        this.$refs.dept2.dropDownVisible = false;
      })
    },
    monthlyIntegral(){
      this.monthlyIntegralloading = true
      let params = {}
      let listslength = []
      params.dept_id=this.exclusiveMonthBranch,
      params.month= this.$moment().format('YYYY-MM')
      if(this.exclusiveMonthChecked){
        params.include_fixed = 1
      }else{
        params.include_fixed = 0
      }
      this.$axios('get','/api/integral/statistics/curve',params)
      .then(res => {
        if(res.data.code == 1){
          let lists = res.data.data
          listslength = lists
          this.monthlyIntegralList[0].total_point = lists.total_point
          this.monthlyIntegralList[1].reward_point = lists.reward_point
          this.monthlyIntegralList[2].deduction_point = lists.deduction_point
          this.monthlyIntegralList[3].ratio = lists.ratio
          this.monthlyIntegralList[4].toRatio = lists.contrast_total
          this.monthlyIntegralList[5].toRatio = lists.contrast_reward
          this.monthlyIntegralList[6].toRatio = lists.contrast_deduction
          let dates = []//日期
          let totals = []//总积分
          let rewards = []//奖分
          let deductions = []//扣分
          for(let i in lists.total){
            dates.push(lists.total[i].date)
            totals.push(lists.total[i].point)
          }
          for(let i in lists.reward){
            rewards.push(lists.reward[i].point)
          }
          for(let i in lists.deduction){
            deductions.push(lists.deduction[i].point)
          }
          this.monthlyIntegralRanking(dates,totals,rewards,deductions)
        }
      }).finally(() => {
        if(listslength.total.length == 0){
          this.monthlyIntegralnone = true
        }else{
          this.monthlyIntegralnone = false
        }
        this.monthlyIntegralloading = false
      });
    },

    
    //管理者奖扣统计
    ManagerSAwardCharts(Name,Award,Deduct){//管理着奖扣统计表
      const chart = this.$refs.ManagerSAwardChart
      if(chart){
        const myChart = ECharts.init(chart)
        const option = {
          tooltip: {
              trigger: 'axis',
              axisPointer: {
                  // type: 'cross',
                  crossStyle: {
                      color: '#999'
                  }
              }
          },
          grid: {//表格偏移量
            // top: '5% '
            left:'5%',
            right:'0%'
          },
          toolbox: {
              feature: {
                  // dataView: {show: false, readOnly: true},
                  // magicType: {show: false, type: ['line', 'bar']},
                  // restore: {show: false},
                  // saveAsImage: {show: false}
              }
          },
          color:['#26A2FF','#FFC100'],
          legend: {
              right: '0%',//设置位置
              data: ['奖分', '扣分']
          },
          xAxis: [
              {
                  type: 'category',
                  data: Name,
                  axisPointer: {
                      type: 'shadow',
                  },
                  axisLabel:{
                    interval:0,//横轴信息全部显示
                    // rotate:-30,//-30度角倾斜显示
                  },
                  axisLine:{//去掉X轴线
                      show:false
                  },
                  axisTick:{//去掉X轴刻度
                      show:false
                  },
              }
          ],
          yAxis: [
              {
                type: 'value',
                axisLabel: {
                    formatter: '{value}'
                },
                axisLine:{//去掉Y轴线
                    show:false
                },
                axisTick:{//去掉Y轴刻度
                    show:false
                },
              },
          ],
          series: [
              { name: '奖分',
                type: 'bar',
                barWidth : 14,//柱图宽度
                barGap:'0%',//柱图间距
                data: Award
              },
              { name: '扣分',
                type: 'bar',
                barWidth : 14,//柱图宽度
                barGap:'0%',//柱图间距
                data: Deduct
              },
          ]
      };
        myChart.setOption(option)
      }
    },
    ManagerSAwardlchange(val){//选中规则
      let valItem = 0
      for(let i in val){
        valItem = val[i]
      }
      this.ManagerSAward(valItem)
      this.$nextTick(()=>{
        this.$refs.dept3.dropDownVisible = false;
      })
    },
    ManagerSAward(item){//管理者奖扣请求
      this.ManagerSAwardloading = true
      let params = {}
      let listslength = []
      if(item){
        params.dept_id=item,
        params.month= this.$moment().format('YYYY-MM')
      }else{
        params.dept_id=0,
        params.month= this.$moment().format('YYYY-MM')
      }
      this.$axios('get','/api/integral/statistics/task/pie', params,'v2')
      .then(res => {
        let datas = res.data.data
        listslength = datas.list
        let histogramName = []
        let histogramAward = []
        let histogramDeduct = []
        for(let i in datas.list){
          histogramName.push(datas.list[i].name)
          histogramAward.push(datas.list[i].reward_point)
          histogramDeduct.push(datas.list[i].deduction_point)
        }
        this.ManagerSAwardlList[0].val = datas.reward_point
        this.ManagerSAwardlList[1].val = datas.deduction_point
        this.ManagerSAwardlList[2].val = datas.ratio
        this.ManagerSAwardlList[3].val = datas.exec_count
        this.ManagerSAwardlList[4].val = datas.manager_count
        this.ManagerSAwardlList[5].val = datas.pass_count
        this.ManagerSAwardlList[6].val = datas.fail_count
        this.ManagerSAwardCharts(histogramName,histogramAward,histogramDeduct)
      }).finally(() => {
        if(listslength.length == 0){
          this.ManagerSAwardnone = true
        }else{
          this.ManagerSAwardnone = false
        }
        this.ManagerSAwardloading = false
      });
    },

    
    //奖扣分最高积分事件
    highestPrizeBuckle(){
      this.highestPrizeBuckleloading = true
      let params = {
        time_type:'1',
        pt_id:'3',
        page:'1',
        page_size:'1'
      }
      this.$axios('get','/api/integral/statistics/prize/buckle/ranking',params).then((res)=>{
        if(res.data.code == 1){
          if(res.data.data.prize.length !=0){
            this.prize = res.data.data.prize[0]
          }else{
            this.prize = []
          }
          if(res.data.data.buckle.length !=0){
            this.buckle = res.data.data.buckle[0]
          }else{
            this.buckle = []
          }
        }
      }).finally(()=>{
        this.highestPrizeBuckleloading = false
      })
    },

    //获取部门
    getDepartment() { 
      this.$axios("get", "/api/department/tree").then((res) => {
        this.dept_tree = this.getTreeData(res.data.data.list);
      });
    },
    // 递归判断列表，把最后的children设为undefined
    getTreeData(data) {
      for (var i = 0; i < data.length; i++) {
        if (data[i]._child.length < 1) {
          // children若为空数组，则将children设为undefined
          data[i]._child = undefined;
        } else {
          // children若不为空数组，则继续 递归调用 本方法
          this.getTreeData(data[i]._child);
        }
      }
      return data;
    },
  },
  beforeDestroy() {//离开路由
    window.removeEventListener("resize",this.selfAdaption);//取消echarts自适应
  },
  created() {
		// var user = {
    //   accedence_time: '2020-12-16 16:32:27',
    //   company_id: '',
    //   company_info: { creator_ids: [167, 166, 165], id: 15, industry: '计算机软件', is_official: 1, logo_url: '', name: '测试组织', status: 1, user_count_max: 50 },
    //   employee_detail: {
    //     dept_list: [{ dept_id: 432675338, dept_name: '技术' }],
    //     manage_scope: [{ id: 164, name: '刘瑞欣' }, { id: 184, name: '莫仕钊' }],
    //     permission_list: [],
    //     role_list: [
    //       { id: 15, name: 'employee', remark: '员工' },
    //       { id: 12, name: 'admin', remark: '公司管理员' },
    //       { id: 14, name: 'dept_manager', remark: '部门管理者' },
    //       { id: 13, name: 'point_manager', remark: '积分管理员' },
    //       { id: 11, name: 'creator', remark: '创始人' }
    //     ],
    //     superior_list: []
    //   },
    //   id: 167,
    //   img_url: '',
    //   is_admin: 0,
    //   is_creator: 1,
    //   is_official: 1,
    //   is_scope: 1,
    //   letter_index: 'C',
    //   name: '蔡文',
    //   point_config: {
    //     deduct_task_monthly: [{ name: 'A分', point: 0, pt_id: 2 }, { name: 'B分', point: 0, pt_id: 3 }],
    //     entry_limit: 0,
    //     exec_count: 0,
    //     exec_count_point: 0,
    //     point_limit: [{ name: 'A分', point: 0, pt_id: 2 }, { name: 'B分', point: 0, pt_id: 3 }],
    //     reward_ratio: 0,
    //     reward_ratio_point: 0,
    //     reward_task_monthly: [{ name: 'A分', point: 0, pt_id: 2 }, { name: 'B分', point: 0, pt_id: 3 }],
    //     service_point: 0
    //   },
    //   post: '',
    //   site_config: { a2b: 0, base_point: 0, rule_limit_check: 1, service_point: 0, task_review: 0 },
    //   site_id: 15
    // };
    // localStorage.setItem('userData',JSON.stringify(user));
    
  },
};
</script>

<style scoped="scoped" lang="scss">
.refresh {
  margin-top: 100px;
  width: 100px;
}
.noData {
  text-align: center;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.data-all {
  margin-bottom: 10%;
  color: #595959;
}
// .left-all-style{
// 	background: #fff;
// 	border-radius: 5px;
//     margin: 20px 0 20px 0;
// 	.title{
// 		padding-left: 10px;
// 		font-size: 16px;
// 		font-weight: normal;
// 		border-left: 2px solid #409EFF;
// 	}
// }
.left-all-style {
  margin-top: 20px;
  padding: 20px;
  background: #fff;
  border-radius: 5px;
  .title {
    padding-left: 10px;
    font-size: 16px;
    font-weight: normal;
    border-left: 2px solid #409eff;
  }
  .titledes {
    display: block;
    padding-top: 10px;
    font-size: 14px;
    color: #909399;
  }
  .noremind {
    display: block;
    text-align: right;
    font-size: 12px;
    color: #909399;
    cursor: pointer;
  }
  .noremind:hover {
    color: #409eff;
  }
  .noremind:active {
    color: #409eff;
  }
}

.right-all-style {
  background: #fff;
  border-radius: 5px;
  margin: 0 0 20px 20px;
  .title {
    padding-left: 10px;
    font-size: 16px;
    font-weight: normal;
    border-left: 2px solid #409eff;
  }
}

.home-left-header {
  background: #fff;
  border-radius: 5px;
  // border:1px #e1e4e7 solid;
  // box-shadow: 0 2px 4px rgba(140,140,140,0.1);
  .hlheader-user {
    border-right: 1px #cecccc solid;
    margin: 34px 0;
  }
  .hlheader-user-info .greetings div {
    max-width: 95px;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: top;
  }
  .hlheader-user-info {
    display: flex;
    .headimg {
      margin: 0 auto;
    }
    .headtext {
      margin: 0 auto;
    }
    .greetings {
      margin: 0 auto;
      font-size: 16px;
      font-weight: bold;
      // div {
      //   max-width: 95px;
      //   display: inline-block;
      //   overflow: hidden;
      //   white-space: nowrap;
      //   text-overflow: ellipsis;
      //   vertical-align: top;
      // }
      span {
        font-size: 14px;
        color: #666;
        display: inline-block;
        vertical-align: top;
        padding-left: 5px;
      }
      p span {
        line-height: 30px;
        font-size: 14px;
        color: #666;
        display: inline-block;
        vertical-align: top;
      }
    }
  }
}

.nopoint_box {
  display: inline-block;
  text-align: center;
  width: 100%;
  margin-bottom: 10px;
  .noimg {
    display: inline-block;
    width: 110px;
    height: 110px;
    margin: 22px auto 16px;
    background: url("./assets/image/nodata_default.png") no-repeat center;
    background-size: 99%;
  }
  .noperson {
    display: inline-block;
    width: 110px;
    height: 110px;
    margin: 22px auto 16px;
    background: url("./assets/image/noperson_default.png") no-repeat center;
    background-size: 99%;
  }
  .title1 {
    display: block;
    text-align: center;
    font-size: 12px !important;
    color: #909399 !important;
    padding: 0;
  }
  a {
    color: #26a2ff;
  }
}
 .ManagerSAwardlStyle{
    text-align:center;
    display:block;
    cursor:pointer;
    b{
      color:#303133;
      font-size:18px;
      transition: all .5s;
    }
    span{
      color:rgb(48, 49, 51);
      font-size:14px;
      margin-top:5px;
      display:block;
    }
  }
  .ManagerSAwardlStyle:hover .ManagerSAwardlStyleB{
    color:#4eb2ff;
  }


  ::v-deep .el-radio-button__inner{
    border: 0px solid #DCDFE6;
    border-radius: 5px;
    padding:0px 18px;
	height: 36px;
	line-height: 38px;
  }
  ::v-deep .el-radio-button--medium .el-radio-button__inner{
    padding: 7px 13px;
  }
   .el-radio-button:first-child ::v-deep .el-radio-button__inner{
    border: 0px solid #DCDFE6;
    border-radius: 5px;
  }
  .el-radio-button:last-child  ::v-deep .el-radio-button__inner{
    border-radius: 5px;
  }
  
  .rightexamineAndApproveList{
    text-align:left;
    width:100%;
    // border-bottom:1px solid #EFEFEF;
  }
</style>