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

12344

feature
是小王呀\24601 1 year ago
parent
fefa09bcae
commit
0a2b2cde1d
2 changed files with 263 additions and 102 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. 176
      src/views/modules/shequzhili/analysis/css/index.scss
  2. 189
      src/views/modules/shequzhili/analysis/index.vue

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

@ -95,7 +95,7 @@ border-left: #777 solid 1px;
.item {
width: 282px;
height: 86px;
background: #E6F0FF;
background: #f7faff;
border-radius: 6px;
margin: 15px 25px 15px 0;
display: flex;
@ -128,12 +128,11 @@ border-left: #777 solid 1px;
.item_row1 {
border-radius: 4px;
display: flex;
justify-content: space-between;
align-items: center;
height: 23px;
.row_left {
font-size: 14px;
font-size: 18px;
font-family: PingFang SC;
font-weight: 500;
color: #666666;
@ -153,10 +152,11 @@ border-left: #777 solid 1px;
margin-top: 2px;
}
.text{
font-size: 20px;
font-size: 16px;
font-family: PingFang SC;
color: #333333;
margin-right: 5px;
padding-left:10px ;
}
}
@ -169,7 +169,7 @@ border-left: #777 solid 1px;
height: 23px;
margin-top: 10px;
.row_left {
font-size: 14px;
font-size: 18px;
font-family: PingFang SC;
font-weight: 500;
color: #666666;
@ -189,10 +189,10 @@ border-left: #777 solid 1px;
margin-top: 2px
}
.text{
font-size: 18px;
font-size: 16px;
font-family: PingFang SC;
color: #666666;
margin-right: 5px;
color: #333333;
padding-left:10px
}
}
@ -248,4 +248,160 @@ border-left: #777 solid 1px;
border: 1px solid #6bb9f8;
}
}
}
.item1 {
width: 400px;
height: 86px;
background: #f7faff;
border-radius: 6px;
margin: 15px 25px 15px 0;
display: flex;
position: relative;
.item_category {
width: 100%;
display: flex;
align-items: center;
padding: 8px;
> img {
width: 66px;
height: 66px;
}
.item_content {
margin-left: 5px;
width: 100%;
text-align: left;
display: flex;
flex-direction: column;
justify-content: flex-start;
.item_count {
font-size: 28px;
font-family: PingFang SC;
font-weight: bold;
color: #333333;
}
.item_row1 {
border-radius: 4px;
display: flex;
align-items: center;
height: 23px;
.row_left {
font-size: 11px;
font-family: PingFang SC;
font-weight: 500;
color: #666666;
text-align: center;
margin-left: 5px;
}
.row_right {
margin: 0px 5px 0 0;
cursor: pointer;
display: flex;
flex-direction: row;
.img{
width: 16px;
height: 16px;
margin-top: 2px;
}
.text{
font-size: 16px;
font-family: PingFang SC;
color: #333333;
padding-left:10px
}
}
}
.item_row2 {
border-radius: 4px;
display: flex;
justify-content: space-between;
align-items: center;
height: 23px;
margin-top: 10px;
.row_left {
font-size: 18px;
font-family: PingFang SC;
font-weight: 500;
color: #666666;
text-align: center;
margin-left: 5px;
}
.row_right {
margin: 0px 5px 0 0;
cursor: pointer;
display: flex;
flex-direction: row;
.img{
width: 16px;
height: 16px;
margin-top: 2px
}
.text{
font-size: 16px;
font-family: PingFang SC;
color: #333333;
padding-left:10px
}
}
}
}
> span {
margin-left: 16px;
font-size: 24px;
}
}
.item_add {
cursor: pointer;
font-size: 24px;
font-family: PingFang SC;
font-weight: 500;
color: #333333;
display: flex;
align-items: center;
padding: 17px 16px;
> img {
width: 86px;
height: 86px;
}
> span {
font-size: 24px;
font-family: PingFang SC;
font-weight: 500;
color: #333333;
margin-left: 16px;
}
}
.icon_circle {
cursor: pointer;
position: absolute;
top: -10px;
right: -10px;
height: 23px;
width: 23px;
background-color: #ffffff;
border-radius: 50%;
border: 1px solid #a5a5a5;
}
.icon_sel {
cursor: pointer;
background-color: #6bb9f8;
border: 1px solid #6bb9f8;
}
}
}

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

@ -22,88 +22,85 @@
<div style="display: flex;justify-content: space-between;flex-direction:row;">
<h1 style="font-size: 24px; font-weight: bold;"> 事件统计 </h1>
</div>
<div class="dashboard">
<div class="card">
<div class="card-icon ">
<img style="width: 40px;height: 40px;" src="./img/eventSumNum.png">
</div>
<div class="card-content">
<p class="card-title">{{analysisList.total}}</p>
<p class="card-text">事件总数</p>
</div>
</div>
<div class="card1">
<div class="card-icon ">
<img style="width: 40px;height: 40px;" src="./img/eventNum.png">
</div>
<div class="card-content1">
<div style="display: flex;flex-direction: column;justify-content: center;">
<div style="display: flex;flex-direction: row;">
<p class="card-title">{{analysisList.resolveTotal}}</p>
<span class="percentage">{{analysisList.resolveRate}}%</span>
</div>
<p class="card-text">已办结事件数</p>
</div>
<div style="padding-left: 20px; display: flex;flex-direction: column;justify-content: center;">
<div style="display: flex;flex-direction: row;">
<p class="card-title">{{analysisList.unresolveTotal}}</p>
<span class="percentage">{{analysisList.unresolveRate}}%</span>
</div>
<p class="card-text">未办结事件数</p>
</div>
</div>
</div>
<div class="card">
<div class="card-icon ">
<img style="width: 40px;height: 40px;" src="./img/perp.png">
</div>
<div class="card-content">
<p class="card-title">{{analysisList.illegalConnectTotal}} <span class="percentage">{{analysisList.illegalConnectRate}}%</span></p>
<p class="card-text">联系当事人超期事件数</p>
</div>
</div>
<div class="card">
<div class="card-icon ">
<img style="width: 40px;height: 40px;" src="./img/overdue.png">
</div>
<div class="card-content">
<p class="card-title">{{analysisList.illegalResolveTotal}} <span class="percentage">{{analysisList.illegalResolveRate}}%</span></p>
<p class="card-text">办理超期事件数</p>
</div>
</div>
<div class="div_room">
<div class="item">
<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.total}}</div>
</div>
<div class="item_row2">
<div class="row_left">事件总数</div>
</div>
</div>
</div>
</div>
<div class="item1">
<div class="item_category">
<img src="@/assets/images/category/perpon.png" />
<div class="item_content">
<div class="item_row1">
<div class="row_left">{{analysisList.resolveTotal}}</div>
<div class="text">{{analysisList.resolveRate}}%</div>
</div>
<div class="item_row2">
<div class="row_left">已办结事件数</div>
</div>
</div>
</div>
<div class="item_category">
<div class="item_content">
<div class="item_row1">
<div class="row_left">{{analysisList.unresolveTotal}}</div>
<div class="text">{{analysisList.resolveRate}}%</div>
</div>
<div class="item_row2">
<div class="row_left">未办结事件数</div>
</div>
</div>
</div>
</div>
<div class="item">
<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.illegalConnectTotal}}</div>
<div class="text">{{analysisList.illegalConnectRate}}%</div>
</div>
<div class="item_row2">
<div class="row_left">联系当事人超期事件数</div>
</div>
</div>
</div>
</div>
<div class="item">
<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="text">{{analysisList.illegalResolveRate}}%</div>
</div>
<div class="item_row2">
<div class="row_left">办理超期事件数</div>
</div>
</div>
</div>
</div>
</div>
<div style="display: flex;justify-content: space-between;flex-direction:row;">
<h1 style="font-size: 24px; font-weight: bold;"> 事件类型统计 </h1>
</div>
<!-- <table >
<thead>
<tr>
<th>一级分类</th>
<th>二级分类</th>
<th>三级分类</th>
<th>四级分类</th>
<th>事件数量</th>
<th>同级占比</th>
</tr>
<tr v-for="item in tableList" :key="item.id" :item="item" :level=1>
<td v-if="level === 1" :rowspan="calculateRowspan(item)">{{ item.categoryName }}</td>
<td v-else></td>
<td v-if="level === 2" :rowspan="calculateRowspan(item)">{{ item.categoryName }}</td>
<td v-else></td>
<td v-if="level === 3" :rowspan="calculateRowspan(item)">{{ item.categoryName }}</td>
<td v-else></td>
<td v-if="level === 4">{{ item.categoryName }}</td>
<td v-if="level === 4">{{ item.eventCount }}</td>
<td v-if="level === 4">{{ item.proportion }}</td>
<td v-else></td>
<td >{{ item.eventCount }}</td>
<td >{{item.proportion}}</td>
</tr>
<TableRow v-for="item in tableList" :key="item.id" :item="item" :level="1" />
</thead>
</table> -->
<el-table
:data="tableList"
style="width: 100%;margin-bottom: 20px;"
@ -154,7 +151,7 @@
</el-table>
<div style="display: flex;justify-content: space-between;flex-direction:row; height:500px">
<div style="display: flex;justify-content: space-between;flex-direction:column;">
<div style="display: flex;width: 50%; margin-right: 10px; justify-content: space-between;flex-direction:column;">
<h1 style="font-size: 24px; font-weight: bold;"> 部门科室工单量统计 </h1>
<el-table :data="departmentList" height="250" border class="m-table-item" style="width: 100%">
<!-- <el-table-column label="序号" fixed="left" type="index" align="center" width="50" /> -->
@ -169,12 +166,12 @@
<el-table-column prop="totalRate" align="center" label="占比" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="unresolveRate" align="center" label="未办结数" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="illegalConnectRate" align="center" label="联系当事人超期数" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="cillegalResolveRateontent" align="center" label="办理超期数" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="illegalResolveTotal" align="center" label="办理超期数" :show-overflow-tooltip="true"></el-table-column>
</el-table>
</div>
<div style="display: flex;justify-content: space-between;flex-direction:column;">
<h1 style="font-size: 24px; font-weight: bold; margin-right: 600px;"> 社区工单量统计 </h1>
<div style="display: flex;margin-right: 10px; justify-content: space-between;flex-direction:column;">
<h1 style="font-size: 24px; font-weight: bold;"> 社区工单量统计 </h1>
<el-table :data="communityList" height="300" border class="m-table-item" style="width: 100%">
<!-- <el-table-column label="序号" fixed="left" type="index" align="center" width="50" /> -->
<!-- <el-table-column prop="address" align="center" label="地点" :show-overflow-tooltip="true"></el-table-column> -->
@ -188,7 +185,7 @@
<el-table-column prop="totalRate" align="center" label="占比" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="unresolveRate" align="center" label="未办结数" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="illegalConnectRate" align="center" label="联系当事人超期数" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="cillegalResolveRateontent" align="center" label="办理超期数" :show-overflow-tooltip="true"></el-table-column>
<el-table-column prop="illegalResolveTotal" align="center" label="办理超期数" :show-overflow-tooltip="true"></el-table-column>
</el-table>
</div>
@ -674,6 +671,7 @@ export default {
mounted() {
this.user = this.$store.state.user;
this.agencyId = this.user.agencyId;
this.getLastMonthRange()
this.getOrgData();
this.agencyLevel = localStorage.getItem("level", this.orgData.level);
this.getTableData();
@ -979,22 +977,29 @@ export default {
formatDate1(date) {
// 获取年份、月份和日期
const year = date.getFullYear();
const month = date.getMonth() + 1; // 月份从0开始
const day = date.getDate();
const month = (date.getMonth() + 1).toString().padStart(2, '0');
const day = date.getDate().toString().padStart(2, '0');
const hours = date.getHours().toString().padStart(2, '0');
const minutes = date.getMinutes().toString().padStart(2, '0');
const seconds = date.getSeconds().toString().padStart(2, '0');
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
// 返回格式化的字符串
return `${year}-${month}-${day} 00:00:00`;
},
//获取前一个月的日期
getLastMonthRange() {
const now = new Date();
const firstDayOfCurrentMonth = new Date(Date.UTC(now.getUTCFullYear(), now.getUTCMonth(), 1));
const lastDayOfLastMonth = new Date(firstDayOfCurrentMonth - 1);
const firstDayOfLastMonth = new Date(Date.UTC(lastDayOfLastMonth.getUTCFullYear(), lastDayOfLastMonth.getUTCMonth(), 1));
firstDayOfLastMonth.setUTCHours(0, 0, 0, 0);
lastDayOfLastMonth.setUTCHours(0, 0, 0, 0);
const firstDayOfCurrentMonth = new Date(now.getFullYear(), now.getMonth(), 1);
const lastDayOfLastMonth = new Date(firstDayOfCurrentMonth - 1);
const firstDayOfLastMonth = new Date(lastDayOfLastMonth.getFullYear(), lastDayOfLastMonth.getMonth(), 1);
firstDayOfLastMonth.setHours(0, 0, 0, 0);
lastDayOfLastMonth.setHours(23, 59, 59, 999);
this.formData.queryDateStart =this.formatDate1(firstDayOfLastMonth),
this.formData.queryDateEnd=this.formatDate1(lastDayOfLastMonth)
console.log(this.formData.queryDateEnd);
},
//对部门进行统计
async EventCate(){

Write Preview
Loading…
Cancel
Save