elink-star
/
epmet-work-pc
17
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

12345的样式更改

luckysheet_xiaowang
是小王呀\24601 6 months ago
parent
5422f339c4
commit
05fc3d3294
2 changed files with 90 additions and 79 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 38
      src/views/modules/shequzhili/analysis/css/index.scss
  2. 103
      src/views/modules/shequzhili/analysis/index.vue

38
src/views/modules/shequzhili/analysis/css/index.scss
View File

@ -93,7 +93,8 @@ border-left: #777 solid 1px;
margin-left: 20px;
margin-bottom: 10px;
.item {
width: 200px;
width: 188px;
height: 280px;
display: flex;
flex-direction: column;
background: #f3f9ff;
@ -110,27 +111,34 @@ border-left: #777 solid 1px;
padding: 8px;
flex-direction: column;
>img {
width: 66px;
height: 66px;
margin-top: 10px;
width: 50px;
height: 50px;
margin-bottom: 10px;
}
.row_left {
margin-top: 8px;
font-family: PingFang SC;
font-weight: bold;
font-size: 18px;
color: #333333;
text-align: center;
margin-left: 5px;
white-space: nowrap;
font-size: 14px;
line-height: 32px;
}
.item_content {
margin-left: 5px;
width: 100%;
text-align: left;
display: flex;
flex-direction: column;
justify-content: flex-start;
text-align: center;
font-family: PingFang SC;
font-weight: 500;
font-size: 14px;
color: #aaadb1;
line-height: 32px;
.img_describe {
width: 10px;
height: 10px;
margin-left: 3px;
margin-bottom: 2px;
}
.item_count {
font-size: 28px;
font-family: PingFang SC;
@ -182,8 +190,7 @@ border-left: #777 solid 1px;
justify-content: space-between;
align-items: center;
height: 23px;
margin-top: 10px;
margin-top: 5px;
.row_left {
font-size: 14px;
font-weight: 500;
@ -271,6 +278,7 @@ border-left: #777 solid 1px;
position: relative;
width: 280px;
img {
width: 100%;
}

103
src/views/modules/shequzhili/analysis/index.vue
View File

@ -23,7 +23,6 @@
<h1 style="font-size: 24px; font-weight: bold;"> 镇街办件情况总览 </h1>
</div>
<div class="div_room">
<div class="item2">
<img src="./img/responsivity.png" />
<div class="item2_div">
@ -39,10 +38,9 @@
<div class="item2_div">
<span class="div_span1">98%</span>
<div style="display: flex; align-items: center;justify-content:center;">
<span class="div_span2">按时办结率</span>
<span class="div_span2">办结率</span>
<img style="width: 10px;height: 10px;margin-top: 10px;margin-left: 5px;" src="./img/describe.png">
</div>
</div>
</div>
<div class="item2">
@ -72,82 +70,79 @@
<div>派件/派件</div>
<div class="item" @click="onEventNum()">
<div class="item_category">
<img src="@/assets/images/category/perpon.png" alt />
<img src="./img/eventSumNum.png" alt />
<div class="row_left">{{ analysisList.total}}</div>
<div class="row_left">收件数<img style="width: 10px;height: 10px;" src="./img/describe.png"></div>
<div class="item_content">收件数<img class="img_describe" src="./img/describe1.png"></div>
<div class="row_left">{{ analysisList.total}}</div>
<div class="row_left">收件数<img style="width: 10px;height: 10px;" src="./img/describe.png"></div>
<div class="item_content">派件数<img class="img_describe" src="./img/describe1.png"></div>
</div>
</div>
</div>
<div style="display: flex; justify-content: center; flex-direction: column; align-items: center;">
<div>派件/派件</div>
<div class="item">
<div class="item_category" @click="onEventNum('resolve')" style="cursor: pointer;">
<img src="./img//eventNum.png" />
<div class="row_left">{{analysisList.resolveTotal}}</div>
<div class="row_left">已办结事件数</div>
<div class="row_left">{{analysisList.resolveTotal}}</div>
<div class="row_left">已办结事件数</div>
<div class="row_left">{{analysisList.resolveTotal}}</div>
<div class="row_left">已办结事件数</div>
<div>办理</div>
<div class="item" @click="onEventNum()" style="background-color: #f2fffb;">
<div class="item_category">
<img src="./img/perp.png" alt />
<div class="row_left">{{ analysisList.total}}</div>
<div class="item_content">已联系当事人(初访)件数<img class="img_describe" src="./img/describe1.png"></div>
<div class="row_left">{{ analysisList.total}}</div>
<div class="item_content">办理中件数<img class="img_describe" src="./img/describe1.png"></div>
</div>
</div>
</div>
<div style="display: flex; justify-content: center; flex-direction: column; align-items: center;">
<div>派件/派件</div>
<div class="item" @click="onEventNum('1')">
<div>办结</div>
<div class="item" @click="onEventNum()" style="background-color: #f4fdff; width: 280px;">
<div class="item_category">
<img src="./img/perp.png" alt />
<div class="item_content">
<div class="item_row1">
<div class="row_left">{{analysisList.illegalConnectTotal}}</div>
<div class="text1">{{analysisList.illegalConnectRate}}%</div>
<img src="@/assets/images/category/perpon.png" alt />
<div style=" display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; ">
<div class="flex">
<div class="row_left">{{ analysisList.total}}</div>
<div class="item_content">收件数<img class="img_describe" src="./img/describe1.png"></div>
</div>
<div class="flex">
<div class="row_left">{{ analysisList.total}}</div>
<div class="item_content">收件数<img class="img_describe" src="./img/describe1.png"></div>
</div>
<div class="item_row2">
<div class="row_left">联系当事人超期事件数</div>
<div class="flex">
<div class="row_left">{{ analysisList.total}}</div>
<div class="item_content">收件数<img class="img_describe" src="./img/describe1.png"></div>
</div>
<div class="flex">
<div class="row_left">{{ analysisList.total}}</div>
<div class="item_content">收件数<img class="img_describe" src="./img/describe1.png"></div>
</div>
</div>
</div>
</div>
</div>
<div style="display: flex; justify-content: center; flex-direction: column; align-items: center;">
<div>派件/派件</div>
<div class="item" @click="onEventNum('2')">
<div>退件/不合规申请件</div>
<div class="item" @click="onEventNum()" style="background-color:#fffdf0;">
<div class="item_category">
<img src="@/assets/images/category/perpon.png" alt />
<div class="item_content">
<div class="item_row1">
<div class="row_left">{{analysisList.illegalResolveTotal}}</div>
<div class="text2">{{analysisList.illegalResolveRate}}%</div>
</div>
<div class="item_row2">
<div class="row_left">办理超期事件数</div>
</div>
</div>
<div class="row_left">{{ analysisList.total}}</div>
<div class="item_content">收件数<img class="img_describe" src="./img/describe1.png"></div>
<div class="row_left">{{ analysisList.total}}</div>
<div class="item_content">收件数<img class="img_describe" src="./img/describe1.png"></div>
<div class="row_left">{{ analysisList.total}}</div>
<div class="item_content">收件数<img class="img_describe" src="./img/describe1.png"></div>
</div>
</div>
</div>
<div style="display: flex; justify-content: center; flex-direction: column; align-items: center;">
<div>派件/派件</div>
<div>退件/不合规申请件</div>
<div class="item" @click="onEventNum('3')">
<div class="item_category">
<img src="./img/acttive.png" alt />
<div class="item_content">
<div class="item_row1">
<div class="row_left">{{ analysisList.tackleWarehouseTotal }}</div>
<div class="text2">{{ analysisList.tackleWarehouseRate }}%</div>
</div>
<div class="item_row2">
<div class="row_left">攻坚事件数</div>
</div>
</div>
<div class="row_left">{{ analysisList.total }}</div>
<div class="item_content">收件数<img class="img_describe" src="./img/describe1.png"></div>
<div class="row_left">{{ analysisList.total }}</div>
<div class="item_content">收件数<img class="img_describe" src="./img/describe1.png"></div>
</div>
</div>
</div>
@ -1354,7 +1349,15 @@ thead {
width: 100px; /* 调整箭头容器的宽度 */
height: 100px; /* 调整箭头容器的高度 */
}
.flex-x{
}
.flex {
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
}
.arrow {
width: 0;
height: 0;

Write Preview
Loading…
Cancel
Save