|
@@ -1,138 +1,142 @@
|
|
|
<template>
|
|
<template>
|
|
|
<view class="">
|
|
<view class="">
|
|
|
- <view class="tabs page-box-bg-fff r-30 m-t30"
|
|
|
|
|
- :style="[{position:is_fixed?'absolute':''}]" style="height: 100rpx;">
|
|
|
|
|
- <z-tabs ref="tabs" :list="tabsList" :active-style="{color:'#10B261',fontWeight:'bold',fontSize:'30rpx'}"
|
|
|
|
|
- :bar-style="{background:'#10B261'}" :inactive-style="{fontWeight:'bold',fontSize:'28rpx'}"
|
|
|
|
|
- :current="current" :bar-animate-mode="'worm'" @change="tabsChange" />
|
|
|
|
|
- </view>
|
|
|
|
|
- <!-- 顶部单行统计 -->
|
|
|
|
|
- <StatSingleData :genre="dateTypeObj.censusUserType" :total-money="moneyData.loanMoney" :total-num="moneyData.loanNum" ></StatSingleData>
|
|
|
|
|
|
|
+ <view class="tabs page-box-bg-fff r-30 m-t30" :style="[{position:is_fixed?'absolute':''}]"
|
|
|
|
|
+ style="height: 100rpx;">
|
|
|
|
|
+ <z-tabs ref="tabs" :list="tabsList" :active-style="{color:'#10B261',fontWeight:'bold',fontSize:'30rpx'}"
|
|
|
|
|
+ :bar-style="{background:'#10B261'}" :inactive-style="{fontWeight:'bold',fontSize:'28rpx'}"
|
|
|
|
|
+ :current="current" :bar-animate-mode="'worm'" @change="tabsChange" />
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <!-- 顶部单行统计 -->
|
|
|
|
|
+ <StatSingleData :genre="dateTypeObj.censusUserType" :total-money="moneyData.loanMoney"
|
|
|
|
|
+ :total-num="moneyData.loanNum"></StatSingleData>
|
|
|
<StatLoanChart ref="outObj" :genre="1" :leftText="'提放汇总占比'"></StatLoanChart>
|
|
<StatLoanChart ref="outObj" :genre="1" :leftText="'提放汇总占比'"></StatLoanChart>
|
|
|
- <stat_gather is_group :leftText="'提放汇总明细'" :out-list="outList" ></stat_gather>
|
|
|
|
|
- <StatRanking ref="rankingObj" :is_margin_top="false" :is_type="2" :leftText="'个人业绩排行'" :data-list="userList"></StatRanking>
|
|
|
|
|
- <StatSituation ref="situationObj" :date-type-obj="selectTypeObj" :type="1"></StatSituation>
|
|
|
|
|
|
|
+ <stat_gather is_group :leftText="'提放汇总明细'" :out-list="outList"></stat_gather>
|
|
|
|
|
+ <StatRanking ref="rankingObj" :is_type="2" :leftText="'个人业绩排行'" :data-list="userList"></StatRanking>
|
|
|
|
|
+ <StatSituation ref="situationObj" :date-type-obj="selectTypeObj" :type="1"></StatSituation>
|
|
|
</view>
|
|
</view>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
<script>
|
|
|
import StatLoanChart from "../module/stat_loan_chart.vue"
|
|
import StatLoanChart from "../module/stat_loan_chart.vue"
|
|
|
- import md5 from "js-md5";
|
|
|
|
|
- import {getRanking,getDepartmentMoney} from "@/api/statistics";
|
|
|
|
|
- import StatSituation from "@/pages/statistics/module/stat_situation.vue";
|
|
|
|
|
- import StatRanking from "@/pages/statistics/module/stat_ranking.vue";
|
|
|
|
|
- import Stat_gather from "@/pages/statistics/module/stat_gather.vue";
|
|
|
|
|
- import StatSingleData from "@/pages/statistics/module/stat_single_data.vue";
|
|
|
|
|
|
|
+ import md5 from "js-md5";
|
|
|
|
|
+ import {
|
|
|
|
|
+ getRanking,
|
|
|
|
|
+ getDepartmentMoney
|
|
|
|
|
+ } from "@/api/statistics";
|
|
|
|
|
+ import StatSituation from "@/pages/statistics/module/stat_situation.vue";
|
|
|
|
|
+ import StatRanking from "@/pages/statistics/module/stat_ranking.vue";
|
|
|
|
|
+ import Stat_gather from "@/pages/statistics/module/stat_gather.vue";
|
|
|
|
|
+ import StatSingleData from "@/pages/statistics/module/stat_single_data.vue";
|
|
|
|
|
|
|
|
export default {
|
|
export default {
|
|
|
- props:{
|
|
|
|
|
- 'dateTypeObj':{
|
|
|
|
|
- default:()=>{
|
|
|
|
|
- return {
|
|
|
|
|
- dateType:4,
|
|
|
|
|
- selectDate:'2023-02-25',
|
|
|
|
|
- money_type:1,
|
|
|
|
|
- censusUserType:0,
|
|
|
|
|
- product_id:5,
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
|
|
+ props: {
|
|
|
|
|
+ 'dateTypeObj': {
|
|
|
|
|
+ default: () => {
|
|
|
|
|
+ return {
|
|
|
|
|
+ dateType: 4,
|
|
|
|
|
+ selectDate: '2023-02-25',
|
|
|
|
|
+ money_type: 1,
|
|
|
|
|
+ censusUserType: 0,
|
|
|
|
|
+ product_id: 5,
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
components: {
|
|
components: {
|
|
|
- StatSingleData,
|
|
|
|
|
- Stat_gather,
|
|
|
|
|
- StatRanking,
|
|
|
|
|
- StatSituation,
|
|
|
|
|
|
|
+ StatSingleData,
|
|
|
|
|
+ Stat_gather,
|
|
|
|
|
+ StatRanking,
|
|
|
|
|
+ StatSituation,
|
|
|
StatLoanChart,
|
|
StatLoanChart,
|
|
|
},
|
|
},
|
|
|
data() {
|
|
data() {
|
|
|
return {
|
|
return {
|
|
|
- selectTypeObj:{
|
|
|
|
|
- dateType:4,
|
|
|
|
|
- selectDate:'2023-02-25',
|
|
|
|
|
- money_type:4,
|
|
|
|
|
- censusUserType:0,
|
|
|
|
|
- product_id:5,
|
|
|
|
|
- },
|
|
|
|
|
- tabsList: [{
|
|
|
|
|
- name: '汇总',
|
|
|
|
|
- dot_color: 'red',
|
|
|
|
|
- disabled: false
|
|
|
|
|
- }, {
|
|
|
|
|
- name: '银行',
|
|
|
|
|
- dot_color: 'yellow',
|
|
|
|
|
- disabled: false
|
|
|
|
|
- }],
|
|
|
|
|
- current: 0,
|
|
|
|
|
|
|
+ selectTypeObj: {
|
|
|
|
|
+ dateType: 4,
|
|
|
|
|
+ selectDate: '2023-02-25',
|
|
|
|
|
+ money_type: 4,
|
|
|
|
|
+ censusUserType: 0,
|
|
|
|
|
+ product_id: 5,
|
|
|
|
|
+ },
|
|
|
|
|
+ tabsList: [{
|
|
|
|
|
+ name: '汇总',
|
|
|
|
|
+ dot_color: 'red',
|
|
|
|
|
+ disabled: false
|
|
|
|
|
+ }, {
|
|
|
|
|
+ name: '银行',
|
|
|
|
|
+ dot_color: 'yellow',
|
|
|
|
|
+ disabled: false
|
|
|
|
|
+ }],
|
|
|
|
|
+ current: 0,
|
|
|
|
|
|
|
|
- userList:[],
|
|
|
|
|
- moneyData:{
|
|
|
|
|
- loanMoney: 0,
|
|
|
|
|
- loanNum: 0
|
|
|
|
|
- },
|
|
|
|
|
- outList:[]
|
|
|
|
|
|
|
+ userList: [],
|
|
|
|
|
+ moneyData: {
|
|
|
|
|
+ loanMoney: 0,
|
|
|
|
|
+ loanNum: 0
|
|
|
|
|
+ },
|
|
|
|
|
+ outList: []
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
- watch:{
|
|
|
|
|
- 'dateTypeObj':function () {
|
|
|
|
|
- this.initData()
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- mounted() {
|
|
|
|
|
- this.initData()
|
|
|
|
|
- },
|
|
|
|
|
- methods:{
|
|
|
|
|
- tabsChange(e) {
|
|
|
|
|
- if(e!==this.current){
|
|
|
|
|
- this.current = e
|
|
|
|
|
- this.selectTypeObj.money_type=this.current===0?5:4
|
|
|
|
|
- this.startData()
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- setSendMd5(){
|
|
|
|
|
- let str=JSON.stringify(this.dateTypeObj)
|
|
|
|
|
- return md5(str)
|
|
|
|
|
- },
|
|
|
|
|
- initData(){
|
|
|
|
|
- if(this.dateTypeObj.censusUserType>0){
|
|
|
|
|
- this.selectTypeObj=this.dateTypeObj
|
|
|
|
|
- this.selectTypeObj.money_type=5
|
|
|
|
|
- this.selectTypeObj.product_id=5
|
|
|
|
|
- let sendMd5=this.setSendMd5()
|
|
|
|
|
- if(sendMd5 !== this.sendMd5){
|
|
|
|
|
- this.sendMd5=sendMd5
|
|
|
|
|
- this.startData()
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- },
|
|
|
|
|
- startData(){
|
|
|
|
|
- this.getDepartmentMoney()
|
|
|
|
|
- this.setUserRanking()
|
|
|
|
|
- this.$refs.situationObj.startList()
|
|
|
|
|
- },
|
|
|
|
|
- setUserRanking(){
|
|
|
|
|
- let fromData = this.selectTypeObj
|
|
|
|
|
- fromData.pageNum = 5
|
|
|
|
|
- getRanking(fromData).then((res)=>{
|
|
|
|
|
- if(res.code === 1){
|
|
|
|
|
- this.userList = res.data.items
|
|
|
|
|
- this.$refs.rankingObj.setDataList(this.userList)
|
|
|
|
|
- }else{
|
|
|
|
|
- this.userList = []
|
|
|
|
|
- }
|
|
|
|
|
- })
|
|
|
|
|
- },
|
|
|
|
|
- getDepartmentMoney(){
|
|
|
|
|
- getDepartmentMoney(this.selectTypeObj).then((res)=>{
|
|
|
|
|
- if(res.code === 1){
|
|
|
|
|
- this.moneyData.loanMoney=res.data.moneyData.loanMoney
|
|
|
|
|
- this.moneyData.loanNum=res.data.moneyData.loanNum
|
|
|
|
|
- this.outList=res.data.items
|
|
|
|
|
- this.$refs.outObj.setPeakChartData(this.outList)
|
|
|
|
|
- }
|
|
|
|
|
- })
|
|
|
|
|
- },
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ watch: {
|
|
|
|
|
+ 'dateTypeObj': function() {
|
|
|
|
|
+ this.initData()
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ mounted() {
|
|
|
|
|
+ this.initData()
|
|
|
|
|
+ },
|
|
|
|
|
+ methods: {
|
|
|
|
|
+ tabsChange(e) {
|
|
|
|
|
+ if (e !== this.current) {
|
|
|
|
|
+ this.current = e
|
|
|
|
|
+ this.selectTypeObj.money_type = this.current === 0 ? 5 : 4
|
|
|
|
|
+ this.startData()
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ setSendMd5() {
|
|
|
|
|
+ let str = JSON.stringify(this.dateTypeObj)
|
|
|
|
|
+ return md5(str)
|
|
|
|
|
+ },
|
|
|
|
|
+ initData() {
|
|
|
|
|
+ if (this.dateTypeObj.censusUserType > 0) {
|
|
|
|
|
+ this.selectTypeObj = this.dateTypeObj
|
|
|
|
|
+ this.selectTypeObj.money_type = 5
|
|
|
|
|
+ this.selectTypeObj.product_id = 5
|
|
|
|
|
+ let sendMd5 = this.setSendMd5()
|
|
|
|
|
+ if (sendMd5 !== this.sendMd5) {
|
|
|
|
|
+ this.sendMd5 = sendMd5
|
|
|
|
|
+ this.startData()
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ startData() {
|
|
|
|
|
+ this.getDepartmentMoney()
|
|
|
|
|
+ this.setUserRanking()
|
|
|
|
|
+ this.$refs.situationObj.startList()
|
|
|
|
|
+ },
|
|
|
|
|
+ setUserRanking() {
|
|
|
|
|
+ let fromData = this.selectTypeObj
|
|
|
|
|
+ fromData.pageNum = 5
|
|
|
|
|
+ getRanking(fromData).then((res) => {
|
|
|
|
|
+ if (res.code === 1) {
|
|
|
|
|
+ this.userList = res.data.items
|
|
|
|
|
+ this.$refs.rankingObj.setDataList(this.userList)
|
|
|
|
|
+ } else {
|
|
|
|
|
+ this.userList = []
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+ },
|
|
|
|
|
+ getDepartmentMoney() {
|
|
|
|
|
+ getDepartmentMoney(this.selectTypeObj).then((res) => {
|
|
|
|
|
+ if (res.code === 1) {
|
|
|
|
|
+ this.moneyData.loanMoney = res.data.moneyData.loanMoney
|
|
|
|
|
+ this.moneyData.loanNum = res.data.moneyData.loanNum
|
|
|
|
|
+ this.outList = res.data.items
|
|
|
|
|
+ this.$refs.outObj.setPeakChartData(this.outList)
|
|
|
|
|
+ }
|
|
|
|
|
+ })
|
|
|
|
|
+ },
|
|
|
|
|
+ }
|
|
|
|
|
|
|
|
}
|
|
}
|
|
|
</script>
|
|
</script>
|