数据驾驶舱后台动态增删

This commit is contained in:
周源 2021-08-03 13:47:44 +08:00
parent ce989bd7a8
commit b43f72c5e1
106 changed files with 4560 additions and 119 deletions

View File

@ -149,9 +149,11 @@ public class ApiStatisticsVoterController extends ApiBaseController {
@GetMapping("people_condition/analyze") @GetMapping("people_condition/analyze")
public void peopleConditionAnalyze() { public void peopleConditionAnalyze() {
String countStr = ConfigUtils.getStr("screen_vote_handle_analyze"); String countStr = ConfigUtils.getStr("screen_vote_handle_analyze");
if (StrUtil.isNotBlank(countStr)) { String statusStr = ConfigUtils.getStr("screen_vote_handle_analyze_status");
if (StrUtil.isNotBlank(countStr)&&StrUtil.isNotBlank(statusStr)) {
String[] countArr = countStr.split(","); String[] countArr = countStr.split(",");
Dict dict = Dict.create().set("countArr", countArr); String[] statusArr = statusStr.split(",");
Dict dict = Dict.create().set("countArr", countArr).set("statusArr",statusArr);
render(Ret.ok().data(dict)); render(Ret.ok().data(dict));
} }
} }

View File

@ -11,4 +11,6 @@ public class ShowVoterBo {
String categoryCondition; String categoryCondition;
String hotKey; String hotKey;
String handleAnalyze; String handleAnalyze;
String handleAnalyzeStatus;
} }

View File

@ -43,11 +43,11 @@ public class ShowController extends BaseAdminController {
Config cycleRateConfig = getConfigByCode("screen_activity_cycle_rate"); Config cycleRateConfig = getConfigByCode("screen_activity_cycle_rate");
Config sameRateConfig = getConfigByCode("screen_activity_same_rate"); Config sameRateConfig = getConfigByCode("screen_activity_same_rate");
model.addAttribute("channel", channelConfig.getParamValue()); model.addAttribute("channel", channelConfig.getParamValue().split(","));
model.addAttribute("peopleCount", peopleCountConfig.getParamValue()); model.addAttribute("channelRate", channelRateConfig.getParamValue().split(","));
model.addAttribute("channelRate", channelRateConfig.getParamValue()); model.addAttribute("peopleCount", peopleCountConfig.getParamValue().split(","));
model.addAttribute("cycleRate", cycleRateConfig.getParamValue()); model.addAttribute("cycleRate", cycleRateConfig.getParamValue().split(","));
model.addAttribute("sameRate", sameRateConfig.getParamValue()); model.addAttribute("sameRate", sameRateConfig.getParamValue().split(","));
return "modules/rddb/show/contact.html"; return "modules/rddb/show/contact.html";
} }
@ -66,22 +66,24 @@ public class ShowController extends BaseAdminController {
Config categoryConditionConfig = getConfigByCode("screen_vote_category_condition"); Config categoryConditionConfig = getConfigByCode("screen_vote_category_condition");
Config hotKeyConfig = getConfigByCode("screen_vote_hot_key"); Config hotKeyConfig = getConfigByCode("screen_vote_hot_key");
Config handleAnalyzeConfig = getConfigByCode("screen_vote_handle_analyze"); Config handleAnalyzeConfig = getConfigByCode("screen_vote_handle_analyze");
Config handleAnalyzeStatusConfig = getConfigByCode("screen_vote_handle_analyze_status");
model.addAttribute("averageTime", averageTimeConfig.getParamValue()); model.addAttribute("averageTime", averageTimeConfig.getParamValue());
model.addAttribute("ontimeRate", ontimeRateConfig.getParamValue()); model.addAttribute("ontimeRate", ontimeRateConfig.getParamValue());
model.addAttribute("satisfactionRate", satisfactionRateConfig.getParamValue()); model.addAttribute("satisfactionRate", satisfactionRateConfig.getParamValue());
model.addAttribute("category", categoryConfig.getParamValue()); model.addAttribute("category", categoryConfig.getParamValue().split(","));
model.addAttribute("categoryCondition", categoryConditionConfig.getParamValue()); model.addAttribute("categoryCondition", categoryConditionConfig.getParamValue().split(","));
model.addAttribute("hotKey", hotKeyConfig.getParamValue()); model.addAttribute("hotKey", hotKeyConfig.getParamValue().split(","));
model.addAttribute("handleAnalyze", handleAnalyzeConfig.getParamValue()); model.addAttribute("handleAnalyze", handleAnalyzeConfig.getParamValue().split(","));
model.addAttribute("handleAnalyzeStatus", handleAnalyzeStatusConfig.getParamValue().split(","));
return "modules/rddb/show/voter.html"; return "modules/rddb/show/voter.html";
} }
@GetMapping("office") @GetMapping("office")
public String office(Model model) { public String office(Model model) {
Config config = getConfigByCode("screen_office_country_rank"); Config config = getConfigByCode("screen_office_country_rank");
model.addAttribute("region", config.getParamValue()); model.addAttribute("region", config.getParamValue().split(","));
model.addAttribute("regionNum", config.getRemarks()); model.addAttribute("regionNum", config.getRemarks().split(","));
return "modules/rddb/show/office.html"; return "modules/rddb/show/office.html";
} }
@ -120,6 +122,7 @@ public class ShowController extends BaseAdminController {
Config categoryConditionConfig = getConfigByCode("screen_vote_category_condition"); Config categoryConditionConfig = getConfigByCode("screen_vote_category_condition");
Config hotKeyConfig = getConfigByCode("screen_vote_hot_key"); Config hotKeyConfig = getConfigByCode("screen_vote_hot_key");
Config handleAnalyzeConfig = getConfigByCode("screen_vote_handle_analyze"); Config handleAnalyzeConfig = getConfigByCode("screen_vote_handle_analyze");
Config handleAnalyzeStatusConfig = getConfigByCode("screen_vote_handle_analyze_status");
averageTimeConfig.setParamValue(bo.getAverageTime()); averageTimeConfig.setParamValue(bo.getAverageTime());
ontimeRateConfig.setParamValue(bo.getOntimeRate()); ontimeRateConfig.setParamValue(bo.getOntimeRate());
@ -128,6 +131,7 @@ public class ShowController extends BaseAdminController {
categoryConditionConfig.setParamValue(bo.getCategoryCondition()); categoryConditionConfig.setParamValue(bo.getCategoryCondition());
hotKeyConfig.setParamValue(bo.getHotKey()); hotKeyConfig.setParamValue(bo.getHotKey());
handleAnalyzeConfig.setParamValue(bo.getHandleAnalyze()); handleAnalyzeConfig.setParamValue(bo.getHandleAnalyze());
handleAnalyzeStatusConfig.setParamValue(bo.getHandleAnalyzeStatus());
boolean flag1 = configService.updateById(averageTimeConfig); boolean flag1 = configService.updateById(averageTimeConfig);
boolean flag2 = configService.updateById(ontimeRateConfig); boolean flag2 = configService.updateById(ontimeRateConfig);
@ -136,9 +140,10 @@ public class ShowController extends BaseAdminController {
boolean flag5 = configService.updateById(categoryConditionConfig); boolean flag5 = configService.updateById(categoryConditionConfig);
boolean flag6 = configService.updateById(hotKeyConfig); boolean flag6 = configService.updateById(hotKeyConfig);
boolean flag7 = configService.updateById(handleAnalyzeConfig); boolean flag7 = configService.updateById(handleAnalyzeConfig);
boolean flag8 = configService.updateById(handleAnalyzeStatusConfig);
CacheUtils.clear(SysCacheName.SYS_DICT_CACHE); CacheUtils.clear(SysCacheName.SYS_DICT_CACHE);
render((flag1 && flag2 && flag3 && flag4 && flag5 && flag6 && flag7) ? Ret.ok() : Ret.fail("操作失败")); render((flag1 && flag2 && flag3 && flag4 && flag5 && flag6 && flag7 && flag8) ? Ret.ok() : Ret.fail("操作失败"));
} }

View File

@ -0,0 +1,374 @@
.menu{
position: fixed;
width: 100%;
bottom: 0;
z-index: 99;
display: flex;
justify-content: space-between;
background: #0F1A46;
height: 60px;
align-items: center;
padding:0 5%;
box-sizing: border-box;
}
.menu .iconfont{
font-size: 20px;
margin-bottom: 2px;
text-align: center;
}
.menu a{
color: #fff;
}
.menu .active{
color: #00E9F9;
}
.allname{
background: url('../img/namebg.png') no-repeat;
height: 60px;
background-size: 100% 100%;
text-align: center;
line-height: 60px;
font-weight: bold;
font-size: 20px;
}
.charts{
padding:0 5% 30px;
}
.charts>div{
margin-top: 30px;
}
.charts>div .name{
color: #fff;
background: url('../img/title.png') no-repeat;
background-size: 100% 100%;
display: inline-block;
padding:0 10px;
box-sizing: border-box;
height: 40px;
line-height: 40px;
}
.circle{
display: flex;
justify-content: space-between;
}
.circle>div{
flex: 1;
}
.circle p{
text-align:center;
color:#fff;
}
.map{
position: relative;
}
.map>img{
width: 100%;
}
.dimap{
position: absolute;
top: 0;
width: 100%;
height: 100%;
}
.dimap img{
width: 12px;
}
.dimap>div{
position: absolute;
z-index: 1;
cursor: pointer;
}
@keyframes beats{
0% {
top: -10px;
}
25%{
top: -5px;
}
50%{
top: 0;
}
75%{
top: -5px;
}
100%{
top: -10px;
}
}
.dimap .dong{
animation-name: beats;
animation-duration: 1s;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-play-state: running;
}
.item1{
position: absolute;
left: 0;
background: #07216A;
bottom: 50px;
width: 240px;
border-radius: 8px;
padding: 15px;
box-sizing: border-box;
color: #fff;
}
.item2{
position: absolute;
right: -10px;
background: rgba(8,37,117,.5);
top: 50px;
width: 250px;
border-radius: 8px;
padding: 15px;
box-sizing: border-box;
color: #fff;
z-index: 99;
}
.item2>div{
display: flex;
align-items: center;
}
.item2>div .icon{
background: url('../img/blue.png') no-repeat;
background-size: 100% 100%;
width: 70px;
height: 24px;
line-height: 24px;
box-sizing: border-box;
padding-left: 10px;
font-size: 14px;
}
.item2>div .red{
background: url('../img/red.png') no-repeat;
background-size: 100% 100%;
}
.item2>div .desc{
padding:10px 15px;
border-left: 1px solid #1D5ECD;
line-height: 30px;
}
.item1>div{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.item1>div div{
width: 50%;
margin-top: 15px;
line-height: 30px;
}
.item1>div div span{
color: #F8CD03;
}
.box>div{
display: none;
}
.page1 .numbox{
display: flex;
flex-wrap: wrap;
padding: 15px 0 15px 5%;
background: url('../img/kuang.png') no-repeat;
background-size: 100% 100%;
}
.page1 .numbox>div{
width: 50%;
font-size: 14px;
margin: 10px 0;
color: #B2DCF9;
box-sizing: border-box;
}
.page1 .numbox>div span:first-child{
color: #CBCCD3;
font-weight: bold;
}
.page1 .numbox>div span:last-child{
color: #0BBFCA;
font-size: 18px;
}
.page1 .item{
display: block;
color: #fff;
font-size: 14px;
padding:7px 10px;
box-sizing: border-box;
}
.page1 .wai{
border:1px solid #353B52;
margin-top: 20px;
}
.page1 .item>div:first-child{
text-align: center;
}
.page1 .item img{
width: 128px;
margin-bottom: 10px;
}
.page1 .item .info{
display: flex;
flex-wrap: wrap;
}
.page1 .item .info p{
width: 50%;
opacity: .7;
margin-bottom: 15px;
}
.page1 .item .btn{
background: url('../img/border.png') no-repeat;
width: 80px;
height: 30px;
line-height: 30px;
text-align: center;
background-size: 100% 100%;
cursor: pointer;
}
.page3 .info{
color: #fff;
display: flex;
flex-wrap: wrap;
font-size: 14px;
justify-content: space-between;
margin-top: 20px;
}
.page3 .info>div{
border-left: 2px solid #8F93A4;
background: linear-gradient(to right, #102254 , #0C1948);
width: 48%;
padding:5px 8px;
box-sizing: border-box;
line-height: 26px;
margin-top: 10px;
}
.page3 .info>div span:first-child{
font-size: 18px;
color: #0BBFCA;
}
.page3 .info>div span:last-child{
font-size: 14px;
}
.page3 .info>div p:last-child{
text-align: right;
}
.page3 .redian{
background:url('../img/kuang2.png') no-repeat;
background-size: 100% 100%;
margin-top: 20px;
}
.page4 .info{
color: #7882BC;
font-size: 14px;
}
.page4 .info>div{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
line-height: 36px;
font-weight: bold;
background:url('../img/kuang2.png') no-repeat;
background-size: 100% 100%;
margin-top: 20px;
padding:20px 10px;
}
.page4 .info>div p{
width: 50%;
display: flex;
align-items: center;
}
.page4 .info span{
color: #E34561;
font-size: 18px;
}
.page4 .list{
color: #fff;
}
.page4 .list .head{
display: flex;
color: #7882BC;
border-bottom: 2px solid #46BAB1;
line-height: 50px;
justify-content: space-between;
}
.page4 .list .head>p{
text-align: center;
}
.page4 .list .head>p:last-child{
width: 30%;
}
.page4 .list .head>p:first-child,.page4 .list .box>div p:first-child{
width: 65%;
overflow: hidden;
text-overflow: ellipsis;
white-space:nowrap;
}
.page4 .list .box{
height: 250px;
max-height: 250px;
overflow: hidden;
}
.page4 .list .box>div{
display: flex;
line-height: 40px;
color: #eee;
justify-content: space-between;
}
.page4 .list .box>div p:last-child{
width: 30%;
text-align: center;
}
.xq{
position: absolute;
width: 90%;
height: 800px;
background: url('../img/bg.jpg') no-repeat;
top: 140px;
left: 5%;
display: none;
z-index: 11;
padding:50px;
box-sizing: border-box;
}
.zhe{
background-color: rgba(0, 0, 0, .8);
position: absolute;
width:1920px;
height: 1080px;
z-index: 10;
}
.xq>div{
display: flex;
justify-content: space-between;
}
.xq .graph{
color: #fff;
width:30%;
}
.xq .graph>p{
font-size: 20px;
padding:10px 30px;
background: linear-gradient(to right,rgba(9,33,143,1),rgba(16,29,71,.1));
}
.xq .graph>div{
margin-top: 20px;
}
.xq .graph .listitem{
line-height: 50px;
padding:0 20px;
}
.xq .graph .listitem:nth-child(2n){
background: #1B375E;
}
.xq .graph .listitem span:first-child{
margin-right: 15px;
}
.xq .graph .wen{
line-height: 30px;
padding:0 20px;
}
.xq .graph .wen p{
margin-bottom: 10px;
}

View File

@ -0,0 +1,606 @@
/**
* Swiper 6.3.5
* Most modern mobile touch slider and framework with hardware accelerated transitions
* https://swiperjs.com
*
* Copyright 2014-2020 Vladimir Kharlampidi
*
* Released under the MIT License
*
* Released on: October 30, 2020
*/
@font-face {
font-family: swiper-icons;
src: url('data:application/font-woff;charset=utf-8;base64, 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') format('woff');
font-weight: 400;
font-style: normal
}
:root {
--swiper-theme-color: #007aff
}
.swiper-container {
margin-left: auto;
margin-right: auto;
position: relative;
overflow: hidden;
list-style: none;
padding: 0;
z-index: 1
}
.swiper-container-vertical>.swiper-wrapper {
flex-direction: column
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: flex;
transition-property: transform;
box-sizing: content-box
}
.swiper-container-android .swiper-slide,
.swiper-wrapper {
transform: translate3d(0px, 0, 0)
}
.swiper-container-multirow>.swiper-wrapper {
flex-wrap: wrap
}
.swiper-container-multirow-column>.swiper-wrapper {
flex-wrap: wrap;
flex-direction: column
}
.swiper-container-free-mode>.swiper-wrapper {
transition-timing-function: ease-out;
margin: 0 auto
}
.swiper-slide {
flex-shrink: 0;
width: 100%;
height: 100%;
position: relative;
transition-property: transform
}
.swiper-slide-invisible-blank {
visibility: hidden
}
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
height: auto
}
.swiper-container-autoheight .swiper-wrapper {
align-items: flex-start;
transition-property: transform, height
}
.swiper-container-3d {
perspective: 1200px
}
.swiper-container-3d .swiper-cube-shadow,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-wrapper {
transform-style: preserve-3d
}
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10
}
.swiper-container-3d .swiper-slide-shadow-left {
background-image: linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-3d .swiper-slide-shadow-right {
background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-3d .swiper-slide-shadow-top {
background-image: linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-3d .swiper-slide-shadow-bottom {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}
.swiper-container-css-mode>.swiper-wrapper {
overflow: auto;
scrollbar-width: none;
-ms-overflow-style: none
}
.swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar {
display: none
}
.swiper-container-css-mode>.swiper-wrapper>.swiper-slide {
scroll-snap-align: start start
}
.swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper {
scroll-snap-type: x mandatory
}
.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper {
scroll-snap-type: y mandatory
}
:root {
--swiper-navigation-size: 44px
}
.swiper-button-next,
.swiper-button-prev {
position: absolute;
top: 50%;
width: calc(var(--swiper-navigation-size)/ 44 * 27);
height: var(--swiper-navigation-size);
margin-top: calc(-1 * var(--swiper-navigation-size)/ 2);
z-index: 10;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
color: #fff;
background: #CCCCCC;
}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
opacity: .35;
cursor: auto;
pointer-events: none
}
.swiper-button-next:after,
.swiper-button-prev:after {
font-family: swiper-icons;
font-size: var(--swiper-navigation-size);
text-transform: none !important;
letter-spacing: 0;
text-transform: none;
font-variant: initial;
line-height: 1
}
.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
left: 10px;
right: auto
}
.swiper-button-prev:after,
.swiper-container-rtl .swiper-button-next:after {
content: 'prev'
}
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
right: 10px;
left: auto
}
.swiper-button-next:after,
.swiper-container-rtl .swiper-button-prev:after {
content: 'next'
}
.swiper-button-next.swiper-button-white,
.swiper-button-prev.swiper-button-white {
--swiper-navigation-color: #ffffff
}
.swiper-button-next.swiper-button-black,
.swiper-button-prev.swiper-button-black {
--swiper-navigation-color: #000000
}
.swiper-button-lock {
display: none
}
.swiper-pagination {
position: absolute;
text-align: center;
transition: .3s opacity;
transform: translate3d(0, 0, 0);
z-index: 10
}
.swiper-pagination.swiper-pagination-hidden {
opacity: 0
}
.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
bottom: 10px;
left: 0;
width: 100%
}
.swiper-pagination-bullets-dynamic {
overflow: hidden;
font-size: 0
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
transform: scale(.33);
position: relative
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
transform: scale(1)
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
transform: scale(1)
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
transform: scale(.66)
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
transform: scale(.33)
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
transform: scale(.66)
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
transform: scale(.33)
}
.swiper-pagination-bullet {
width: 8px;
height: 8px;
display: inline-block;
border-radius: 100%;
background: #000;
opacity: .2
}
button.swiper-pagination-bullet {
border: none;
margin: 0;
padding: 0;
box-shadow: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
.swiper-pagination-clickable .swiper-pagination-bullet {
cursor: pointer
}
.swiper-pagination-bullet-active {
opacity: 1;
background: var(--swiper-pagination-color, var(--swiper-theme-color))
}
.swiper-container-vertical>.swiper-pagination-bullets {
right: 10px;
top: 50%;
transform: translate3d(0px, -50%, 0)
}
.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 6px 0;
display: block
}
.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
top: 50%;
transform: translateY(-50%);
width: 8px
}
.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
display: inline-block;
transition: .2s transform, .2s top
}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 4px
}
.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
left: 50%;
transform: translateX(-50%);
white-space: nowrap
}
.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
transition: .2s transform, .2s left
}
.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
transition: .2s transform, .2s right
}
.swiper-pagination-progressbar {
background: rgba(0, 0, 0, .25);
position: absolute
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
background: var(--swiper-pagination-color, var(--swiper-theme-color));
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
transform: scale(0);
transform-origin: left top
}
.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
transform-origin: right top
}
.swiper-container-horizontal>.swiper-pagination-progressbar,
.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
width: 100%;
height: 4px;
left: 0;
top: 0
}
.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-container-vertical>.swiper-pagination-progressbar {
width: 4px;
height: 100%;
left: 0;
top: 0
}
.swiper-pagination-white {
--swiper-pagination-color: #ffffff
}
.swiper-pagination-black {
--swiper-pagination-color: #000000
}
.swiper-pagination-lock {
display: none
}
.swiper-scrollbar {
border-radius: 10px;
position: relative;
-ms-touch-action: none;
background: rgba(0, 0, 0, .1)
}
.swiper-container-horizontal>.swiper-scrollbar {
position: absolute;
left: 1%;
bottom: 3px;
z-index: 50;
height: 5px;
width: 98%
}
.swiper-container-vertical>.swiper-scrollbar {
position: absolute;
right: 3px;
top: 1%;
z-index: 50;
width: 5px;
height: 98%
}
.swiper-scrollbar-drag {
height: 100%;
width: 100%;
position: relative;
background: rgba(0, 0, 0, .5);
border-radius: 10px;
left: 0;
top: 0
}
.swiper-scrollbar-cursor-drag {
cursor: move
}
.swiper-scrollbar-lock {
display: none
}
.swiper-zoom-container {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
text-align: center
}
.swiper-zoom-container>canvas,
.swiper-zoom-container>img,
.swiper-zoom-container>svg {
max-width: 100%;
max-height: 100%;
object-fit: contain
}
.swiper-slide-zoomed {
cursor: move
}
.swiper-lazy-preloader {
width: 42px;
height: 42px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -21px;
margin-top: -21px;
z-index: 10;
transform-origin: 50%;
animation: swiper-preloader-spin 1s infinite linear;
box-sizing: border-box;
border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
border-radius: 50%;
border-top-color: transparent
}
.swiper-lazy-preloader-white {
--swiper-preloader-color: #fff
}
.swiper-lazy-preloader-black {
--swiper-preloader-color: #000
}
@keyframes swiper-preloader-spin {
100% {
transform: rotate(360deg)
}
}
.swiper-container .swiper-notification {
position: absolute;
left: 0;
top: 0;
pointer-events: none;
opacity: 0;
z-index: -1000
}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
transition-timing-function: ease-out
}
.swiper-container-fade .swiper-slide {
pointer-events: none;
transition-property: opacity
}
.swiper-container-fade .swiper-slide .swiper-slide {
pointer-events: none
}
.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
pointer-events: auto
}
.swiper-container-cube {
overflow: visible
}
.swiper-container-cube .swiper-slide {
pointer-events: none;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
z-index: 1;
visibility: hidden;
transform-origin: 0 0;
width: 100%;
height: 100%
}
.swiper-container-cube .swiper-slide .swiper-slide {
pointer-events: none
}
.swiper-container-cube.swiper-container-rtl .swiper-slide {
transform-origin: 100% 0
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
pointer-events: auto
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-next+.swiper-slide,
.swiper-container-cube .swiper-slide-prev {
pointer-events: auto;
visibility: visible
}
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-cube .swiper-slide-shadow-top {
z-index: 0;
-webkit-backface-visibility: hidden;
backface-visibility: hidden
}
.swiper-container-cube .swiper-cube-shadow {
position: absolute;
left: 0;
bottom: 0px;
width: 100%;
height: 100%;
background: #000;
opacity: .6;
-webkit-filter: blur(50px);
filter: blur(50px);
z-index: 0
}
.swiper-container-flip {
overflow: visible
}
.swiper-container-flip .swiper-slide {
pointer-events: none;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
z-index: 1
}
.swiper-container-flip .swiper-slide .swiper-slide {
pointer-events: none
}
.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
pointer-events: auto
}
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-top {
z-index: 0;
-webkit-backface-visibility: hidden;
backface-visibility: hidden
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 957 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 97 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 957 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 420 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 796 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 583 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 438 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 473 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 338 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 388 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

View File

@ -0,0 +1,11 @@
xun();
function xun(){
if($('.xun').length==0){
$('.top img').addClass('xun');
}else{
$('.top img').removeClass('xun');
}
}
setInterval(() => {
xun()
}, 3000);

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,29 @@
// JavaScript Document
(function($){
$.fn.extend({
"slideUp":function(h,value){
var docthis = this;
value=$.extend({
"time":5000,
"movetime":1000
},value)
function autoani(){
$("div:first",docthis).animate({"margin-top":-h},value.movetime,function(){
$(this).css("margin-top",0).appendTo(".box");
})
}
var anifun = setInterval(autoani,value.time);
$(docthis).children("div").hover(function(){
clearInterval(anifun);
},function(){
if($('.zhe').length==0){
anifun = setInterval(autoani,value.time);
}
})
$('.dise').click(function(){
anifun = setInterval(autoani,value.time);
})
}
})
})(jQuery)

View File

@ -0,0 +1,159 @@
(function () {
act.get("/api/statistics/db/perform/analyze", function (resp) {
var data = resp.data.countList;
option = {
animation: true,
grid: {
top: "15%",
bottom: 40,
right: 0,
left: 40
},
xAxis: {
data: resp.data.monthList,
axisLine: {
show: false //隐藏X轴轴线
},
axisTick: {
show: false //隐藏X轴轴线
},
splitLine: {
show: false,
lineStyle: {
color: "rgba(77, 128, 254, 0.2)",
width: 2
}
},
axisLabel: {
show: true,
margin: 14,
interval: 0,
fontSize: 14,
textStyle: {
color: "#65D5FF" //X轴文字颜色
}
}
},
yAxis: [
{
type: "value",
gridIndex: 0,
// splitNumber: 4,
splitLine: {
show: true,
lineStyle: {
color: "rgba(77, 128, 254, 0.2)",
width: 2
}
},
axisTick: {
show: false
},
axisLine: {
show: true,
lineStyle: {
color: "rgba(77, 128, 254, 0.2)"
}
},
axisLabel: {
show: true,
margin: 14,
fontSize: 14,
textStyle: {
color: "#65D5FF"
}
}
}
],
series: [
{
name: "设备在线率",
type: "bar",
barWidth: 16,
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{
offset: 0,
color: "rgba(146, 225, 255, 1)"
},
{
offset: 1,
color: "rgba(0, 151, 251, 1)"
}
])
}
},
data: data,
z: 10,
zlevel: 0
},
{
// 分隔
type: "pictorialBar",
itemStyle: {
normal: {
color: "#0F375F"
}
},
symbolRepeat: "fixed",
symbolMargin: 6,
symbol: "rect",
symbolClip: true,
symbolSize: [18, 2],
symbolPosition: "start",
symbolOffset: [1, 1],
data: data,
width: 2,
z: 0,
zlevel: 1
},
{
name: "外框",
type: "bar",
barGap: "-110%", // 设置外框粗细
data: [100, 100, 100, 100, 100, 100, 100],
barWidth: 16,
itemStyle: {
normal: {
color: "transparent", // 填充色
// barBorderRadius: 0, //圆角半径
label: {
// 标签显示位置
show: false,
position: "top" // insideTop 或者横向的 insideLeft
}
}
},
z: 0
},
{
name: "背影",
type: "line",
smooth: true, //平滑曲线显示
showAllSymbol: false, //显示所有图形。
symbolSize: 0,
lineStyle: {
width: 0
},
areaStyle: {
color: "rgba(0, 151, 251, 0.1)"
},
data: data,
z: 5
}
],
dataZoom: [
{
type: "slider",
show: false,
xAxisIndex: [0],
endValue: 11,
startValue: 0
}
]
}
var myChart = echarts.init(document.getElementById('page1_1'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,205 @@
(function () {
act.get("/api/statistics/db/supervise_thing/region/count", function (resp) {
let categoryData = resp.data.nameList;
let partdata = resp.data.nameList.slice(0, 5);
let chartdata = resp.data.countList;
let numdata = resp.data.countList.slice(0, 5);
let itemcolor = {
type: 'linear',
colorStops: [
{
offset: 0,
color: 'rgba(6, 120, 157,1)',
},
{
offset: 0.5,
color: 'rgba(6, 120, 157,0.2)',
},
{
offset: 1,
color: 'rgba(6, 120, 157,1)',
},
],
};
myoption = {
textStyle: {
color: '#c0c3cd',
fontSize: 14,
},
toolbox: {
show: false,
feature: {
saveAsImage: {
backgroundColor: '#031245',
},
restore: {},
},
iconStyle: {
borderColor: '#c0c3cd',
},
},
legend: {
top: 10,
itemWidth: 8,
itemHeight: 8,
icon: 'circle',
left: 'center',
padding: 0,
textStyle: {
color: '#c0c3cd',
fontSize: 14,
padding: [2, 0, 0, 0],
},
},
color: ['#00D7E9', 'rgba(0, 215, 233, 0.9)'],
grid: {
left: 30,
right: 0,
bottom: 20,
top: 40,
},
xAxis: {
nameTextStyle: {
color: '#c0c3cd',
padding: [0, 0, -10, 0],
fontSize: 14,
},
axisLabel: {
color: '#c0c3cd',
fontSize: 14,
interval: 0,
},
axisTick: {
show: false,
lineStyle: {
color: '#384267',
width: 1,
},
},
splitLine: {
show: false,
},
axisLine: {
lineStyle: {
color: '#335971',
},
show: true,
},
data: partdata,
type: 'category',
},
yAxis: {
nameTextStyle: {
color: '#c0c3cd',
padding: [0, 0, -10, 0],
fontSize: 14,
},
axisLabel: {
color: '#c0c3cd',
fontSize: 14,
},
axisTick: {
lineStyle: {
color: '#668092',
width: 1,
},
show: true,
},
splitLine: {
show: true,
lineStyle: {
color: '#335971',
// "type": "dashed"
},
},
axisLine: {
lineStyle: {
color: '#668092',
width: 1,
// "type": "dashed"
},
show: true,
},
},
series: [
{
data: numdata,
type: 'bar',
barMaxWidth: 'auto',
barWidth: 20,
itemStyle: {
color: {
x: 0,
y: 1,
x2: 0,
y2: 0,
type: 'linear',
colorStops: [
{
offset: 0,
color: '#00D7E9',
},
{
offset: 1,
color: 'rgba(0, 167, 233,0.3)',
},
],
},
},
label: {
show: true,
position: 'top',
distance: 10,
color: '#fff',
},
},
{
data: [1, 1, 1, 1, 1, 1],
type: 'pictorialBar',
barMaxWidth: '20',
symbol: 'diamond',
symbolOffset: [0, '50%'],
symbolSize: [20, 10],
},
{
data: numdata,
type: 'pictorialBar',
barMaxWidth: '20',
symbolPosition: 'end',
symbol: 'diamond',
symbolOffset: [0, '-50%'],
symbolSize: [20, 12],
zlevel: 2,
},
],
tooltip: {
show: true,
formatter: '{b}:{c0}',
},
};
var num1 = 6;
var num2 = 6;
function han() {
if (num1 > categoryData.length - 1) {
num1 = 0;
num2 = 0;
}
myoption.series[0].data.shift();
myoption.series[0].data.push(chartdata[num2++]);
myoption.xAxis.data.shift();
myoption.xAxis.data.push(categoryData[num1++]);
myChart.setOption(myoption);
}
interval = setInterval(function () {
han()
}, 3000);
var myChart = echarts.init(document.getElementById('page1_2'));
myChart.setOption(myoption);
});
})()

View File

@ -0,0 +1,77 @@
(function () {
act.get("/api/statistics/db/perform/count", function (resp) {
let nameList = resp.data.nameList;
let countList = resp.data.countList;
option = {
tooltip: {
trigger: 'axis',
show: false,
axisPointer: { // 坐标轴指示器,坐标轴触发有效
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
},
},
legend: {
show: false
},
grid: {
top: 20,
left: '15%',
right: '8%',
bottom: 0
},
xAxis: [{
splitLine: {
show: false
},
type: 'value',
show: false,
}],
yAxis: [{
splitLine: {
show: false
},
axisLine: { //y轴
show: false
},
type: 'category',
axisTick: {
show: false
},
inverse: true,
data: nameList,
axisLabel: {
color: '#A7D6F4',
fontSize: 14,
}
}],
series: [{
name: '标准化',
type: 'bar',
barWidth: 12, // 柱子宽度
label: {
show: true,
position: 'right', // 位置
color: '#A7D6F4',
fontSize: 14,
distance: 15, // 距离
formatter: '{c} 次' // 这里是数据展示的时候显示的数据
}, // 柱子上方的数值
itemStyle: {
barBorderRadius: [0, 20, 20, 0], // 圆角(左上、右上、右下、左下)
color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [{
offset: 0,
color: '#51C5FD'
}, {
offset: 1,
color: '#005BB1'
}], false), // 渐变
},
data: countList
},]
};
var myChart = echarts.init(document.getElementById('page1_3'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,99 @@
(function () {
act.get("/api/statistics/db/supervise_thing/status_count", function (resp) {
option = {
tooltip: {
trigger: 'item',
formatter: "{b} : ({d}%)",
extraCssText: 'z-index:2'
},
series: [{
type: 'pie',
radius: '68%',
center: ['50%', '55%'],
clockwise: false,
data: [{
value: resp.data.wenPercent,
name: '问'
}, {
value: resp.data.pingPercent,
name: '评'
}, {
value: resp.data.yiPercent,
name: '议'
}, {
value: resp.data.duPercent,
name: '督'
}],
label: {
normal: {
textStyle: {
color: '#fff',
fontSize: 14,
}
}
},
labelLine: {
normal: {
show: false
}
},
itemStyle: {
normal: {
borderWidth: 2,
borderColor: '#ffffff',
},
emphasis: {
borderWidth: 0,
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}],
color: [
'#00acee',
'#52cdd5',
'#79d9f1',
'#a7e7ff',
'#c8efff'
]
};
var myChart = echarts.init(document.getElementById('page1_4'));
myChart.setOption(option);
let index = 0;
function fun() {
var timer = setInterval(function () {
myChart.dispatchAction({
type: 'hideTip',
seriesIndex: 0,
dataIndex: index
});
// 显示提示框
myChart.dispatchAction({
type: 'showTip',
seriesIndex: 0,
dataIndex: index
});
// 取消高亮指定的数据图形
myChart.dispatchAction({
type: 'downplay',
seriesIndex: 0,
dataIndex: index == 0 ? 2 : index - 1
});
myChart.dispatchAction({
type: 'highlight',
seriesIndex: 0,
dataIndex: index
});
index++;
if (index > 4) {
index = 0;
}
}, 2000)
}
fun();
});
})()

View File

@ -0,0 +1,125 @@
(function () {
act.get("/api/statistics/contact/count", function (resp) {
var option = {
series: [{
type: 'liquidFill',
radius: '60%',
center: ['50%', '50%'],
data: [0.5, 0.5, 0.5],
backgroundStyle: {
borderWidth: 1,
color: 'rgb(255,0,255,0.1)'
},
label: {
normal: {
formatter: resp.data + '个',
textStyle: {
fontSize: 20
}
}
},
outline: {
show: false,
}
},
{
"type": "pie",
"center": ["50%", "50%"],
"radius": ["80%", "76%"],
"hoverAnimation": false,
"data": [{
"name": "",
"value": 500,
labelLine: {
show: false
},
itemStyle: {
color: '#5886f0'
},
emphasis: {
labelLine: {
show: false
},
itemStyle: {
color: '#5886f0'
},
}
},
{
"name": "",
"value": 4,
labelLine: {
show: false
},
itemStyle: {
color: '#ffffff',
"normal": {
"color": "#5886f0",
"borderColor": "#5886f0",
"borderWidth": 20,
// borderRadius: '100%'
},
},
label: {
borderRadius: '100%'
},
emphasis: {
labelLine: {
show: false
},
itemStyle: {
color: '#5886f0'
},
}
},
{ // 解决圆点过大后续部分显示明显的问题
"name": "",
"value": 4,
labelLine: {
show: false
},
itemStyle: {
color: '#5886f0'
},
emphasis: {
labelLine: {
show: false
},
itemStyle: {
color: '#5886f0'
},
}
},
{ //画剩余的刻度圆环
"name": "",
"value": 0,
itemStyle: {
color: '#050038'
},
"label": {
show: false
},
labelLine: {
show: false
},
emphasis: {
labelLine: {
show: false
},
itemStyle: {
color: 'rgba(255,255,255,0)'
},
}
}
]
}
]
}
var myChart = echarts.init(document.getElementById('page2_1'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,124 @@
(function () {
act.get("/api/statistics/contact/activity/count", function (resp) {
var option = {
series: [{
type: 'liquidFill',
radius: '60%',
center: ['50%', '50%'],
data: [0.5, 0.5, 0.5],
backgroundStyle: {
borderWidth: 1,
color: 'rgb(255,0,255,0.1)'
},
label: {
normal: {
formatter: resp.data + '次',
textStyle: {
fontSize: 20
}
}
},
outline: {
show: false,
}
},
{
"type": "pie",
"center": ["50%", "50%"],
"radius": ["80%", "76%"],
"hoverAnimation": false,
"data": [{
"name": "",
"value": 500,
labelLine: {
show: false
},
itemStyle: {
color: '#5886f0'
},
emphasis: {
labelLine: {
show: false
},
itemStyle: {
color: '#5886f0'
},
}
},
{
"name": "",
"value": 4,
labelLine: {
show: false
},
itemStyle: {
color: '#ffffff',
"normal": {
"color": "#5886f0",
"borderColor": "#5886f0",
"borderWidth": 20,
// borderRadius: '100%'
},
},
label: {
borderRadius: '100%'
},
emphasis: {
labelLine: {
show: false
},
itemStyle: {
color: '#5886f0'
},
}
},
{ // 解决圆点过大后续部分显示明显的问题
"name": "",
"value": 4,
labelLine: {
show: false
},
itemStyle: {
color: '#5886f0'
},
emphasis: {
labelLine: {
show: false
},
itemStyle: {
color: '#5886f0'
},
}
},
{ //画剩余的刻度圆环
"name": "",
"value": 0,
itemStyle: {
color: '#050038'
},
"label": {
show: false
},
labelLine: {
show: false
},
emphasis: {
labelLine: {
show: false
},
itemStyle: {
color: 'rgba(255,255,255,0)'
},
}
}
]
}
]
}
var myChart = echarts.init(document.getElementById('page2_1_1'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,107 @@
(function () {
act.get("/api/statistics/contact/activity/count/rank", function (resp) {
let className = resp.data.nameList;
let data = resp.data.countList;
var colorList = ['#2473EF', '#33DDF8', '#2473EF', '#33DDF8', '#2473EF', '#33DDF8'];
var defaultData = [100, 100, 100, 100, 100, 100];
option = {
grid: {
left: '22%',
right: '12%',
bottom: 0,
top: '10%',
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'none'
},
formatter: function (params) {
return params[0].name + '<br/>' +
"<span style='display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:rgba(36,207,233,0.9)'></span>" +
// params[0].seriesName + ' : ' + Number((params[0].value.toFixed(4) / 10000).toFixed(2)).toLocaleString() + ' <br/>'
params[0].seriesName + ' : ' + params[0].value + '次'
}
},
xAxis: {
show: false,
type: 'value'
},
yAxis: [{
type: 'category',
inverse: true,
axisLabel: {
show: true,
textStyle: {
color: '#fff'
},
},
splitLine: {
show: false
},
axisTick: {
show: false
},
axisLine: {
show: false
},
data: className
}, {
type: 'category',
inverse: true,
axisTick: 'none',
axisLine: 'none',
show: true,
axisLabel: {
textStyle: {
color: '#ffffff',
fontSize: '12'
},
formatter: function (value) {
return value + ' 次';
},
},
data: data
}],
series: [{
name: '举办次数',
type: 'bar',
zlevel: 1,
itemStyle: {
normal: {
barBorderRadius: 13,
// color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [{
// offset: 0,
// color: 'rgb(57,89,255,1)'
// }, {
// offset: 1,
// color: 'rgb(46,200,207,1)'
// }]),
color: (params) => {
return colorList[params.dataIndex]
}
},
},
barWidth: 10,
data: data
},
{
name: '背景',
type: 'bar',
barWidth: 10,
barGap: '-100%',
data: defaultData,
itemStyle: {
normal: {
color: '#1B375E',
barBorderRadius: 0,
}
},
},
]
};
var myChart = echarts.init(document.getElementById('page2_2'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,87 @@
(function () {
act.get("/api/statistics/contact/activity/channel/count", function (resp) {
var channelArr = resp.data.channelArr;
var countArr = resp.data.countArr;
var objArr = new Array();
channelArr.forEach((item, index) => {
objArr.push({ "value": countArr[index], "name": item });
});
var color = ['#FFAA45', '#38FCBE', '#6844C6', '#164EB8', '#678198']
option = {
tooltip: {
trigger: 'item'
},
legend: {
orient: 'vertical',
left: "75%",
top: 'center',
textStyle: {
color: '#A3E2F4',
}
},
series: [
{
type: 'pie',
radius: '80%',
center: ['35%', '50%'],
data: objArr,
label: {
show: false
},
itemStyle: {
normal: {
borderColor: '#10234B',
borderWidth: '5',
},
},
color: color,
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
};
var myChart = echarts.init(document.getElementById('page2_3'));
myChart.setOption(option);
let index = 0;
function fun() {
var timer = setInterval(function () {
myChart.dispatchAction({
type: 'hideTip',
seriesIndex: 0,
dataIndex: index
});
// 显示提示框
myChart.dispatchAction({
type: 'showTip',
seriesIndex: 0,
dataIndex: index
});
// 取消高亮指定的数据图形
myChart.dispatchAction({
type: 'downplay',
seriesIndex: 0,
dataIndex: index == 0 ? 2 : index - 1
});
myChart.dispatchAction({
type: 'highlight',
seriesIndex: 0,
dataIndex: index
});
index++;
if (index > 5) {
index = 0;
}
}, 2000)
}
fun();
});
})()

View File

@ -0,0 +1,92 @@
(function () {
act.get("/api/statistics/contact/activity/count/month", function (resp) {
var monthList = resp.data.monthList;
var countList = resp.data.countList;
option = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
grid: {
right: '3%',
left: '8%',
bottom: 30
},
xAxis: [{
type: 'category',
data: monthList,
axisLine: {
lineStyle: {
color: '#FFFFFF'
}
},
axisLabel: {
margin: 10,
color: '#e2e9ff',
textStyle: {
fontSize: 14
},
},
axisTick: {
show: false
}
}],
yAxis: [{
axisLabel: {
formatter: '{value}',
color: '#e2e9ff',
},
axisTick: {
show: false
},
axisLine: {
show: false,
lineStyle: {
color: 'rgba(0,186,255,.6)'
}
},
splitLine: {
lineStyle: {
color: 'rgba(255,255,255,0.12)'
}
}
}],
series: [{
type: 'bar',
data: countList,
barWidth: '28px',
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: 'rgba(0,244,255,1)' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(0,77,167,1)' // 100% 处的颜色
}], false),
shadowColor: 'rgba(0,160,221,1)',
shadowBlur: 4,
}
},
label: {
normal: {
show: true,
lineHeight: 30,
formatter: '{c}',
position: 'top',
textStyle: {
color: '#00D6F9',
fontSize: 14
}
}
}
}]
};
var myChart = echarts.init(document.getElementById('page2_4'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,220 @@
(function () {
act.get("/api/statistics/contact/activity/month/analyze", function (resp) {
var monthArr = resp.data.monthArr;
var sameRateArr = resp.data.sameRateArr;
var cycleRateArr = resp.data.cycleRateArr;
// 统计百分比
var data1 = cycleRateArr;
var data2 = sameRateArr;
var json = {
chart0: {
xcategory: monthArr,
low: data1,
lowLine: [],
}
};
var json2 = {
chart0: {
xcategory: monthArr,
low: data2,
lowLine: [],
}
};
var zrUtil = echarts.util;
zrUtil.each(json.chart0.xcategory, function (item, index) {
json.chart0.lowLine.push([{
coord: [index, json.chart0.low[index]]
}, {
coord: [index + 1, json.chart0.low[index + 1]]
}]);
});
zrUtil.each(json.chart0.xcategory, function (item, index) {
json2.chart0.lowLine.push([{
coord: [index, json2.chart0.low[index]]
}, {
coord: [index + 1, json2.chart0.low[index + 1]]
}]);
});
var option = {
tooltip: {
trigger: 'axis',
axisPointer: {
lineStyle: {
color: '#15ecf4'
}
},
backgroundColor: 'rgba(0,0,0,.8)',
extraCssText: 'box-shadow: 4px 4px 10px rgba(21, 250, 255,.6);',
formatter: function (params) {
var result = params[0].name + '<br>';
params.forEach(function (item) {
result += '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:' + item.color + '"></span>';
// 判断设置增长还是降低
if (parseFloat(item.data) >= 50) {
result += item.seriesName + ": " + '<span class="growth">增长' + item.data + "%</span><br>"
} else if (parseFloat(item.data) < 50) {
result += item.seriesName + ": " + '<span class="reduce">降低' + item.data + "%</span><br>"
}
});
return result;
}
},
legend: {
data: ['同比', '环比'],
textStyle: {
fontSize: 12,
color: 'rgb(0,253,255,0.6)'
},
top: '5%',
right: '5%'
},
grid: {
bottom: 30,
left: 50,
right: 0,
},
xAxis: {
axisLine: {
show: true,
lineStyle: {
color: '#15faff',
},
},
axisTick: {
show: false
},
axisLabel: {
show: true
},
data:monthArr,
},
yAxis: {
max: 100,
splitNumber: 4,
interval: 25,
axisLine: {
show: false,
},
axisTick: {
show: false
},
splitLine: {
lineStyle: {
type: 'dashed',
color: '#4b4d64'
}
},
axisLabel: {
formatter: '{value} %',
textStyle: { //改变刻度字体样式
color: '#ffffff'
}
},
},
series: [{
name: '环比',
type: 'line',
// smooth: true,
symbol: 'circle',
symbolSize: 10,
areaStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: 'rgba(255, 204,1, .9)'
}, {
offset: 0.8,
color: 'rgba(6, 8, 41,.1)'
}], false),
shadowColor: 'rgba(0, 0, 0, 0.1)',
shadowBlur: 10
}
},
itemStyle: {
normal: {
color: '#ffcb00'
}
},
data: data1
},
{
name: '环比',
type: 'lines',
coordinateSystem: 'cartesian2d',
zlevel: 1,
smooth: true,
symbol: 'circle',
effect: {
show: true,
smooth: true,
period: 2,
symbolSize: 8
},
lineStyle: {
normal: {
color: '#ffcb00',
width: 0,
opacity: 0,
curveness: 0,
}
},
data: json.chart0.lowLine
},
{
name: '同比',
type: 'line',
// smooth: true,
symbol: 'circle',
symbolSize: 10,
areaStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: 'rgba(21, 250, 255,.9)'
}, {
offset: 0.8,
color: 'rgba(6, 8, 41,.1)'
}], false),
shadowColor: 'rgba(0, 0, 0, 0.1)',
shadowBlur: 10
}
},
itemStyle: {
normal: {
color: '#15faff'
}
},
data: data2
},
{
name: '同比',
type: 'lines',
coordinateSystem: 'cartesian2d',
zlevel: 1,
smooth: true,
symbol: 'circle',
effect: {
show: true,
smooth: true,
period: 2,
symbolSize: 8
},
lineStyle: {
normal: {
color: '#15faff',
width: 0,
opacity: 0,
curveness: 0,
}
},
data: json2.chart0.lowLine
},
]
};
var myChart = echarts.init(document.getElementById('page2_5'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,93 @@
(function () {
act.get("/api/statistics/contact/activity/people/month/analyze", function (resp) {
var monthArr = resp.data.monthArr;
var countArr = resp.data.countArr;
option = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
grid: {
right: '3%',
left: '9%',
bottom: '15%'
},
xAxis: [{
type: 'category',
data: monthArr,
axisLine: {
lineStyle: {
color: '#FFFFFF'
}
},
axisLabel: {
margin: 10,
color: 'grey',
textStyle: {
fontSize: 14
},
},
axisTick: {
show: false
}
}],
yAxis: [{
axisLabel: {
formatter: '{value}',
color: '#e2e9ff',
},
axisTick: {
show: false
},
axisLine: {
show: false,
lineStyle: {
color: 'rgba(0,186,255,.6)'
}
},
splitLine: {
lineStyle: {
color: 'rgba(255,255,255,0.12)'
}
}
}],
series: [{
type: 'bar',
data: countArr,
barWidth: '14px',
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: 'rgba(0,162,255,1)' // 0% 处的颜色
}, {
offset: 1,
color: 'rgba(16,70,174,1)' // 100% 处的颜色
}], false),
shadowBlur: 4,
//柱形图圆角,初始化效果
barBorderRadius: [15, 15, 0, 0]
}
},
label: {
normal: {
show: true,
lineHeight: 30,
formatter: '{c}',
position: 'top',
textStyle: {
color: '#00D6F9',
fontSize: 14
}
}
}
}]
};
var myChart = echarts.init(document.getElementById('page2_6'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,244 @@
(function () {
act.get("/api/statistics/voter/analyze", function (resp) {
var nameList = resp.data.nameList;
var leftIndex = nameList.length % 2 == 0 ? nameList.length / 2 : nameList.length / 2 + 1;
var leftNameList = nameList.slice(0, leftIndex);
var rightNameList = nameList.slice(leftIndex, nameList.length);
var countList = resp.data.countList;
var leftCountList = countList.slice(0, leftIndex);
var rightCountList = countList.slice(leftIndex, countList.length);
var percentList = resp.data.percentList;
var leftPercentList = percentList.slice(0, leftIndex);
var rightPercentList = percentList.slice(leftIndex, percentList.length);
var leftFullPercentList = new Array();
var rightFullPercentList = new Array();
leftPercentList.forEach(() => {
leftFullPercentList.push("100");
});
rightPercentList.forEach(() => {
rightFullPercentList.push("100");
});
var option = {
grid: [
{
//左侧的柱状图grid
width: "46%",
left: 0,
top: '8%',
right: '5%',
bottom: 0
},
{
//右侧的柱状图grid
width: "46%",
left: '54%',
top: '8%',
right: 0,
bottom: 0
}
],
xAxis: [
{
//左侧柱状图的X轴
gridIndex: 0,//x 轴所在的 grid 的索引
show: false
},
{
//右侧柱状图的X轴
gridIndex: 1,//x 轴所在的 grid 的索引
show: false
}],
yAxis: [
{
//左侧柱状图的Y轴
gridIndex: 0,//y轴所在的 grid 的索引
splitLine: 'none',
axisTick: 'none',
axisLine: 'none',
axisLabel: {
verticalAlign: 'bottom',
align: 'left',
padding: [0, 0, 8, 10],
textStyle: {
color: '#befbff',
fontSize: '14',
}
},
data: leftNameList,
inverse: true,
},
{
//左侧柱状图的Y轴
gridIndex: 0,//y轴所在的 grid 的索引
splitLine: 'none',
axisTick: 'none',
axisLine: 'none',
data: leftCountList,
inverse: true,
axisLabel: {
show: true,
verticalAlign: 'bottom',
align: 'right',
padding: [0, 16, 8, 0],
textStyle: {
color: '#fff',
fontSize: '14',
},
formatter: function (value) {
return '{x|' + value + '} {y|' + "次}"
},
rich: {
y: {
color: '#befbff',
fontSize: 14
},
x: {
color: '#f6cf42',
fontSize: 14
}
}
}
},
{
//左侧柱状图的Y轴
gridIndex: 0,//y轴所在的 grid 的索引
splitLine: 'none',
axisTick: 'none',
axisLine: 'none',
data: []
},
{
//右侧柱状图的Y轴
gridIndex: 1,//y轴所在的 grid 的索引
splitLine: 'none',
axisTick: 'none',
axisLine: 'none',
axisLabel: {
verticalAlign: 'bottom',
align: 'left',
padding: [0, 0, 8, 10],
textStyle: {
color: '#befbff',
fontSize: '14',
}
},
data: rightNameList,
inverse: true
},
{
//右侧柱状图的Y轴
gridIndex: 1,//y轴所在的 grid 的索引
splitLine: 'none',
axisTick: 'none',
axisLine: 'none',
data: rightCountList,
inverse: true,
axisLabel: {
show: true,
verticalAlign: 'bottom',
align: 'right',
padding: [0, 16, 8, 0],
textStyle: {
color: '#fff',
fontSize: '14',
},
formatter: function (value) {
return '{x|' + value + '} {y|' + "次}"
},
rich: {
y: {
color: '#befbff',
fontSize: 14
},
x: {
color: '#f6cf42',
fontSize: 14
}
}
},
},
{
//右侧柱状图的Y轴
gridIndex: 1,//y轴所在的 grid 的索引
splitLine: 'none',
axisTick: 'none',
axisLine: 'none',
data: []
}
],
series: [
{
name: '值',
type: 'bar',
xAxisIndex: 0,//使用的 x 轴的 index在单个图表实例中存在多个 x 轴的时候有用。
yAxisIndex: 0,//使用的 y 轴的 index在单个图表实例中存在多个 y轴的时候有用。
data: leftPercentList,
barWidth: 10,
itemStyle: {
normal: {
color: '#0BBFCA',
barBorderRadius: 6,
}
},
z: 2
},
{
name: '外框',
type: 'bar',
xAxisIndex: 0,//使用的 x 轴的 index在单个图表实例中存在多个 x 轴的时候有用。
yAxisIndex: 2,//使用的 y 轴的 index在单个图表实例中存在多个 y轴的时候有用。
barGap: '-100%',
data: leftFullPercentList,
barWidth: 10,
itemStyle: {
normal: {
color: '#2d5271',
barBorderRadius: 6,
}
},
z: 0
},
{
name: '值',
type: 'bar',
xAxisIndex: 1,//使用的 x 轴的 index在单个图表实例中存在多个 x 轴的时候有用。
yAxisIndex: 3,//使用的 y 轴的 index在单个图表实例中存在多个 y轴的时候有用。
data: rightPercentList,
barWidth: 10,
itemStyle: {
normal: {
color: '#0BBFCA',
barBorderRadius: 6,
}
},
z: 2
},
{
name: '外框',
type: 'bar',
xAxisIndex: 1,//使用的 x 轴的 index在单个图表实例中存在多个 x 轴的时候有用。
yAxisIndex: 5,//使用的 y 轴的 index在单个图表实例中存在多个 y轴的时候有用。
barGap: '-100%',
data: rightFullPercentList,
barWidth: 10,
itemStyle: {
normal: {
color: '#2d5271',
barBorderRadius: 6,
}
},
z: 0
}
]
};
var myChart = echarts.init(document.getElementById('page3_1'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,110 @@
(function () {
act.get("/api/statistics/voter/month/count", function (resp) {
var countList = resp.data.countList;
var monthList = resp.data.monthList;
option = {
color: ["#63caff", "#3608FE"],
grid: {
left: 36,
right: 0,
bottom: 30,
top: 40
},
xAxis: {
axisLabel: {
color: "#c0c3cd",
fontSize: 14,
interval: 0
},
splitLine: {
show: false
},
axisLine: {
lineStyle: {
color: "#384267",
width: 1,
type: "dashed"
},
show: true
},
data: monthList,
type: "category"
},
yAxis: {
axisLabel: {
color: "#c0c3cd",
fontSize: 14
},
splitLine: {
show: true,
lineStyle: {
color: "#384267",
type: "dashed"
}
},
axisLine: {
lineStyle: {
color: "#384267",
width: 1,
type: "dashed"
},
show: true
},
name: ""
},
series: [{
data: countList,
type: "bar",
barWidth: 30,
itemStyle: {
color: {
x: 0,
y: 0,
x2: 0,
y2: 1,
type: "linear",
global: false,
colorStops: [{
offset: 0,
color: "#3A1BFD"
}, {
offset: 1,
color: "#3BEFFD"
}]
}
},
label: {
show: true,
position: "top",
distance: 10,
color: "#fff"
}
}, {
data: [1, 1, 1, 1, 1, 1, 1, 1],
type: "pictorialBar",
barMaxWidth: "20",
symbol: "diamond",
symbolOffset: [0, "50%"],
symbolSize: [30, 15]
}, {
data: countList,
type: "pictorialBar",
barMaxWidth: "20",
symbolPosition: "end",
symbol: "diamond",
symbolOffset: [0, "-50%"],
symbolSize: [30, 12],
zlevel: 2
}],
tooltip: {
trigger: "item",
show: true
}
}
var myChart = echarts.init(document.getElementById('page3_2'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,170 @@
(function () {
act.get("/api/statistics/voter/people_condition/category", function (resp) {
var categoryArr = resp.data.categoryArr;
var countArr = resp.data.countArr;
var objArr = new Array();
categoryArr.forEach((item, index) => {
objArr.push({ "value": countArr[index], "name": item });
});
option = {
color: ["#EAEA26", "#906BF9", "#01E17E", "#3DD1F9", "#FE5656", "#164BCD", "#3434B0", "#FFAD05"],
tooltip: {
trigger: 'item',
formatter: "{b} : {c} ({d}%)"
},
legend: {
type: "scroll",
orient: "vartical",
// x: "right",
top: "center",
left: "75%",
// bottom: "0%",
itemWidth: 16,
itemHeight: 8,
itemGap: 10,
textStyle: {
color: '#A3E2F4',
fontSize: 12,
fontWeight: 0
},
data: categoryArr
},
polar: {},
angleAxis: {
interval: 1,
type: 'category',
data: [],
z: 10,
axisLine: {
show: false,
lineStyle: {
color: "#0B4A6B",
width: 1,
type: "solid"
},
},
axisLabel: {
interval: 0,
show: true,
color: "#0B4A6B",
margin: 8,
fontSize: 14
},
},
radiusAxis: {
show: false,
min: 40,
max: 120,
interval: 20,
axisLine: {
show: false,
lineStyle: {
color: "#0B3E5E",
width: 1,
type: "solid"
},
},
axisLabel: {
formatter: '{value} %',
show: false,
padding: [0, 0, 20, 0],
color: "#0B3E5E",
fontSize: 14
},
splitLine: {
lineStyle: {
color: "#0B3E5E",
width: 2,
type: "solid"
}
}
},
calculable: true,
series: [{
type: 'pie',
radius: ["5%", "10%"],
center: ['40%', '50%'],
hoverAnimation: false,
labelLine: {
normal: {
show: false,
length: 15,
length2: 18
},
emphasis: {
show: false
}
},
data: [{
name: '',
value: 0,
itemStyle: {
normal: {
color: "#0B4A6B"
}
}
}]
}, {
type: 'pie',
radius: ["75%", "80%"],
center: ['40%', '50%'],
hoverAnimation: false,
labelLine: {
normal: {
show: false,
length: 30,
length2: 55
},
emphasis: {
show: false
}
},
name: "",
data: [{
name: '',
value: 0,
itemStyle: {
normal: {
color: "#0B4A6B"
}
}
}]
}, {
stack: 'a',
type: 'pie',
radius: ['20%', '60%'],
center: ['40%', '50%'],
roseType: 'area',
zlevel: 10,
label: {
normal: {
show: true,
formatter: "{c}",
textStyle: {
fontSize: 12,
},
position: 'outside'
},
emphasis: {
show: true
}
},
labelLine: {
normal: {
show: true,
length: 10,
length2: 20
},
emphasis: {
show: false
}
},
data: objArr
},]
}
var myChart = echarts.init(document.getElementById('page3_3'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,198 @@
(function () {
act.get("/api/statistics/voter/people_condition/analyze", function (resp) {
var statusArr = resp.data.statusArr;
var countArr = resp.data.countArr;
var data=new Array();
statusArr.forEach((status,i)=>{
data.push({
"name":status,
"value":countArr[i]
})
});
arrName = getArrayValue(data, "name");
arrValue = getArrayValue(data, "value");
sumValue = eval(arrValue.join('+'));
objData = array2obj(data, "name");
optionData = getData(data)
function getArrayValue(array, key) {
var key = key || "value";
var res = [];
if (array) {
array.forEach(function (t) {
res.push(t[key]);
});
}
return res;
}
function array2obj(array, key) {
var resObj = {};
for (var i = 0; i < array.length; i++) {
resObj[array[i][key]] = array[i];
}
return resObj;
}
function getData(data) {
var res = {
series: [],
yAxis: []
};
for (let i = 0; i < data.length; i++) {
// console.log([70 - i * 15 + '%', 67 - i * 15 + '%']);
res.series.push({
name: '',
type: 'pie',
clockWise: false, //顺时加载
hoverAnimation: false, //鼠标移入变大
radius: [83 - i * 15 + '%', 78 - i * 15 + '%'],
center: ["38%", "50%"],
label: {
show: false
},
itemStyle: {
label: {
show: false,
},
labelLine: {
show: false
},
borderWidth: 5,
},
data: [{
value: data[i].value,
name: data[i].name
}, {
value: sumValue - data[i].value,
name: '',
itemStyle: {
color: "rgba(0,0,0,0)",
borderWidth: 0
},
tooltip: {
show: false
},
hoverAnimation: false
}]
});
res.series.push({
name: '',
type: 'pie',
silent: true,
z: 1,
clockWise: false, //顺时加载
hoverAnimation: false, //鼠标移入变大
radius: [83 - i * 15 + '%', 78 - i * 15 + '%'],
center: ["38%", "50%"],
label: {
show: false
},
itemStyle: {
label: {
show: false,
},
labelLine: {
show: false
},
borderWidth: 5,
},
data: [{
value: 7.5,
itemStyle: {
color: "rgb(3, 31, 62)",
borderWidth: 0
},
tooltip: {
show: false
},
hoverAnimation: false
}, {
value: 2.5,
name: '',
itemStyle: {
color: "rgba(0,0,0,0)",
borderWidth: 0
},
tooltip: {
show: false
},
hoverAnimation: false
}]
});
res.yAxis.push((data[i].value / sumValue * 100).toFixed(2) + "%");
}
return res;
}
option = {
legend: {
show: true,
icon: "circle",
top: "center",
left: '75%',
data: arrName,
width: 50,
padding: [0, 5],
itemGap: 10,
formatter: function (name) {
return "{title|" + name + "}"
},
textStyle: {
rich: {
title: {
fontSize: 14,
lineHeight: 15,
color: "rgb(0, 178, 246)"
},
value: {
fontSize: 14,
lineHeight: 16,
color: "#fff"
}
}
},
},
tooltip: {
show: true,
trigger: "item",
formatter: "{a}<br>{b}:{c}({d}%)"
},
color: ['rgb(24, 183, 142)', 'rgb(1, 179, 238)', 'rgb(22, 75, 205)', 'rgb(52, 52, 176)'],
grid: {
top: '6%',
bottom: '65%',
left: "40%",
containLabel: false
},
yAxis: [{
type: 'category',
inverse: true,
axisLine: {
show: false
},
axisTick: {
show: false
},
axisLabel: {
interval: 0,
inside: true,
textStyle: {
color: "#fff",
fontSize: 12,
},
show: true
},
data: optionData.yAxis
}],
xAxis: [{
show: false
}],
series: optionData.series
};
var myChart = echarts.init(document.getElementById('page3_4'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,67 @@
(function () {
act.get("/api/statistics/voter/people_condition/hot_key", function (resp) {
var keyArr = resp.data.keyArr;
var objArr = new Array();
keyArr.forEach((item) => {
objArr.push({ "value": Math.floor(Math.random() * 50), "name": item });
});
let datas = objArr;
option = {
tooltip: {
show: true,
position: 'top',
textStyle: {
fontSize: 14
}
},
series: [{
type: "wordCloud",
// 网格大小,各项之间间距
gridSize: 25,
// 形状 circle 圆cardioid 心, diamond 菱形,
// triangle-forward 、triangle 三角star五角星
shape: 'circle',
// 字体大小范围
sizeRange: [10, 20],
// 文字旋转角度范围
rotationRange: [0, 90],
// 旋转步值
rotationStep: 90,
// 自定义图形
// maskImage: maskImage,
left: 'center',
top: 'center',
right: null,
bottom: null,
// 画布宽
width: '90%',
// 画布高
height: '80%',
// 是否渲染超出画布的文字
drawOutOfBound: false,
textStyle: {
normal: {
color: function () {
return 'rgb(' + [
Math.round(Math.random() * 10 + 55),
Math.round(Math.random() * 80 + 55),
Math.round(Math.random() * 120 + 55)
].join(',') + ')';
}
},
emphasis: {
shadowBlur: 10,
shadowColor: '#2ac'
}
},
data: datas
}]
};
var myChart = echarts.init(document.getElementById('page3_5'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,134 @@
(function () {
act.get("/api/statistics/office/analyze", function (resp) {
var objArr = resp.data;
var nameArr = new Array();
var countArr = new Array();
objArr.forEach(item => {
nameArr.push(item.name);
countArr.push(item.count);
});
//数据
var XName = nameArr;
var data1 = countArr;
var img = [
'image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAABRCAYAAABFTSEIAAAACXBIWXMAAAsSAAALEgHS3X78AAAEp0lEQVR42u3cz4sjRRTA8W9Vd3Vn8mMmjj9WQWSRZQ+CsH+B7MnDIgiCd0E8CYJ/gOAIelo8ehUP/gF6WLw5/gMueFP2sIcF0dHd2Z1kknR11fOQZJJJMtlZd03H7HtQpNOTnpn+8Lrm1etmjIig8e/DKoECKqACKqCGAiqgAiqghgIqoAIqoIYCKqACKqCGAiqgAiqghgIqoAJudKTr+osZMNPvBUQBHwHsPF9fB9R0DeHMOQ6T6WOrhEzXBM4swDOL0M6CrArRVoq3t2dGUIb9fTvatg8ZZup1PDBgzPmy98mey6qfzjLz2WaWjEUZKEvGyi9nWyneMOvGIyFQo2Sbg4MUSChpU9IeTTUpJdsEajPZOJeJG5uBZj7rLLduWS5dGm6XNLEELOFUFj54ACJCaychkpDSASK3bwsXL0YgVpWJKwM0iy9Zy8HdGru7jvt3Pbu7w0wES7drTwAbjTHMGCsQcIAnYTC1/wRx0wEnl27JNgZI8HQ6Kc1mQq83RNzaMjPzXqDbjTQaJRFLxIyyMSxAXEkWrhrQzAAmo5HOjCQf7jflILxOkohL+aUPgV4vEGNJo+E5PAy02+UIMEwBxo0CPDP7Dg5SnEtpt1PA0e87XO25FOoh8IYIH2Y5b45RzGAQBiIltZoHxqMcjbksXAVgdc2EQMYzzzdotyeZWKuleULXJtwT4SODfC2QCWR+IF9KnjuX1Xbo99Op7LVE8iXlz0YBTk5SyLEEjo5OLuccEoFUvHfO+reuUPx4zftXAIcx1hdcF+/TvFab4A0Bs0VwqyhpVnkJT89/Q4DDQ0e77YCMwIUsFMeFZD856699URRvX4nxE4A/jbnxXp7v4Zw3ReGNSDHI8wFQjIafuoyn58L/fB6sth/Ybg9fez2TRC6QZcZYvgHsazF+MP7YCyLXcM7gvSXLDGBqYDg+NhwdmSpPoTrAkub0W+f4FSB1fDucIunMHSLpO8WAH0rSy8u+19MBCHB4OHzd2pI+CEUhpigEiN+l6WcdY252jLn5s7Wf472ImPcN8pUl/tEHoV4XWq1Ke4KrLmPsTA3oODpytFoOyJKSyzHyMSIxteWngMW5cSEdDJQUhTdZVgxOz3/+jFJm4+bA2e5JpNU6WZ4Fw99JwnWMKccwpeddP+B7GZTNUPKqybJy0O+Hs1YfMz9swwvpB8fbGDG0GuGkkK7V0hxSmZQpABI8l2z0v3sJf50qpAMJCd2qCulql3LD1lRGQjm7lEsDz0rkxTQOfiPPxUBcuJTbbhss/Y1eyi3NwsmKInmkZsKk5gtPUzNhvp11507CSy/X6XYStpvFudpZw1ZWIOF4Cq6SdtbKbioJyAhRTu3u9yMJXerN+ugvaQQsjcZ8Q3VnZwxlSDhe1lB9GjrSw5b+1avT8+Jw+979nNaOI6U3KpTrWAosxVQmygK4ld8X0ZtK/7eViExD7O1NQPb3T7fsl4/4sBpwYzPwjFbTo95Yl9l9Vd1YN1X/147HebSjary1AHyc5qc+XLQEQx9ve8Kg6xr6hKoCKqACKqCGAiqgAiqghgIqoAIqoIYCKqACKqCGAiqgAiqghgIq4JrHP8fEWV8FMTmOAAAAAElFTkSuQmCC',
'image://data:image/png;base64,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',
'image://data:image/png;base64,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',
'image://data:image/png;base64,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',
]
var data = [{
coords: objArr
}]
option = {
grid: {
left: '10%',
top: '14%',
bottom: '20%',
right: 0,
},
legend: {
type: "scroll",
data: "来电量",
itemWidth: 18,
itemHeight: 12,
textStyle: {
color: "#00ffff",
fontSize: 14
},
},
yAxis: [{
type: 'value',
position: 'left',
nameTextStyle: {
color: '#00FFFF'
},
splitLine: {
lineStyle: {
type: 'dashed',
color: 'rgba(135,140,147,0.8)'
}
},
axisLine: {
show: false
},
axisTick: {
show: false
},
axisLabel: {
formatter: '{value}',
color: '#fff',
fontSize: 12
}
},],
xAxis: [{
type: 'category',
axisTick: {
show: false
},
axisLine: {
show: false,
lineStyle: {
color: '#0696f9',
}
},
axisLabel: {
inside: false,
interval: 0,
rotate: 40,
margin: 20,
textStyle: {
color: '#fff', // x轴颜色
fontWeight: 'normal',
fontSize: '12',
lineHeight: 22
}
},
data: XName,
},],
series: [{
symbolSize: 70,
symbol: img[2],
name: '小灯光',
type: "line",
data: data1,
itemStyle: {
normal: {
borderWidth: 5,
color: '#0696f9',
}
}
},
{
name: '滑行的光点',
type: 'lines',
coordinateSystem: 'cartesian2d',
symbolSize: 30,
polyline: true,
effect: {
show: true,
trailLength: 0,
symbol: "arrow",
period: 20, //光点滑动速度
symbolSize: 150,
symbol: img[0]
},
lineStyle: {
normal: {
width: 1,
opacity: 0.6,
curveness: 0.2
}
},
data: data
}
],
};
var myChart = echarts.init(document.getElementById('page4_1'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,79 @@
(function () {
act.get("/api/statistics/office/conference/analyze", function (resp) {
var monthList = resp.data.monthList;
var countList = resp.data.countList;
option = {
grid: {
top: 40,
bottom: 30,
left: 26,
right: 0
},
xAxis: {
data: monthList,
axisLine: {
lineStyle: {
color: '#3d5269'
}
},
axisLabel: {
color: '#fff',
fontSize: 14,
interval: 0,
}
},
yAxis: {
name: "",
nameTextStyle: {
color: '#fff',
fontSize: 14
},
axisLine: {
lineStyle: {
color: '#3d5269'
}
},
axisLabel: {
color: '#fff',
fontSize: 14
},
splitLine: {
show: true,
lineStyle: {
color: '#2d3d53'
}
},
interval: 2,
},
series: [{
type: 'bar',
barWidth: 20,
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0,
color: '#5ef3ff'
}, {
offset: 1,
color: '#06a4f4'
}], false)
}
},
label: {
normal: {
show: true,
fontSize: 14,
fontWeight: 'bold',
color: '#ffffff',
position: 'top',
}
},
data: monthList
}]
};
var myChart = echarts.init(document.getElementById('page4_2'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,170 @@
(function () {
act.get("/api/statistics/office/conference/category/count", function (resp) {
let chart = [
{
name: '常委会议',
value: resp.data.cwPercent // 百分比
},
{
name: '主任会议',
value: resp.data.zrPercent// 百分比
},
{
name: '其他会议',
value: resp.data.otherPercent // 百分比
}
]
let startAngle = [90, 270, 90] // 起始角度
let centerX = [20, 50, 80] // 每个圆心的x位置
let centerY = [75, 28, 75] // 每个圆心的Y位置
let seriesAll = []
chart.forEach((item, i) => {
if (i < 4) {
let pie = {
name: '',
type: 'pie',
z: 10,
radius: ['40%', '42%'],
center: [`${centerX[i]}%`, `${centerY[i]}%`],
startAngle: startAngle[i],
avoidLabelOverlap: false,
data: [{
value: chart[i].value,
name: chart[i].name,
tooltip: {
trigger: 'item',
formatter: '{b} : {c} ({d}%)'
},
label: {
show: false
},
labelLine: {
show: false
},
emphasis: {
label: {
show: false
},
labelLine: {
show: false
}
}
},
{
value: 100 - chart[i].value,
name: '',
itemStyle: {
color: 'transparent'
},
tooltip: {
show: false
},
label: {
show: false
},
labelLine: {
show: false
},
emphasis: {
label: {
show: false
},
labelLine: {
show: false
}
}
},
{
// 指示线
name: chart[i].name,
value: 0,
tooltip: {
show: false
},
itemStyle: {
color: 'transparent'
},
labelLine: {
show: true,
length: 20,
length2: 3,
color: '#B1BCD2',
lineStyle: {
color: '#B1BCD2'
}
},
label: {
color: '#B1BCD2',
fontSize: 12,
position: 'outside'
}
}
]
}
let gauge = {
name: '',
z: -1,
type: 'gauge',
radius: '42%',
center: [`${centerX[i]}%`, `${centerY[i]}%`],
startAngle: 0,
endAngle: 359.9,
splitNumber: 30,
title: {
show: false
},
// 中间的百分比
detail: {
formatter: '{value}%',
offsetCenter: [0, 0],
color: '#fff',
fontSize: 16,
fontStyle: 'italic',
fontFamily: 'DINPro-Light'
},
pointer: {
show: false
},
axisTick: {
show: false
},
axisLine: {
show: false
},
splitLine: {
show: true,
length: 1,
lineStyle: {
width: 6,
color: '#fff'
}
},
axisLabel: {
show: false
},
data: [{
value: chart[i].value,
name: chart[i].name
}]
}
seriesAll.push(pie)
seriesAll.push(gauge)
}
})
option = {
color: '#fff',
tooltip: {
trigger: 'item',
formatter: '{b} : {c} ({d}%)'
},
series: seriesAll
}
var myChart = echarts.init(document.getElementById('page4_3'));
myChart.setOption(option);
});
})()

View File

@ -0,0 +1,82 @@
(function () {
init();
})()
function init(){
act.get("/api/statistics/office/rank", function (resp) {
var countryArr = resp.data.countryArr;
var countArr = resp.data.countArr;
option = {
tooltip: {
trigger: 'axis',
show: false,
axisPointer: { // 坐标轴指示器,坐标轴触发有效
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
},
},
legend: {
show: false
},
grid: {
top: 20,
left: '15%',
right: '10%',
bottom: 0,
},
xAxis: [{
splitLine: {
show: false
},
type: 'value',
show: false,
}],
yAxis: [{
splitLine: {
show: false
},
axisLine: { //y轴
show: false
},
type: 'category',
axisTick: {
show: false
},
inverse: true,
data: countryArr,
axisLabel: {
color: '#A7D6F4',
fontSize: 14,
}
}],
series: [{
name: '标准化',
type: 'bar',
barWidth: 14, // 柱子宽度
label: {
show: true,
position: 'right', // 位置
color: '#A7D6F4',
fontSize: 14,
distance: 15, // 距离
formatter: '{c}' // 这里是数据展示的时候显示的数据
}, // 柱子上方的数值
itemStyle: {
barBorderRadius: [0, 0, 0, 0], // 圆角(左上、右上、右下、左下)
color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [{
offset: 0,
color: '#7882BC'
}, {
offset: 1,
color: '#5062F5'
}], false), // 渐变
},
data: countArr
},]
};
var myChart = echarts.init(document.getElementById('page4_4'));
myChart.setOption(option);
});
}

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,32 @@
var yuan = {
baseUrl: "https://rd.ydool.org",
ajax: (url, type, data, func) => {
$.ajax({
"url": yuan.baseUrl + url,
"type": type,
"data": data,
"dataType": "json",
success: function (resp) {
if (func) func(resp);
}
});
},
get: (url, func) => {
yuan.ajax(url, "get", null, func);
},
dom2ValueStr: (dom) => {
return $(dom).map((e) => $(dom).eq(e).val()).get().join(",");
},
checkBlank: (domArr) => {
var flag = true;
domArr.forEach((dom) => {
for (let i = 0; i < dom.length; i++) {
let val = $(dom).eq(i).val();
if (val == undefined || val == null || val == "" || val.trim() == "") flag = false;
}
});
if (!flag) act.error("输入框内容不能为空值");
return flag;
}
}

View File

@ -9,35 +9,173 @@
</div> </div>
<act:form id="inputForm" action="${ctx}/rddb/show/contact/save" remote="true" <act:form id="inputForm" action="${ctx}/rddb/show/contact/save" remote="true"
result="updateResult"> before="before" result="updateResult">
<input type="hidden" name="id" value="${report.id!}">
<div class="box-body"> <div class="box-body">
<div class="form-unit">活动举办次数渠道</div> <div id="channel-div">
<act:title title="" fields="1"/> <div class="form-unit">活动举办次数渠道/占比</div>
<act:input text="渠道" name="channel" value="${channel}" as="textarea" col="2" rows="3"/> <div class="row">
<div class="col-xs-12">
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<div id="page2_3" style="height:250px;"></div>
</div>
</div>
</div>
</div>
<input type="hidden" name="channel">
<input type="hidden" name="channelRate">
<% for(_channel in channel){ %>
<div class="row">
<div class="col-xs-6">
<div class="form-group">
<label class="control-label col-sm-4">
渠道:
</label>
<div class="col-sm-8">
<input type="text" value="${_channel}" name="_channel" maxlength=""
class="form-control"
placeholder="">
</div>
</div>
</div>
<div class="col-xs-5">
<div class="form-group">
<label class="control-label col-sm-4">
占比:
</label>
<div class="col-sm-8">
<input type="text" value="${channelRate[_channelLP.dataIndex]}" name="_channelRate"
maxlength=""
class="form-control" placeholder="">
</div>
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label" style="width: 100%;text-align: right">
<input type="button" class="channel-decrease-btn" value="-">
</label>
</div>
</div>
</div>
</div>
<% } %>
</div>
<div class="row">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label col-sm-2">
<input type="button" class="channel-increase-btn" value="+">
</label>
</div>
</div>
</div>
<div class="form-unit">活动参与人数月度统计人数</div> <div class="form-unit">活动参与人数月度统计人数</div>
<div class="row">
<div class="col-xs-12">
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<div id="page2_6" style="height:250px;"></div>
</div>
</div>
</div>
</div>
<act:title title="" fields="1"/> <act:title title="" fields="1"/>
<act:input text="人数" name="peopleCount" value="${peopleCount}" as="textarea" col="2" rows="3"/> <input type="hidden" name="peopleCount">
<div class="row">
<% for(_peopleCount in peopleCount){ %>
<div class="col-xs-6">
<div class="form-group">
<label class="control-label col-sm-4">
${_peopleCountLP.index}月:
</label>
<div class="col-sm-8">
<input type="text" value="${_peopleCount}" name="_peopleCount" maxlength=""
class="form-control"
placeholder="">
</div>
</div>
</div>
<% } %>
</div>
<div class="form-unit">活动举办次数渠道分布占比</div> <div class="form-unit">联络站月使用情况分析</div>
<act:title title="" fields="1"/> <div class="row">
<act:input text="占比" name="channelRate" value="${channelRate}" as="textarea" col="2" rows="3"/> <div class="col-xs-12">
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<div id="page2_5" style="height:250px;"></div>
</div>
</div>
</div>
</div>
<div class="form-unit">联络站月使用情况分析-环比</div> <div class="row">
<act:title title="" fields="1"/> <div class="col-xs-12">
<act:input text="环比" name="cycleRate" value="${cycleRate}" as="textarea" col="2" rows="3"/> <div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<div class="form-unit">环比</div>
</div>
</div>
</div>
</div>
<div class="form-unit">联络站月使用情况分析-同比</div> <input type="hidden" name="cycleRate">
<act:title title="" fields="1"/> <div class="row">
<act:input text="同比" name="sameRate" value="${sameRate}" as="textarea" col="2" rows="3"/> <% for(_cycleRate in cycleRate){ %>
<div class="col-xs-6">
<div class="form-group">
<label class="control-label col-sm-4">
${_cycleRateLP.index}月:
</label>
<div class="col-sm-8">
<input type="text" value="${_cycleRate}" name="_cycleRate" maxlength=""
class="form-control"
placeholder="">
</div>
</div>
</div>
<% } %>
</div>
<div class="row">
<div class="col-xs-12">
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<div class="form-unit">同比</div>
</div>
</div>
</div>
</div>
<input type="hidden" name="sameRate">
<div class="row">
<% for(_sameRate in sameRate){ %>
<div class="col-xs-6">
<div class="form-group">
<label class="control-label col-sm-4">
${_sameRateLP.index}月:
</label>
<div class="col-sm-8">
<input type="text" value="${_sameRate}" name="_sameRate" maxlength=""
class="form-control"
placeholder="">
</div>
</div>
</div>
<% } %>
</div>
</div> </div>
<div class="box-footer"> <div class="box-footer">
<div class="row"> <div class="row">
<div class="col-sm-offset-2 col-sm-10"> <div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-sm btn-primary" id="btnSubmit"><i class="fa fa-check"></i> <button type="submit" class="btn btn-sm btn-primary" id="btnSubmit"><i
class="fa fa-check"></i>
保 存 保 存
</button>&nbsp; </button>&nbsp;
@ -54,15 +192,106 @@
<script> <script>
$(".channel-increase-btn").on("click", function () {
$("#channel-div").append(`
<div class="row">
<div class="col-xs-6">
<div class="form-group">
<label class="control-label col-sm-4">
渠道:
</label>
<div class="col-sm-8">
<input type="text" name="_channel" maxlength="" class="form-control"
placeholder="">
</div>
</div>
</div>
<div class="col-xs-5">
<div class="form-group">
<label class="control-label col-sm-4">
占比:
</label>
<div class="col-sm-8">
<input type="text" name="_channelRate"
maxlength=""
class="form-control" placeholder="">
</div>
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label" style="width: 100%;text-align: right">
<input type="button" class="channel-decrease-btn" value="-">
</label>
</div>
</div>
</div>
</div>
`);
});
$("body").on("click", ".channel-decrease-btn", function () {
$(this).parents(".row").remove();
});
function before() {
var _channel = $("[name='_channel']");
var _channelRate = $("[name='_channelRate']");
var _peopleCount = $("[name='_peopleCount']");
var _cycleRate = $("[name='_cycleRate']");
var _sameRate = $("[name='_sameRate']");
var flag = yuan.checkBlank([
_channel,
_channelRate,
_peopleCount,
_cycleRate,
_sameRate
]);
$("[name = 'channel']").val(yuan.dom2ValueStr(_channel));
$("[name = 'channelRate']").val(yuan.dom2ValueStr(_channelRate));
$("[name = 'peopleCount']").val(yuan.dom2ValueStr(_peopleCount));
$("[name = 'cycleRate']").val(yuan.dom2ValueStr(_cycleRate));
$("[name = 'sameRate']").val(yuan.dom2ValueStr(_sameRate));
return flag;
}
function updateResult(resp) { function updateResult(resp) {
if (resp.state == 1) { if (resp.state == 1) {
act.msg("操作成功"); act.msg("操作成功");
setTimeout(() => {
location.reload();
}, 500);
} else { } else {
act.error(resp.msg); act.error(resp.msg);
} }
} }
</script> </script>
<link rel="stylesheet" href="/assets/css/style.css">
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2656742_5xdkb8jf9mn.css">
<script src="/assets/js/echarts.min.js"></script>
<script src="/assets/js/yuan.js"></script>
<script src="/assets/js/echarts-wordcloud.min.js"></script>
<script src="/assets/js/page2_3.js"></script>
<script src="/assets/js/page2_6.js"></script>
<script src="/assets/js/page2_5.js"></script>
<style>
#page2_3 {
background-color: rgb(250, 250, 250);
}
#page2_6 {
background-color: rgb(250, 250, 250);
}
#page2_5 {
background-color: rgb(250, 250, 250);
}
</style>

View File

@ -8,12 +8,67 @@
</div> </div>
</div> </div>
<act:form id="inputForm" action="${ctx}/rddb/show/office/save" remote="true" result="updateResult"> <act:form id="inputForm" action="${ctx}/rddb/show/office/save" remote="true" result="updateResult"
before="before">
<div class="box-body"> <div class="box-body">
<div class="form-unit">区县信息报道</div> <div class="form-unit">区县信息报道</div>
<div class="row">
<div class="col-xs-12">
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<div id="page4_4" style="height:250px;"></div>
</div>
</div>
</div>
</div>
<act:title title="" fields="2"/> <act:title title="" fields="2"/>
<act:input text="区县" name="region" as="textarea" col="2" rows="3" value="${region}"/> <input type="hidden" name="region">
<act:input text="数值" name="regionNum" as="textarea" col="2" rows="3" value="${regionNum}"/> <input type="hidden" name="regionNum">
<% for(_region in region){ %>
<div class="row">
<div class="col-xs-6">
<div class="form-group">
<label class="control-label col-sm-4">
区县:
</label>
<div class="col-sm-8">
<input type="text" value="${_region}" name="_region" maxlength="" class="form-control"
placeholder="">
</div>
</div>
</div>
<div class="col-xs-5">
<div class="form-group">
<label class="control-label col-sm-4">
数值:
</label>
<div class="col-sm-8">
<input type="text" value="${regionNum[_regionLP.dataIndex]}" name="_regionNum"
maxlength=""
class="form-control" placeholder="">
</div>
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label" style="width: 100%;text-align: right">
<input type="button" class="decrease-btn" value="-">
</label>
</div>
</div>
</div>
</div>
<% } %>
</div>
<div class="row">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label col-sm-2">
<input type="button" class="increase-btn" value="+">
</label>
</div>
</div>
</div> </div>
<div class="box-footer"> <div class="box-footer">
@ -34,17 +89,86 @@
</div> </div>
</div> </div>
<% } %> <% } %>
<script> <script>
$(".increase-btn").on("click", function () {
$(".box-body").append(`
<div class="row">
<div class="col-xs-6">
<div class="form-group">
<label class="control-label col-sm-4">
区县:
</label>
<div class="col-sm-8">
<input type="text" name="_region" maxlength="" class="form-control"
placeholder="">
</div>
</div>
</div>
<div class="col-xs-5">
<div class="form-group">
<label class="control-label col-sm-4">
数值:
</label>
<div class="col-sm-8">
<input type="text" name="_regionNum" maxlength=""
class="form-control" placeholder="">
</div>
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label" style="width: 100%;text-align: right">
<input type="button" class="decrease-btn" value="-">
</label>
</div>
</div>
</div>
</div>
`);
});
$("body").on("click", ".decrease-btn", function () {
$(this).parents(".row").remove();
});
function before() {
var _region = $("[name='_region']");
var _regionNum = $("[name='_regionNum']");
var flag = yuan.checkBlank([
_region,
_regionNum
]);
$("[name = 'region']").val(yuan.dom2ValueStr(_region));
$("[name = 'regionNum']").val(yuan.dom2ValueStr(_regionNum));
return flag;
}
function updateResult(resp) { function updateResult(resp) {
if (resp.state == 1) { if (resp.state == 1) {
act.msg("操作成功"); act.msg("操作成功");
setTimeout(() => {
location.reload();
}, 500);
} else { } else {
act.error(resp.msg); act.error(resp.msg);
} }
} }
</script> </script>
<link rel="stylesheet" href="/assets/css/style.css">
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2656742_5xdkb8jf9mn.css">
<script src="/assets/js/echarts.min.js"></script>
<script src="/assets/js/yuan.js"></script>
<script src="/assets/js/echarts-wordcloud.min.js"></script>
<script src="/assets/js/page4_4.js"></script>
<style>
#page4_4 {
background-color: rgb(250, 250, 250);
}
</style>

View File

@ -8,29 +8,192 @@
</div> </div>
</div> </div>
<act:form id="inputForm" action="${ctx}/rddb/show/voter/save" remote="true" result="updateResult"> <act:form id="inputForm" action="${ctx}/rddb/show/voter/save" remote="true" result="updateResult"
before="before">
<div class="box-body"> <div class="box-body">
<div class="form-unit">统计信息</div> <div class="form-unit">统计信息</div>
<act:title title="" fields="3"/> <act:title title="" fields="3"/>
<act:input text="平均办理时长" name="averageTime" value="${averageTime}" col="2" /> <act:input text="平均办理时长" name="averageTime" value="${averageTime}" col="2"/>
<act:input text="按时办结率" name="ontimeRate" value="${ontimeRate}" col="2" /> <act:input text="按时办结率" name="ontimeRate" value="${ontimeRate}" col="2"/>
<act:input text="满意率" name="satisfactionRate" value="${satisfactionRate}" col="2" /> <act:input text="满意率" name="satisfactionRate" value="${satisfactionRate}" col="2"/>
<div class="form-unit">民情分类</div> <div class="form-unit">民情分类情况/占比</div>
<act:title title="" fields="1"/> <div id="category-div">
<act:input text="分类" name="category" value="${category}" as="textarea" col="2" rows="3"/> <div class="row">
<div class="col-xs-12">
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<div id="page3_3" style="height:250px;"></div>
</div>
</div>
</div>
</div>
<input type="hidden" name="category">
<input type="hidden" name="categoryCondition">
<% for(_category in category){ %>
<div class="row">
<div class="col-xs-6">
<div class="form-group">
<label class="control-label col-sm-4">
分类:
</label>
<div class="col-sm-8">
<input type="text" value="${_category}" name="_category" maxlength=""
class="form-control"
placeholder="">
</div>
</div>
</div>
<div class="col-xs-5">
<div class="form-group">
<label class="control-label col-sm-4">
占比:
</label>
<div class="col-sm-8">
<input type="text" value="${categoryCondition[_categoryLP.dataIndex]}"
name="_categoryCondition"
maxlength=""
class="form-control" placeholder="">
</div>
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label" style="width: 100%;text-align: right">
<input type="button" class="category-decrease-btn" value="-">
</label>
</div>
</div>
</div>
</div>
<% } %>
</div>
<div class="row">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label col-sm-2">
<input type="button" class="category-increase-btn" value="+">
</label>
</div>
</div>
</div>
<div class="form-unit">民情分类情况</div>
<act:title title="" fields="1"/>
<act:input text="占比" name="categoryCondition" value="${categoryCondition}" as="textarea" col="2" rows="3"/>
<div class="form-unit">民情处理情况分析</div> <div class="form-unit">民情处理情况分析</div>
<div id="handle-div">
<div class="row">
<div class="col-xs-12">
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<div id="page3_4" style="height:250px;"></div>
</div>
</div>
</div>
</div>
<act:title title="" fields="1"/> <act:title title="" fields="1"/>
<act:input text="数值" name="handleAnalyze" value="${handleAnalyze}" as="textarea" col="2" rows="3"/> <input type="hidden" name="handleAnalyze">
<input type="hidden" name="handleAnalyzeStatus">
<% for(_handleAnalyze in handleAnalyze){ %>
<div class="row">
<div class="col-xs-6">
<div class="form-group">
<label class="control-label col-sm-4">
状态:
</label>
<div class="col-sm-8">
<input type="text" value="${handleAnalyzeStatus[_handleAnalyzeLP.dataIndex]}"
name="_handleAnalyzeStatus"
maxlength=""
class="form-control" placeholder="">
</div>
</div>
</div>
<div class="col-xs-5">
<div class="form-group">
<label class="control-label col-sm-4">
数值:
</label>
<div class="col-sm-8">
<input type="text" value="${_handleAnalyze}" name="_handleAnalyze" maxlength=""
class="form-control"
placeholder="">
</div>
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label" style="width: 100%;text-align: right">
<input type="button" class="handle-decrease-btn" value="-">
</label>
</div>
</div>
</div>
</div>
<% } %>
</div>
<div class="row">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label col-sm-2">
<input type="button" class="handle-increase-btn" value="+">
</label>
</div>
</div>
</div>
<div class="form-unit">民情反映热点关键词云</div> <div class="form-unit">民情反映热点关键词云</div>
<div class="row">
<div class="col-xs-12">
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<div id="page3_5" style="height:250px;"></div>
</div>
</div>
</div>
</div>
<act:title title="" fields="1"/> <act:title title="" fields="1"/>
<act:input text="词云" name="hotKey" value="${hotKey}" as="textarea" col="2" rows="3"/> <input type="hidden" name="hotKey">
<div id="hot-div" class="row">
<% for(_hotKey in hotKey){ %>
<div class="col-xs-5">
<div class="form-group">
<label class="control-label key-label">
关键词:
</label>
<div class="key-div">
<input type="text" value="${_hotKey}" name="_hotKey" maxlength=""
class="form-control"
placeholder="">
</div>
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label" style="width: 100%;text-align: right">
<input type="button" class="hot-decrease-btn" value="-">
</label>
</div>
</div>
</div>
<% } %>
</div>
<div class="row">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label col-sm-2">
<input type="button" class="hot-increase-btn" value="+">
</label>
</div>
</div>
</div>
</div>
</div> </div>
<div class="box-footer"> <div class="box-footer">
@ -48,21 +211,209 @@
</div> </div>
</div> </div>
</act:form> </act:form>
</div> </div>
</div> </div>
<% } %> <% } %>
<script> <script>
$(".category-increase-btn").on("click", function () {
$("#category-div").append(`
<div class="row">
<div class="col-xs-6">
<div class="form-group">
<label class="control-label col-sm-4">
分类:
</label>
<div class="col-sm-8">
<input type="text" name="_category" maxlength=""
class="form-control"
placeholder="">
</div>
</div>
</div>
<div class="col-xs-5">
<div class="form-group">
<label class="control-label col-sm-4">
占比:
</label>
<div class="col-sm-8">
<input type="text"
name="_categoryCondition"
maxlength=""
class="form-control" placeholder="">
</div>
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label" style="width: 100%;text-align: right">
<input type="button" class="category-decrease-btn" value="-">
</label>
</div>
</div>
</div>
</div>
`);
});
$("body").on("click", ".category-decrease-btn", function () {
$(this).parents(".row").remove();
});
$(".handle-increase-btn").on("click", function () {
$("#handle-div").append(`
<div class="row">
<div class="col-xs-6">
<div class="form-group">
<label class="control-label col-sm-4">
状态:
</label>
<div class="col-sm-8">
<input type="text"
name="_handleAnalyzeStatus"
maxlength=""
class="form-control" placeholder="">
</div>
</div>
</div>
<div class="col-xs-5">
<div class="form-group">
<label class="control-label col-sm-4">
数值:
</label>
<div class="col-sm-8">
<input type="text" name="_handleAnalyze" maxlength=""
class="form-control"
placeholder="">
</div>
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label" style="width: 100%;text-align: right">
<input type="button" class="handle-decrease-btn" value="-">
</label>
</div>
</div>
</div>
</div>
`);
});
$("body").on("click", ".handle-decrease-btn", function () {
$(this).parents(".row").remove();
});
$(".hot-increase-btn").on("click", function () {
$("#hot-div").append(`
<div class="col-xs-5">
<div class="form-group">
<label class="control-label key-label">
关键词:
</label>
<div class="key-div">
<input type="text" name="_hotKey" maxlength=""
class="form-control"
placeholder="">
</div>
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">
<div class="form-group">
<label class="control-label" style="width: 100%;text-align: right">
<input type="button" class="hot-decrease-btn" value="-">
</label>
</div>
</div>
</div>
`);
});
$("body").on("click", ".hot-decrease-btn", function () {
$(this).parents(".col-xs-1").prev().remove();
$(this).parents(".col-xs-1").remove();
});
function before() {
var averageTime = $("[name='averageTime']");
var ontimeRate = $("[name='ontimeRate']");
var satisfactionRate = $("[name='satisfactionRate']");
var _category = $("[name='_category']");
var _categoryCondition = $("[name='_categoryCondition']");
var _handleAnalyze = $("[name='_handleAnalyze']");
var _handleAnalyzeStatus = $("[name='_handleAnalyzeStatus']");
var _hotKey = $("[name='_hotKey']");
var flag = yuan.checkBlank([
averageTime,
ontimeRate,
satisfactionRate,
_category,
_categoryCondition,
_handleAnalyze,
_handleAnalyzeStatus,
_hotKey
]);
$("[name = 'category']").val(yuan.dom2ValueStr(_category));
$("[name = 'categoryCondition']").val(yuan.dom2ValueStr(_categoryCondition));
$("[name = 'handleAnalyze']").val(yuan.dom2ValueStr(_handleAnalyze));
$("[name = 'handleAnalyzeStatus']").val(yuan.dom2ValueStr(_handleAnalyzeStatus));
$("[name = 'hotKey']").val(yuan.dom2ValueStr(_hotKey));
return flag;
}
function updateResult(resp) { function updateResult(resp) {
if (resp.state == 1) { if (resp.state == 1) {
act.msg("操作成功"); act.msg("操作成功");
setTimeout(() => {
location.reload();
}, 500);
} else { } else {
act.error(resp.msg); act.error(resp.msg);
} }
} }
</script> </script>
<link rel="stylesheet" href="/assets/css/style.css">
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2656742_5xdkb8jf9mn.css">
<script src="/assets/js/echarts.min.js"></script>
<script src="/assets/js/yuan.js"></script>
<script src="/assets/js/echarts-wordcloud.min.js"></script>
<script src="/assets/js/page3_3.js"></script>
<script src="/assets/js/page3_4.js"></script>
<script src="/assets/js/page3_5.js"></script>
<style>
#page3_3 {
background-color: rgb(250, 250, 250);
}
#page3_4 {
background-color: rgb(250, 250, 250);
}
#page3_5 {
background-color: rgb(250, 250, 250);
}
.key-div {
width: 60%;
display: inline-block;
float: right;
position: relative;
min-height: 1px;
padding-left: 15px;
padding-right: 15px;
}
.key-label {
width: 40%;
display: inline-block
}
</style>

View File

@ -88,7 +88,7 @@
axisLabel: { axisLabel: {
show: true show: true
}, },
data: ['1月', '2月', '3月', '4月', '5月', '6月'], data: monthArr,
}, },
yAxis: { yAxis: {
max: 100, max: 100,

View File

@ -1,23 +1,15 @@
(function () { (function () {
act.get("/api/statistics/voter/people_condition/analyze", function (resp) { act.get("/api/statistics/voter/people_condition/analyze", function (resp) {
var statusArr = resp.data.statusArr;
var countArr = resp.data.countArr; var countArr = resp.data.countArr;
data = [{ var data=new Array();
name: "已受理", statusArr.forEach((status,i)=>{
value: countArr[0] data.push({
}, "name":status,
{ "value":countArr[i]
name: "已办结", })
value: countArr[1] });
},
{
name: "未受理",
value: countArr[2]
},
{
name: "办理中",
value: countArr[3]
}
];
arrName = getArrayValue(data, "name"); arrName = getArrayValue(data, "name");
arrValue = getArrayValue(data, "value"); arrValue = getArrayValue(data, "value");
sumValue = eval(arrValue.join('+')); sumValue = eval(arrValue.join('+'));

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>象山人大驾驶舱</title> <title>象山人大数据驾驶舱</title>
<link rel="stylesheet" href="./assets/css/style.css"> <link rel="stylesheet" href="./assets/css/style.css">
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2656742_5xdkb8jf9mn.css"> <link rel="stylesheet" href="http://at.alicdn.com/t/font_2656742_5xdkb8jf9mn.css">
</head> </head>
@ -27,7 +27,7 @@
<p>人大办公</p> <p>人大办公</p>
</a> </a>
</div> </div>
<div class="allname">象山人大驾驶舱</div> <div class="allname">象山人大数据驾驶舱</div>
<div class="charts"> <div class="charts">
<div> <div>
<p class="name">联络站概况</p> <p class="name">联络站概况</p>

View File

@ -5,7 +5,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>象山人大驾驶舱</title> <title>象山人大数据驾驶舱</title>
<link rel="stylesheet" href="./assets/css/style.css"> <link rel="stylesheet" href="./assets/css/style.css">
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2656742_5xdkb8jf9mn.css"> <link rel="stylesheet" href="http://at.alicdn.com/t/font_2656742_5xdkb8jf9mn.css">
<link rel="stylesheet" href="./assets/css/swiper-bundle.min.css"> <link rel="stylesheet" href="./assets/css/swiper-bundle.min.css">
@ -31,7 +31,7 @@
<p>人大办公</p> <p>人大办公</p>
</a> </a>
</div> </div>
<div class="allname">象山人大驾驶舱</div> <div class="allname">象山人大数据驾驶舱</div>
<div class="charts"> <div class="charts">
<div class="numbox"> <div class="numbox">
<div> <div>

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>象山人大驾驶舱</title> <title>象山人大数据驾驶舱</title>
<link rel="stylesheet" href="./assets/css/style.css"> <link rel="stylesheet" href="./assets/css/style.css">
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2656742_5xdkb8jf9mn.css"> <link rel="stylesheet" href="http://at.alicdn.com/t/font_2656742_5xdkb8jf9mn.css">
</head> </head>
@ -27,7 +27,7 @@
<p>人大办公</p> <p>人大办公</p>
</a> </a>
</div> </div>
<div class="allname">象山人大驾驶舱</div> <div class="allname">象山人大数据驾驶舱</div>
<div class="charts"> <div class="charts">
<div> <div>
<p class="name">关键指标</p> <p class="name">关键指标</p>

View File

@ -4,7 +4,7 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>象山人大驾驶舱</title> <title>象山人大数据驾驶舱</title>
<link rel="stylesheet" href="./assets/css/style.css"> <link rel="stylesheet" href="./assets/css/style.css">
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2656742_5xdkb8jf9mn.css"> <link rel="stylesheet" href="http://at.alicdn.com/t/font_2656742_5xdkb8jf9mn.css">
</head> </head>
@ -27,7 +27,7 @@
<p>人大办公</p> <p>人大办公</p>
</a> </a>
</div> </div>
<div class="allname">象山人大驾驶舱</div> <div class="allname">象山人大数据驾驶舱</div>
<div class="charts"> <div class="charts">
<div class="info"> <div class="info">
<p class="name">基础情况</p> <p class="name">基础情况</p>

Some files were not shown because too many files have changed in this diff Show More