gdy_qywx_pc/src/views/dashboard/index.vue

<template>
<div>
  <el-row :style="noticeRole && pastdueDate?'':'margin-top: 20px'">
    <el-col :span="24">
      <div class="" style="border:1px #e1e4e7 solid;margin-bottom:20px;" v-if="experience_data">
        <el-carousel  trigger="click" :interval="6000" height="125px">
          <el-carousel-item v-for="(item,index) in banner" :key="index">
            <img :src="item.image" alt="" style="cursor:pointer;" @click="bannerImagePush(item.key)">
          </el-carousel-item>
        </el-carousel>
      </div>
    </el-col>

    <el-col :span="24" v-if="noticeRole && pastdueDate">
      <!-- <div class="" style="margin-bottom:10px;position: absolute;top:-18px;z-index:1;width:100%;"> -->
      <div class="" style="margin:10px 0;z-index:1;width:100%;">
      <!-- <div class="" style="position:relative;top:-10px; "> -->
        <div style="width: 100%;overflow: hidden;">
          <!-- <announcement :sendVal="pastdueDate"></announcement> -->
          <marquee scrollamount="5" onmouseover=this.stop() onmouseout=this.start()>
            <div style="color:#ff880e;font-size:16px;">{{pastdueDate}}&nbsp;&nbsp;&nbsp;<a class="vtRenew" @click="innerVisible=true">立即续费>></a> </div>
          </marquee>
        </div>
      </div>
    </el-col>

    <el-col :span="18">
      <el-row :gutter="40" class="top_user_info" style="margin:0;padding:0;">
        <el-col :span="7" class="userinfo_box" v-loading="send_site_info_loading">
          <el-row :gutter="40" style="margin:0;padding:0;">
            <el-col :span="24" class="user_info">
              <!-- <div class="headimg fl" style=" margin-right: 10px;cursor:pointer;" v-if="deptManagerRouters" @click="$router.push({ name: 'company_info',params:{activeName: 'second'}})">
                <userImage :id="user_info.id" :img_url="user_info.img_url" :user_name="user_info.name" width="50px" height="50px"></userImage>
              </div> -->
              <div class="headimg fl" style=" margin-right: 10px;">
                <userImage :id="user_info.id" :img_url="user_info.img_url" :user_name="user_info.name" width="50px" height="50px"></userImage>
              </div>
              <div class="greetings">
                
                <!-- <div ref="dept9999"> -->
                <div>
                  <WWOpenData type="userName" :openid="user_info.name"></WWOpenData>
                <!-- {{user_info.name}} -->
                </div>&nbsp;&nbsp;
                <span v-show="time <= 4">夜深了</span>
                <span v-show="time > 4 && time <= 11">早上好</span>
                <span v-show="time > 11 && time <= 14">中午好</span>
                <span v-show="time > 14 && time <= 19">下午好</span>
                <span v-show="time > 19 && time <= 24">晚上好</span>
              </div>
              <p style="margin: 0; color: #666;">
                <span v-show="time <= 4">烦恼尽退散</span>
                <span v-show="time > 4 && time <= 11">又是美好的一天</span>
                <span v-show="time > 11 && time <= 14">吃饱睡好更有动力</span>
                <span v-show="time > 14 && time <= 19">致敬奋斗中的自己</span>
                <span v-show="time > 19 && time <= 24">该养精蓄锐了</span>
              </p>
            </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 15px 0 15px">
                  <img :src="item.img" @click="openGzd(item.url)" style="width:46px;height:46px;margin:10px 5px 0 0">
                  <p style="display: inline-block;width:100%;">
                    <b style="color:#303133;font-size:16px;">{{item.name}}</b><br>
                    <span style="color:#606266;font-size:12px;display: inline-block;margin-top:8px;">{{item.value}}</span>
                  </p>
                </div>
              <!-- </el-col> -->
            </div>

          </el-col>
        </el-col>
        <div v-else>
          <!-- <el-col :span="16" style="margin-top:34px;padding:0;border-right: 1px #cecccc solid;height:58px;" v-loading="authorityManagerHeaderLoad"> -->
          <el-col :span="16" style="margin-top:34px;padding: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>
              </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.complete_count + '/' + authorityManagerHeaders.performance.total_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="raiders_box">
        <el-row>
          <el-col :span="22">
            <b class="title">排行榜 </b>
          </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">
                <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;padding-top:30px;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;">
                <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: 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 style="">{{item.rank}}</b></div>
                <div v-if="item.employee_id  == user_infos.id && 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: 10px;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="16" :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;">
                <!-- <open-data :type="item.employee_name" lang="zh_CN"></open-data> -->
                <!-- <ww-open-data type="userName" openid="item.id"></ww-open-data> -->
                <!-- {{item.employee_name}} -->
                <WWOpenData type="userName" :openid="item.employee_name"></WWOpenData>
                <span v-if="item.employee_id  == user_infos.id">(我)</span>
              </span>
            </div>
          </div>

        </div>
      </el-row>

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

          <el-col :span="5" style="position: absolute;top:40px;left:10px;z-index: 1;" v-if="!employeeRout">
            <deptData  v-if="toPdept1 && toPdept1!=0" :refsName="$refs.dept1" :toPdept="toPdept1"></deptData>
            <!-- <WWOpenData type="departmentName" :openid="dept_tree.name"></WWOpenData> -->
            <el-cascader
              v-model="dept_name1"
              :options="dept_tree"
              :props="{ label: 'name', value: 'id'}"
              @change="dept1_null"
              ref="dept1"
              filterable
              change-on-select
              placeholder="请选择部门"
              clearable
            >
              <template slot-scope="{ node, data }">
                <span>
                  <WWOpenData type="departmentName" :openid="data.name"></WWOpenData>
                </span>
                <!-- <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span> -->
              </template>
            </el-cascader>
          </el-col>
          <div v-loading="IntegralFormChartLoad">
            <div class="nopoint_box" style="height:340px;" v-show="IntegralFormnone">
              <div class="noimg" style="width: 150px;height: 150px;margin-top:80px;"></div>
              <span class="title1">暂无积分数据，<span @click="$router.push({ path: '/award_punish' })" style="color:#409EFF;cursor:pointer;">去奖扣积分></span></span>
            </div>
            <div v-show="!IntegralFormnone">
              <div ref="IntegralFormChart" :style="{width: '858px', height: '400px'}"></div>
            </div>
          </div>
        </el-row>
      </el-row>

      <el-row class="raiders_box">
        <el-row style="position: relative;">
          <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: absolute;top:40px;left:10px;z-index: 1;"  v-if="!employeeRout">
              <deptData  v-if="toPdept2 && toPdept2!=0" :refsName="$refs.dept2" :toPdept="toPdept2"></deptData>
              <el-cascader
                v-model="dept_name2"
                :options="dept_tree"
                :props="{ label: 'name', value: 'id'}"
                @change="monthlyIntegralchange"
                ref="dept2"
                filterable
                change-on-select
                placeholder="请选择部门"
                clearable
              >
                <template slot-scope="{ node, data }">
                  <span>
                    <WWOpenData type="departmentName" :openid="data.name"></WWOpenData>
                  </span>
                  <!-- <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span> -->
                </template>
              </el-cascader>
            </el-col>

            <div class="nopoint_box" style="height:400px;" 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: '858px', height: '350px'}"></div>
              <div style="width:100%;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="raiders_box" style="margin-bottom:20px;" v-if="!employeeRout">
        <el-row style="position: relative;">
          <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: absolute;top:40px;left:10px;z-index: 1;">
              <deptData  v-if="toPdept3 && toPdept3!=0" :refsName="$refs.dept3" :toPdept="toPdept3"></deptData>
              <el-cascader
                v-model="dept_name3"
                :options="dept_tree"
                :props="{ label: 'name', value: 'id'}"
                @change="ManagerSAwardlchange"
                ref="dept3"
                filterable
                change-on-select
                placeholder="请选择部门"
                clearable
              >
                <template slot-scope="{ node, data }">
                  <span>
                    <WWOpenData type="departmentName" :openid="data.name"></WWOpenData>
                  </span>
                  <!-- <span v-if="!node.isLeaf"> ({{ data.children.length }}) </span> -->
                </template>
              </el-cascader>
            </el-col>
            <div class="nopoint_box" style="height:400px;" v-if="ManagerSAwardnone">
              <div class="noimg" style="width: 150px;height: 170px;margin-top:90px;"></div>
              <span class="title1">暂无积分数据</span>
            </div>
            <div v-show="!ManagerSAwardnone">
              <div ref="ManagerSAwardChart" :style="{width: '858px', height: '400px'}"></div>
              <div style="width:100%;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">

      <el-row v-if="!creatorJurisdiction" class="readyapprove_box" style="background-color:#fff;text-align:left;margin-bottom: 20px;">
        <div class="grid-content bg-purple" style="background-color:#fff;padding:20px;">
          <span class="title">常用</span>
          <div>
            <span v-for="(item,index) in inCommonUse" :key="index" @click="$router.push({ path: item.push })" class="inCommonUseStyle">
              <img :src="item.image" alt="" style="width:31px;height:31px;margin:11px 9px 0 12px;">
              <b>{{item.name}}</b>
            </span>
          </div>
        </div>
      </el-row>

      <el-row class="readyapprove_box" style="background-color:#fff;" v-loading="examineAndApproveloading" v-if="!employeeRout">
        <div class="grid-content bg-purple" style="background-color:#fff;padding:20px;">
          <span class="title">待我审批的 <span v-if="examineAndApproveList.length > 0">({{examineAndApproveindex>0?examineAndApproveindex:''}})</span></span>
          <div v-show="false">
            <div id="secancode"></div>
            <span class="secantitle">为了更方便操作，请使用 APP 处理</span>
          </div>
          <div class="nopoint_box" v-if="examineAndApproveList.length == 0">
            <div class="noimg"></div>
            <span class="title1">还没有待我审批</span>
          </div>
          <div v-for="(item,index) in examineAndApproveList" class="List_border" :key="index" style="cursor:pointer;display:flex;padding-top:10px;" v-else @click="openDetail(item)">
              <userImage
                width="45px"
                height="45px"
                :id="item.employee_id"
                :user_name="item.employee_name"
                style="margin-right:8px"
              ></userImage>
              <div class="rightexamineAndApproveList">
                <p style="width:160px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#303133;font-size:16px"><b><WWOpenData type="userName" :openid="item.employee_name"></WWOpenData>{{item.source_type==1?'的积分任务':item.source_type==2?'的积分申请':item.source_type==3?'的积分录入':item.source_type==4?'的绩效工作':''}}</b></p>
                <p style="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; ">{{item.remark.rule || item.remark.customize}}</p>
                <div style="display:flex;padding-bottom:16px;justify-content: space-between;">
                  <span style="color:#909399">{{item.event_time}}</span>
                  <div>
                    <span style="color:#26A2FF;cursor:pointer" >去审批</span>
                  </div>
                </div>
              </div>
          </div>
          <div class="more" v-show="examineAndApproveList.length > 0 && examineAndApproveindex>3" style="border-top:1px solid #EFEFEF;color: rgb(144, 147, 153);font-size: 14px; padding: 20px 0 0 20px; cursor: pointer;"
            @click="$router.push({path: '/approval_list'})">查看更多</div>
        </div>
      </el-row>

    <!-- 本周考勤模块 -->
      <!-- <el-row class="pointsevent_box">
        <div class="grid-content bg-purple" v-loading="weekChecking_inloading" style="background:#fff;padding: 20px 20px 0;">
          <span class="title">本周考勤</span>
          <div style="display:flex;flex-wrap:wrap;justify-content: space-around;padding-bottom:20px">
            <div v-for="(item,index) in weekChecking_ins" :key="index" style="width:45%;">
              <p class="weekChecking_inStyle"><b style="font-size:20px;">{{item.val}}</b><br> {{item.name}}</p>
            </div>
          </div>
        </div>
      </el-row> -->

      <el-row class="pointsevent_box">
        <div class="grid-content bg-purple" 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-bottom:20px;">
            <userImage
              width="45px"
              height="45px"
              :id="prize.id"
              :user_name="prize.name"
              :img_url="prize.img_url"
              fontSize="16"
              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;"><WWOpenData type="userName" :openid="prize.name"></WWOpenData></b><span style="color:#26A2FF;font-size:16px;"><span v-if="prize.point>0">+</span>{{prize.point}} B分</span></p>
              <p style="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:3; ">{{prize.remark? prize.remark.customize : ''}}</p>
            </div>
          </div>
        </div>
      </el-row>

      <el-row class="pointsevent_box">
        <div class="grid-content bg-purple" 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">
            <userImage
              width="45px"
              height="45px"
              :id="buckle.id"
              :user_name="buckle.name"
              :img_url="prize.img_url"
              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;"><WWOpenData type="userName" :openid="buckle.name"></WWOpenData></b><span style="color:#FF9600;font-size:16px;">{{buckle.point}} B分</span></p>
              <p style="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:3; ">{{buckle.remark?buckle.remark.customize:''}}</p>
            </div>
          </div>
        </div>
      </el-row>

      <el-row v-if="advertisingImage != ''" class="pointsevent_box" style="width:280px;height:200px;background:#fff;">
        <img :src="advertisingImage" style="width:100%;height:100%;" alt="">
          <!-- <div style="background:#fff;padding: 20px 20px 0;">
            <div class="nopoint_box">
              <div class="noimg"></div>
              <span class="title1">暂无数据</span>
            </div>
          </div> -->
      </el-row>
    </el-col>
  </el-row>

    <examinePopup
      :title="'审核详情'"
      :id="detail_id"
      :show.sync="detailShow"
    ></examinePopup>
    
		<el-dialog :visible.sync="innerVisible" width="400px" append-to-body class="innerVisible">
        <p style="font-size:21px;">续费/升级</p>
        <p style="margin:0;">请在功道云积分服务群中联系客服顾问或微信扫码添加功道云客服进行续费</p>
        <img src="/static/images/vtRemewService.png" style="width:100%">
        <p style="font-size:20px;">电话咨询：400-6877-880</p>
		</el-dialog>
</div>
</template>


<script>
  import {setToken} from '@/utils/auth'
  import announcement from "@/views/common/announcement";
  // import request from '@/utils/request'
  import examinePopup from "@/views/common/examinePopup";
  import tubiao from './components/tubiao'
  import tubiaoEmployee from './components/tubiaoEmployee'
  import tubiaoAdmin from './components/tubiaoAdmin'
  import anniu from './components/anniu'
  import daiyu from './components/daiyu'
  import jclb from './components/jclb'
  import dashboarde from './components/dashboarde'
  import jfnr from './components/jfnr'
  import EmployeeProfile from '@/views/integral/EmployeeProfile'
  import EmployeePwd from '@/views/integral/EmployeePwd'
  import avatarUpload from '@/views/integral/avatarUpload'
  import QRCode from 'qrcodejs2';
  import {
    mapGetters,
    mapState
  } from 'vuex'
  import axios from "axios"
  import ECharts from "echarts";
  import qs from 'qs'
  export default {
    components: {
      examinePopup,
      tubiao,
      tubiaoEmployee,
      tubiaoAdmin,
      anniu,
      daiyu,
      jclb,
      dashboarde,
      jfnr,
      EmployeeProfile,
      EmployeePwd,
      avatarUpload,
      QRCode,
      announcement
    },
    data() {
      return {
        dept_namedata:[],
        noticeRole:this.$authoritys('creator') || this.$authoritys('admin') || this.$authoritys('point_manager'),
        innerVisible:false,
        experience_data:false,//是否体验账号
        banner:[//首页轮播
          {image:'/static/images/banner1.jpg',key:1},
          {image:'/static/images/banner2.jpg',key:2},
        ],
        exclusiveMonthBranch:0,//本月积分情况--部门
        exclusiveMonthChecked:true,//本月积分情况--不包含自动积分加分项
        rollOne:true,
        advertisingImage:'',//广告位图片
        inCommonUse:[
          {name:'奖扣积分',image:'/static/images/entry_list.png',push:'/award_punish'},
          {name:'发布任务',image:'/static/images/my_publish.png',push:'/my_issue'},
          {name:'申请积分',image:'/static/images/a_apply.png',push:'/apply_list'},
          {name:'领任务',image:'/static/images/task_hall.png',push:'/get_task'},
        ],
        authorityManagerHeaderLoad:false,//除了管理员 的头部  -- loading
        authorityManagerHeaders:{},//除了管理员 的头部  --数据
        highestPrizeBuckleloading:false,//奖扣最高loading
        prize:{},//奖分最高
        buckle:{},//扣分最高


        //本周考勤
        weekChecking_inloading:false,//本周考勤loading
        weekChecking_ins:[//本周考勤
          {val:0,name:'迟到人数'},
          {val:0,name:'早退人数'},
          {val:0,name:'缺卡人数'},
          {val:0,name:'旷工人数'},
          {val:0,name:'外勤人数'},
          {val:0,name:'加班人数'}
        ],
        //隐藏的积分构成
        IntegralFormnone:false,//积分构成为空或报错，展示的开关
				dept_name1:[],//积分构成--部门
        IntegralFormChartLoad:false,//积分构成loading


        ManagerSAwardloading:false,//管理者统计 loading
        ManagerSAwardlList:[//管理者统计数据
          {val:'0',name:'总奖分'},
          {val:'0',name:'总扣分'},
          {val:'0',name:'奖扣分比例'},
          {val:'0',name:'奖扣人次'},
          {val:'0',name:'奖扣执行人数'},
          {val:'0',name:'达标人数'},
          {val:'0',name:'未达标人数'},
        ],
        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,//本月积分情况为空或报错，展示的开关
        ManagerSAwardnone:false,//管理者奖扣执行情况为空或报错，展示的开关
        // IntegralForms:{
        //   dept_id:0,
        //   month: this.$moment().format('YYYY-MM')
        // },
				dept_name2:[],//本月积分情况--部门
				dept_name3:[],//管理者统计数据--部门
				dept_tree: [],//部门
        RankingPush:'',
        tabPositionLoad:false,//排名分类loading
        addUpRankingLoad:false,//排名人员loading
        tabPosition:'0',
        rankingList:[],//排行榜数据
        rankingListDetails:[],//排行榜人员列表
        // adoptShow:false,//通过窗口
        // determinedBy:false,//通过loading

        // rejectShow:false,//驳回窗口
        // rejectLoading:false,//驳回loadings
        // rejectForm: {//审批驳回
        //   remark: ""
        // },
        detail_id: null,//审批组件传入的ID
        detailShow: false,//审批组件显示隐藏
        examineAndApproveloading:false,//审批loading
        examineAndApproveList:[],//审批列表
        examineAndApproveindex:0,//审批列表数量
        deptManagerRouters:!this.$authoritys('dept_manager'),//是否部门管理者权限
        creatorJurisdiction:this.$authoritys('creator'),//是否创始人权限
        employeeRout:this.$authoritys('employee'),//员工权限
        user_infos:this.$store.getters.user_info,//拿到当前登录人员信息，隐藏部门管理者等
        dialogProfileVisibleinit: false,
        compnayInfoForm: {
          name: '',
          contacts: ''
        },
        fits: [{
            name: '奖扣A/B分',
            value:'表现好坏，有奖有罚',
            img: '/static/images/prizeBuckle.png',
            url: '/award_punish'
          },
          // {
          //   name: '绩效',
          //   value:'工作目标与价值的体现',
          //   img: '/static/images/performance.png',
          //   url: '/team_performance'
          // },
          {
            name: '任务',
            value:'认可积极完成任务的人',
            img: '/static/images/task.png',
            url: '/my_issue'
          },
        ],
        pointsevent: 0,
        send_site_info_loading: false,
        enabled_close: false,
        ProfileActiveName: 'first',
        dialogProfileVisible: false,
        currentTubiao: 'tubiao',
        activeName2: 'first',
        click_close: false,

        rules: {
          name: [{
              required: true,
              message: this.$t('dashboard.rulescompnayname'),
              trigger: 'blur'
            },
            {
              min: 2,
              max: 30,
              message: this.$t('dashboard.rulescompnaynamelength'),
              trigger: 'blur'
            }
          ],
          contacts: [{
              required: true,
              message: this.$t('dashboard.rulescontacts'),
              trigger: 'blur'
            },
            {
              min: 2,
              max: 7,
              message: this.$t('dashboard.rulescontactslength'),
              trigger: 'blur'
            }
          ]
        },

        // 7.0
        employee_map: {},
        point_types: {},
        time: this.$moment().format('HH'),
        site_info: {},
        // index_introduction: localStorage.getItem('index_introduction'),
        // index_course: localStorage.getItem('index_course'),
        pastdueDate:null,

        
        toPdept1:0,//选择部门的遮到
        toPdept2:0,//选择部门的遮到
        toPdept3:0,//选择部门的遮到
      }
    },
    watch: {
      exclusiveMonthChecked(){
        this.monthlyIntegral()
      },
    },
    computed: {
      ...mapState({
        user_info: state => state.user.user_info
      }),
    },
    methods: {
      //点击轮播图
      bannerImagePush(item){
        if(item == 1){
          window.open('http://gdyapp.oss-cn-shenzhen.aliyuncs.com/pdf/%E7%A7%AF%E5%88%86%E8%BD%AF%E4%BB%B6%E4%BB%8B%E7%BB%8D-APP%E7%89%88.pdf')
        }else{
          window.open('https://www.g107.com/GouShuZhuanXian')
        }
      },
      handleScrolls(e){
        if(document.getElementsByClassName('main-content')[0].scrollTop){
          let H = document.getElementsByClassName('main-content')[0].scrollTop
          if(this.rollOne && H>=100){
            this.rollOne = false
            this.monthlyIntegral()//月度积分
            if(!this.employeeRout){//员工不请求管理者奖扣任务执行情况
              this.ManagerSAward(); //管理者奖扣任务执行情况
            }
          }
        }
      },
      //广告位
      advertising(){
        this.$http('get','/api/pc_admin').then((res)=>{
          if(res.data.code == 1){
            this.advertisingImage = res.data.data.advertising_img
          }
        }).finally(()=>{
          
        })
      },
      //管理员头部
      authorityManagerHeader(){
        this.authorityManagerHeaderLoad = true
        let params = {
          employee_id:this.user_infos.id,
          month:this.$moment().format('YYYY-MM')
        }
        this.$http('get','/api/integral/statistics/',params,'v2').then((res)=>{
          if(res.data.code == 1){
            this.authorityManagerHeaders = res.data.data
          }
        }).finally(()=>{
          this.authorityManagerHeaderLoad = false
        })
      },

      //奖扣分最高积分事件
      highestPrizeBuckle(){
        this.highestPrizeBuckleloading = true
        let params = {
          time_type:'1',
          pt_id:'3',
          page:'1',
          page_size:'1'
        }
        this.$http('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
        })
      },

      //本周考勤
      //格式化日期：yyyy-MM-dd
      formatDate(date) {
          var myyear = date.getFullYear();
          var mymonth = date.getMonth() + 1;
          var myweekday = date.getDate();

          if (mymonth < 10) {
              mymonth = "0" + mymonth;
          }
          if (myweekday < 10) {
              myweekday = "0" + myweekday;
          }
          return (myyear + "-" + mymonth + "-" + myweekday);
      },
      weekChecking_in(){
        this.weekChecking_inloading = true
        var now = new Date();
        var nowTime = now.getTime() ;
        var day = now.getDay()|| 7;
        var oneDayTime = 24*60*60*1000 ;
        var MondayTime = nowTime - (day-1)*oneDayTime ;//显示周一
        var SundayTime =  nowTime + (7-day)*oneDayTime ;//显示周日
        var params = {
          start_date:this.formatDate(new Date(MondayTime)),
          end_date:this.formatDate(new Date(SundayTime))
        }
        this.$jtoken.get(this.serveAd + '/ad/statistics/department/weekly', {
            params: params
          }).then((res)=> {
            let datas = res.data.data
            this.weekChecking_ins[0].val = datas.late_count
            this.weekChecking_ins[1].val = datas.leave_early_count
            this.weekChecking_ins[2].val = datas.sign_absent_count
            this.weekChecking_ins[3].val = datas.absent_count
            this.weekChecking_ins[4].val = datas.range_count
            this.weekChecking_ins[5].val = datas.ot_count
          }).finally(()=>{
            this.weekChecking_inloading = false
          })
      },
      //管理者奖扣统计
      ManagerSAwardCharts(Name,Award,Deduct){//管理着奖扣统计表
        const chart = this.$refs.ManagerSAwardChart
        console.log(Name)
        // WWOpenData.prefetch({ items }, (err, data) => {
        //   if (err) {
        //       console.log(err);
        //       return reject(err);
        //   }
        //   console.log(data);
        //   resolve(data);
        // });
        // var Name = [];
            if(chart){
              const myChart = ECharts.init(chart)
              const option = {
                // tooltip: {
                //     trigger: 'axis',
                //     axisPointer: {
                //         // type: 'cross',
                //         crossStyle: {
                //             color: '#999'
                //         }
                //     },
                // },
                tooltip: {
                  trigger: 'axis',
                  formatter: (params) => {
                    var htmlStr ='<div>';
                    for(let i in params){
                      htmlStr += '<span style="display:inline-block;background-color:'+params[i].color+';width:8px;height:8px;border-radius:50%;margin:0 5px;"></span>'
                      htmlStr += '<span>'+params[i].seriesName+':</span>';
                      htmlStr += '<span style="margin:0 5px 0 3px;">'+params[i].value+'</span><br>';
                    }
                    htmlStr += '</div>';
                    return htmlStr;
                  }
                },
                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){//选中规则
        this.toPdept3 = val[val.length-1]
        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.$http('get','/api/integral/statistics/task/pie', params,'v2')
        .then(res => {
          let datas = res.data.data
          listslength = datas.list
          let items = []
          let histogramAward = []
          let histogramDeduct = []
          for(let i in datas.list){
            console.log(datas.list[i].name)
            let arr = {}//转结构
            arr.type = "userName",
            arr.id = datas.list[i].name
            items.push(arr)
            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
          console.log(items)
          console.log(histogramAward)
          console.log(histogramDeduct)
          // WWOpenData.prefetch({ histogramName }, (err, data) => {
          //   if (err) {
          //     console.log(err);
          //   }
          //   // var ds = data.items.map($0=>$0.data) // 这个就是转好的，直接丢到 echarts
          //   console.log(data)
          //   if (WWOpenData.initCanvas) {
          //     WWOpenData.initCanvas()
          //   }
          // });
          
          WWOpenData.prefetch({ items }, (err, data) => {
              if (err) {
                console.log(err);
              }
              var Name = data.items.map($0=>$0.data) // 这个就是转好的，直接丢到 echarts
              console.log(Name)
              console.log(data)
              if (WWOpenData.initCanvas) {
                WWOpenData.initCanvas()
              }
              this.ManagerSAwardCharts(Name,histogramAward,histogramDeduct)
          });
        }).finally(() => {
          if(listslength.length == 0){
            this.ManagerSAwardnone = true
          }else{
            this.ManagerSAwardnone = false
          }
          this.ManagerSAwardloading = false
        });
      },
      //月度积分
      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){
        this.toPdept2 = val[val.length-1]
        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 = []
        if(this.employeeRout){
          console.log(this.$store.getters.user_info.id)
          params.employee_id = this.$store.getters.user_info.id;
        }else{
          params.dept_id = this.exclusiveMonthBranch
        }
        // 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.$http('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
        });
      },
      // clickDept(refsNAme){
			// 	this.$refs.refsNAme.dropDownVisible = true;
      // },
      //积分构成
			dept1_null(val){
        this.toPdept1 = val[val.length-1]
        let valItem = 0
        for(let i in val){
          valItem = val[i]
        }
        this.integralForm(valItem)
				this.$nextTick(()=>{
					this.$refs.dept1.dropDownVisible = 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
        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 = '33%'
          leftBT = '19%'
        }

        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: '68%',
                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)
        }
      },
      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=0,
            params.month= this.$moment().format('YYYY-MM')
        }
        if(this.employeeRout){
          params.employee_id = this.$store.getters.user_info.id;
        }
        this.$http('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>10){
              lists[i].name = lists[i].name.slice(0,10)+'...'
            }
            //分为两列展示
            // 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
        });
      },
      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.$http('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.$http('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.$http('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.$http('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);
            }
          })
          .catch(e => {
            self.$message.error(e.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)
        }
      },
      //审批
      openDetail(item) {
        this.detail_id = item.id;
        this.detailShow = true;
      },
      get_list(){
        this.examineAndApproveloading = true;
        let params = {
          type: 'waiting',
          source_type: 0,
          pt_id: 0,
          page_size: 3,
          page: 1,
        }
        this.$http('get',"/api/integral/review/list",params).then(res => {
          if (res.data.code == 1) {
            this.examineAndApproveList = res.data.data.list
            this.examineAndApproveindex = res.data.data.total
          } else {
            this.$message.error(res.data.data.msg);
          }
          this.examineAndApproveloading = false;
        }).catch(e => {
          this.examineAndApproveloading = false;
        });
      },
      // get_site_info() {
      //   let self = this
      //   self.send_site_info_loading = true
      //   this.$http('get','/api/site/info').then((res) => {
      //     if (res.data.code == 1) {
      //       self.site_info = res.data.data
      //     } else {
      //       self.$message.error(res.data.data.msg)
      //     }
      //   }).finally(() => {
      //     self.send_site_info_loading = false
      //   })
      // },
      // setIntroduction() {
      //   this.$confirm('确认后，将永久不再显示整个攻略模块', '确认不再提示吗?', {
      //     confirmButtonText: '确定',
      //     cancelButtonText: '取消',
      //     type: 'warning'
      //   }).then(() => {
      //     localStorage.setItem('index_introduction', 'true')
      //     this.index_introduction = true
      //   })
      // },
      // setCourse() {
      //   this.$confirm('确认后，将永久不再显示整个攻略模块', '确认不再提示吗?', {
      //     confirmButtonText: '确定',
      //     cancelButtonText: '取消',
      //     type: 'warning'
      //   }).then(() => {
      //     localStorage.setItem('index_course', 'true')
      //     this.index_course = true
      //   })
      // },
      get_new_employee() {
        let self = this
        this.$http('get','/api/join/index').then((res) => {
          if (res.data.code == 1) {
            const list = res.data.data.list
            // if(list.length!=0){
              let item = list.find(item => item.status == 0)
              if (item !== undefined) {
                this.notify_close = this.$notify({
                  showClose: false,
                  dangerouslyUseHTMLString: true,
                  offset: 64,
                  onClick: function() {
                    this.close()
                    self.$router.push({
                      path: '/employee_table',
                      query:{is:true}
                    })
                  },
                  message: "<div style='height: 50px;display: block;'><div>" + item.account_name +"申请加入企业</div><p><a>点击处理</a></p></div>",
                  duration: 0
                });
              }
            // }
          } else {
            self.$message.error(res.data.msg)
          }
        }).finally(() => {
          self.loading = false
        })
      },
      renew() {
        window.open('http://p.qiao.baidu.com/cps/chat?siteId=10793815&userId=3040844','_blank')
          // https://www7.53kf.com/webCompany.php?kf_sign=DE5OTMTU5MQ2MzEwMjk5NzQ2MDM2MDAwNzIyMjA2Njk=&arg=10220669&style=1&kflist=off&kf=&zdkf_type=1&lnk_overflow=0&language=zh-cn&charset=GBK&username=&userinfo=&introurl=&lyurl=&lytype=0&copartner=&referer=https%3A%2F%2Fwww.g107.com%2F&keyword=&brief=&logo=&question=&uid=936d332da783c637077db48fd080dff5&tfrom=2&timeStamp=1590199547629&ucust_id=
      },
      //  生成二维码
      qrcode () {
        let self = this
        let code = window.location.href.substring(0,window.location.href.length - 5) + 'android'
        let qrcode = new QRCode('secancode', {
          width: 110,
          height: 110,        // 高度
          text:  code,   // 二维码内容
        })
      },
      openPage(index) {
        switch (index) {
          case 1:
            this.$router.push({
              path: '/company_info'
            })
            break;
          case 2:
            this.$router.push({
              path: '/set_basics'
            })
            break;
          case 3:
            this.$router.push({
              path: '/employee_table'
            })
            break;
          case 4:
            this.$router.push({
              path: '/rule_manage'
            })
            break;
          case 5:
            this.$router.push({
              path: '/attendance_classnew'
            })
            break;
        }
      },
      openGzd(val) {
        val?this.$router.push({path: val}):''
      },
      // point_name(name) {
      //   if(this.point_types){
      //     let pt_name = this.point_types.find(function(element) {
      //       if (element.id == name) {
      //         return element.name;
      //       }
      //     });
      //     return pt_name
      //   }
      // },
			// 递归判断列表，把最后的children设为undefined
			getTreeData(data){
				for(var i=0;i<data.length;i++){
					if(data[i].children.length<1){
						// children若为空数组，则将children设为undefined
						data[i].children=undefined;
					}else {
						// children若不为空数组，则继续 递归调用 本方法
						this.getTreeData(data[i].children);
					}
				}
				return data;
      },
      popstate() {
        history.pushState(null, null, document.URL)
      },
      site_infoTIme(site_info){
        let moment = this.$moment
        let create_time = site_info
        let pastdueTime = moment(create_time.toString().length==10?create_time*1000:create_time).format('YYYY-MM-DD')
        let atpresentDate = moment().format('YYYY-MM-DD')
        let date = moment(pastdueTime).diff(moment(atpresentDate),'days')
        // console.log(pastdueTime)
        // console.log(date)
        // date = 25
        if(date>=0 && date<=30){
          this.pastdueDate = '您的积分软件即将到期，有效期至'+pastdueTime+'，请及时续费以免影响使用'
        }else if(date<0){
          this.pastdueDate = '您的积分软件已到期，有效期:'+pastdueTime+'，请及时续费以免影响使用'
        }else{
          this.pastdueDate = null
        }
      },
      overdueToken(){
        let moment = this.$moment
        let atpresentTime = moment().format('YYYY-MM-DD')
        if(localStorage.getItem('overdueToken')){
          let overdue_Token = localStorage.getItem('overdueToken')
          let overdueNum = moment(atpresentTime).diff(moment(overdue_Token),'days')
          if(overdueNum>=7 && overdueNum<=15){
            this.refreshToken()
          }
        }else{
          localStorage.setItem('overdueToken',atpresentTime)
        }
      },
      refreshToken(){
        this.$http('get','/api/fresh_token').then((res)=>{
          let employee_token = res.data.data.employee_token
          let account_token = res.data.data.account_token
          setToken(employee_token)
          localStorage.setItem('user_token_temp', account_token)
          localStorage.removeItem('overdueToken');
          this.overdueToken()
        })
      },
      
    },
    created() {
      console.log('$wx')
      console.log(wx)
      console.log(window.WWOpenData)
      console.log('$wx')
      if (this.$store.getters.user_info.manager_type == 4) {
        this.currentTubiao = 'tubiaoAdmin'
      } else if (this.$store.getters.user_info.manager_type == 0) {
        this.currentTubiao = 'tubiaoEmployee'
      }
			if (localStorage.getItem('dept_tree')) {
        this.dept_tree = 	this.getTreeData(JSON.parse(localStorage.getItem('dept_tree')))
        console.log( this.dept_tree)
          // this.dept_tree[0].name = `<WWOpenData type="departmentName" :openid="${this.dept_tree[0].name}"></WWOpenData>`
      }else{
        this.$store.dispatch('get_dept_tree').then((res) => {
          this.$nextTick(() => {
            this.dept_tree = 	this.getTreeData(JSON.parse(localStorage.getItem('dept_tree')))
          })
        })
      }
      
      localStorage.removeItem('site_info')
      this.$store.dispatch('get_site_info').then((res) => {
        if(JSON.parse(localStorage.getItem('site_info'))){
          this.site_infoTIme(JSON.parse(localStorage.getItem('site_info')).expire_time)
        }else{
          this.site_infoTIme(res.expire_time)
        }
      })
      // this.overdueToken()//长时间免登，重新请求token
      
      // window.addEventListener("popstate", this.popstate, false)
      // 拜年动画
      // if(!localStorage.getItem('isPlayFlash')){
      //   let nowTime = (new Date()).valueOf();
      //   nowTime = parseInt(nowTime/1000)
      //   let endTime = 1549295999  // 春节零点时间戳
      //   if(endTime < nowTime){
      //     setTimeout(()=>{
      //       let flash = document.querySelector('.flash')
      //       let maskFlash = document.querySelector('.mask-falsh')
      //       flash.style.display = 'block'
      //       maskFlash.style.display = 'block'
      //       localStorage.setItem('isPlayFlash',true)
      //     },2000)
      //   }
      // }
    },
    mounted() {
      if(this.employeeRout){
        this.inCommonUse = []
        this.inCommonUse.push(
          {name:'申请积分',image:'/static/images/a_apply.png',push:'/apply_list'},
          {name:'领任务',image:'/static/images/task_hall.png',push:'/get_task'},
        )
      }
      // console.log('this.$refs.dept9999')
      // console.log(this.$refs.dept9999.firstChild.innerHTML)
      // console.log(this.$refs.dept9999.textContent)
      console.log(WWOpenData)
      if(JSON.parse(localStorage.getItem("Experience_data"))){
        this.experience_data = JSON.parse(localStorage.getItem("Experience_data")).if//是否体验账号
      }
    	window.addEventListener('scroll',this.handleScrolls,true)
      // 修改请求接口顺序
      //判断是创始人还是管理员
      if(this.creatorJurisdiction){//创始人
        this.highestPrizeBuckle()//奖扣分最高积分事件
      }else{//管理员
         this.authorityManagerHeader()//管理员header
      }
      if(this.employeeRout){
        this.highestPrizeBuckle()//奖扣分最高积分事件
      }
      this.rankingListname()//获取自定义排行榜名
      // this.monthlyIntegral()//月度积分
      this.integralForm()//积分构成
      this.get_list()//待我审批的
      
      if(!this.creatorJurisdiction && !this.employeeRout){//创始人不请求奖扣分最高积分事件
        this.highestPrizeBuckle()//奖扣分最高积分事件
      }
      // this.weekChecking_in()//本周考勤
      this.advertising()//广告位
      // this.get_new_employee()//申请加入弹窗

      // this.get_site_info()//获取公司详情----当前页面没有用到，先别删



      // let onjpan = []
      // let onarr = [38,38,40,40,37,39,37,39,66,65,66,65]
      // document.onkeydown = function(e) {
      //   clearTimeout(timer);
      //   let e1 = e || event || window.event || arguments.callee.caller.arguments[0]
      //   if (e1 && e1.keyCode == 37) {
      //       onjpan.push(37)
      //   } else if (e1 && e1.keyCode == 38) {
      //       onjpan.push(38)
      //   } else if (e1 && e1.keyCode == 39) {
      //       onjpan.push(39)
      //   } else if (e1 && e1.keyCode == 40) {
      //       onjpan.push(40)
      //   }else if (e1 && e1.keyCode == 65) {
      //       onjpan.push(65)
      //   } else if (e1 && e1.keyCode == 66) {
      //       onjpan.push(66)
      //   }
      //   const result = onjpan.length === onarr.length && onjpan.every(a => onarr.some(b => a === b)) && onarr.every(_b => onjpan.some(_a => _a === _b));
      //   console.log(result)
      //   if(result){
      //     // console.log(document.getElementsByClassName("main-content")[0])
      //     // document.body.style.cursor="pointer";
      //     document.div.style.cssText = "cursor:pointer !important;"
          
      //     // let ids = document.getElementById("app")
      //     // console.log(ids)
      //     //  ids.style("cursor","url(/static/images/nodata_default.png) 64 64 ,pointer");
      //     //  ids.style.cursor = 'help'
      //     onjpan = []
      //     document.onkeydown = undefined
      //   }
      //   var timer = null;
      //   timer = setTimeout(()=>{
      //     onjpan = []
      //     // document.onkeydown = undefined
      //   },5000)
      // }

      
      this.$nextTick(() => {
        this.$router.afterEach(() => {//切换到此路由时让滚动条回到顶部
            document.getElementsByClassName('main-content')[0].scrollTop = 0;
            document.documentElement.scrollTop = 0;
        })
        // this.point_types = JSON.parse(localStorage.getItem('SET_POINT_TYPES')) || this.$store.getters.point_types
        // this.employee_map = JSON.parse(localStorage.getItem('SET_EMPLOYEE_MAP')) || this.$store.getters.employee_map
      })
      //  WWOpenData.bind(document.querySelector('ww-open-data'))

      console.log('this.$refs.dept1')
      console.log(this.$refs.dept1)
      // this.qrcode()//生成二维码，可能无用
    },
    beforeDestroy(){//销毁滚动条事件
      window.removeEventListener("scroll",this.handleScrolls,true)
    },
    destroyed(){
      // window.removeEventListener("scroll",this.handleScrolls)
      if(this.notify_close){
        this.notify_close.close()
      }
    }
  }
</script>

<style scoped>

  /deep/ .el-carousel__button{
    background-color: #dadada;
  }
  .time-box .past {
    color: #999;
  }

  .mask-falsh {
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: none;
  }

  .flash .closeBtn {
    width: 35px;
    z-index: 100;
    height: 35px;
    position: absolute;
    right: 0;
    padding: 5px;
    cursor: pointer;
  }

  .flash {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99;
  }

  @media screen and (max-width: 1366px) {
    .index-admin-right {
      width: 100%;
    }

    .index-admin-left {
      width: 100%;
    }

    .index-admin-right .el-col-lg-8 {
      width: 16.66667%;
    }
  }

  @media screen and (max-width: 960px) {
    .card-panel-right {
      width: 100%;
    }

    .card-panel-left {
      width: 100%;
    }
  }

  .index-admin .el-tabs {
    background-color: #fff;
  }

  .el-tabs__item {
    height: 50px;
    line-height: 50px;
  }

  .el-tabs__item {
    font-size: 16px;
  }

  .el-row {
    padding: 0;

    & :last-child {
      margin-bottom: 0;
    }
  }

  .index-admin .el-tabs__header {
    padding: 0;
    position: relative;
    margin: 0 0 15px !important;
  }
  .top_user_info {
    position: relative;
    padding-top: 0;
    background: #fff;
    border:1px #e1e4e7 solid;
    box-shadow: 0 2px 4px rgba(140,140,140,0.1);
  }

  .top_user_info .userinfo_box {
    border-right: 1px #cecccc solid;
    margin: 34px 0;
  }

  .top_user_info .user_box {
    padding-left: 0 !important;
    border-right: 1px #333 solid;

  }

  .top_user_info .headimg_box {
    padding-left: 0 !important;
  }

  .top_user_info .headimg_box .headimg {
    width: 50px;
    height: 50px;
    background: #909399;
    border-radius: 50px;
  }

  .top_user_info .user_info {
    padding: 0 !important;
    line-height: 25px;
  }
  .top_user_info .user_info .greetings{
    margin: 0 auto;
    font-size: 16px;
    font-weight:bold;
  }
  .top_user_info .user_info .greetings div{
    max-width: 95px;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    vertical-align: top;
  }
  .top_user_info .user_info .greetings span{
    font-size:14px;
    color:#666;
    display: inline-block;
    vertical-align: top;
  }

  .top_user_info .user_info span:nth-child(1) {
    display: block;
    font-size: 16px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .top_user_info .person {
    display: block;
    font-size: 14px;
    padding: 32px 0 18px 0;
    color: #606266;
  }
/*
padding: 18px 0 16px 0;
color: #606266;
height: 32px;
box-sizing: content-box;
*/

  .top_user_info .time {
    font-size: 14px;
    padding-right: 10px;
    position: relative;
  }
  .hong{
    position: relative;
  }
  .hong:before{
    position: absolute;
    content: "";
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 25px;
    background-color: #F56C6C;
    left: -0.8rem;
    animation:theanimation 1s infinite alternate
  }
  @keyframes theanimation{
    0% {width: 0.4rem; height: 0.4rem; opacity: 0.1;}
    100% {width: 0.6rem;height: 0.6rem;opacity: 1;}
  }
  .top_user_info .el-button--info {
    margin-left: 40px;
  }

  .quick_button_box .title {
    font-family: Microsoft Yahei;
    font-size: 16px;
    font-weight:normal;
    padding-left: 20px;
  }

  /* .quick_button_box .quickbutton {
    margin-top: 26px;
    display: flex;
  } */

  /* .quick_button_box .quickbutton .imgbox {
    display: block;
    text-align: center;
    width: calc(100%/5);
    flex: 1;
    opacity:0.76;
    transition:0.35s ease-in-out;
  }
  .quick_button_box .quickbutton .imgbox img:hover{
    cursor: pointer;
    opacity:1;
    transform:scale(1.1);
    transition:0.35s ease-in-out;
  }
  .quick_button_box .quickbutton .imgbox:hover .buttontitle{
    color:#409EFF;
  }
  .quick_button_box .quickbutton .imgbox img {
    display: inline-block;
    width: 72px;
    height: 72px;
    border-radius: 16px;
    transition:0.35s ease-in-out;
  }

  .quick_button_box .quickbutton .imgbox .buttontitle {
    display: block;
    text-align: center;
    font-size: 14px;
    margin-top: 18px;
  } */

  .readyapprove_box {
    /* display: block; */
    text-align: center;
    margin-left: 20px;
    /* padding-right: 0 !important; */
    border:1px #e1e4e7 solid;
    box-shadow: 0 2px 4px rgba(140,140,140,0.1);
  }

  .readyapprove_box .title {
    font-family: Microsoft Yahei;
    display: block;
    font-size:16px;
    font-weight: normal;
    text-align: left;
    margin: 0px 20px 11px 0;
    padding: 2px 0 0 10px;
    border-left: 2px solid #409EFF;
  }

  .readyapprove_box #secancode {
    display: inline-block;
    margin: 8px auto 10px;
  }

  .readyapprove_box .secantitle {
    display: block;
    text-align: center;
    font-size: 12px;
    line-height: 18px;
    color: #909399;
  }

  .raiders_box {
    margin-top: 20px;
    padding: 20px;
    background: #fff;
    border:1px #e1e4e7 solid;
    box-shadow: 0 2px 4px rgba(140,140,140,0.1);
  }

  .raiders_box .title {
    font-family: Microsoft Yahei;
    padding-left: 10px;
    font-size: 16px;
    font-weight: normal;
    border-left: 2px solid #409EFF;
  }

  .raiders_box .titledes {
    display: block;
    padding-top: 10px;
    font-size: 14px;
    color: #909399;
  }

  .raiders_box .noremind {
    display: block;
    text-align: right;
    font-size: 12px;
    color: #909399;
    cursor: pointer;
  }
  .raiders_box .noremind:hover{
    color:#409EFF;
  }
  .raiders_box .noremind:active{
    color:#409EFF;
  }
  /* .raiders_box .raiders_list {
    margin: 0 auto;
  }

  .raiders_box .raiders_list .list {
    width: calc(91%/3);
    margin: 10px;
    padding: 20px !important;
    border: 1px solid rgba(192,196,204,0.4);
    transition:0.35s ease-in-out;
  }
  .raiders_box .raiders_list .list:hover{
    border: 1px #409EFF solid;
    box-shadow: 0 2px 4px rgba(140,140,140,0.2);
    transition:0.35s ease-in-out;
    cursor:pointer;
  }
  .raiders_box .raiders_list .list:hover .title{
    color:#409EFF;
    transition:0.35s ease-in-out;
  }
  .raiders_box .raiders_list .list:nth-child(1) {
    margin-left: 20px;
  }

  .raiders_box .raiders_list .list:nth-child(4) {
    margin-left: 20px;
  }

  .raiders_box .raiders_list .list .title {
    font-size: 16px;
    font-weight:normal;
    color: #606266;
    padding-left:0;
    padding-bottom: 10px;
    border-left:none;
    transition:0.35s ease-in-out;
  }

  .raiders_box .raiders_list .list .desbox {
    display: flex;
  }

  .raiders_box .raiders_list .list .desbox .des {
    font-size: 12px;
    line-height:18px;
    color: #909399;
    padding-right: 14px;
    flex: 1;
  } */

  .pointsevent_box {
    display: block;
    text-align: center;
    margin: 20px 0 0 20px;
    padding-right: 0 !important;
    border:1px #e1e4e7 solid;
    box-shadow: 0 2px 4px rgba(140,140,140,0.1);
  }

  .pointsevent_box .title {
    font-family: Microsoft Yahei;
    display: block;
    text-align: left;
    margin-bottom: 20px;
    padding: 0 0 0 10px;
    font-size:16px;
    font-weight: normal;
    border-left: 2px solid #409EFF;
  }

  .pointsevent_box .more:hover {
    color: #26A2FF !important;
  }

  .nopoint_box {
    display: inline-block;
    text-align: center;
    width: 100%;
    margin-bottom: 10px;
  }

  .nopoint_box .noimg {
    display: inline-block;
    width: 110px;
    height: 110px;
    margin: 22px auto 16px;
    background: url("/static/images/nodata_default.png") no-repeat center;
    background-size: 99%;
  }

  .nopoint_box .noperson {
    display: inline-block;
    width: 110px;
    height: 110px;
    margin: 22px auto 16px;
    background: url("/static/images/noperson_default.png") no-repeat center;
    background-size: 99%;
  }

  .nopoint_box .title1 {
    display: block;
    text-align: center;
    font-size: 12px !important;
    color: #909399 !important;
    padding: 0;
  }

  .nopoint_box a {
    color: #26A2FF;
  }

  .pointsevent_box /deep/ .el-timeline {
    padding-left: 0;
  }
  .pointsevent_box /deep/ .el-timeline .el-timeline-item:hover .el-timeline-item__node{
    background:#409EFF;
  }
  .pointsevent_box /deep/ .el-timeline .el-timeline-item__wrapper {
    text-align: left;
    font-size: 14px;
    color: #303133;
    padding-left: 24px;
  }

  .pointsevent_box /deep/ .el-timeline .el-timeline-item__wrapper span {
    display: block;
    font-size: 14px;
    color: #303133;
    margin-bottom: 8px;
  }
  .pointsevent_box /deep/ .el-timeline .el-timeline-item__wrapper:hover span{
    color:#409EFF;
    cursor: pointer;
  }
  .pointsevent_box /deep/ .el-timeline .el-timeline-item__wrapper span:nth-child(2) {
    font-size: 12px;
    color: #909399;
  }

  .prizebuckle_box {
    margin: 20px auto 20px !important;
    padding: 0;
  }

  .prizebuckle_box .manager_box {
    width: 49%;
    margin-left: 1%;
    height: 570px;
    padding: 20px;
    background: #fff;
    border:1px #e1e4e7 solid;
    box-shadow: 0 2px 4px rgba(140,140,140,0.1);
  }

  .prizebuckle_box .manager_box .title {
    font-family: Microsoft Yahei;
    font-size: 16px;
    color: #303133;
    font-weight:normal;
    padding-left: 10px;
    border-left: 2px solid #409EFF;
  }

  .prizebuckle_box .manager_box .list {
    position: relative;
    margin-top: 25px;
    padding-bottom:22px;
  }
  .prizebuckle_box .manager_box .list:hover .point:before{
    box-shadow: 0 2px 4px rgba(140,140,140,0.1);
    cursor: pointer;
  }
  .prizebuckle_box .manager_box .list:hover .point{
    cursor: pointer;
  }
  .prizebuckle_box .manager_box .list:hover:before{
    background:#409EFF;
    border-bottom: 1px #409EFF solid;
    box-shadow: 0 2px 4px rgba(140,140,140,0.25);
    transition:0.5s ease-in-out;
    cursor: pointer;
  }
  .prizebuckle_box .manager_box .list .headimg_box {
    display: block;
  }

  .prizebuckle_box .manager_box .list:before {
    display: block;
    position: absolute;
    bottom: 0;
    left: 20px;
    width: 350px;
    border-bottom: 1px #efefef solid;
    content: " ";
    z-index: 1;
  }

  .prizebuckle_box .manager_box .list .headimg_box .headimg {
    display: inline-block;
    text-align: center;
    width: 40px;
    height: 40px;
    font-size: 12px;
    color: #fff;
    line-height: 40px;
    background: #606266;
    border-radius: 40px;
  }

  .prizebuckle_box .manager_box .list .headimg_box span{
    display: inline-block;
    vertical-align: middle;
    font-size: 16px;
    padding-left: 6px;
  }

  .prizebuckle_box .manager_box .list .item {
    position: relative;
    text-align: center;
    margin-top: 15px;
  }

  .prizebuckle_box .manager_box .list .item:before {
    display:none;
    position: absolute;
    content: " ";
    top: 0;
    left: 0;
    width: 90%;
    height: 100%;
    background: #f8f8f8;
    border-radius: 8px;
    z-index: 1;
    transition:0.5s ease-in-out;
  }

  .prizebuckle_box .manager_box .list .item .point{
    font-size: 20px;
    color: #606266;
  }

  .prizebuckle_box .manager_box .list .item .describe{
    font-size: 12px;
    color: #606266;
    padding: 10px 0;
  }

  /*
  .prizebuckle_box .manager_box .list .point .record {
    position: relative;
    display: block;
    width: 90px;
    font-size: 20px;
    color: #1c1c1c;
    padding-bottom: 10px;
    z-index: 2;
  }

  .prizebuckle_box .manager_box .list .point .name {
    position: relative;
    display: block;
    width: 90px;
    font-size: 12px;
    color: #606266;
    padding-bottom: 6px;
    z-index: 2;
  }

  .prizebuckle_box .manager_box .list .point .object {
    position: relative;
    display: block;
    width: 90px;
    font-size: 12px;
    color: #606266;
    z-index: 2;
  }
  */

  .prizebuckle_box .manager_box .list .more a {
    display: block;
    text-align: center;
    font-size: 14px;
    color: #909399;
    margin-top: 42px;
  }

  .prizebuckle_box .remeber_box {
    width: 49%;
    height: 570px;
    margin-right: 1%;
    padding: 20px;
    background: #fff;
    border:1px #e1e4e7 solid;
    box-shadow: 0 2px 4px rgba(140,140,140,0.1);
  }
  .prizebuckle_box .remeber_box .team_data_item{
    position:relative;
  }
  .prizebuckle_box .remeber_box .team_data_item:before{
    display: block;
    position: absolute;
    top: 52px;
    left: 0px;
    width: 390px;
    border-bottom: 1px #efefef solid;
    content: " ";
    z-index: 1;
  }
  .prizebuckle_box .remeber_box .team_data_item:hover{
    cursor: pointer;
  }
  .prizebuckle_box .remeber_box .title {
    font-family: Microsoft Yahei;
    font-size: 16px;
    color: #303133;
    font-weight:normal;
    padding-left: 10px;
    border-left: 2px solid #409EFF;
  }

  .prizebuckle_box .remeber_box .name {
    text-align: center;
    font-size: 14px;
    color: #606266;
    padding: 28px 0 20px;
  }

  .prizebuckle_box .remeber_box .name:nth-child(1) {
    text-align: left;
  }

  .prizebuckle_box .remeber_box .name:last-nth-child(1) {
    text-align: right;
  }

  .prizebuckle_box .remeber_box .list {
    position: relative;
    margin-bottom: 20px;
    border-bottom:none;
  }

  .prizebuckle_box .remeber_box .list:before {
    display:none;
    position: absolute;
    top: -6px;
    left: 20px;
    right: 20px;
    width: 400px;
    height: 50px;
    background: #f8f8f8;
    border-radius: 40px 0 0 40px;
    box-shadow: none;
    transition: 0.35s ease-in-out;
    z-index: 1;
  }

  .prizebuckle_box .remeber_box .list:hover:before {
    background:#409EFF;
    box-shadow: 1px 2px 4px rgba(51, 51, 51, 0.2);
    transition: 0.35s ease-in-out;
  }
  .prizebuckle_box .remeber_box .list:hover .point{
    color:#1c1c1c;
  }
  .prizebuckle_box .remeber_box .team_data_item:hover:before{
    border-bottom: 1px #409EFF solid;
  }
  .prizebuckle_box .remeber_box .list .headimg_box {
    position: relative;
    display: block;
    padding-right: 0 !important;
    z-index: 2;
  }

  .prizebuckle_box .remeber_box .list .headimg_box .headimg {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    width: 40px;
    height: 40px;
    font-size: 12px;
    color: #fff;
    line-height: 40px;
    background: #909399;
    border-radius: 40px;
  }

  .prizebuckle_box .remeber_box .list .headimg_box span.headname {
    width: 98px;
    float: right;
    display: block;
    font-size: 16px;
    margin-left: 4px;
    line-height: 40px;
    vertical-align: bottom;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .prizebuckle_box .remeber_box .list .point {
    position: relative;
    text-align: center;
    padding-top: 10px;
    font-size:16px;
    z-index: 2;
  }

  .prizebuckle_box .remeber_box .list .point .record {
    display: block;
    font-size: 14px;
    padding-bottom: 10px;
  }

  .prizebuckle_box .remeber_box .list .point .name {
    display: block;
    font-size: 12px;
    padding-bottom: 6px;
  }

  .prizebuckle_box .remeber_box .list .point .object {
    display: block;
    font-size: 12px;
  }

  .prizebuckle_box .remeber_box .more span {
    display: block;
    text-align: center;
    font-size: 14px;
    color: #909399;
    margin-top: 0px;
  }

  .prizebuckle_box .more:hover span {
    color: #26A2FF !important;
    cursor: pointer;
  }

  .joinin_box {
    display: block;
    text-align: left;
    margin: 20px 0 0 20px !important;
    padding-right: 0 !important;
  }

  .joinin_box .title {
    display: block;
    font-size: 16px;
    color: #303133;
    padding: 18px 20px 0px;
  }

  .joinin_box .join_name {
    display: block;
    font-size: 12px;
    color: #909399;
    padding: 10px 20px 18px;
  }

  .statistics_box {
    margin: 0 auto 20px !important;
    padding: 20px;
    background: #fff;
    border:1px #e1e4e7 solid;
    box-shadow: 0 2px 4px rgba(140,140,140,0.1);
  }

  .statistics_box .title {
    font-family: Microsoft Yahei;
    font-size: 16px;
    margin:0 0 20px 0;
    padding: 0 0 0px 10px !important;
    font-weight: normal;
    border-left: 2px solid #409EFF;
  }

  .statistics_box .num {
    font-size: 20px;
    color: #409EFF;
  }

  .statistics_box .num span {
    font-size: 12px;
    color: #606266;
    padding-right: 10px;
  }

  .case_box {
    margin: 20px auto 0 !important;
    padding: 20px 20px 30px 20px;
    background: #fff;
  }

  .case_box .title {
    font-size: 16px;
    padding: 0 0 20px 0 !important;
  }

  .case_box .noremind {
    display: block;
    text-align: right;
    font-size: 12px;
    padding-right: 20px;
    color: #909399;
  }

  .case_box .newslist {
    padding: 0 !important;
  }

  .case_box .newslist .imgbox {
    width: 196px;
    height: 110px;
    background: #909399;
  }

  .case_box .newslist .listtitle {
    display: block;
    font-size: 14px;
    color: #606266;
    padding: 6px 0 0 0;
  }

  .case_box .newslist .des {
    display: block;
    font-size: 12px;
    color: #606266;
    padding: 10px 0 0 0;
  }

  .more_manager {
    cursor: pointer;
    padding: 20px 0;
    color: rgb(144, 147, 153);
    font-size: 14px;
    text-align: center;
  }
  /* .team_data_item:hover{
    color: #26A2FF;
  } */
  .update_button:hover{
    background:#fc7676;
    border:1px #fc7676 solid;
  }
  .update_button:active{
    background:#fc7676;
    border:1px #fc7676 solid;
  }

 .examineAndApproveTable /deep/  td{
    border: 0px solid #fff;
  }

   .readyapprove_box .more:hover {
    color: #26A2FF !important;
  }
  .rightexamineAndApproveList{
    text-align:left;
    width:100%;
    border-bottom:1px solid #EFEFEF;
    padding-bottom:15px;
  }
  .List_border:nth-child(5)  .rightexamineAndApproveList{
    border-bottom: 0px solid #fff;
  }
  /* .List_border:hover{
    background-color: rgb(252, 252, 252);
  } */


  /deep/ .el-radio-button__inner{
    border: 0px solid #DCDFE6;
    border-radius: 5px;
    padding-right: 15px;
  }
  /deep/ .el-radio-button--medium .el-radio-button__inner{
    padding: 7px 13px;
  }
   .el-radio-button:first-child /deep/ .el-radio-button__inner{
    border: 0px solid #DCDFE6;
    border-radius: 5px;
  }
  .el-radio-button:last-child  /deep/ .el-radio-button__inner{
    border-radius: 5px;
  }

  .ManagerSAwardlStyle{
    text-align:center;
    display:block;
    cursor:pointer;
  }
  .ManagerSAwardlStyleB{
    color:#303133;
    font-size:18px;
    transition: all .5s;
  }
  .ManagerSAwardlStyleSpan{
    color:rgb(48, 49, 51);
    font-size:14px;
    margin-top:5px;
    display:block;
  }
  .ManagerSAwardlStyle:hover .ManagerSAwardlStyleB{
    color:#4eb2ff;
  }

  .weekChecking_inStyle{
    color:#606266;
    font-size:14px;
    display:block;
  }
  .weekChecking_inStyle b{
    color:rgb(38, 162, 255);
    transition: all .5s;
  }
  .weekChecking_inStyle:hover b{
    color:rgb(0 145 255);
  }


  .inCommonUseStyle{
    width:215px;
    height:54px;
    border:1px solid #C0C4CC;
    display:block;
    margin:16px 0 0 10px;
    display:flex;
    line-height:54px;
    border-radius:5px;
    cursor:pointer;
    transition: all .5s;
  }
  .inCommonUseStyle b{
    transition: all .5s;
    color:#303133;
    font-size:14px;
  }
  .inCommonUseStyle:hover{
    background-color: #fcfcfc;
    border: 1px solid #409EFF;
  }
  .inCommonUseStyle:hover b{
    color : #409EFF;
  }

  .vtRenew{
    color:#53b3f7
  }

  .innerVisible p{
    text-align: center;
  }
  /deep/ .el-dialog__body{
    padding: 0 80px 15px;
  }
</style>