Commit f41751ec authored by godwithdh's avatar godwithdh

员工分析

parent e1ee5b93
......@@ -356,7 +356,7 @@ let tipRoutes = [
name:"receive",
component:()=>import("@/view/tiip/receive/index.vue"),
meta:{
title:"收发存"
title:"收发存报表"
}
},
{
......@@ -372,7 +372,7 @@ let tipRoutes = [
name:"receive_varieties_detail",
component:()=>import("@/view/tiip/receive/varietiesDetail.vue"),
meta:{
title:"接单详情"
title:"收发存明细"
}
},
]
......
<style lang="less">
@import url("../../../styles/common.less");
#empAna{
background:#dce9fe;
// background:#dce9fe;
>.CONTENT{
.iCard{
height:260px;
......@@ -29,7 +29,7 @@
</style>
<template>
<div id="empAna">
<div class="HEADER">
<div class="head">
<dateMonth @month="searchData" />
</div>
<div class="CONTENT">
......
......@@ -127,14 +127,22 @@
</swiper>
</div>
<div class="TAB">
<button-tab class="buttonTab" :value="activeBtn" >
<tab v-model="activeBtn">
<tab-item @on-item-click="situation='salesStatistics'">销售统计</tab-item>
<tab-item @on-item-click="situation='empAna'">员工分析</tab-item>
<tab-item @on-item-click="situation='revenue'">收支分析</tab-item>
<tab-item @on-item-click="situation='liabilities'">负债分析</tab-item>
<tab-item @on-item-click="situation='repayment'">回款额</tab-item>
<tab-item @on-item-click="situation='cost'">费用分析</tab-item>
</tab>
<!-- <button-tab class="buttonTab" :value="activeBtn" >
<button-tab-item @on-item-click="situation='salesStatistics'">销售统计</button-tab-item>
<!-- <button-tab-item @on-item-click="situation='empAna'">员工排行</button-tab-item> -->
<button-tab-item @on-item-click="situation='empAna'">员工分析</button-tab-item>
<button-tab-item @on-item-click="situation='revenue'">收支分析</button-tab-item>
<button-tab-item @on-item-click="situation='liabilities'">负债分析</button-tab-item>
<button-tab-item @on-item-click="situation='repayment'">回款额</button-tab-item>
<button-tab-item @on-item-click="situation='cost'">费用分析</button-tab-item>
</button-tab>
</button-tab> -->
</div>
<div class="content">
<component :is="situation" />
......@@ -144,7 +152,8 @@
<script>
import Util from '@/libs/util.js';
import {mapState} from 'vuex';
import {Swiper,SwiperItem,ButtonTab, ButtonTabItem } from 'vux';
import {Swiper,SwiperItem,Tab, TabItem } from 'vux';
import salesStatistics from "./salesStatistics"
import empAna from "./empAna"
import revenue from "./revenue"
......@@ -153,7 +162,7 @@ import cost from "./cost"
import liabilities from "./liabilities"
export default {
name:"IntReportForms",
components:{Swiper,SwiperItem,ButtonTab, ButtonTabItem,salesStatistics,empAna,revenue,repayment,cost,liabilities},
components:{Swiper,SwiperItem,Tab, TabItem,salesStatistics,empAna,revenue,repayment,cost,liabilities},
data(){
return{
list:[],
......@@ -161,13 +170,11 @@ export default {
situation:"salesStatistics",
}
},
created(){
this.$store.dispatch('saveUserId',this.$route.params.userId);
},
computed:{
},
mounted(){
this.$store.dispatch('saveUserId',this.$route.params.userId);
this.$nextTick(()=>{
this.init()
})
......
......@@ -88,7 +88,8 @@
</div>
<div class="HEADER iCard">
<span style="color:#777;margin-right:10rpx;">总负债额</span>
<span style="color:#777;margin-right:10rpx;" v-if="activeIndex=='客户'">总映山红额</span>
<span style="color:#777;margin-right:10rpx;" v-else>总欠款额</span>
<div :style="{'width':rate+'%','background':color}"></div>
<span class="number">{{total}}</span>
</div>
......
......@@ -46,7 +46,7 @@ export default {
},
}
},
mounted(){
activated(){
this.$nextTick(()=>{
this.getDetail();
})
......
......@@ -61,7 +61,7 @@
</style>
<template>
<div id="statistics">
<dateMonth @month="searchData" />
<dateMonth @month="searchData"/>
<div class="Content">
<div class='double'>
<div class="card">
......@@ -90,15 +90,25 @@
</div>
</div>
<div class="card">
<div class="head">产品颜色销售排行</div>
<div class="head">客户销售额排行</div>
<div ref='chart5' :style="{width:'100%',height:'230px',opacity:chartData.set5.length>0?'1':'0'}" />
<img v-if="chartData.set5.length==0" src="@/assets/noData.jpg" class="imgBC" />
</div>
<div class="card">
<div class="head">产品销售排行</div>
<div class="head">货品销售额排行</div>
<div ref='chart6' :style="{width:'100%',height:'230px',opacity:chartData.set6.length>0?'1':'0'}" />
<img v-if="chartData.set6.length==0" src="@/assets/noData.jpg" class="imgBC" />
</div>
<div class="card">
<div class="head">产品颜色排行</div>
<div ref="chart7" :style="{width:'100%',height:'230px',opacity:chartData.set7.length>0?'1':'0'}"/>
<img v-if="chartData.set7.length==0" src="@/assets/noData.jpg" class="imgBC" />
</div>
<div class="card">
<div class="head">产品类别排行</div>
<div ref="chart8" :style="{width:'100%',height:'230px',opacity:chartData.set8.length>0?'1':'0'}"/>
<img v-if="chartData.set8.length==0" src="@/assets/noData.jpg" class="imgBC" />
</div>
</div>
</div>
......@@ -116,10 +126,6 @@ export default {
components:{dateMonth},
data(){
return{
// search:{
// dBeginDate:Util.dateFormat(new Date(),'yyyy-MM-01'),
// dEndDate:Util.dateFormat(new Date(),'yyyy-MM-dd'),
// },
chartData:{
nOrderSameRatio:0,
nOrderRingRatio:0,
......@@ -130,12 +136,16 @@ export default {
},
set5:[],
set6:[],
set7:[],
set8:[],
},
chart1:null,
chart2:null,
chart3:null,
chart5:null,
chart6:null,
chart7:null,
chart8:null,
}
},
created(){
......@@ -148,6 +158,8 @@ export default {
this.resize(this.chart3,1.15)
this.resize(this.chart5,1.35)
this.resize(this.chart6,1.35)
this.resize(this.chart7,1.35)
this.resize(this.chart8,1.35)
})
},
mounted(){
......@@ -156,6 +168,8 @@ export default {
this.createChart('chart1')
this.createChart('chart2')
this.createChart('chart3')
this.createChart('chart7')
this.createChart('chart8')
this.createChart('chart5','set5',true)
this.createChart('chart6','set6',true)
window.addEventListener('resize',()=>{
......@@ -165,6 +179,8 @@ export default {
this.resize(this.chart3,1.15)
this.resize(this.chart5,1.35)
this.resize(this.chart6,1.35)
this.resize(this.chart7,1.35)
this.resize(this.chart8,1.35)
})
})
// this.$nextTick(()=>{
......@@ -240,8 +256,10 @@ export default {
nOrderSameRatio:Math.round((value.set1&&value.set1[0]&&value.set1[0].nOrderSameRatio||0)*100)/100,
nOrderRingRatio:Math.round((value.set2&&value.set2[0]&&value.set2[0].nOrderRingRatio||0)*100)/100,
set3:typeof value.set3=='object'&&value.set3.length>0&&value.set3.map(v=>{
v.value=Math.round(v.nAmount/100)/100
return v
return {
value:Math.round(v.nAmount/100)/100,
name:v.sYearMonth
}
})||[],
set4:{
iSellCount:value.set4&&value.set4[0]&&value.set4[0].iSellCount||0,
......@@ -259,6 +277,20 @@ export default {
value:v.nAmount
}
})||[],
set7:typeof value.set7=='object'&&value.set6.length>0&&value.set7.map(v=>{
return{
number:Math.round(v.nQty/100)/100,
value:Math.round(v.nAmount/100)/100,
name:v.sSampleMaterialName,
}
})||[],
set8:typeof value.set8=='object'&&value.set6.length>0&&value.set8.map(v=>{
return{
number:Math.round(v.nQty/100)/100,
value:Math.round(v.nAmount/100)/100,
name:v.sMaterialTypeName
}
})||[]
})
},
......@@ -273,16 +305,27 @@ export default {
})
this.drawLing({
e:this.chart3,
value:this.chartData.set3
value:this.chartData.set3,
height:130,
})
this.drawLing2({
this.drawBar({
e:this.chart5,
value:this.chartData.set5
})
this.drawLing2({
this.drawBar({
e:this.chart6,
value:this.chartData.set6
})
this.drawLing2({
e:this.chart7,
value:this.chartData.set7,
height:170,
})
this.drawLing2({
e:this.chart8,
value:this.chartData.set8,
height:170,
})
},
drawRing(data){//仪表盘
data.e.setOption({
......@@ -346,12 +389,12 @@ export default {
},
grid: {
top:30,
height:130,
height:data.height,
right:10,
},
xAxis: {
type:"category",
data:data.value.map(v=>v.sYearMonth),
data:data.value.map(v=>v.name),
axisPointer:{
type:"shadow"
},
......@@ -359,7 +402,8 @@ export default {
alignWithLabel: true
},
axisLabel: {
interval:0
interval:0,
rotate:-15,
},
minInterval:10,
},
......@@ -398,7 +442,110 @@ export default {
]
})
},
drawLing2(data){
drawLing2(data){//双折线
data.e.setOption({
tooltip:{
trigger:"axis",
axisPointer:{
type:"cross",
// crossStyle:{ color:"#111" }
},
formatter:"{b}<br/>金额: {c0}<br />数量: {c1}",
},
grid:{
top:30,
height:data.height,
right:15,
},
xAxis:{
type:"category",
data:data.value.map(v=>v.name),
axisPointer:{ type:"shadow" },
axisTick:{ alignWithLabel:true },
axisLabel:{
interval:0,
rotate:-15,
},
minInterval:10,
},
yAxis:[
{
type:'value',
name:"金额(万)",
offset:-10,
axisLine: {
lineStyle: {
color: "#708bf6",
}
},
},
{
type:'value',
name:"数量(万)",
offset:-10,
nameTextStyle:{
color:"#0F9048",
},
axisLine: {
lineStyle: {
color: "#0F9048",
}
},
},
],
dataZoom:[{
type: 'inside',
xAxisIndex: 0,
show: false, //flase直接隐藏图形
filterMode: 'empty',
start: 0,//滚动条的起始位置
end: (window.innerWidth*1.15)/data.value.length //滚动条的截止位置(按比例分割你的柱状图x轴长度)
}],
series:[
{
id:"a",
type:"line",
smooth:true,
symbolSize:10,
data:data.value.map(v=>v.value),
label:{
fontSize:9,
show:true,
formatter:val=>`${val.data}万`
},
lineStyle: {
width: 1,
color:"#A6B7FA",
},
itemStyle:{
normal:{ color:"#708bf6" }
},
},
{
id:"b",
type:"line",
smooth:true,
symbolSize:2,
yAxisIndex: 1,
data:data.value.map(v=>v.number),
label:{
fontSize:9,
show:true,
formatter:val=>`${val.data}万`
},
lineStyle: {
width: 1,
type :'dashed',
color:"#72BE94",
},
itemStyle:{
normal:{ color:"#0F9048" }
},
},
],
})
},
drawBar(data){
data.e.setOption({
color:['#5cadff','#1c2438'],
tooltip: {
......
......@@ -12,6 +12,7 @@
display: block;
height: 200px;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
height: calc(100vh - 160px);
>div{
background: #fff;
......@@ -159,6 +160,7 @@ export default {
}
},
created(){
this.$store.dispatch('saveUserId',this.$route.params.userId);
this.init();
this.global.$off('searchData');
......
......@@ -11,6 +11,7 @@
display: block;
height: 200px;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
height: calc(100vh - 160px);
>tr{
height:30px;
......
......@@ -12,27 +12,37 @@
display: block;
height: 200px;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
height: calc(100vh - 160px);
>tr{
height:30px;
&.user{
background:#fff;
>td{
color:#5E9AFE;
text-align: left;
padding-left:20px;
>div{
background: #fff;
border-radius: 5px;
margin: 5px;
box-shadow: 0 1px 3px #bababa;
overflow: hidden;
>tr{
&.user{
background:#fff;
>td{
color:#5E9AFE;
text-align: left;
padding: 6px 15px;
}
}
}
&.addr{
>td{
color:#068FCA;
text-align: left;
padding-left:20px;
&.addr{
background:#eef4fe;
>td{
color:#068FCA;
text-align: left;
padding-left:20px;
}
}
&.num{
background:#fff;
>td{
padding:4px 0;
}
}
}
&.num{
height:35px;
background:#fff;
}
}
}
......@@ -65,52 +75,53 @@
</thead>
<tbody>
<template v-for="(v,k) in list">
<tr class="user" :key="k+'_user'">
<td @click="toDetail(v.sProviderName)" style="text-decoration: underline;">{{v.sProviderName}}</td>
<td/>
<td/>
</tr>
<tr class="addr" :key="k+'_addr1'">
<td colspan="5">期初库存</td>
</tr>
<tr class="num" :key="k+'_num1'">
<td></td>
<td>{{v.nOldPieceQty||0}}</td>
<td style="color:#64B18B;">{{v.nOldLengthM||0}}</td>
<td style="color:#64B18B;">{{v.nOldLengthYD||0}}</td>
<td>{{v.nOldWeight||0}}</td>
</tr>
<tr class="addr" :key="k+'_addr2'">
<td colspan="5">本期入库</td>
</tr>
<tr class="num" :key="k+'_num2'">
<td></td>
<td>{{v.nInPieceQty||0}}</td>
<td style="color:#64B18B;">{{v.nInLengthM||0}}</td>
<td style="color:#64B18B;">{{v.nInLengthYD||0}}</td>
<td>{{v.nInWeight||0}}</td>
</tr>
<tr class="addr" :key="k+'_addr3'">
<td colspan="5">本期出库</td>
</tr>
<tr class="num" :key="k+'_num3'">
<td></td>
<td>{{v.nOutPieceQty||0}}</td>
<td style="color:#64B18B;">{{v.nOutLengthM||0}}</td>
<td style="color:#64B18B;">{{v.nOutLengthYD||0}}</td>
<td>{{v.nOutWeight||0}}</td>
</tr>
<tr class="addr" :key="k+'_addr4'">
<td colspan="5">本期库存</td>
</tr>
<tr class="num" :key="k+'_num4'">
<td></td>
<td>{{v.nStockPieceQty||0}}</td>
<td style="color:#64B18B;">{{v.nStockLengthM||0}}</td>
<td style="color:#64B18B;">{{v.nStockLengthYD||0}}</td>
<td>{{v.nStockWeight||0}}</td>
</tr>
<tr :key="k+'_5'" style="height:10px;background:transparent;"/>
<div :key="k">
<tr class="user" :key="k+'_user'">
<td @click="toDetail(v.sProviderName)" style="text-decoration: underline;">{{v.sProviderName}}</td>
<td/>
<td/>
</tr>
<tr class="addr" :key="k+'_addr1'">
<td colspan="5">期初库存</td>
</tr>
<tr class="num" :key="k+'_num1'">
<td></td>
<td>{{v.nOldPieceQty||0}}</td>
<td style="color:#64B18B;">{{v.nOldLengthM||0}}</td>
<td style="color:#64B18B;">{{v.nOldLengthYD||0}}</td>
<td>{{v.nOldWeight||0}}</td>
</tr>
<tr class="addr" :key="k+'_addr2'">
<td colspan="5">本期入库</td>
</tr>
<tr class="num" :key="k+'_num2'">
<td></td>
<td>{{v.nInPieceQty||0}}</td>
<td style="color:#64B18B;">{{v.nInLengthM||0}}</td>
<td style="color:#64B18B;">{{v.nInLengthYD||0}}</td>
<td>{{v.nInWeight||0}}</td>
</tr>
<tr class="addr" :key="k+'_addr3'">
<td colspan="5">本期出库</td>
</tr>
<tr class="num" :key="k+'_num3'">
<td></td>
<td>{{v.nOutPieceQty||0}}</td>
<td style="color:#64B18B;">{{v.nOutLengthM||0}}</td>
<td style="color:#64B18B;">{{v.nOutLengthYD||0}}</td>
<td>{{v.nOutWeight||0}}</td>
</tr>
<tr class="addr" :key="k+'_addr4'">
<td colspan="5">本期库存</td>
</tr>
<tr class="num" :key="k+'_num4'">
<td></td>
<td>{{v.nStockPieceQty||0}}</td>
<td style="color:#64B18B;">{{v.nStockLengthM||0}}</td>
<td style="color:#64B18B;">{{v.nStockLengthYD||0}}</td>
<td>{{v.nStockWeight||0}}</td>
</tr>
</div>
</template>
</tbody>
</table>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment