|
|
@@ -1,24 +1,1250 @@
|
|
|
<template>
|
|
|
+ <div>
|
|
|
+ <el-row style="min-width:1160px;">
|
|
|
+ <el-row :span="24" style="display:flex;min-width:650px;">
|
|
|
+ <el-col style="width:200px;">
|
|
|
+ <el-select
|
|
|
+ v-model="select_employee_id"
|
|
|
+ filterable
|
|
|
+ placeholder="请输入或选择人员"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in employee_map"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-col>
|
|
|
+ <el-col style="width:105px;margin-left:20px;">
|
|
|
+ <el-select
|
|
|
+ v-model="time_type"
|
|
|
+ placeholder="请选择分类"
|
|
|
+ style="width: 100px;"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in time_types"
|
|
|
+ :key="item.label"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-col>
|
|
|
|
|
|
-</template>
|
|
|
+ <el-col style="width:200px;">
|
|
|
+ <el-date-picker
|
|
|
+ v-show="time_type == '2'"
|
|
|
+ v-model="export_from.year"
|
|
|
+ class="date-picker-width"
|
|
|
+ type="year"
|
|
|
+ value-format="yyyy"
|
|
|
+ :clearable="false"
|
|
|
+ :editable="false"
|
|
|
+ placeholder="选择年份排名"
|
|
|
+ ></el-date-picker>
|
|
|
+ <el-date-picker
|
|
|
+ v-show="time_type == '1' || time_type == '月份'"
|
|
|
+ v-model="export_from.month"
|
|
|
+ class="date-picker-width"
|
|
|
+ type="month"
|
|
|
+ value-format="yyyy-MM"
|
|
|
+ :clearable="false"
|
|
|
+ :editable="false"
|
|
|
+ placeholder="选择月份排名"
|
|
|
+ ></el-date-picker>
|
|
|
+ </el-col>
|
|
|
+ <!-- <el-col style="margin-left:20px;" :span="5">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="formData.month"
|
|
|
+ type="month"
|
|
|
+ placeholder="请选择月份"
|
|
|
+ value-format="yyyy-MM"
|
|
|
+ ></el-date-picker>
|
|
|
+ </el-col> -->
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-col :span="24" style="min-width:1160px;margin-top:10px;">
|
|
|
+ <el-col :span="18" style="min-width:780px;">
|
|
|
+ <el-row
|
|
|
+ :span="24"
|
|
|
+ class="top_user_info"
|
|
|
+ style="margin:0 0 0 0;padding:0;"
|
|
|
+ >
|
|
|
+ <el-col :span="7" class="userinfo_box">
|
|
|
+
|
|
|
+ <el-row :gutter="40" style="margin:0;padding:0;">
|
|
|
+ <el-col
|
|
|
+ :span="24"
|
|
|
+ class="user_info"
|
|
|
+ style="display:flex;"
|
|
|
+ v-loading="personnelMessage"
|
|
|
+ >
|
|
|
+ <div class="headimg fl" style=" margin: 0 10px 0 20%;">
|
|
|
+ <userImage
|
|
|
+ :id="personnel.id"
|
|
|
+ :img_url="personnel.img_url"
|
|
|
+ :user_name="personnel.name"
|
|
|
+ fontSize="1"
|
|
|
+ width="50px"
|
|
|
+ height="50px"
|
|
|
+ ></userImage>
|
|
|
+ </div>
|
|
|
+ <div style="width:100%;">
|
|
|
+ <div style="max-width: 80%;display: inline-block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;vertical-align: top;margin-left:10%;"><b style="font-size:16px;">{{ personnel.name }}</b></div>
|
|
|
+ <div
|
|
|
+ style="max-width: 80%;display:flex;flex-wrap:wrap;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;margin-left:10%;"
|
|
|
+ >
|
|
|
+ <el-popover
|
|
|
+ trigger="hover"
|
|
|
+ placement="top"
|
|
|
+ popper-class="popperSPBOX"
|
|
|
+ >
|
|
|
+ <div style="font-size:14px;color:#828282;">
|
|
|
+ {{ dept_list }}
|
|
|
+ </div>
|
|
|
+ <div slot="reference" class="name-wrapper">
|
|
|
+ <span style="font-size:14px;color:#828282;">{{
|
|
|
+ dept_list
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ </el-popover>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ </el-col>
|
|
|
+ <!-- <div>
|
|
|
+ <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;"><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;">{{ yearhORmontStr }}度B分</span></p>
|
|
|
+ <p style="text-align:center;cursor:pointer;margin: 0;"><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;">{{ yearhORmontStr }}度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;">
|
|
|
+ <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;"><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-col :span="17" 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;"><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;">{{ yearhORmontStr }}度B分</span></p>
|
|
|
+ <p style="text-align:center;cursor:pointer;margin: 0;"><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;">{{ yearhORmontStr }}度A分</span></p>
|
|
|
+ <!-- <p style="text-align:center;cursor:pointer;margin: 0;"><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;"><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>
|
|
|
+
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-row class="left-all-style">
|
|
|
+ <el-row style="position: relative;">
|
|
|
+ <el-col :span="24">
|
|
|
+ <b class="title" style="margin-bottom:15px;display:block"
|
|
|
+ >{{ yearhORmontStr }}积分构成</b
|
|
|
+ >
|
|
|
+ </el-col>
|
|
|
+ <div v-loading="IntegralFormChartLoad">
|
|
|
+ <div
|
|
|
+ class="nopoint_box"
|
|
|
+ style="height:307px;"
|
|
|
+ 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: '100%', height: '350px' }"
|
|
|
+ ></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-row>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="24" style="">
|
|
|
+ <el-row class="left-all-style">
|
|
|
+ <el-row style="position: relative;">
|
|
|
+ <el-col :span="24" style="display:flex">
|
|
|
+ <b class="title" style="margin:0 20px 15px 0;display:block"
|
|
|
+ >{{ yearhORmontStr }}积分情况</b
|
|
|
+ >
|
|
|
+ <el-checkbox v-model="exclusiveMonthChecked"
|
|
|
+ >不包含自动积分加分项</el-checkbox
|
|
|
+ >
|
|
|
+ </el-col>
|
|
|
+ <div v-loading="monthlyIntegralloading">
|
|
|
+ <div
|
|
|
+ class="nopoint_box"
|
|
|
+ style="height:450px;"
|
|
|
+ v-if="monthlyIntegralnone"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="noimg"
|
|
|
+ style="width: 150px;height: 150px;margin-top:110px;"
|
|
|
+ ></div>
|
|
|
+ <span class="title1">暂无积分数据</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div v-show="!monthlyIntegralnone">
|
|
|
+ <div
|
|
|
+ ref="monthlyIntegralChart"
|
|
|
+ :style="{ width: '100%', height: '400px' }"
|
|
|
+ ></div>
|
|
|
+ <div
|
|
|
+ style="width:90%;display:flex;justify-content: space-around;margin-top:30px;padding-left:40px"
|
|
|
+ >
|
|
|
+ <p
|
|
|
+ v-for="(item, index) in monthORyear == '2'
|
|
|
+ ? monthlyIntegralList
|
|
|
+ : yearlyIntegralList"
|
|
|
+ :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-col>
|
|
|
+ </el-col>
|
|
|
+
|
|
|
+ <el-col :span="6" style="min-width:280px;">
|
|
|
+ <el-col>
|
|
|
+ <el-row class="right-all-style" v-loading="awardDeductRanking">
|
|
|
+ <el-row style="">
|
|
|
+ <el-col :span="24" style="display:flex">
|
|
|
+ <b class="title" style="margin:0 20px 15px 0;display:block"
|
|
|
+ >{{ yearhORmontStr }}奖分最多</b
|
|
|
+ >
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" style="margin-bottom:10px;">
|
|
|
+ <el-col style="">
|
|
|
+ <div class="nopoint_box" v-if="IntegralEventO.length == 0">
|
|
|
+ <div class="noimg" style="margin: 48px auto 16px;"></div>
|
|
|
+ <span class="title1" style="padding-bottom:20px;"
|
|
|
+ >暂无积分数据</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-table
|
|
|
+ :data="IntegralEventO"
|
|
|
+ fit
|
|
|
+ :show-header="false"
|
|
|
+ style="border:0px solid #fff;"
|
|
|
+ v-else
|
|
|
+ >
|
|
|
+ <el-table-column prop="remark_data" label="规则">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div
|
|
|
+ style="padding-left:10px;display:flex;flex-wrap:wrap;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;"
|
|
|
+ >
|
|
|
+ <el-popover
|
|
|
+ trigger="hover"
|
|
|
+ placement="top"
|
|
|
+ popper-class="popperSPBOX"
|
|
|
+ >
|
|
|
+ <div style="font-size:14px;color:#828282;">
|
|
|
+ {{
|
|
|
+ scope.row.remark.customize ||
|
|
|
+ scope.row.remark.rule
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ <div slot="reference" class="name-wrapper">
|
|
|
+ <span style="font-size:14px;color:#828282;">{{
|
|
|
+ scope.row.remark.customize ||
|
|
|
+ scope.row.remark.rule
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ </el-popover>
|
|
|
+ </div>
|
|
|
+ <!-- <span>{{scope.row.remark.customize || scope.row.remark.rule}}</span> -->
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <!-- <el-table-column align="center" prop="create_time" label="创建时间" width="140"></el-table-column> -->
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="point"
|
|
|
+ label="积分"
|
|
|
+ width="110"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span
|
|
|
+ >{{ scope.row.point > 0 ? "+" : ""
|
|
|
+ }}{{ scope.row.point }}</span
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
|
|
|
+ <el-col>
|
|
|
+ <el-row class="right-all-style" v-loading="awardDeductRanking">
|
|
|
+ <el-row style="">
|
|
|
+ <el-col :span="24" style="display:flex">
|
|
|
+ <b class="title" style="margin:0 20px 15px 0;display:block"
|
|
|
+ >{{ yearhORmontStr }}扣分最多</b
|
|
|
+ >
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" style="margin-bottom:10px;">
|
|
|
+ <el-col style="">
|
|
|
+ <div class="nopoint_box" v-if="IntegralEventT.length == 0">
|
|
|
+ <div class="noimg" style="margin: 48px auto 16px;"></div>
|
|
|
+ <span class="title1" style="padding-bottom:20px;"
|
|
|
+ >暂无积分数据</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ :data="IntegralEventT"
|
|
|
+ fit
|
|
|
+ :show-header="false"
|
|
|
+ v-else
|
|
|
+ >
|
|
|
+ <el-table-column prop="remark_data" label="规则">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div
|
|
|
+ style="padding-left:10px;display:flex;flex-wrap:wrap;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;"
|
|
|
+ >
|
|
|
+ <el-popover
|
|
|
+ trigger="hover"
|
|
|
+ placement="top"
|
|
|
+ popper-class="popperSPBOX"
|
|
|
+ >
|
|
|
+ <div style="font-size:14px;color:#828282;">
|
|
|
+ {{
|
|
|
+ scope.row.remark.customize ||
|
|
|
+ scope.row.remark.rule
|
|
|
+ }}
|
|
|
+ </div>
|
|
|
+ <div slot="reference" class="name-wrapper">
|
|
|
+ <span style="font-size:14px;color:#828282;">{{
|
|
|
+ scope.row.remark.customize ||
|
|
|
+ scope.row.remark.rule
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ </el-popover>
|
|
|
+ </div>
|
|
|
+ <!-- <span>{{scope.row.remark.customize || scope.row.remark.rule}}</span> -->
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <!-- <el-table-column align="center" prop="create_time" label="创建时间" width="140"></el-table-column> -->
|
|
|
+ <el-table-column
|
|
|
+ align="center"
|
|
|
+ prop="point_mark"
|
|
|
+ label="积分"
|
|
|
+ width="110"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span>{{ scope.row.point }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <!-- <el-table-column align="center" prop="remark_data.rule" show-overflow-tooltip label="规则" width="180"></el-table-column> -->
|
|
|
+
|
|
|
+ <!-- <el-table-column align="center" label="规则" prop="remark_data.rule" width="180">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-popover trigger="hover" placement="top" popper-class="popperSPBOX">
|
|
|
+ <span>{{scope.row.remark_data.rule || scope.row.remark_data.customize}}</span>
|
|
|
+ <div slot="reference" class="name-wrapper" style="width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;"><span>{{scope.row.remark_data.rule || scope.row.remark_data.customize}}</span></div>
|
|
|
+ </el-popover>
|
|
|
+ </template>
|
|
|
+ </el-table-column> -->
|
|
|
+ </el-table>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <!-- <el-col style="display:flex;justify-content: space-between;"> -->
|
|
|
+ <!-- </el-col> -->
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
<script>
|
|
|
+import ECharts from "echarts";
|
|
|
export default {
|
|
|
- name:'individual_statistics',
|
|
|
- data() {
|
|
|
- return {
|
|
|
- };
|
|
|
- },
|
|
|
- watch: {},
|
|
|
- mounted() {
|
|
|
-
|
|
|
- },
|
|
|
- methods: {
|
|
|
-
|
|
|
- }
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ //筛选项
|
|
|
+ formData: {
|
|
|
+ employee_id: this.$getUserData().id,
|
|
|
+ },
|
|
|
+ //时间
|
|
|
+ time_type: "月份",
|
|
|
+ time_types: [
|
|
|
+ { label: "月份", value: "1" },
|
|
|
+ { label: "年份", value: "2" },
|
|
|
+ ],
|
|
|
+ export_from: {
|
|
|
+ year: this.$moment().format("YYYY"),
|
|
|
+ month: this.$moment().format("YYYY-MM"),
|
|
|
+ },
|
|
|
+ yearhORmontStr: "月",
|
|
|
+ monthORyear: "2",
|
|
|
+
|
|
|
+ //选择人员
|
|
|
+ select_employee_id: this.$getUserData().name,
|
|
|
+ employee_map: "", //获取人员列表
|
|
|
+
|
|
|
+ dept_list: "",
|
|
|
+ //人员详情
|
|
|
+ personnel: {},
|
|
|
+ authorityManagerHeaderLoad: false, //人员loading
|
|
|
+ authorityManagerHeaders: {}, //人员数据
|
|
|
+ personnelMessage: false, //人员信息loading
|
|
|
+
|
|
|
+ //饼图
|
|
|
+ IntegralFormChartLoad: false, //积分构成loading
|
|
|
+ IntegralFormnone: false, //积分构成为空或报错，展示的开关
|
|
|
+
|
|
|
+ //本月积分情况
|
|
|
+ exclusiveMonthChecked: true, //不包含自动积分加分项
|
|
|
+ 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: "对比上月扣分" },
|
|
|
+ ],
|
|
|
+ yearlyIntegralList: [
|
|
|
+ //年积分情况数据
|
|
|
+ { 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, //本月积分情况为空或报错，展示的开关
|
|
|
+ exclusiveMonthBranch: 0, //本月积分情况--部门
|
|
|
+
|
|
|
+ IntegralEventO: [], //个人奖分数据
|
|
|
+ IntegralEventT: [], //个人扣分数据
|
|
|
+
|
|
|
+ awardDeductRanking: false, //个人奖扣分loading
|
|
|
+ };
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ time_type(val) {
|
|
|
+ if (val == "1") {
|
|
|
+ //月
|
|
|
+ this.monthORyear = "2";
|
|
|
+ this.formData.year = null;
|
|
|
+ this.formData.month = this.$moment().format("YYYY-MM");
|
|
|
+ this.export_from.month = this.$moment().format("YYYY-MM");
|
|
|
+ this.yearhORmontStr = "月";
|
|
|
+ } else if (val == "2") {
|
|
|
+ //年
|
|
|
+ this.monthORyear = "3";
|
|
|
+ this.formData.month = null;
|
|
|
+ this.formData.year = this.$moment().format("YYYY");
|
|
|
+ this.export_from.year = this.$moment().format("YYYY");
|
|
|
+ this.yearhORmontStr = "年";
|
|
|
+ }
|
|
|
+ this.executiveFunction();
|
|
|
+ },
|
|
|
+ "export_from.month"(val, old_val) {
|
|
|
+ this.formData.month = val;
|
|
|
+ this.executiveFunction();
|
|
|
+ },
|
|
|
+ "export_from.year"(val, old_val) {
|
|
|
+ this.formData.year = val;
|
|
|
+ this.executiveFunction();
|
|
|
+ },
|
|
|
+ // "formData.month"(val, old_val) {
|
|
|
+ // this.executiveFunction();
|
|
|
+ // console.log(this.formData);
|
|
|
+ // },
|
|
|
+ //不包含自动积分加分项
|
|
|
+ exclusiveMonthChecked() {
|
|
|
+ this.monthlyIntegral();
|
|
|
+ },
|
|
|
+
|
|
|
+ select_employee_id(val) {
|
|
|
+ this.formData.employee_id = val;
|
|
|
+ this.executiveFunction(true);
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ window.addEventListener('resize',this.selfAdaption);
|
|
|
+ this.getEmployee()
|
|
|
+ // if(JSON.parse(localStorage.getItem("SET_EMPLOYEE_MAP"))){
|
|
|
+ // this.employee_map = JSON.parse(localStorage.getItem("SET_EMPLOYEE_MAP"))
|
|
|
+ // }else{
|
|
|
+ // this.$store.dispatch('get_employee_map').then((res) => {
|
|
|
+ // this.$nextTick(() => {
|
|
|
+ // this.employee_map = JSON.parse(localStorage.getItem("SET_EMPLOYEE_MAP"))
|
|
|
+ // })
|
|
|
+ // })
|
|
|
+ // }
|
|
|
+ // if (this.$store.getters.user_info) {
|
|
|
+ // this.personnel = this.$store.getters.user_info;
|
|
|
+ // let dept_li = this.personnel.employee_detail.dept_list;
|
|
|
+ // let dept_ = "";
|
|
|
+ // for (let i in dept_li) {
|
|
|
+ // dept_ += dept_li[i].dept_name + " ";
|
|
|
+ // }
|
|
|
+ // this.dept_list = dept_;
|
|
|
+ // } else {
|
|
|
+ // this.personnelDetails(); //获取人员详情
|
|
|
+ // }
|
|
|
+ if(this.$getUserData()){
|
|
|
+ this.personnel = this.$getUserData()
|
|
|
+ let dept_li = this.personnel.employee_detail.dept_list;
|
|
|
+ let dept_ = "";
|
|
|
+ for (let i in dept_li) {
|
|
|
+ dept_ += dept_li[i].dept_name + " ";
|
|
|
+ }
|
|
|
+ this.dept_list = dept_;
|
|
|
+ }else{
|
|
|
+ this.personnelDetails(); //获取人员详情
|
|
|
+ }
|
|
|
+ this.formData.month = this.$moment().format("YYYY-MM");
|
|
|
+ this.executiveFunction();
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ //获取员工列表
|
|
|
+ getEmployee() {
|
|
|
+ this.$axios('get','/api/employee/index', {dept_id: 0, keywords: '', page: 1, page_size: 2000 }).then(res => {
|
|
|
+ let list = res.data.data.list
|
|
|
+ this.employee_map = list
|
|
|
+ // for(let i in list){
|
|
|
+
|
|
|
+ // }
|
|
|
+ }).finally(err=>{
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ //echarts自适应
|
|
|
+ selfAdaption() {
|
|
|
+ var myChart1 = ECharts.init(this.$refs.monthlyIntegralChart);
|
|
|
+ var myChart2 = ECharts.init(this.$refs.IntegralFormChart);
|
|
|
+ // myChart.setOption(option);
|
|
|
+ myChart1.resize();
|
|
|
+ myChart2.resize();
|
|
|
+ },
|
|
|
+ //需要执行的所有函数
|
|
|
+ executiveFunction(item) {
|
|
|
+ //切换角色才请求--人员详情--。
|
|
|
+ if (item) {
|
|
|
+ this.personnelDetails(); //获取人员详情
|
|
|
+ this.authorityManagerHeader(); //本月 A B 绩效分 比例
|
|
|
+ this.integralForm(); //饼图
|
|
|
+ this.monthlyIntegral(); //本月积分情况
|
|
|
+ this.integralEvents(); //积分事件列表
|
|
|
+ } else {
|
|
|
+ this.authorityManagerHeader(); //本月 A B 绩效分 比例
|
|
|
+ this.integralForm(); //饼图
|
|
|
+ this.monthlyIntegral(); //本月积分情况
|
|
|
+ this.integralEvents(); //积分事件列表
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ //获取人员详情
|
|
|
+ personnelDetails() {
|
|
|
+ this.personnelMessage = true;
|
|
|
+ let params = {
|
|
|
+ id: this.formData.employee_id,
|
|
|
+ };
|
|
|
+ this.$axios("get", "/api/employee/info", params)
|
|
|
+ .then((res) => {
|
|
|
+ this.personnel = res.data.data;
|
|
|
+ let dept_li = this.personnel.employee_detail.dept_list;
|
|
|
+ let dept_ = "";
|
|
|
+ for (let i in dept_li) {
|
|
|
+ dept_ += dept_li[i].dept_name + " ";
|
|
|
+ }
|
|
|
+ this.dept_list = dept_;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ this.personnelMessage = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //本月 A B 绩效分 比例
|
|
|
+ authorityManagerHeader() {
|
|
|
+ this.authorityManagerHeaderLoad = true;
|
|
|
+ let params = {};
|
|
|
+ params.employee_id = this.formData.employee_id;
|
|
|
+ if (this.monthORyear == "2") {
|
|
|
+ //月
|
|
|
+ params.month = this.formData.month;
|
|
|
+ } else if (this.monthORyear == "3") {
|
|
|
+ //年
|
|
|
+ params.year = this.formData.year;
|
|
|
+ }
|
|
|
+ this.$axios("get", "/api/integral/statistics/", params, "v2")
|
|
|
+ .then((res) => {
|
|
|
+ if (res.data.code == 1) {
|
|
|
+ this.authorityManagerHeaders = res.data.data;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ this.authorityManagerHeaderLoad = 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 = "36%";
|
|
|
+ leftBT = "18%";
|
|
|
+ }
|
|
|
+ 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: "10%",
|
|
|
+ itemGap: 20,
|
|
|
+ textStyle: { fontSize: 14, color: "rgb(48, 49, 51)" },
|
|
|
+ data: legendData1,
|
|
|
+ },
|
|
|
+ //分为两列展示
|
|
|
+ {
|
|
|
+ type: "scroll",
|
|
|
+ orient: "vertical",
|
|
|
+ icon: "square",
|
|
|
+ left: "70%",
|
|
|
+ align: "left",
|
|
|
+ top: "10%",
|
|
|
+ itemGap: 20,
|
|
|
+ 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, "40%"],
|
|
|
+ roseType: "radius",
|
|
|
+ label: { show: false },
|
|
|
+ emphasis: { label: { show: false } },
|
|
|
+ data: dadalist,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+ myChart.setOption(option);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ integralForm() {
|
|
|
+ this.IntegralFormChartLoad = true;
|
|
|
+ let listslength = [];
|
|
|
+ let params = {};
|
|
|
+ params.employee_id = this.formData.employee_id;
|
|
|
+ if (this.monthORyear == "2") {
|
|
|
+ //月
|
|
|
+ params.month = this.formData.month;
|
|
|
+ } else if (this.monthORyear == "3") {
|
|
|
+ //年
|
|
|
+ params.year = this.formData.year;
|
|
|
+ }
|
|
|
+ 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(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;
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ //月度积分
|
|
|
+ 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,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ name: "总积分",
|
|
|
+ type: "line",
|
|
|
+ data: total,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "奖分",
|
|
|
+ type: "line",
|
|
|
+ data: reward,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "扣分",
|
|
|
+ type: "line",
|
|
|
+ data: deduction,
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+ myChart.setOption(option);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //月度积分
|
|
|
+ // monthlyIntegralchange(val){
|
|
|
+ // console.log(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.employee_id = this.formData.employee_id;
|
|
|
+ if (this.monthORyear == "2") {
|
|
|
+ //月
|
|
|
+ params.month = this.formData.month;
|
|
|
+ } else if (this.monthORyear == "3") {
|
|
|
+ //年
|
|
|
+ params.year = this.formData.year;
|
|
|
+ }
|
|
|
+ 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;
|
|
|
+ if (this.monthORyear == "2") {
|
|
|
+ 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;
|
|
|
+ } else if (this.monthORyear == "3") {
|
|
|
+ this.yearlyIntegralList[0].total_point = lists.total_point;
|
|
|
+ this.yearlyIntegralList[1].reward_point = lists.reward_point;
|
|
|
+ this.yearlyIntegralList[2].deduction_point =
|
|
|
+ lists.deduction_point;
|
|
|
+ this.yearlyIntegralList[3].ratio = lists.ratio;
|
|
|
+ this.yearlyIntegralList[4].toRatio = lists.contrast_total;
|
|
|
+ this.yearlyIntegralList[5].toRatio = lists.contrast_reward;
|
|
|
+ this.yearlyIntegralList[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) {
|
|
|
+ this.monthlyIntegralnone = true;
|
|
|
+ } else {
|
|
|
+ this.monthlyIntegralnone = false;
|
|
|
+ }
|
|
|
+ this.monthlyIntegralloading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ //积分事件列表
|
|
|
+ integralEvents() {
|
|
|
+ this.awardDeductRanking = true;
|
|
|
+ let params = {
|
|
|
+ page: 1,
|
|
|
+ page_size: 5,
|
|
|
+ pt_id: "3",
|
|
|
+ time_type: "2",
|
|
|
+ };
|
|
|
+ params.employee_id = this.formData.employee_id;
|
|
|
+ if (this.monthORyear == "2") {
|
|
|
+ //月
|
|
|
+ params.month = this.formData.month;
|
|
|
+ params.time_type = "2";
|
|
|
+ } else if (this.monthORyear == "3") {
|
|
|
+ //年
|
|
|
+ params.year = this.formData.year;
|
|
|
+ params.time_type = "3";
|
|
|
+ }
|
|
|
+ this.$axios(
|
|
|
+ "get",
|
|
|
+ "/api/integral/statistics/prize/buckle/ranking",
|
|
|
+ params
|
|
|
+ )
|
|
|
+ .then((res) => {
|
|
|
+ this.IntegralEventO = res.data.data.prize;
|
|
|
+ this.IntegralEventT = res.data.data.buckle;
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ this.awardDeductRanking = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ beforeDestroy() {//取消echarts自适应
|
|
|
+ window.removeEventListener("resize",this.selfAdaption);
|
|
|
+ },
|
|
|
};
|
|
|
</script>
|
|
|
+<style scoped="scoped" lang="scss">
|
|
|
+.el-table::before {
|
|
|
+ height: 0px;
|
|
|
+}
|
|
|
+
|
|
|
+.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 {
|
|
|
+ padding: 20px;
|
|
|
+ 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;
|
|
|
+ }
|
|
|
+}
|
|
|
+.rightexamineAndApproveList {
|
|
|
+ text-align: left;
|
|
|
+ width: 100%;
|
|
|
+ border-bottom: 1px solid #efefef;
|
|
|
+}
|
|
|
+.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("../../assets/image/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("../../assets/image/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;
|
|
|
+}
|
|
|
+
|
|
|
+.top_user_info {
|
|
|
+ position: relative;
|
|
|
+ padding-top: 0;
|
|
|
+ background: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.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: 4px 0px 0 120px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+.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;
|
|
|
+}
|
|
|
+
|
|
|
+.pointsevent_box {
|
|
|
+ display: block;
|
|
|
+ text-align: center;
|
|
|
+ margin: 20px 0 0 0px;
|
|
|
+ padding-right: 0 !important;
|
|
|
+ border: 1px #e1e4e7 solid;
|
|
|
+ box-shadow: 0 2px 4px rgba(140, 140, 140, 0.1);
|
|
|
+}
|
|
|
|
|
|
-<style scoped="scoped">
|
|
|
+.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;
|
|
|
+}
|
|
|
|
|
|
-</style>
|
|
|
+.popperSPBOX {
|
|
|
+ max-width: calc(100vh - 400px);
|
|
|
+ background-color: rgb(255, 255, 255);
|
|
|
+}
|
|
|
+</style>
|
哥哥玩剑魂呢