Commit be7d970c authored by 黄媛媛's avatar 黄媛媛

统计

parent 39edeee3
......@@ -121,12 +121,13 @@
<div style="height: 100%;" class="sjsm">
<div v-for="(item, index) in orders" :key="index">
<div class="left">
<img v-if="item.StudentType === 1" src="../../assets/img/tongji/zaidu.png" alt="">
<img v-if="item.StudentType === 2" src="../../assets/img/tongji/biye.png" alt="">
<span class="font-size-12">{{item.StudentTypeName}}</span>
<img v-if="index==0" src="../../assets/img/tongji/in1.png" alt="">
<img v-if="index==1" src="../../assets/img/tongji/in2.png" alt="">
<img v-if="index==2" src="../../assets/img/tongji/in3.png" alt="">
<span class="font-size-12">{{item.ZiChanTypeName}}</span>
</div>
<div class="right">
<p>累计报名<span class="hight-font">{{item.StudentCount}}</span>人,关联购物金额<span class="hight-font">{{item.TotalMoney}}</span>万,报名均价为<span class="hight-font">{{item.Unit_Price}}</span></p>
<p>累计报名<span class="hight-font">{{item.OrderCount}}</span>人,关联购物金额<span class="hight-font">{{item.ShopMoney}}</span>万,报名均价为<span class="hight-font">{{item.Unit_Price}}</span></p>
<p>最喜爱产品<span class="hight-font">{{item.LtName}}</span></p>
</div>
</div>
......@@ -146,7 +147,7 @@
</el-row>
</div>
<div class="situ">
<div class="c">根据对客户年学历的统计可以,更好的了解不同学历段客人的喜好,消费能力的判读,从而快速的推荐团队给客人等等等</div>
<div class="c">根据对资产的统计可以,更好的了解不同资产客人的喜好,消费能力的判读,从而快速的推荐团队给客人等等等</div>
<div class="bot" @click="drawer = true">
查看更多,参与讨论(1)
<i class="el-icon-d-arrow-right"></i>
......@@ -195,16 +196,18 @@ export default {
methods: {
GetSexOrderList(){
this.loading = true
this.apipost("/api/Statistic/GetStudentShopList", {}, res => {
this.apipost("/api/Statistic/GetZiChanOrderOrderList", {}, res => {
// this.SexOrder = res.data.data
let contShop = res.data.data[0].TotalMoney + res.data.data[1].TotalMoney+ res.data.data[2].TotalMoney,
zai = res.data.data[0].TotalMoney,
bi = res.data.data[1].TotalMoney,
ot = res.data.data[2].TotalMoney,
contNum = res.data.data[0].StudentCount + res.data.data[1].StudentCount+ res.data.data[2].StudentCount,
zaiN = res.data.data[0].StudentCount,
biN = res.data.data[1].StudentCount,
otN = res.data.data[2].StudentCount;
this.loading = false
console.log("res.data.data",res.data.data)
let contShop = res.data.data[0].ShopMoney + res.data.data[1].ShopMoney+ res.data.data[2].ShopMoney,
zai = res.data.data[0].ShopMoney,
bi = res.data.data[1].ShopMoney,
ot = res.data.data[2].ShopMoney,
contNum = res.data.data[0].OrderCount + res.data.data[1].OrderCount+ res.data.data[2].OrderCount,
zaiN = res.data.data[0].OrderCount,
biN = res.data.data[1].OrderCount,
otN = res.data.data[2].OrderCount;
let chartData = [], shopChartData = [];
chartData.push(
((zaiN/contNum)*100).toFixed(2)
......@@ -239,20 +242,11 @@ export default {
this.chartData = chartData
this.shopChartData = shopChartData
this.orders=res.data.data;
this.getOrders()
// console.log("this.orders",this.orders)
});
},
getOrders(){
this.apipost("/api/Statistic/GetStudentOrderList", {}, res => {
console.log(res)
res.data.data.forEach(x => {
this.orders[x.NewStudentType - 1].LtName = x.LtName;
this.orders[x.NewStudentType - 1].Unit_Price = x.Unit_Price;
});
this.loading = false
});
}
}
}
</script>
\ No newline at end of file
......@@ -114,14 +114,17 @@
<span>数据说明</span>
</div>
<div class="sjsm">
<div v-for="(item, index) in 9" :key="index">
<div v-for="(item, index) in orders" :key="index">
<div class="left">
<img v-if="item.Sex === 1" src="../../assets/img/tongji/man1.png" alt="">
<img v-else src="../../assets/img/tongji/woman1.png" alt="">
<span class="font-size-12">{{item.SexStr}}</span>
<img v-if="index==0" src="../../assets/img/tongji/qinzhi.png" alt="">
<img v-if="index==1" src="../../assets/img/tongji/miyue.png" alt="">
<img v-if="index==2" src="../../assets/img/tongji/in3.png" alt="">
<img v-if="index==3" src="../../assets/img/tongji/d1.png" alt="">
<img v-if="index==4" src="../../assets/img/tongji/hanjia.png" alt="">
<span class="font-size-12">{{item.DutyTypeName}}</span>
</div>
<div class="right">
<p>累计报名<span class="hight-font">{{item.SexCount}}</span>人,关联购物金额<span class="hight-font">{{item.ShopMoney}}</span>万,报名均价为<span class="hight-font">{{item.Unit_Price}}</span></p>
<p>累计报名<span class="hight-font">{{item.OrderCount}}</span>人,关联购物金额<span class="hight-font">{{item.ShopMoney}}</span>万,报名均价为<span class="hight-font">{{item.Unit_Price}}</span></p>
<p>最喜爱产品<span class="hight-font">{{item.LtName}}</span></p>
</div>
</div>
......@@ -172,43 +175,78 @@ export default {
},
data() {
return {
orders:[],
discussID: 0,
drawer: false,
chartData: [50, 30, 20, 10, 60, 30],
chartData: [],
shopChartData: [],
SexOrder: [],
loading: false,
strArr: ['教育', '服务', '科研', '农业', '管理', '娱乐']
strArr: ['娱乐', '教育', '服务']
};
},watch:{
},
mounted() {
// this.GetSexOrderList()
this.GetSexOrderList()
},
methods: {
GetSexOrderList(){
this.loading = true
this.apipost("/api/Statistic/GetSexOrderList", {}, res => {
this.SexOrder = res.data.data
let contShop = res.data.data[0].ShopMoney + res.data.data[1].ShopMoney, man = res.data.data[0].ShopMoney, woman = res.data.data[1].ShopMoney,
contNum = res.data.data[0].SexCount + res.data.data[1].SexCount, manN = res.data.data[0].SexCount, womanN = res.data.data[1].SexCount;
this.apipost("/api/Statistic/GetDutyTypeOrderList", {}, res => {
console.log("fdff",res)
this.strArr=[];
let data=res.data.data;
data.forEach(item=>{
this.strArr.push(item.DutyTypeName)
})
this.loading = false
let contShop = res.data.data[0].ShopMoney + res.data.data[1].ShopMoney+ res.data.data[2].ShopMoney,
one = res.data.data[0].ShopMoney,
two = res.data.data[1].ShopMoney,
three = res.data.data[2].ShopMoney,
contNum = res.data.data[0].OrderCount + res.data.data[1].OrderCount+ res.data.data[2].OrderCount,
zaiN = res.data.data[0].OrderCount,
twoN = res.data.data[1].OrderCount,
threeN = res.data.data[2].OrderCount;
let chartData = [], shopChartData = [];
chartData.push(
((manN/contNum)*100).toFixed(2)
((zaiN/contNum)*100).toFixed(2)
)
chartData.push(
((twoN/contNum)*100).toFixed(2)
)
chartData.push(
((womanN/contNum)*100).toFixed(2)
((threeN/contNum)*100).toFixed(2)
)
shopChartData.push(
Number(((man/contShop)*100).toFixed(0))
{
num: Number(((one/contShop)*100).toFixed(2)),
color: "#0D2481",
text: '娱乐'
}
)
shopChartData.push(
Number(((woman/contShop)*100).toFixed(0))
{
num: Number(((two/contShop)*100).toFixed(2)),
color: "#FFA475",
text: '教育'
}
)
shopChartData.push(
{
num: Number(((three/contShop)*100).toFixed(2)),
color: "#999",
text: '服务'
}
)
this.chartData = chartData
this.shopChartData = shopChartData
this.loading = false
this.orders=res.data.data;
console.log("this.chartData",this.chartData)
});
}
}
......
......@@ -125,54 +125,18 @@
<span>数据说明</span>
</div>
<div class="sjsm">
<div>
<div v-for="(item, index) in orders" :key="index">
<div class="left">
<img src="../../assets/img/tongji/qinzhi.png" alt="">
<p>{{strArr[0]}}</p>
<img v-if="index==0" src="../../assets/img/tongji/qinzhi.png" alt="">
<img v-if="index==1" src="../../assets/img/tongji/miyue.png" alt="">
<img v-if="index==2" src="../../assets/img/tongji/in3.png" alt="">
<img v-if="index==3" src="../../assets/img/tongji/d1.png" alt="">
<img v-if="index==4" src="../../assets/img/tongji/hanjia.png" alt="">
<span class="font-size-12">{{item.TravelTypeName}}</span>
</div>
<div class="right">
<p>累计报名<span class="hight-font">6800</span>人,关联购物金额<span class="hight-font">57952.67</span>万,报名均价为<span class="hight-font">8152.69</span></p>
<p>最喜爱产品<span class="hight-font">《椿山庄假期》</span></p>
</div>
</div>
<div>
<div class="left">
<img src='../../assets/img/tongji/miyue.png' alt="">
<p>{{strArr[1]}}</p>
</div>
<div class="right">
<p>累计报名<span class="hight-font">6800</span>人,关联购物金额<span class="hight-font">57952.67</span>万,报名均价为<span class="hight-font">8152.69</span></p>
<p>最喜爱产品<span class="hight-font">《椿山庄假期》</span></p>
</div>
</div>
<div>
<div class="left">
<img src='../../assets/img/tongji/xiyang.png' alt="">
<p>{{strArr[2]}}</p>
</div>
<div class="right">
<p>累计报名<span class="hight-font">6800</span>人,关联购物金额<span class="hight-font">57952.67</span>万,报名均价为<span class="hight-font">8152.69</span></p>
<p>最喜爱产品<span class="hight-font">《椿山庄假期》</span></p>
</div>
</div>
<div>
<div class="left">
<img src="../../assets/img/tongji/shujia.png" alt="">
<p>{{strArr[3]}}</p>
</div>
<div class="right">
<p>累计报名<span class="hight-font">6800</span>人,关联购物金额<span class="hight-font">57952.67</span>万,报名均价为<span class="hight-font">8152.69</span></p>
<p>最喜爱产品<span class="hight-font">《椿山庄假期》</span></p>
</div>
</div>
<div>
<div class="left">
<img src='../../assets/img/tongji/hanjia.png' alt="">
<p>{{strArr[4]}}</p>
</div>
<div class="right">
<p>累计报名<span class="hight-font">6800</span>人,关联购物金额<span class="hight-font">57952.67</span>万,报名均价为<span class="hight-font">8152.69</span></p>
<p>最喜爱产品<span class="hight-font">《椿山庄假期》</span></p>
<p>累计报名<span class="hight-font">{{item.TravelCount}}</span>人,关联购物金额<span class="hight-font">{{item.TotalMoney}}</span>万,报名均价为<span class="hight-font">{{item.Unit_Price}}</span></p>
<p>最喜爱产品<span class="hight-font">{{item.LtName}}</span></p>
</div>
</div>
</div>
......@@ -191,7 +155,7 @@
</el-row>
</div>
<div class="situ">
<div class="c">根据对客户年龄段的统计可以,更好的了解不同年龄段客人的喜好,消费能力的判读,从而快速的推荐团队给客人等等等</div>
<div class="c">根据对出游类型的统计可以,更好的了解不同出游类型客人的喜好,消费能力的判读,从而快速的推荐团队给客人等等等</div>
<div class="bot" @click="drawer = true">
查看更多,参与讨论(1)
<i class="el-icon-d-arrow-right"></i>
......@@ -222,30 +186,11 @@ export default {
},
data() {
return {
orders:[],
discussID: 0,
drawer: false,
chartData: [17,5,20,37,21],
shopChartData: [{
text:'亲子',
num:17,
color:'#0D2481'
},{
text:'蜜月',
num:5,
color:'#FFA97C'
},{
text:'夕阳红',
num:20,
color:'#98BD7B'
},{
text:'暑期',
num:37,
color:'#D2C9F1'
},{
text:'寒假',
num:21,
color:'#6EBCE2'
}],
chartData: [],
shopChartData: [],
SexOrder: [17,5,20,37,21],
loading: false,
strArr: ['亲子', '蜜月', '夕阳红', '暑期', '寒假'],
......@@ -265,34 +210,97 @@ export default {
},
mounted() {
// this.GetSexOrderList()
this.GetSexOrderList()
},
methods: {
GetSexOrderList(){
this.loading = true
this.apipost("/api/Statistic/GetSexOrderList", {}, res => {
this.SexOrder = res.data.data
let contShop = res.data.data[0].ShopMoney + res.data.data[1].ShopMoney, man = res.data.data[0].ShopMoney, woman = res.data.data[1].ShopMoney,
contNum = res.data.data[0].SexCount + res.data.data[1].SexCount, manN = res.data.data[0].SexCount, womanN = res.data.data[1].SexCount;
this.apipost("/api/Statistic/GetTravelTypeShopList", {}, res => {
this.loading = false
this.strArr=[];
let data=res.data.data;
data.forEach(item=>{
this.strArr.push(item.TravelTypeName)
})
let contShop = res.data.data[0].TotalMoney + res.data.data[1].TotalMoney+ res.data.data[2].TotalMoney+ res.data.data[3].TotalMoney+ res.data.data[4].TotalMoney,
one = res.data.data[0].TotalMoney,
two = res.data.data[1].TotalMoney,
three = res.data.data[2].TotalMoney,
four= res.data.data[3].TotalMoney,
five= res.data.data[4].TotalMoney,
contNum = res.data.data[0].TravelCount + res.data.data[1].TravelCount+ res.data.data[2].TravelCount+ res.data.data[3].TravelCount+ res.data.data[4].TravelCount,
oneN = res.data.data[0].TravelCount,
twoN = res.data.data[1].TravelCount,
threeN = res.data.data[2].TravelCount,
fourN = res.data.data[3].TravelCount,
fiveN = res.data.data[4].TravelCount;
let chartData = [], shopChartData = [];
// chartData.push(
// ((manN/contNum)*100).toFixed(2)
// )
// chartData.push(
// ((womanN/contNum)*100).toFixed(2)
// )
// shopChartData.push(
// Number(((man/contShop)*100).toFixed(0))
// )
// shopChartData.push(
// Number(((woman/contShop)*100).toFixed(0))
// )
chartData.push(
((oneN/contNum)*100).toFixed(2)
)
chartData.push(
((twoN/contNum)*100).toFixed(2)
)
chartData.push(
((threeN/contNum)*100).toFixed(2)
)
chartData.push(
((fourN/contNum)*100).toFixed(2)
)
chartData.push(
((fiveN/contNum)*100).toFixed(2)
)
shopChartData.push(
{
num: Number(((one/contShop)*100).toFixed(2)),
color: "#0D2481",
text: '亲子'
}
)
shopChartData.push(
{
num: Number(((two/contShop)*100).toFixed(2)),
color: "#FFA475",
text: '蜜月'
}
)
shopChartData.push(
{
num: Number(((three/contShop)*100).toFixed(2)),
color: "#99BD7B",
text: '夕阳红'
}
)
shopChartData.push(
{
num: Number(((four/contShop)*100).toFixed(2)),
color: "#D2C9F1",
text: '暑假'
}
)
shopChartData.push(
{
num: Number(((five/contShop)*100).toFixed(2)),
color: "#6EBCE2",
text: '寒假'
}
)
this.chartData = chartData
//this.shopChartData = shopChartData
this.chartData.
this.loading = false
this.shopChartData = shopChartData
this.orders=res.data.data;
this.getOrders();
});
},
getOrders(){
this.apipost("/api/Statistic/GetTravelTypeOrderList", {}, res => {
res.data.data.forEach(x => {
this.orders[x.NewTravelType - 1].LtName = x.LtName;
this.orders[x.NewTravelType - 1].Unit_Price = x.Unit_Price;
});
console.log("this.orders",this.orders)
});
}
}
}
}
</script>
\ No newline at end of file
<style>
.sex{
height: calc(100% - 25px);
}
.statistics-title {
font-size: 24px;
color: #111;
margin-bottom: 30px;
font-family: perfectFont;
}
.sex .conten-box{
display: flex;
flex-direction: column;
height: calc(100% - 62px);
}
.sex .conten-box .el-card .el-card__header {
font-weight: normal !important;
}
.sex .conten-box .top{
flex: 1.2;
margin-bottom: 25px;
}
.sex .conten-box .bottom{
flex: .8;
}
.sex .conten-box .left{
height: 100%;
}
.sex .conten-box .el-card.blue {
background: #0D2481!important;
color: #fff !important;
height: calc(100% - 2px);
}
.sex .conten-box .el-card .el-card__body {
padding: 20px;
height: calc(100% - 98px);
max-height: calc(100% - 98px);
}
.sex .conten-box .img {
display: flex;
align-items: flex-end;
text-align: center;
padding: 20px 70px 10px 70px!important;
justify-content: space-between;
font-size: 14px;
}
.sex .sjsm{
display: flex;
flex-direction: column;
}
.sex .sjsm>div:nth-child(1){
margin-bottom: 20px;
}
.sex .sjsm>div{
flex: 1;
background:rgba(244,245,249,1);
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px;
}
.sex .sjsm>div .left{
display: flex;
align-items: center;
}
.sex .sjsm>div .left img{
padding-right: 10px;
}
.sex .sjsm>div .right{
text-align: right;
color: #888888;
font-size: 12px;
}
.sex .hight-font{
color: #0D2481 !important;
font-size: 14px;
}
</style>
<template>
<div class="sex" v-loading="loading">
<div class="statistics-title bold18">单位统计</div>
<div class="conten-box" v-if="!loading">
<el-row :gutter="25" class="top">
<el-col :span="16" class="left">
<el-card class="blue">
<div slot="header" class="clearfix">
<span>单位统计</span>
</div>
<el-row :gutter="80" style="height: 100%;">
<el-col :span="10" class="img">
<div>
<div style="margin-bottom: 10px;">
<img src="../../assets/img/tongji/zc.png" alt="">
</div>
<p>单位</p>
</div>
</el-col>
<el-col :span="14" style="height: 100%;">
<sexChart :myData="chartData" :strArr="strArr"/>
</el-col>
</el-row>
</el-card>
</el-col>
<el-col :span="8" style="height: 100%;">
<el-card style="height: calc(100% - 2px);">
<div slot="header" class="clearfix">
<span>购物统计<span class="font-size-12">(按平均计算)</span></span>
</div>
<shopChart :shopChartData="shopChartData"/>
</el-card>
</el-col>
</el-row>
<el-row :gutter="25" class="bottom" >
<el-col :span="16" style="height: 100%;">
<el-card style="height: 100%;">
<div slot="header" class="clearfix">
<span>数据说明</span>
</div>
<div style="height: 198px;overflow: auto;" class="sjsm">
<div v-for="(item, index) in orders" :key="index">
<div class="left">
<img v-if="index==0" src="../../assets/img/tongji/qinzhi.png" alt="">
<img v-if="index==1" src="../../assets/img/tongji/miyue.png" alt="">
<img v-if="index==2" src="../../assets/img/tongji/in3.png" alt="">
<img v-if="index==3" src="../../assets/img/tongji/d1.png" alt="">
<img v-if="index==4" src="../../assets/img/tongji/hanjia.png" alt="">
<span class="font-size-12">{{item.UnitTypeName}}</span>
</div>
<div class="right">
<p>累计报名<span class="hight-font">{{item.OrderCount}}</span>人,关联购物金额<span class="hight-font">{{item.ShopMoney}}</span>万,报名均价为<span class="hight-font">{{item.Unit_Price}}</span></p>
<p>最喜爱产品<span class="hight-font">{{item.LtName}}</span></p>
</div>
</div>
</div>
</el-card>
</el-col>
<el-col :span="8" style="height: 100%;">
<el-card style="height: 100%;">
<div slot="header" class="clearfix">
<el-row style="width:100%">
<el-col :span="12" size="30">
推荐解答
</el-col>
<!-- <el-col :span="12" class="right-title">
<i class="iconfont icondianzan1"></i> 点赞
</el-col> -->
</el-row>
</div>
<div class="situ">
<div class="c">根据对单位的统计可以,更好的了解不同单位客人的喜好,消费能力的判读,从而快速的推荐团队给客人等等等</div>
<div class="bot" @click="drawer = true">
查看更多,参与讨论(1)
<i class="el-icon-d-arrow-right"></i>
</div>
</div>
</el-card>
</el-col>
</el-row>
</div>
<el-drawer
size='695px'
:visible.sync="drawer"
direction="rtl"
:with-header="false">
<discussBox :id="discussID"/>
</el-drawer>
</div>
</template>
<script>
import sexChart from './model/sexChart'
import shopChart from './model/shopChart'
import discussBox from "./model/discussBox";
export default {
components: {
sexChart,
shopChart,
discussBox
},
data() {
return {
discussID: 0,
drawer: false,
chartData: [0, 0],
shopChartData: [],
SexOrder: [],
loading: false,
strArr: ['世界500强', '事业单位', '其他',"教育机构"],
orders:[]
};
},watch:{
},
mounted() {
this.GetSexOrderList()
},
methods: {
GetSexOrderList(){
this.loading = true
this.strArr=[];
this.apipost("/api/Statistic/GetUnitTypeOrderList", {}, res => {
// this.SexOrder = res.data.data
let data=res.data.data;
data.forEach(item=>{
this.strArr.push(item.UnitTypeName)
})
this.loading = false
let contShop = res.data.data[0].ShopMoney + res.data.data[1].ShopMoney+ res.data.data[2].ShopMoney+ res.data.data[3].ShopMoney+ res.data.data[4].ShopMoney,
one = res.data.data[0].ShopMoney,
two = res.data.data[1].ShopMoney,
three = res.data.data[2].ShopMoney,
four = res.data.data[3].ShopMoney,
five = res.data.data[4].ShopMoney,
contNum = res.data.data[0].OrderCount + res.data.data[1].OrderCount+ res.data.data[2].OrderCount+ res.data.data[3].OrderCount+ res.data.data[4].OrderCount,
zaiN = res.data.data[0].OrderCount,
twoN = res.data.data[1].OrderCount,
threeN = res.data.data[2].OrderCount,
fourN = res.data.data[3].OrderCount,
fiveN = res.data.data[4].OrderCount;
let chartData = [], shopChartData = [];
chartData.push(
((zaiN/contNum)*100).toFixed(2)
)
chartData.push(
((twoN/contNum)*100).toFixed(2)
)
chartData.push(
((threeN/contNum)*100).toFixed(2)
)
chartData.push(
((fourN/contNum)*100).toFixed(2)
)
chartData.push(
((fiveN/contNum)*100).toFixed(2)
)
shopChartData.push(
{
num: Number(((one/contShop)*100).toFixed(2)),
color: "#0D2481",
text: '世界500强'
}
)
shopChartData.push(
{
num: Number(((two/contShop)*100).toFixed(2)),
color: "#FFA475",
text: '事业单位'
}
)
shopChartData.push(
{
num: Number(((three/contShop)*100).toFixed(2)),
color: "#999",
text: '其他'
}
)
shopChartData.push(
{
num: Number(((four/contShop)*100).toFixed(2)),
color: "#6EBCE2",
text: '教育机构'
}
)
shopChartData.push(
{
num: Number(((five/contShop)*100).toFixed(2)),
color: "#98BD7B",
text: '聚集'
}
)
this.chartData = chartData
this.shopChartData = shopChartData
this.orders=res.data.data;
// console.log("this.orders",this.orders)
});
},
}
}
</script>
\ No newline at end of file
......@@ -195,7 +195,14 @@ export default new Router({
title: "季节"
}
},
{
path: "/unit",
name: "unit",
component: ()=>import('./components/statistics/unit.vue'),
meta: {
title: "单位"
}
},
{
path: "/contractManagement",
name: "contractManagement",
......
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