|
|
@@ -1,123 +1,129 @@
|
|
|
<template>
|
|
|
<div class="page-header-index-wide">
|
|
|
- <a-row :gutter="24">
|
|
|
- <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px', cursor: 'pointer' }" v-for="(item, index) in zhibiaoTotal" :key="index" @click="clickItemTotal(item, index)">
|
|
|
- <chart-card :loading="loading" :title="item.title+'(元) / 当月'" :total="item.monthTotal+''">
|
|
|
- <a-tooltip :title="`点击查看${item.title}明细`" slot="action">
|
|
|
- <a-icon type="info-circle-o" />
|
|
|
- </a-tooltip>
|
|
|
- <div>
|
|
|
- <trend flag="up" style="margin-right: 16px;">
|
|
|
- <span slot="term">月同比</span>
|
|
|
- {{Number(item.monthTb)*100}}%
|
|
|
- </trend>
|
|
|
- <trend flag="down">
|
|
|
- <span slot="term">月环比</span>
|
|
|
- {{Number(item.monthHb)*100}}%
|
|
|
- </trend>
|
|
|
- </div>
|
|
|
- <template slot="footer">年{{item.title}}<span> {{item.yearTotal}}0</span>
|
|
|
- <trend flag="up" style="float: right;">
|
|
|
- <span slot="term">同比</span>
|
|
|
- {{Number(item.yearTb)*100}}%
|
|
|
- </trend>
|
|
|
- </template>
|
|
|
- </chart-card>
|
|
|
- </a-col>
|
|
|
-
|
|
|
- </a-row>
|
|
|
+ <template v-if="pageRoleNum > 2">
|
|
|
+ <a-empty :description="false" style="height: 210px;margin-top: 200px;"/>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px', cursor: 'pointer' }" v-for="(item, index) in zhibiaoTotal" :key="index" @click="clickItemTotal(item, index)">
|
|
|
+ <chart-card :loading="loading" :title="item.title+'(元) / 当月'" :total="item.monthTotal+''">
|
|
|
+ <a-tooltip :title="`点击查看${item.title}明细`" slot="action">
|
|
|
+ <a-icon type="info-circle-o" />
|
|
|
+ </a-tooltip>
|
|
|
+ <div>
|
|
|
+ <trend flag="up" style="margin-right: 16px;">
|
|
|
+ <span slot="term">月同比</span>
|
|
|
+ {{(Number(item.monthTb)*100).toFixed(2)}}%
|
|
|
+ </trend>
|
|
|
+ <trend flag="down">
|
|
|
+ <span slot="term">月环比</span>
|
|
|
+ {{(Number(item.monthHb)*100).toFixed(2)}}%
|
|
|
+ </trend>
|
|
|
+ </div>
|
|
|
+ <template slot="footer">年{{item.title}}<span> {{item.yearTotal}}0</span>
|
|
|
+ <trend flag="up" style="float: right;">
|
|
|
+ <span slot="term">同比</span>
|
|
|
+ {{(Number(item.yearTb)*100).toFixed(2)}}%
|
|
|
+ </trend>
|
|
|
+ </template>
|
|
|
+ </chart-card>
|
|
|
+ </a-col>
|
|
|
+
|
|
|
+ </a-row>
|
|
|
|
|
|
- <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}">
|
|
|
- <div class="salesCard">
|
|
|
- <a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
|
|
|
- <div class="extra-wrapper" slot="tabBarExtraContent">
|
|
|
- <div class="extra-item">
|
|
|
- <a-button :type=searchTypeMonth @click="searchTypeChange('month')">按月查询</a-button>
|
|
|
- <a-button :type="searchTypeYear" @click="searchTypeChange('year')">按年查询</a-button>
|
|
|
+ <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}">
|
|
|
+ <div class="salesCard">
|
|
|
+ <a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
|
|
|
+ <div class="extra-wrapper" slot="tabBarExtraContent">
|
|
|
+ <div class="extra-item">
|
|
|
+ <a-button :type=searchTypeMonth @click="searchTypeChange('month')">按月查询</a-button>
|
|
|
+ <a-button :type="searchTypeYear" @click="searchTypeChange('year')">按年查询</a-button>
|
|
|
+ </div>
|
|
|
+ <!-- <a-range-picker :style="{width: '256px'}" /> -->
|
|
|
+ <a-range-picker
|
|
|
+ :placeholder="searchPlaceholder"
|
|
|
+ :format="searchFormat"
|
|
|
+ :mode="searchMode"
|
|
|
+ :value="dateValue"
|
|
|
+ @panelChange="handlePanelChange"
|
|
|
+ @openChange="handleChange"
|
|
|
+ >
|
|
|
+ <template slot="renderExtraFooter">
|
|
|
+ extra footer
|
|
|
+ </template>
|
|
|
+ </a-range-picker>
|
|
|
</div>
|
|
|
- <!-- <a-range-picker :style="{width: '256px'}" /> -->
|
|
|
- <a-range-picker
|
|
|
- :placeholder="searchPlaceholder"
|
|
|
- :format="searchFormat"
|
|
|
- :mode="searchMode"
|
|
|
- :value="dateValue"
|
|
|
- @panelChange="handlePanelChange"
|
|
|
- @openChange="handleChange"
|
|
|
- >
|
|
|
- <template slot="renderExtraFooter">
|
|
|
- extra footer
|
|
|
- </template>
|
|
|
- </a-range-picker>
|
|
|
- </div>
|
|
|
- <a-tab-pane loading="true" :tab="chartTitle+'图表'" key="1">
|
|
|
- <a-row>
|
|
|
- <a-col :xl="16" :lg="16" :md="16" :sm="24" :xs="24">
|
|
|
- <!-- <bar title="销售额排行" :dataSource="barData"/> -->
|
|
|
- <twoYAxisChart v-if="chooseValue === 'hte'" :xAxisData="twoYAxisXAxisData" :seriesData="twoYAxisSeriesData" :title="chartTitle"
|
|
|
- style="height: 360px;"
|
|
|
- class="line-timePrice common-layout"></twoYAxisChart>
|
|
|
- <lineBarChart v-else :xAxisData="lineBarXAxisData" :seriesData="lineBarSeriesData" :title="chartTitle"
|
|
|
- style="height: 360px;"
|
|
|
- class="line-timePrice common-layout"></lineBarChart>
|
|
|
- </a-col>
|
|
|
- <a-col :xl="8" :lg="8" :md="8" :sm="24" :xs="24">
|
|
|
- <rank-list title="详情" :list="rankList"/>
|
|
|
- <!-- <pieContentChart style="height: 360px;"></pieContentChart> -->
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- </a-tab-pane>
|
|
|
- <!-- <a-tab-pane tab="销售趋势" key="2">
|
|
|
- <a-row>
|
|
|
- <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
- <bar title="销售额趋势" :dataSource="barData"/>
|
|
|
- </a-col>
|
|
|
- <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
- <rank-list title="门店销售排行榜" :list="rankList"/>
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- </a-tab-pane> -->
|
|
|
- </a-tabs>
|
|
|
- </div>
|
|
|
- </a-card>
|
|
|
-
|
|
|
- <!-- <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}" :style="{ marginTop: '24px' }">
|
|
|
- <div class="salesCard">
|
|
|
- <a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
|
|
|
- <div class="extra-wrapper" slot="tabBarExtraContent">
|
|
|
- <div class="extra-item">
|
|
|
- <a>本月</a>
|
|
|
- <a>本季</a>
|
|
|
- <a>本年</a>
|
|
|
+ <a-tab-pane loading="true" :tab="chartTitle+'图表'" key="1">
|
|
|
+ <a-row>
|
|
|
+ <a-col :xl="16" :lg="16" :md="16" :sm="24" :xs="24">
|
|
|
+ <!-- <bar title="销售额排行" :dataSource="barData"/> -->
|
|
|
+ <twoYAxisChart v-if="chooseValue === 'hte'" :xAxisData="twoYAxisXAxisData" :seriesData="twoYAxisSeriesData" :title="chartTitle"
|
|
|
+ style="height: 360px;"
|
|
|
+ class="line-timePrice common-layout"></twoYAxisChart>
|
|
|
+ <lineBarChart v-else :xAxisData="lineBarXAxisData" :seriesData="lineBarSeriesData" :title="chartTitle"
|
|
|
+ style="height: 360px;"
|
|
|
+ class="line-timePrice common-layout"></lineBarChart>
|
|
|
+ </a-col>
|
|
|
+ <a-col :xl="8" :lg="8" :md="8" :sm="24" :xs="24">
|
|
|
+ <rank-list title="详情" :list="rankList"/>
|
|
|
+ <!-- <pieContentChart style="height: 360px;"></pieContentChart> -->
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-tab-pane>
|
|
|
+ <!-- <a-tab-pane tab="销售趋势" key="2">
|
|
|
+ <a-row>
|
|
|
+ <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
+ <bar title="销售额趋势" :dataSource="barData"/>
|
|
|
+ </a-col>
|
|
|
+ <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
+ <rank-list title="门店销售排行榜" :list="rankList"/>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-tab-pane> -->
|
|
|
+ </a-tabs>
|
|
|
+ </div>
|
|
|
+ </a-card>
|
|
|
+
|
|
|
+ <!-- <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}" :style="{ marginTop: '24px' }">
|
|
|
+ <div class="salesCard">
|
|
|
+ <a-tabs default-active-key="1" size="large" :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
|
|
|
+ <div class="extra-wrapper" slot="tabBarExtraContent">
|
|
|
+ <div class="extra-item">
|
|
|
+ <a>本月</a>
|
|
|
+ <a>本季</a>
|
|
|
+ <a>本年</a>
|
|
|
+ </div>
|
|
|
+ <a-range-picker :style="{width: '256px'}" />
|
|
|
</div>
|
|
|
- <a-range-picker :style="{width: '256px'}" />
|
|
|
- </div>
|
|
|
- <a-tab-pane loading="true" :tab="'部门'+chartTitle+'排行'" key="1">
|
|
|
- <a-row :gutter="24">
|
|
|
- <a-col :xl="6" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
- <rankingChart :title="chartTitle" :seriesData="rankingSeriesData" :yAxisNames="rankingYAxisNames" :yAxisNumbers="yAxisNumbers" style="height: 360px;"></rankingChart>
|
|
|
- </a-col>
|
|
|
- <a-col :xl="18" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
- <a-table
|
|
|
- ref="table"
|
|
|
- size="middle"
|
|
|
- :scroll="{x:true}"
|
|
|
- bordered
|
|
|
- rowKey="id"
|
|
|
- :columns="columns"
|
|
|
- :dataSource="dataSource"
|
|
|
- :pagination="ipagination"
|
|
|
- :loading="loading"
|
|
|
- class="j-table-force-nowrap"
|
|
|
- :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
|
|
- @change="handleTableChange"
|
|
|
- >
|
|
|
- </a-table>
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- </a-tab-pane>
|
|
|
- </a-tabs>
|
|
|
- </div>
|
|
|
- </a-card> -->
|
|
|
+ <a-tab-pane loading="true" :tab="'部门'+chartTitle+'排行'" key="1">
|
|
|
+ <a-row :gutter="24">
|
|
|
+ <a-col :xl="6" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
+ <rankingChart :title="chartTitle" :seriesData="rankingSeriesData" :yAxisNames="rankingYAxisNames" :yAxisNumbers="yAxisNumbers" style="height: 360px;"></rankingChart>
|
|
|
+ </a-col>
|
|
|
+ <a-col :xl="18" :lg="12" :md="12" :sm="24" :xs="24">
|
|
|
+ <a-table
|
|
|
+ ref="table"
|
|
|
+ size="middle"
|
|
|
+ :scroll="{x:true}"
|
|
|
+ bordered
|
|
|
+ rowKey="id"
|
|
|
+ :columns="columns"
|
|
|
+ :dataSource="dataSource"
|
|
|
+ :pagination="ipagination"
|
|
|
+ :loading="loading"
|
|
|
+ class="j-table-force-nowrap"
|
|
|
+ :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
|
|
|
+ @change="handleTableChange"
|
|
|
+ >
|
|
|
+ </a-table>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ </a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
+ </div>
|
|
|
+ </a-card> -->
|
|
|
+ </template>
|
|
|
+
|
|
|
|
|
|
|
|
|
</div>
|
|
|
@@ -164,6 +170,7 @@
|
|
|
loginfo:{},
|
|
|
visitInfo:[],
|
|
|
|
|
|
+ pageRoleNum: 0,
|
|
|
// 顶部n项指标
|
|
|
zhibiaoTotal: [
|
|
|
// {
|
|
|
@@ -300,11 +307,17 @@
|
|
|
getZhibiaoCollect().then(res => {
|
|
|
console.log(res)
|
|
|
if (res.success) {
|
|
|
+ if(res.result.auth >2){
|
|
|
+ // 0:所领导，1：部门领导，2：员工；3：未赋值或选了多个前面所说角色
|
|
|
+ // 如果是管理员，默认显示所领导的
|
|
|
+ this.pageRoleNum = res.result.auth
|
|
|
+ return
|
|
|
+ }
|
|
|
var arr = []
|
|
|
for (let i = 0; i < this.zhibiaoTotal.length; i++) {
|
|
|
const element = this.zhibiaoTotal[i];
|
|
|
// element.data = res.result[element.hdValue]
|
|
|
- arr[i] = {...element, ...res.result[element.hdValue]}
|
|
|
+ arr[i] = {...element, ...res.result.data[element.hdValue]}
|
|
|
}
|
|
|
this.zhibiaoTotal = arr
|
|
|
this.loading = false
|
yuhan