UI修改
This commit is contained in:
a0049873
parent
b3899dbfaf
commit
51271131b6
|
|
@ -273,7 +273,7 @@
|
|||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-bottom: 26px;
|
||||
margin-bottom: -10px;
|
||||
.line {
|
||||
width: 34px;
|
||||
height: 3px;
|
||||
|
|
@ -356,6 +356,8 @@
|
|||
color: #734204;
|
||||
}
|
||||
.content-neirong {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
width: 215px;
|
||||
text-overflow: -o-ellipsis-lastline;
|
||||
overflow: hidden;
|
||||
|
|
|
|||
|
|
@ -31,7 +31,11 @@
|
|||
查看更多
|
||||
<span class="gengduo"></span>
|
||||
</div>
|
||||
<a-empty v-else style="margin-top: 160px; margin-bottom: 60px" />
|
||||
<a-empty
|
||||
v-else
|
||||
style="margin-top: 160px; margin-bottom: 60px"
|
||||
:imageStyle="{ color: '#0058e1' }"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -92,6 +96,7 @@
|
|||
dataList.value[index].photo = photo.value[4]
|
||||
break
|
||||
}
|
||||
dataList.value = []
|
||||
})
|
||||
|
||||
console.log('123123123qwee', dataList.value)
|
||||
|
|
|
|||
|
|
@ -475,7 +475,7 @@
|
|||
barGap: '-100%',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#C1232B',
|
||||
color: '#ECB53F',
|
||||
},
|
||||
},
|
||||
// data: [5, 20, 36, 10, 10, 20]
|
||||
|
|
@ -488,7 +488,7 @@
|
|||
barGap: '-100%',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#B5C334',
|
||||
color: '#FE845E',
|
||||
},
|
||||
},
|
||||
// data: [5, 20, 36, 10, 10, 20]
|
||||
|
|
@ -501,7 +501,7 @@
|
|||
barGap: '-100%',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#FCCE10',
|
||||
color: '#6CC95A',
|
||||
},
|
||||
},
|
||||
// data: [5, 20, 36, 10, 10, 20]
|
||||
|
|
@ -514,7 +514,7 @@
|
|||
barGap: '-100%',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#E87C25',
|
||||
color: '#02D1B0',
|
||||
},
|
||||
},
|
||||
// data: [5, 20, 36, 10, 10, 20]
|
||||
|
|
@ -527,20 +527,7 @@
|
|||
barGap: '-100%',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#27727B',
|
||||
},
|
||||
},
|
||||
// data: [5, 20, 36, 10, 10, 20]
|
||||
data: [],
|
||||
},
|
||||
{
|
||||
name: '',
|
||||
type: 'bar',
|
||||
barWidth: 35,
|
||||
barGap: '-100%',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#FE8463',
|
||||
color: '#1772FF',
|
||||
},
|
||||
},
|
||||
// data: [5, 20, 36, 10, 10, 20]
|
||||
|
|
@ -558,6 +545,7 @@
|
|||
for (let i = 0; i < 5; i++) {
|
||||
if (i == index) {
|
||||
arr.push(val.value)
|
||||
// arr.push(10) // 方便更改样式
|
||||
} else {
|
||||
arr.push(0)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,9 +8,17 @@
|
|||
<div class="SharingSituation-left">
|
||||
<div>
|
||||
<div class="left-title">
|
||||
<div>日平均浏览量 {{ browseAvg }}次</div>
|
||||
<div>
|
||||
日平均浏览量
|
||||
<span>{{ browseAvg }}</span>
|
||||
次
|
||||
</div>
|
||||
<div></div>
|
||||
<div>日最大浏览量{{ browseMax }}次</div>
|
||||
<div>
|
||||
日最大浏览量
|
||||
<span>{{ browseMax }}</span>
|
||||
次
|
||||
</div>
|
||||
</div>
|
||||
<div class="left-content-title">
|
||||
<div
|
||||
|
|
@ -34,7 +42,7 @@
|
|||
style="
|
||||
font-size: 14px;
|
||||
float: left;
|
||||
margin-left: 420px;
|
||||
margin-left: 505px;
|
||||
text-align: center;
|
||||
padding-top: 6px;
|
||||
"
|
||||
|
|
@ -42,6 +50,9 @@
|
|||
单位: 次
|
||||
</span>
|
||||
<p class="p">申请量</p>
|
||||
<p class="p" style="position: absolute; top: 420px; left: -564px">
|
||||
浏览量
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="volume_box">
|
||||
|
|
@ -61,12 +72,12 @@
|
|||
backgroundImage: `url(${item.photo}) `,
|
||||
}"
|
||||
></div>
|
||||
<div class="name">{{ item.type }}</div>
|
||||
<div class-="type">{{ item.amount }}</div>
|
||||
<div class="type">{{ item.type }}</div>
|
||||
<div class="amount">{{ item.amount }}</div>
|
||||
</div>
|
||||
<div class="volume_box-son-bottom" v-else>
|
||||
<div class="type">{{ item.amount }}</div>
|
||||
<div class="name">{{ item.type }}</div>
|
||||
<div class="amount">{{ item.amount }}</div>
|
||||
<div class="type">{{ item.type }}</div>
|
||||
<div
|
||||
class="photo"
|
||||
:style="{
|
||||
|
|
@ -109,6 +120,8 @@
|
|||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
name: '单位：次',
|
||||
// minInterval: 1,
|
||||
},
|
||||
tooltip: {
|
||||
show: true,
|
||||
|
|
@ -285,6 +298,7 @@
|
|||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 40px;
|
||||
position: relative;
|
||||
|
||||
.SharingSituation-left {
|
||||
width: 666px;
|
||||
|
|
@ -293,6 +307,7 @@
|
|||
z-index: 2;
|
||||
.left-title {
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
width: 100%;
|
||||
background: #0058e1;
|
||||
color: #ffffff;
|
||||
|
|
@ -301,6 +316,10 @@
|
|||
align-items: center;
|
||||
border-radius: 2px;
|
||||
padding: 0 80px;
|
||||
span {
|
||||
font-size: 26px;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
.left-content-title {
|
||||
display: flex;
|
||||
|
|
@ -344,15 +363,16 @@
|
|||
border-radius: 2px;
|
||||
margin-left: -40px;
|
||||
.p {
|
||||
width: 96px;
|
||||
height: 36px;
|
||||
width: 95px;
|
||||
height: 48px;
|
||||
color: #0058e1;
|
||||
font-size: 18px;
|
||||
background: url('../../../assets/abilityStatistics/gongxiangqingkuangliulanl.png')
|
||||
no-repeat;
|
||||
background-size: 100%;
|
||||
text-align: center;
|
||||
line-height: 36px;
|
||||
margin-left: 500px;
|
||||
line-height: 48px;
|
||||
margin-left: 570px;
|
||||
}
|
||||
.volume_box {
|
||||
width: 666px;
|
||||
|
|
@ -384,6 +404,13 @@
|
|||
height: 46px;
|
||||
width: 46px;
|
||||
}
|
||||
.amount {
|
||||
font-size: 30px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.type {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
.volume_box-son-bottom {
|
||||
position: absolute;
|
||||
|
|
|
|||
Loading…
Reference in New Issue