Commit 02ba8992 authored by 曹雷's avatar 曹雷

统计页面调整

parent 5a3df100
html { html, body {
height: 100vh; height: 100%;
overflow: hidden;
} }
.ds { .ds {
max-width: 1900px; max-width: 1900px;
...@@ -11,6 +12,7 @@ html { ...@@ -11,6 +12,7 @@ html {
margin: 2vh 0; margin: 2vh 0;
margin-left: 10%; margin-left: 10%;
height: 5vh; height: 5vh;
max-height: 40px;
} }
.ds-content { .ds-content {
width: 100%; width: 100%;
...@@ -47,21 +49,24 @@ html { ...@@ -47,21 +49,24 @@ html {
margin-top: 3%; margin-top: 3%;
} }
.ds-content-source { .ds-content-source {
display: flex; /* display: flex; */
max-width: 1000px; max-width: 1000px;
margin: 0 auto; margin: 0 auto;
height: calc(100% - 100px); height: calc(100% - 100px);
} }
.ds-content-city { .ds-content-city {
flex-basis: 400px; /* flex-basis: 400px; */
float: left;
width: 35%;
padding-right: 10px; padding-right: 10px;
height: 100%; height: 100%;
flex-grow: 1; /* flex-grow: 1;
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end; */
} }
.ds-content-city-float { .ds-content-city-float {
width: 300px; width: 300px;
margin-left: auto;
} }
.ds-content-city-float > p { .ds-content-city-float > p {
width: 90px; width: 90px;
...@@ -74,8 +79,10 @@ html { ...@@ -74,8 +79,10 @@ html {
margin-left: 10px; margin-left: 10px;
} }
.ds-content-district { .ds-content-district {
flex-basis: 600px; float: left;
flex-grow: 2; width: 58%;
/* flex-basis: 600px;
flex-grow: 2; */
height: 100%; height: 100%;
margin-left: 10px; margin-left: 10px;
} }
...@@ -137,6 +144,7 @@ html { ...@@ -137,6 +144,7 @@ html {
margin-bottom: 8px; margin-bottom: 8px;
} }
.ds-divide-line { .ds-divide-line {
float: left;
width: 2px; width: 2px;
margin: 10px 20px; margin: 10px 20px;
height: 40vh; height: 40vh;
...@@ -170,13 +178,14 @@ html { ...@@ -170,13 +178,14 @@ html {
font-size: 20px; font-size: 20px;
} }
.ds-content-city { .ds-content-city {
flex-basis: 350px; /* flex-basis: 350px; */
padding-right: 0; padding-right: 0;
height: 100%; height: 100%;
flex-grow: 1; min-width: 210px;
/* flex-grow: 1; */
} }
.ds-content-city-float { .ds-content-city-float {
width: 220px; width: 210px;
} }
.ds-content-city-float > p { .ds-content-city-float > p {
font-size: 16px; font-size: 16px;
...@@ -184,7 +193,7 @@ html { ...@@ -184,7 +193,7 @@ html {
margin: 6px 5px; margin: 6px 5px;
} }
.ds-content-district { .ds-content-district {
flex-grow: 1; /* flex-grow: 1; */
margin: 0 auto; margin: 0 auto;
} }
.ds-content-district > p { .ds-content-district > p {
...@@ -219,20 +228,17 @@ html { ...@@ -219,20 +228,17 @@ html {
font-size: 25px; font-size: 25px;
} }
.ds-content-city { .ds-content-city {
flex-basis: 400px;
padding-right: 0; padding-right: 0;
height: 100%; height: 100%;
flex-grow: 1;
} }
.ds-content-city-float { .ds-content-city-float {
width: 100%; width: 100%;
float: none;
} }
.ds-content-city-float > p { .ds-content-city-float > p {
font-size: 18px; font-size: 18px;
} }
.ds-content-district { .ds-content-district {
flex-grow: 1; /* flex-grow: 1; */
margin: 0 auto; margin: 0 auto;
} }
.ds-content-district > p { .ds-content-district > p {
...@@ -250,10 +256,10 @@ html { ...@@ -250,10 +256,10 @@ html {
font-size: 25px; font-size: 25px;
} }
.ds-content-city { .ds-content-city {
flex-basis: 400px; /* flex-basis: 400px; */
padding-right: 10px; padding-right: 10px;
height: 100%; height: 100%;
flex-grow: 1; /* flex-grow: 1; */
} }
.ds-content-city-float { .ds-content-city-float {
width: 300px; width: 300px;
...@@ -262,7 +268,7 @@ html { ...@@ -262,7 +268,7 @@ html {
font-size: 18px; font-size: 18px;
} }
.ds-content-district { .ds-content-district {
flex-grow: 1; /* flex-grow: 1; */
margin: 0 auto; margin: 0 auto;
} }
.ds-content-district > p { .ds-content-district > p {
......
...@@ -10,14 +10,12 @@ body { ...@@ -10,14 +10,12 @@ body {
background-color: white; background-color: white;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
} padding: 5px 0;
.flex {
/* flex: 1; */
} }
.statistics-content { .statistics-content {
margin: 6px 6px; margin: 6px 6px;
display: flex; display: flex;
height: calc(100vh - 80px); height: calc(100vh - 90px);
} }
.statistics-content-item { .statistics-content-item {
background-color: white; background-color: white;
...@@ -31,24 +29,40 @@ body { ...@@ -31,24 +29,40 @@ body {
height: 60%; height: 60%;
} }
.statistics-content-item-title { .statistics-content-item-title {
padding: 20px 0 0 20px; padding: 12px 0 0 20px;
font-size: 14px; font-size: 14px;
color: #777c82;
}
.statistics-content-item-title-remark {
float: right;
margin-right: 20px;
} }
.nums-total { .nums-total {
width: 140px; width: 140px;
height: 70px; height: 91px;
display: inline-block; display: inline-block;
background-size: cover !important; background-size: cover !important;
font-size: 12px; font-size: 12px;
} }
.nums-title { .nums-title {
color: white; color: white;
margin: 10px 10px; margin: 20px 10px 10px 10px;
font-weight: 700;
}
.nums-title-num {
color: white;
margin: 0px 10px 20px 10px;
font-weight: 700; font-weight: 700;
} }
.nums-total-nums { .nums-total-nums {
font-size: 18px; font-size: 22px;
} }
.idp-total-nums { .idp-total-nums {
color: rgb(77, 160, 255); color: rgb(77, 160, 255);
} }
.nums-by-idp {
width: 100%;
padding: 8px 20px 0 20px;
display: flex;
justify-content: space-between;
}
\ No newline at end of file
...@@ -127,8 +127,8 @@ ...@@ -127,8 +127,8 @@
<div class="statistics-content-item item-height-higher"> <div class="statistics-content-item item-height-higher">
<p class="statistics-content-item-title">认证热点单位<span class="statistics-content-item-title-remark">单位:人次</span> <p class="statistics-content-item-title">认证热点单位<span class="statistics-content-item-title-remark">单位:人次</span>
</p> </p>
<div id="user-org" style="height: calc(100% - 40px)"> <div id="user-org" style="height: calc(100% - 40px); margin-top: 8px;">
<p style="padding: 6px 20px 0 20px; color: #5f646a; font-size: 12px; line-height: 1.8;" v-for="item in userOrgList"><span <p style="padding: 5px 20px 0 20px; color: #5f646a; font-size: 12px; line-height: 1.8;" v-for="item in userOrgList"><span
style="color: orange; font-weight: 900; padding-right: 8px;">·</span><span v-text="item.name"></span><span style="color: orange; font-weight: 900; padding-right: 8px;">·</span><span v-text="item.name"></span><span
style="float: right;" v-text="item.count"></span></p> style="float: right;" v-text="item.count"></span></p>
</div> </div>
...@@ -229,7 +229,7 @@ ...@@ -229,7 +229,7 @@
}, },
legend: { legend: {
icon: "circle", icon: "circle",
bottom: 10, bottom: 0,
data: ["数字教材", "阅览室", "其他"] data: ["数字教材", "阅览室", "其他"]
}, },
series: [ series: [
...@@ -237,11 +237,9 @@ ...@@ -237,11 +237,9 @@
name: "应用来源", name: "应用来源",
type: "pie", type: "pie",
radius: ["40%", "60%"], radius: ["40%", "60%"],
center: ["50%", "42%"], center: ["50%", "48%"],
label: { label: {
position: 'outside', position: 'outside',
alignTo: 'edge',
margin: 10,
formatter: "{per|{d}%}", formatter: "{per|{d}%}",
rich: { rich: {
per: { per: {
...@@ -603,7 +601,7 @@ ...@@ -603,7 +601,7 @@
}, },
legend: { legend: {
icon: "circle", icon: "circle",
bottom: 10, bottom: 0,
data: [] data: []
}, },
series: [ series: [
...@@ -611,11 +609,9 @@ ...@@ -611,11 +609,9 @@
name: "访客身份", name: "访客身份",
type: "pie", type: "pie",
radius: ["30%", "50%"], radius: ["30%", "50%"],
center: ["50%", "40%"], center: ["50%", "48%"],
label: { label: {
position: 'outside', position: 'outside',
alignTo: 'edge',
margin: 10,
formatter: "{per|{d}%}", formatter: "{per|{d}%}",
rich: { rich: {
per: { per: {
......
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