This commit is contained in:
DESKTOP-369JRHT\12997 2024-10-14 14:06:09 +08:00
parent 872cfdc423
commit 43339ac7fb
3 changed files with 141 additions and 55 deletions
fuintAdmin/src

Binary file not shown.

After

(image error) Size: 2.0 KiB

Binary file not shown.

After

(image error) Size: 575 B

View File

@ -2,16 +2,15 @@
<div class="home-index">
<el-carousel height="230px">
<el-carousel-item v-for="(item,index) in bannerList" :key="index">
<div class="bannser">
<div class="bannser">-
<!-- <img src="../../assets/images/banner.png" alt="" >-->
<img :src="imagePath+item.productImage" alt="" >
</div>
</el-carousel-item>
</el-carousel>
<div class="b-bs">
<div class="left-box">
<div>核心数据</div>
<div class="h-tt">核心数据</div>
<div style="display: flex;justify-content: space-between">
<div class="san-box">
<div class="r-title">{{ storeTotal.allAmount || 0 }}</div>
@ -45,12 +44,22 @@
<div class="b-bs">
<div class="left-box-t">
<div class="d-s">
<div class="h-tt" >数据看板</div>
<div class="q-anniu">近一周</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>
<el-dropdown-item>近一周</el-dropdown-item>
<el-dropdown-item>近一月</el-dropdown-item>
<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 style="margin-right: 40px">
<el-date-picker
v-model="value1"
type="datetimerange"
type="daterange"
value-format="yyyy-MM-dd HH:mm:ss"
range-separator="至"
start-placeholder="开始日期"
@ -63,28 +72,28 @@
<div class="k-box">
<div class="d-s" style="font-size: 12px;color: #999999;">
<div class="sian"></div>
<div>油品销售金额/交易笔数</div>
<div style="color: #333">油品销售金额/交易笔数</div>
</div>
<div class="num-size">{{ storeAmount.oilAmount || 0 }}/{{ storeAmount.oilNum || 0 }}</div>
</div>
<div class="k-box">
<div class="d-s" style="font-size: 12px;color: #999999;">
<div class="sian"></div>
<div>会员充值金额/充值笔数</div>
<div style="color: #333">会员充值金额/充值笔数</div>
</div>
<div class="num-size">{{ storeAmount.userRechargeAmount || 0 }}/{{ storeAmount.userRechargeNum || 0 }}</div>
</div>
<div class="k-box">
<div class="d-s" style="font-size: 12px;color: #999999;">
<div class="sian"></div>
<div>便利店销售金额/交易笔数</div>
<div style="color: #333">便利店销售金额/交易笔数</div>
</div>
<div class="num-size">{{ storeAmount.minimartAmount || 0 }}/{{ storeAmount.minimartNum || 0 }}</div>
</div>
<div class="k-box">
<div class="d-s" style="font-size: 12px;color: #999999;">
<div class="sian"></div>
<div>积分商城销售金额/兑换笔数</div>
<div style="color: #333">积分商城销售金额/兑换笔数</div>
</div>
<div class="num-size">{{ storeAmount.pointMallAmount || 0 }}/{{ storeAmount.pointMallNum || 0 }}</div>
</div>
@ -105,57 +114,114 @@
</div>
</div>
</div>
<div class="right-box-t">
<div class="h-tt" >硬件设备</div>
<div class="d-s" style="margin: 30px 0px" v-for="(item,index) in hardwareList" :key="index" >
<!-- <div class="r-img">-->
<!-- <img src="../../assets/images/pcin.png" style="width: 84px;height: 70px">-->
<!-- </div>-->
<!-- <div>容大(RT RONGTA)RP76II针式76mm小票打印机加油站二三联票据 RP76II/USB口</div>-->
<div class="r-img">
<img :src="imagePath + item.image" style="width: 84px;height: 70px">
<div class="right-box-t" >
<div class="h-tt" >
<div>硬件设备</div>
<el-popover
placement="top-start"
title="联系人:某某某"
width="200"
trigger="hover"
content="联系电话1352415811">
<img slot="reference" style="width: 28px; height: 28px " src="../assets/images/telindex.png">
</el-popover>
</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="r-img">
<img :src="imagePath + item.image" style="width: 84px;height: 70px">
</div>
<div style="font-size: 14px">{{ item.name }}</div>
</div>
<div>{{ item.name }}</div>
</div>
</div>
</div>
<div class="b-bs">
<div class="left-box-t">
<div>数据展示</div>
<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>
<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 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"
type="daterange"
value-format="yyyy-MM-dd HH:mm:ss"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
@blur="getStoreAmount">
</el-date-picker>
</div>
</div>
</div>
<div class="right-box-t">
<div style="font-size: 16px;font-weight: bold">员工排行</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>
<div style="width: 25%">会员充值金额)</div>
<div style="width: 25%">油品销售金额)</div>
<div>总销售额</div>
<div style="width: 25%">会员充值金额</div>
<div style="width: 25%">油品销售金额</div>
<div>总销售额</div>
</div>
<div class="hang-box" v-for="(item,index) in employeList" :key="index">
<div style="width: 10%">{{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="overflow: auto; scrollbar-width: none; height: 74% ">
<div class="hang-box" v-for="(item,index) in employeList" :key="index">
<div style="width: 10%">{{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>
</div>
</div>
</div>
<div class="bottom_">
<div class="h-tt" style="margin-bottom: 15px" >数据统计</div>
<div class="d-s">
<div class="anniu-h" :class="{ 'anniu-act': index == 0 }" v-for="(item,index) in timeList" :key="index">
{{item}}
<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>
<el-dropdown-item>近一周</el-dropdown-item>
<el-dropdown-item>近一月</el-dropdown-item>
<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 style="margin-right: 40px">
<el-date-picker
v-model="value1"
type="daterange"
value-format="yyyy-MM-dd HH:mm:ss"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
@blur="getStoreAmount">
</el-date-picker>
</div>
<el-date-picker
v-model="value2"
type="datetimerange"
range-separator="至"
value-format="yyyy-MM-dd HH:mm:ss"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</div>
<div id="ctct" style="width: 100%; height: 315px;background: linear-gradient( 360deg, #F8F0E7 0%, #FFFFFF 100%); "></div>
</div>
@ -178,6 +244,8 @@ export default {
props:["accountId"],
data(){
return{
xShow:false,
timeShow:false,
form: {},
timeList:[
"今日",
@ -860,17 +928,17 @@ export default {
height: 380px;
box-sizing: border-box;
padding: 15px;
overflow: auto;
scrollbar-width: none;
}
.san-box{
width: 24%;
height: 120px;
height: 100px;
box-sizing: border-box;
border-radius: 8px;
background: #fe8c4a;
margin: 15px 0px;
margin-right: 15px;
margin: 15px auto;
box-sizing: border-box;
padding: 20px 40px;
}
@ -900,37 +968,53 @@ export default {
overflow: hidden; //
text-overflow: ellipsis; //
font-size: 14px;
color: #777777;
color: #333;
margin: 14px auto;
}
.h-tt{
font-size: 16px;
color: #333333;
font-weight: bold;
margin-right: 40px;
display: flex;
justify-content: space-between;
}
.q-anniu{
width: 80px;
height: 26px;
background: #FF9655;
background: #FF9655 !important;
border-radius: 4px 4px 4px 4px;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
color: #fff !important;
font-size: 12px;
cursor: pointer;
margin-right: 20px;
}
.h-anniu{
width: 80px;
height: 26px;
background: #fafafa;
border-radius: 4px 4px 4px 4px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
margin-right: 20px;
font-weight: 400;
font-size: 12px;
color: #555555;
}
.k-box{
width: 220px;
width: 24%;
height: 68px;
background: #FFFFFF;
border-radius: 8px;
border: 1px solid #e1e0e0;
box-sizing: border-box;
margin: 0 auto;
padding: 10px;
margin-right: 10px;
}
.num-size{
font-weight: bold;
@ -1003,6 +1087,7 @@ export default {
box-sizing: border-box;
padding: 10px;
display: flex;
font-size: 14px;
justify-content: space-between;
margin: 10px auto;
div{
@ -1012,12 +1097,13 @@ export default {
}
.hang-box{
border-radius: 8px;
font-size: 14px;
width: 100%;
box-sizing: border-box;
padding: 10px;
padding: 5px;
display: flex;
justify-content: space-between;
margin: 10px auto;
margin: 0px auto;
div{
width: 20%;
text-align: center;