dianliang/oil-station
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

更新10.15

Browse Source
This commit is contained in:
许允枞 2024-10-15 09:53:01 +08:00
parent 6d48219cd6
commit bb21cf0aec
1 changed files with 229 additions and 176 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

405
fuintAdmin/src/views/shopowner.vue
View File

@ -4,7 +4,7 @@
<el-carousel-item v-for="(item,index) in bannerList" :key="index">
<div class="bannser">-
<img :src="imagePath+item.productImage" alt="" >
<img :src="imagePath+item.productImage" alt="">
</div>
</el-carousel-item>
</el-carousel>
@ -34,19 +34,24 @@
<div class="right-box">
<div class="title_">
<div>通知中心</div>
<div style="font-size: 12px;color: #BBBBBB;cursor: pointer; display: flex;align-items: center" @click="goList()" >更多 <i class="el-icon-arrow-right"></i> </div>
<div style="font-size: 12px;color: #BBBBBB;cursor: pointer; display: flex;align-items: center"
@click="goList()">更多 <i class="el-icon-arrow-right"></i></div>
</div>
<!-- <div class="hang_" v-for="(item,index) in 4" :key="index" >【到期提醒】百业兴智慧油站系统将于2024年07月10日到期...</div>-->
<div class="hang_" v-for="(item,index) in noticeList" :key="index" >【{{ item.notificationType }}】{{ item.templateContent }}</div>
<div class="hang_" v-for="(item,index) in noticeList" :key="index">【{{
item.notificationType
}}】{{ item.templateContent }}
</div>
<div class="hang_" v-if="this.noticeList.length==0">暂无通知</div>
</div>
</div>
<div class="b-bs">
<div class="left-box-t">
<div class="d-s">
<div class="h-tt" style="margin-right: 15px" >数据看板</div>
<el-dropdown placement="bottom-start" >
<div class="h-anniu" :class="{'q-anniu' : timeShow == false}" @click="timeShow = false ">近一周 <i class="el-icon-arrow-down el-icon--right"></i></div>
<div class="h-tt" style="margin-right: 15px">数据看板</div>
<el-dropdown placement="bottom-start">
<div class="h-anniu" :class="{'q-anniu' : timeShow == false}" @click="timeShow = false ">近一周 <i
class="el-icon-arrow-down el-icon--right"></i></div>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>今日</el-dropdown-item>
<el-dropdown-item>昨日</el-dropdown-item>
@ -55,7 +60,9 @@
<el-dropdown-item>近一周</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<div class="h-anniu" :class="{'q-anniu' : timeShow == true}" @click="timeShow = true" > <img src="../assets/images/zdy.png" style="width: 14px; height: 14px" > 自定义</div>
<div class="h-anniu" :class="{'q-anniu' : timeShow == true}" @click="timeShow = true"><img
src="../assets/images/zdy.png" style="width: 14px; height: 14px"> 自定义
</div>
<div style="margin-right: 40px">
<el-date-picker
v-model="value1"
@ -99,14 +106,14 @@
</div>
</div>
<div class="hui-hang"></div>
<div class="d-s" >
<div class="d-s">
<div>
<div class="h-tt" >数据分析</div>
<div class="h-tt">数据分析</div>
<div id="ccc" style="width: 300px;height: 200px; "></div>
</div>
<div class="h-r-ba"></div>
<div>
<!-- <div class="h-tt" >活跃油站</div>-->
<!-- <div class="h-tt" >活跃油站</div>-->
<div class="d-s" style="justify-content: space-between">
<div id="cccc" style="width: 300px;height: 200px;margin-right: 50px"></div>
<div id="ccct" style="width: 300px;height: 200px;"></div>
@ -114,8 +121,8 @@
</div>
</div>
</div>
<div class="right-box-t" >
<div class="h-tt" >
<div class="right-box-t">
<div class="h-tt">
<div>硬件设备</div>
<el-popover
placement="top-start"
@ -125,9 +132,9 @@
content="联系电话：1352415811">
<img slot="reference" style="width: 28px; height: 28px " src="../assets/images/telindex.png">
</el-popover>
</div>
</div>
<div style="height: 90%;overflow: auto;scrollbar-width: none;">
<div class="d-s" style="margin: 30px 0px" v-for="(item,index) in hardwareList" :key="index" >
<div class="d-s" style="margin: 30px 0px" v-for="(item,index) in hardwareList" :key="index">
<div class="r-img">
<img :src="imagePath + item.image" style="width: 84px;height: 70px">
</div>
@ -140,10 +147,11 @@
<div class="b-bs">
<div class="left-box-t">
<div class="d-s">
<div class="h-tt" style="margin-right: 15px" >油品交易分析</div>
<div class="h-tt" style="margin-right: 15px">油品交易分析</div>
<el-dropdown placement="bottom-start" >
<div class="h-anniu" :class="{'q-anniu' : timeShow == false}" @click="timeShow = false ">近一周 <i class="el-icon-arrow-down el-icon--right"></i></div>
<el-dropdown placement="bottom-start">
<div class="h-anniu" :class="{'q-anniu' : timeShow == false}" @click="timeShow = false ">近一周 <i
class="el-icon-arrow-down el-icon--right"></i></div>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>今日</el-dropdown-item>
<el-dropdown-item>昨日</el-dropdown-item>
@ -152,7 +160,9 @@
<el-dropdown-item>近一周</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<div class="h-anniu" :class="{'q-anniu' : timeShow == true}" @click="timeShow = true" > <img src="../assets/images/zdy.png" style="width: 14px; height: 14px" > 自定义</div>
<div class="h-anniu" :class="{'q-anniu' : timeShow == true}" @click="timeShow = true"><img
src="../assets/images/zdy.png" style="width: 14px; height: 14px"> 自定义
</div>
<div style="margin-right: 40px">
<el-date-picker
v-model="value1"
@ -164,20 +174,24 @@
@blur="getDataShow">
</el-date-picker>
</div>
<div id="cccf" style="width: 100%; height: 315px;background: linear-gradient( 360deg, #F8F0E7 0%, #FFFFFF 100%); "></div>
<div id="cccf"
style="width: 100%; height: 315px;background: linear-gradient( 360deg, #F8F0E7 0%, #FFFFFF 100%); "></div>
</div>
</div>
<div class="right-box-t">
<div style="font-size: 16px;font-weight: bold"><span style="margin-right: 15px">员工排行</span> <el-dropdown placement="bottom-start" >
<div class="h-anniu" :class="{'q-anniu' : timeShow == false}" @click="timeShow = false ">近一周 <i class="el-icon-arrow-down el-icon--right"></i></div>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>今日</el-dropdown-item>
<el-dropdown-item>昨日</el-dropdown-item>
<el-dropdown-item>近一周</el-dropdown-item>
<el-dropdown-item>近一月</el-dropdown-item>
<el-dropdown-item>近一周</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown></div>
<div style="font-size: 16px;font-weight: bold"><span style="margin-right: 15px">员工排行</span>
<el-dropdown placement="bottom-start">
<div class="h-anniu" :class="{'q-anniu' : timeShow == false}" @click="timeShow = false ">近一周 <i
class="el-icon-arrow-down el-icon--right"></i></div>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>今日</el-dropdown-item>
<el-dropdown-item>昨日</el-dropdown-item>
<el-dropdown-item>近一周</el-dropdown-item>
<el-dropdown-item>近一月</el-dropdown-item>
<el-dropdown-item>近一周</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
<div class="hui-box">
<div style="width: 10%">排名</div>
<div>员工姓名</div>
@ -189,21 +203,21 @@
<div class="hang-box" v-for="(item,index) in employeList" :key="index">
<div style="width: 10%" v-if="index == 0">
<img src="../assets/images/one_icon.png" style="width: 22px;height: 22px">
<img src="../assets/images/one_icon.png" style="width: 22px;height: 22px">
</div>
<div style="width: 10%" v-if="index == 1">
<img src="../assets/images/two_icon.png" style="width: 22px;height: 22px">
<img src="../assets/images/two_icon.png" style="width: 22px;height: 22px">
</div>
<div style="width: 10%" v-if="index == 2">
<img src="../assets/images/three_icon.png" style="width: 22px;height: 22px">
<img src="../assets/images/three_icon.png" style="width: 22px;height: 22px">
</div>
<div style="width: 10%" v-if="index>2">{{index +1}}</div>
<div style="width: 10%" v-if="index>2">{{ index + 1 }}</div>
<div>{{ item.realName }}</div>
<div style="width: 25%">{{item.cardSum}}</div>
<div style="width: 25%">{{item.oilSum}}</div>
<div>{{item.totalSum}}</div>
<div style="width: 25%">{{ item.cardSum }}</div>
<div style="width: 25%">{{ item.oilSum }}</div>
<div>{{ item.totalSum }}</div>
</div>
</div>
@ -211,9 +225,10 @@
</div>
<div class="bottom_">
<div class="d-s">
<div class="h-tt" style="margin-right: 15px" >数据统计</div>
<el-dropdown placement="bottom-start" >
<div class="h-anniu" :class="{'q-anniu' : timeShow == false}" @click="timeShow = false ">近一周 <i class="el-icon-arrow-down el-icon--right"></i></div>
<div class="h-tt" style="margin-right: 15px">数据统计</div>
<el-dropdown placement="bottom-start">
<div class="h-anniu" :class="{'q-anniu' : timeShow == false}" @click="timeShow = false ">近一周 <i
class="el-icon-arrow-down el-icon--right"></i></div>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>今日</el-dropdown-item>
<el-dropdown-item>昨日</el-dropdown-item>
@ -222,7 +237,9 @@
<el-dropdown-item>近一周</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<div class="h-anniu" :class="{'q-anniu' : timeShow == true}" @click="timeShow = true" > <img src="../assets/images/zdy.png" style="width: 14px; height: 14px" > 自定义</div>
<div class="h-anniu" :class="{'q-anniu' : timeShow == true}" @click="timeShow = true"><img
src="../assets/images/zdy.png" style="width: 14px; height: 14px"> 自定义
</div>
<div style="margin-right: 40px">
<el-date-picker
v-model="value1"
@ -236,7 +253,8 @@
</div>
</div>
<div id="ctct" style="width: 100%; height: 315px;background: linear-gradient( 360deg, #F8F0E7 0%, #FFFFFF 100%); "></div>
<div id="ctct"
style="width: 100%; height: 315px;background: linear-gradient( 360deg, #F8F0E7 0%, #FFFFFF 100%); "></div>
</div>
@ -253,15 +271,16 @@ import {getBannerListApi} from "@/api/sys/banner";
import {getNotificationlogList} from "@/api/sys/sysNotificationlog";
import {employeeSalesApi} from "@/api/indexStatistics";
import {getDataAnalysis, getDataBoard, getDataCount, getDataShow, getTotalAmount} from "@/api/allOrder";
export default {
props:["accountId"],
data(){
return{
xShow:false,
timeShow:false,
props: ["accountId"],
data() {
return {
xShow: false,
timeShow: false,
form: {},
timeList:[
timeList: [
"今日",
"近一周",
"近一月",
@ -288,20 +307,22 @@ export default {
value1: [],
value2: [],
imagePath: process.env.VUE_APP_SERVER_URL,
queryParams:{},
queryParams: {},
// 店铺数量
storeTotal:{},
storeTotal: {},
// 店铺金额
storeAmount:{},
storeAmount: {},
// banner图列表
bannerList:{},
storeList:[],
hardwareList:[],
noticeList:[],
employeList:[],
dataAnalysisOilNumberList:[],
dataAnalysisAllList:[],
dataAnalysisIfOilList:[],
bannerList: {},
storeList: [],
hardwareList: [],
noticeList: [],
employeList: [],
dataAnalysisOilNumberList: [],
dataAnalysisAllList: [],
dataAnalysisIfOilList: [],
//数据统计
dataCount: {},
}
},
created() {
@ -355,42 +376,46 @@ export default {
// 获取数据分析信息
getDataAnalysis() {
getDataAnalysis().then(res => {
console.log('数据分析的数据',res)
// console.log('数据分析的数据', res)
if (res.code == 200) {
for (let i = 0; i < res.data.length; i++) {
if (res.data[i].type == 1) {
this.dataAnalysisOilNumberList.push(res.data[i])
}else if (res.data[i].type == 2) {
} else if (res.data[i].type == 2) {
this.dataAnalysisIfOilList.push(res.data[i])
}else if (res.data[i].type == 3) {
} else if (res.data[i].type == 3) {
this.dataAnalysisAllList.push(res.data[i])
}
}
console.log('dataAnalysisOilNumberList',this.dataAnalysisOilNumberList)
console.log('dataAnalysisIfOilList',this.dataAnalysisIfOilList)
console.log('dataAnalysisAllList',this.dataAnalysisAllList)
// console.log('dataAnalysisOilNumberList', this.dataAnalysisOilNumberList)
// console.log('dataAnalysisIfOilList', this.dataAnalysisIfOilList)
// console.log('dataAnalysisAllList', this.dataAnalysisAllList)
// this.initChart()
}
})
},
//油站首页数据展示
getDataShow(){
getDataShow() {
const data = {
"startTime": this.value1[0].split(' ')[0],
"endTime": this.value1[1].split(' ')[0]
}
getDataShow(data).then(res => {
console.log('首页数据展示',res)
// console.log('首页数据展示', res)
})
},
//油站首页数据统计
getDataCount(){
getDataCount() {
const data = {
"startTime": this.value1[0].split(' ')[0],
"endTime": this.value1[1].split(' ')[0]
}
getDataCount(data).then(res => {
console.log('首页数据统计',res)
console.log('首页数据统计', res.data)
if (res.code == 200) {
this.dataCount = res.data
this.initChart()
}
})
},
getNoticeList() {
@ -494,6 +519,32 @@ export default {
userBalanceList.push(item.userBalance)
})
}
const times = this.dataCount.oilData.map(item => item.time);
const count = [];
for (let i = 0; i < this.dataCount.oilNames.length; i++) {
let a = {
name: this.dataCount.oilNames[i],
color: '#FF9655',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value;
}
},
barWidth: 13,
itemStyle: {
normal: {
barBorderRadius: [50, 50, 0, 0]
}
},
barGap: '60%',
data: this.dataCount.oilData.map(item => item.money[i])
// data: oilAmountList
}
count.push(a)
}
console.log('count', count)
const option = {
color: [
@ -558,7 +609,7 @@ export default {
// },
//
// ],
data:this.dataAnalysisIfOilList,
data: this.dataAnalysisIfOilList,
emphasis: {
itemStyle: {
shadowBlur: 10,
@ -608,7 +659,7 @@ export default {
// },
//
// ],
data:this.dataAnalysisAllList,
data: this.dataAnalysisAllList,
emphasis: {
itemStyle: {
shadowBlur: 10,
@ -620,6 +671,7 @@ export default {
]
};
const option3 = {
tooltip: {
trigger: 'axis',
@ -631,13 +683,13 @@ export default {
}
},
legend: {
data: ['Evaporation', '油品交易额', '非油品交易额', '会员充值金额', '会员消费金额', '会员余额']
data: this.dataCount.oilNames
},
xAxis: [
{
type: 'category',
data: ['中建锦绣广场1站', '中建锦绣广场2站', '中建锦绣广场3站', '中建锦绣广场4站', '中建锦绣广场5站', '中建锦绣广场6站', '中建锦绣广场7站'],
// data: storeNameList,
// data: ['中建锦绣广场1站', '中建锦绣广场2站', '中建锦绣广场3站', '中建锦绣广场4站', '中建锦绣广场5站', '中建锦绣广场6站', '中建锦绣广场7站'],
data: times,
axisPointer: {
type: 'shadow'
}
@ -665,109 +717,110 @@ export default {
// }
// }
],
series: [
{
name: '油品交易额',
color: '#FF9655',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value;
}
},
barWidth: 13,
itemStyle: {
normal: {
barBorderRadius: [50, 50, 0, 0]
}
},
barGap: '60%',
// data: [
// 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
// ]
data: oilAmountList
},
{
name: '非油品交易额',
color: '#55F3FF',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value;
}
},
barWidth: 13,
itemStyle: {
normal: {
barBorderRadius: [50, 50, 0, 0]
}
},
// data: [
// 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
// ]
data: noOilAmountList
},
{
name: '会员充值金额',
color: '#0DC291',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value;
}
},
barWidth: 13,
itemStyle: {
normal: {
barBorderRadius: [50, 50, 0, 0]
}
},
// data: [
// 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
// ]
data: rechargeBalanceList
},
{
name: '会员消费金额',
color: '#fe8c4a',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value;
}
},
barWidth: 13,
itemStyle: {
normal: {
barBorderRadius: [50, 50, 0, 0]
}
},
// data: [
// 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
// ]
data: consumeBalanceList
},
{
name: '会员余额',
color: '#D55F5F',
type: 'bar',
tooltip: {
valueFormatter: function (value) {
return value;
}
},
barWidth: 13,
itemStyle: {
normal: {
barBorderRadius: [50, 50, 0, 0]
}
},
// data: [
// 2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3
// ]
data: userBalanceList
}
],
// series: [
// {
// name: '油品交易额',
// color: '#FF9655',
// type: 'bar',
// tooltip: {
// valueFormatter: function (value) {
// return value;
// }
// },
// barWidth: 13,
// itemStyle: {
// normal: {
// barBorderRadius: [50, 50, 0, 0]
// }
// },
// barGap: '60%',
// data: [
// 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
// ]
// // data: oilAmountList
// },
// {
// name: '非油品交易额',
// color: '#55F3FF',
// type: 'bar',
// tooltip: {
// valueFormatter: function (value) {
// return value;
// }
// },
// barWidth: 13,
// itemStyle: {
// normal: {
// barBorderRadius: [50, 50, 0, 0]
// }
// },
// // data: [
// // 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
// // ]
// data: noOilAmountList
// },
// {
// name: '会员充值金额',
// color: '#0DC291',
// type: 'bar',
// tooltip: {
// valueFormatter: function (value) {
// return value;
// }
// },
// barWidth: 13,
// itemStyle: {
// normal: {
// barBorderRadius: [50, 50, 0, 0]
// }
// },
// // data: [
// // 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
// // ]
// data: rechargeBalanceList
// },
// {
// name: '会员消费金额',
// color: '#fe8c4a',
// type: 'bar',
// tooltip: {
// valueFormatter: function (value) {
// return value;
// }
// },
// barWidth: 13,
// itemStyle: {
// normal: {
// barBorderRadius: [50, 50, 0, 0]
// }
// },
// // data: [
// // 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
// // ]
// data: consumeBalanceList
// },
// {
// name: '会员余额',
// color: '#D55F5F',
// type: 'bar',
// tooltip: {
// valueFormatter: function (value) {
// return value;
// }
// },
// barWidth: 13,
// itemStyle: {
// normal: {
// barBorderRadius: [50, 50, 0, 0]
// }
// },
// data: [
// 2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3
// ]
// // data: userBalanceList
// }
// ],
series: count,
grid: {
left: '3%',
right: '3%',