This commit is contained in:
xvv 2024-07-11 17:33:26 +08:00
parent fa1e15dde4
commit a88217849a
2 changed files with 39 additions and 32 deletions

View File

@ -15,7 +15,7 @@
</div> </div>
<div><span>{{radio}}交易金额总计</span><span class="title-lan">{{sum}}</span> <span></span></div> <div><span>{{radio}}交易金额总计</span><span class="title-lan">{{sum}}</span> <span></span></div>
<div v-loading="oilLoading" id="ccccc" style="width: 100%; height: 400px; background: linear-gradient( 360deg, #F8F1E7 0%, #FFFFFF 100%); "></div> <div v-loading="oilLoading" id="ccccc" style="width: 100%; height: 370px; background: linear-gradient( 360deg, #F8F1E7 0%, #FFFFFF 100%); "></div>
</div> </div>
@ -194,7 +194,14 @@ export default {
}, },
] ],
grid: {
left: '8%',
right: '8%',
bottom: '5%',
containLabel: true
},
}; };
chart.setOption(option) chart.setOption(option)

View File

@ -243,16 +243,17 @@
<div class="center-top-of"> <div class="center-top-of">
<div class="wrap-wrap"> <div class="wrap-wrap">
<div class="of-box" v-for="(item,index) in gunList" :key="index" <div class="of-box" v-for="(item,index) in gunList" :key="index"
:style="{'background-color': colorList[index%5].color}" :style="{'background-color': colorList[index%4].color}"
@click="refuel(item)"> @click="refuel(item)">
<div>{{ getName(oilNameList,getOilNames(oilNumberList,item.numberId)) }}</div> <div :style="{'color': colorList[index%4].border}" >{{ getName(oilNameList,getOilNames(oilNumberList,item.numberId)) }}</div>
<!-- <div>{{ getOilNames(oilNumberList,item.numberId) }}</div>--> <!-- <div>{{ getOilNames(oilNumberList,item.numberId) }}</div>-->
<!-- <div>{{ item.oilNumber }</div>--> <!-- <div>{{ item.oilNumber }</div>-->
<div class="of-title" >{{item.gunName}}</div> <div class="of-title" >{{item.gunName}}</div>
<div style="display: flex;justify-content: space-between"> <div style="display: flex;justify-content: space-between ;font-size: 12px" >
<img src="../../../assets/images/jya.png" style="width: 18px;height: 18px;"> <img src="../../../assets/images/jya.png" style="width: 18px;height: 18px;">
<span style="font-size: 12px">{{ item.tankName }}</span> <span :style="{'color': colorList[index%4].border}" >{{ item.tankName }}</span>
</div> </div>
</div> </div>
@ -268,7 +269,7 @@
</div> </div>
</div> </div>
<div class="center-left-bottom"> <div class="center-left-bottom">
<div class="bottom-gd" @click="resetting">重置</div> <div class="bottom-qk" @click="resetting">重置</div>
<!-- <div class="bottom-qk">解锁</div>--> <!-- <div class="bottom-qk">解锁</div>-->
</div> </div>
</div> </div>
@ -1497,11 +1498,10 @@
leftindex:0, leftindex:0,
oilList:[], oilList:[],
colorList:[ colorList:[
{color:'#e5f0ff'}, {color:'#e5f0ff',border:"#409EFF"},
{color:'#fff2e5'}, {color:'#fff2e5',border:"#FF9655"},
{color:'#e5edf1'}, {color:'#ecfae5',border:"#0DC291"},
{color:'#ecfae5'}, {color:'#fff8e7',border:"#FFB519"}
{color:'#fafafa'}
], ],
restaurants:'', restaurants:'',
num: 1, num: 1,
@ -4829,19 +4829,19 @@
//cursor: pointer; //cursor: pointer;
//color: #20b400; //color: #20b400;
} }
.wrap-box :hover{ //.wrap-box :hover{
/*background: #00afff !important;*/ // /*background: #00afff !important;*/
width: 100%; // width: 100%;
height: 100%; // height: 100%;
border-radius: 8px; // border-radius: 8px;
height: 80px; // height: 80px;
display: flex; // display: flex;
align-items: center; // align-items: center;
justify-content: center; // justify-content: center;
border: 1px solid #00afff; // border: 1px solid #00afff;
cursor: pointer; // cursor: pointer;
/*color: white;*/ // /*color: white;*/
} //}
.box-center{ .box-center{
width: 100%; width: 100%;
@ -4864,27 +4864,27 @@
.bottom-qk{ .bottom-qk{
border: 1px solid #99a9bf; border: 1px solid #99a9bf;
box-sizing: border-box; box-sizing: border-box;
padding: 14px 20px; padding: 10px 20px;
border-radius: 50px; border-radius: 10px;
color: #99a9bf; color: #99a9bf;
margin: 15px 0px ; margin: 15px 0px ;
} }
.bottom-qd{ .bottom-qd{
border: 1px solid #13ce66; border: 1px solid #13ce66;
background: #13ce66; background: linear-gradient( 312deg, #9CDCA0 0%, #5BC557 100%);
box-sizing: border-box; box-sizing: border-box;
padding: 14px 20px; padding: 14px 20px;
border-radius: 50px; border-radius: 8px;
color: #ffffff; color: #ffffff;
margin: 15px 10px ; margin: 15px 10px ;
} }
.bottom-gd{ .bottom-gd{
border: 1px solid #FF9655; border: 1px solid #02AAFE;
background: #FF9655; background: linear-gradient( 312deg, #70CAFD 0%, #0BADFE 100%, #02AAFE 100%);
box-sizing: border-box; box-sizing: border-box;
padding: 14px 20px; padding: 14px 20px;
border-radius: 50px; border-radius: 8px;
color: #ffffff; color: #ffffff;
margin: 15px 10px ; margin: 15px 10px ;