diff --git a/epmet-oper-web/src/assets/scss/modules/wx-mini/score.scss b/epmet-oper-web/src/assets/scss/modules/wx-mini/score.scss index f504114..b7947d3 100644 --- a/epmet-oper-web/src/assets/scss/modules/wx-mini/score.scss +++ b/epmet-oper-web/src/assets/scss/modules/wx-mini/score.scss @@ -1,6 +1,6 @@ -@import "@/assets/scss/c/config.scss"; -@import "@/assets/scss/c/function.scss"; -@import "@/assets/scss/c/anime.scss"; +@import '@/assets/scss/c/config.scss'; +@import '@/assets/scss/c/function.scss'; +@import '@/assets/scss/c/anime.scss'; // 积分银行-积分排行 .score_rank { @@ -22,7 +22,7 @@ color: rgba(51, 51, 51, 1); &::before { - content: ""; + content: ''; position: absolute; top: 7px; left: 0; @@ -31,30 +31,30 @@ background: rgba(230, 0, 0, 1); border-radius: 3px; } - .score_more{ + .score_more { position: absolute; - top:13px; - right:10px; + top: 13px; + right: 10px; font-size: 13px; font-weight: normal; color: rgb(151, 150, 150); } } - .rank_tabs{ - margin:10px 20px; + .rank_tabs { + margin: 10px 20px; display: flex; - background: #F8F8F8; + background: #f8f8f8; border-radius: 5px; height: 40px; justify-content: space-around; - padding:5px 0; + padding: 5px 0; - .tabs_1{ - width:28%; + .tabs_1 { + width: 28%; text-align: center; height: 30px; - background: #FFFFFF; + background: #ffffff; box-shadow: 0px 4px 12px 0px rgba(63, 63, 63, 0.1); border-radius: 5px; font-size: 15px; @@ -63,8 +63,8 @@ color: #333333; line-height: 30px; } - .tabs_2{ - width:28%; + .tabs_2 { + width: 28%; text-align: center; height: 30px; font-size: 15px; @@ -73,22 +73,18 @@ color: #999999; line-height: 30px; } - } - - - } } //积分银行-党员积分排行榜 -.score_party{ +.score_party { position: relative; margin-top: 10px; .score_party_content { width: 100%; overflow: hidden; - .title { + .title { position: relative; margin: 10px 10px 0 10px; padding: 7px 10px 13px; @@ -99,253 +95,249 @@ color: rgba(51, 51, 51, 1); &::before { - content: ""; + content: ''; position: absolute; top: 7px; left: 0; width: 3px; height: 15px; - background: rgba(230, 0, 0, 1.0); + background: rgba(230, 0, 0, 1); border-radius: 3px; } } - .rank_tabs{ - margin:0px 15px 0px; + .rank_tabs { + margin: 0px 15px 0px; display: flex; - padding:0px 0px; - .rank_title_left{ + padding: 0px 0px; + .rank_title_left { margin-left: 25px; margin-top: 10px; - width:30%; + width: 30%; font-size: 16px; text-align: center; font-family: PingFang-SC; - padding:0px 0px 0px 0px; + padding: 0px 0px 0px 0px; font-weight: 600; color: rgb(0, 0, 0); - } - .red_line{ - height: 3px; - width: 30px; - background-color: red; - position: absolute; - margin-left: 56px; - margin-top: 33px; - border-radius:4px; - } - .rank_title_right{ - margin-left: 70px; - margin-top: 12px; - width:30%; - font-size: 14px; - text-align: center; - font-family: PingFang-SC; - padding:0px 0px 0px 0px; - font-weight: 500; - color: rgb(171, 171, 171); - } + } + .red_line { + height: 3px; + width: 30px; + background-color: red; + position: absolute; + margin-left: 56px; + margin-top: 33px; + border-radius: 4px; + } + .rank_title_right { + margin-left: 70px; + margin-top: 12px; + width: 30%; + font-size: 14px; + text-align: center; + font-family: PingFang-SC; + padding: 0px 0px 0px 0px; + font-weight: 500; + color: rgb(171, 171, 171); + } } - - - .m-box{ - width: 328px; - height:100%; - //height: 480px; - background-color: white; + + .m-box { + width: 328px; + height: 100%; + //height: 480px; + background-color: white; + position: relative; + float: left; + border-radius: 10px; + margin: 0px 15px 0 15px; + padding-bottom: 7px; + box-shadow: 0px 3px 24px 0px rgba(211, 211, 211, 0.26); + .line { + width: 310px; + border-bottom: 1px solid #e7eeee; + margin-left: 15px; + margin-top: 26px; + margin-bottom: 7px; position: relative; - float: left; - border-radius: 10px; - margin: 0px 15px 0 15px; - padding-bottom: 7px; - box-shadow: 0px 3px 24px 0px rgba(211, 211, 211, 0.26); - .line{ - width: 310px; - border-bottom: 1px solid #e7eeee; - margin-left: 15px; - margin-top: 26px; - margin-bottom: 7px; - position: relative; - } - .list6{ - @include list; - width: 60px; - margin-left: 145px; - margin-top: 20px; - position: relative; + } + .list6 { + @include list; + width: 60px; + margin-left: 145px; + margin-top: 20px; + position: relative; + text-align: center; + font-size: 13px; + color: #b9b9b9; + margin-bottom: 10px; + font-size: PingFang-SC; + } + + .rank_img_score { + width: 327px; + height: 160px; + .item { + position: relative; + float: left; + border-radius: 10px; + background-color: white; + margin-left: 0px; + margin-top: 15px; + width: 33.33%; + .d-group-logo { + position: absolute; + left: 8px; + top: 74px; + width: 10px; + height: 10px; + line-height: 22px; text-align: center; - font-size: 13px; - color: #b9b9b9; - margin-bottom:10px; - font-size: PingFang-SC; - } - - - .rank_img_score { - width: 327px; - height: 160px; - .item{ - position: relative; - float: left; - border-radius: 10px; - background-color: white; - margin-left: 0px; - margin-top: 15px; - width: 33.33%; - .d-group-logo { - position: absolute; - left: 8px; - top: 74px; - width: 10px; - height: 10px; - line-height: 22px; - text-align: center; - .logo1{ - @include img123; - background-color: #f14805; - left: 45px; - } - .logo2{ - @include img123; - background-color: #ff0606; - left: 36px; - } - .logo3{ - @include img123; - background-color: #ffa515; - left: 30px; - } - span { - position: absolute; - z-index: 10; - font-size: 16px; - font-style: italic; - color: white; - width:17px; - height: 17px; - margin-left: 50px; - position: absolute; - display: block; - } + .logo1 { + @include img123; + background-color: #f14805; + left: 45px; } - .d-group-rank{ - position: absolute; - padding-top: 1px; - font-style: italic; - - .rank_1{ - @include shuzi_123; - margin-left: 58px; - } - .rank_2{ - @include shuzi_123; - margin-left: 48px; - } - .rank_3{ - margin-left: 43px; - @include shuzi_123; - } + .logo2 { + @include img123; + background-color: #ff0606; + left: 36px; } - .d-group-name{ - position: absolute; - font-family: PingFang-SC; - font-weight: 600; - .name_1{ - margin-left: 47px; - @include name_123; - } - .name_2{ - margin-left: 41px; - @include name_123; - } - .name_3{ - margin-left: 28px; - @include name_123; - } + .logo3 { + @include img123; + background-color: #ffa515; + left: 30px; } - .d-group-score{ + span { + position: absolute; + z-index: 10; + font-size: 16px; + font-style: italic; + color: white; + width: 17px; + height: 17px; + margin-left: 50px; position: absolute; - font-family: PingFang-SC; - .score_1{ - margin-left: 50px; - @include jifen; - } - .score_2{ - margin-left: 42px; - @include jifen; - } - .score_3{ - margin-left: 36px; - @include jifen; - } + display: block; } - - .d-group-imgback{ - position: absolute; - margin-top: 0.5px; - .back_1{ - width:75px; - height: 75px; - left: 24px; - top: 9.5px; - @include img_123; - } - .back_2{ - @include img_123; - width:88px; - height: 88px; - left: 9px; - top: 0px; - } - .back_3{ - width:75px; - height: 75px; - left: 9px; - top: 9.5px; - @include img_123; - } + } + .d-group-rank { + position: absolute; + padding-top: 1px; + font-style: italic; + + .rank_1 { + @include shuzi_123; + margin-left: 58px; } - .d-group-img { - position: relative; - margin-top: 10px ; - width: 50px; - height: 50px; - margin-left: 0px; - .img1{ - @include img_small12; - left: 28px; - right: 0; - bottom: 0; - } - .img2{ - width: 79.5px; - height: 79.5px; - position: absolute; - display: block; - top: 19px; - left: 13.3px; - right: 0; - bottom: 0px; - margin: auto; - border-radius: 100%; - } - .img3{ - @include img_small12; - left: 13px; - right: 5; - bottom: 5; - } + .rank_2 { + @include shuzi_123; + margin-left: 48px; + } + .rank_3 { + margin-left: 43px; + @include shuzi_123; + } + } + .d-group-name { + position: absolute; + font-family: PingFang-SC; + font-weight: 600; + .name_1 { + margin-left: 47px; + @include name_123; + } + .name_2 { + margin-left: 41px; + @include name_123; + } + .name_3 { + margin-left: 28px; + @include name_123; + } + } + .d-group-score { + position: absolute; + font-family: PingFang-SC; + .score_1 { + margin-left: 50px; + @include jifen; + } + .score_2 { + margin-left: 42px; + @include jifen; + } + .score_3 { + margin-left: 36px; + @include jifen; + } + } + + .d-group-imgback { + position: absolute; + margin-top: 0.5px; + .back_1 { + width: 75px; + height: 75px; + left: 24px; + top: 9.5px; + @include img_123; + } + .back_2 { + @include img_123; + width: 88px; + height: 88px; + left: 9px; + top: 0px; + } + .back_3 { + width: 75px; + height: 75px; + left: 9px; + top: 9.5px; + @include img_123; + } + } + .d-group-img { + position: relative; + margin-top: 10px; + width: 50px; + height: 50px; + margin-left: 0px; + .img1 { + @include img_small12; + left: 28px; + right: 0; + bottom: 0; + } + .img2 { + width: 79.5px; + height: 79.5px; + position: absolute; + display: block; + top: 19px; + left: 13.3px; + right: 0; + bottom: 0px; + margin: auto; + border-radius: 100%; + } + .img3 { + @include img_small12; + left: 13px; + right: 5; + bottom: 5; } } } - - } - - } + } + } + } } -.rank_box{ - height:100%; +.rank_box { + height: 100%; background-color: white; position: relative; // border-radius: 10px; @@ -353,150 +345,390 @@ padding-bottom: 7px; // box-shadow: 0px 3px 24px 0px rgba(211, 211, 211, 0.26); - .list_title{ - display: flex; - justify-content: space-between; - padding:10px 10px 0 10px; - margin-top: 8px; - text-align: center; - color: #b9b9b9; - font-size: 12px; + .list_title { + display: flex; + justify-content: space-between; + padding: 10px 10px 0 10px; + margin-top: 8px; + text-align: center; + color: #b9b9b9; + font-size: 12px; } - - .score_list{ - margin-top:10px; - padding:0 10px; - .item{ + .score_list { + margin-top: 10px; + padding: 0 10px; + + .item { display: flex; - height:40px; + height: 40px; line-height: 40px; display: flex; justify-content: space-between; margin-top: 8px; text-align: center; - .d-group-rank{ + .d-group-rank { text-align: center; font-style: italic; - - >span{ + + > span { font-family: PingFang-SC; font-weight: 600; font-size: 16px; } - .span_rank1{ - color: #E60000; + .span_rank1 { + color: #e60000; } - .span_rank2{ - color: #F56A24; + .span_rank2 { + color: #f56a24; } - .span_rank3{ - color: #F6A33B; + .span_rank3 { + color: #f6a33b; } } - .d-group-img{ + .d-group-img { text-align: center; - >img{ + > img { width: 28px; height: 28px; border-radius: 25px; } - } - + } } - } - .score_no_border{ - padding:0 20px; - } -} - -.single{ - width:100%; - margin:10px 0; + } + .score_no_border { + padding: 0 20px; + } +} + +.single { + width: 100%; + margin: 10px 0; display: flex; justify-content: space-around; - .single_bc{ - width:45%; + .single_bc { + width: 45%; height: 140px; border-radius: 5px; - background: linear-gradient(-54deg, rgba(255, 248, 247, 0.56), rgba(255, 215, 208, 0.56)); + background: linear-gradient( + -54deg, + rgba(255, 248, 247, 0.56), + rgba(255, 215, 208, 0.56) + ); - .single_name{ - margin:15px 0 0 10px; + .single_name { + margin: 15px 0 0 10px; font-size: 15px; font-family: PingFang SC; font-weight: bold; color: #333333; line-height: 23px; - height:35px; + height: 35px; - >img{ + > img { width: 35px; height: 35px; border-radius: 50%; } - >span{ - margin-left:10px; + > span { + margin-left: 10px; line-height: 30px; } - - } - .single_rank{ - width:100%; + .single_rank { + width: 100%; - padding:10px 5px; + padding: 10px 5px; display: flex; justify-content: space-around; - .single_rank_bc{ - width:45%; + .single_rank_bc { + width: 45%; height: 65px; border-radius: 5px; - padding:10px; + padding: 10px; - .score{ + .score { text-align: center; - .span_title{ + .span_title { font-size: 13px; font-family: PingFang SC; font-weight: bold; - color: #FFFFFF; + color: #ffffff; line-height: 23px; } - .span_no{ + .span_no { font-size: 15px; font-family: PingFang SC; font-weight: bold; - color: #FFFFFF; + color: #ffffff; line-height: 23px; } } - .rank2_row2{ + .rank2_row2 { text-align: center; font-size: 12px; font-family: PingFang SC; font-weight: 500; - color: #FFFFFF; + color: #ffffff; line-height: 24px; } } - .bc_left{ - background: linear-gradient(-10deg, #2F93EE, #03C7EF); + .bc_left { + background: linear-gradient(-10deg, #2f93ee, #03c7ef); + } + + .bc_right { + background: linear-gradient(0deg, #f6a43b, #f56923); } + } + } +} + +.score_news { + position: relative; + margin: 0 auto; + margin-top: 5px; + padding-bottom: 18px; + background-color: #fff; - .bc_right{ - background: linear-gradient(0deg, #F6A43B, #F56923); + .cpt-title { + position: relative; + display: flex; + flex-direction: row; + justify-content: space-between; + // border-bottom: 1px solid #e7eeee; + line-height: 15px; + margin-left: 19px; + + .cpt-title-t { + position: relative; + margin: 5px 0 0; + padding: 7px 11px 0; + font-size: 15px; + line-height: 20px; + font-family: Source Han Serif SC; + font-weight: 800; + color: #000000; + + &::before { + content: ''; + position: absolute; + top: 7px; + left: 0; + width: 4px; + height: 20px; + background: rgba(230, 0, 0, 1); + border-radius: 1px; } } } - + .info { + padding: 11px; + margin: 3px 8px 0; + height: 85px; + + display: flex; + justify-content: center; + + .line { + width: 1px; + height: 88px; + background-color: #ffffff; + } + + .card { + width: 50%; + background: #fff2f1; + border-radius: 3px; + box-sizing: border-box; + padding: 0 19px; + text-align: center; + display: flex; + flex-direction: column; + + .title { + @include toe; + display: flex; + align-items: center; + margin-top: 5px; + overflow: hidden; + justify-content: center; + + .avatar { + flex-shrink: 0; + margin-right: 5px; + display: block; + width: 14px; + height: 14px; + border-radius: 100%; + line-height: 32px; + } + .avatar2 { + box-sizing: border-box; + padding: 6px; + background-color: #fff; + flex-shrink: 0; + margin-right: 5px; + display: block; + width: 29px; + height: 29px; + border-radius: 100%; + line-height: 32px; + } + .name { + @include toe; + font-size: 11px; + font-family: Source Han Serif SC; + font-weight: 800; + color: #000000; + } + } + + .ranks { + display: flex; + justify-content: space-around; + align-items: center; + margin-top: 9px; + + .rank { + display: flex; + flex-direction: column; + text-align: center; + justify-content: space-around; + + .rank-value { + @include toe; + margin-top: 5px; + font-size: 11px; + font-family: PingFang SC; + font-family: Source Han Serif SC; + font-weight: bold; + + span { + font-size: 11px; + } + } + + .value_color_1 { + color: #e72418; + } + .value_color_2 { + color: #27ae60; + } + + .rank-field { + font-size: 9px; + font-family: Source Han Serif SC; + font-weight: 400; + color: #000000; + } + } + } + } + } + + .rank_title { + margin: 10px 0; + // height: 100px; + line-height: 30px; + width: 100%; + display: flex; + padding: 5px 5px; + box-sizing: border-box; + font-size: 14px; + background: #f8f8f8; + border-radius: 5px; + + .tab { + flex: 1; + margin: 0 5px; + width: 105px; + border-radius: 5px; + line-height: 25px; + text-align: center; + color: #999; + font-weight: 500; + } + + .selTab { + color: #333333; + background-color: #fff; + box-shadow: 0px 2px 6px 0px rgba(63, 63, 63, 0.1); + font-weight: bold; + } + } } - +.score_list { + margin: 0 20px 0 20px; + .item { + padding: 8px 0 4px; + background-color: #ffffff; + width: 100%; + display: flex; + height: 30px; + align-items: center; + font-size: 11px; + border-bottom: 1px solid #f7f7f7; + + .logo { + width: 10%; + height: 30px; + line-height: 25px; + text-align: center; + + > img { + width: 18px; + height: 15px; + } + > span { + font-size: 11px; + font-family: Source Han Serif SC; + font-weight: 400; + color: #000000; + } + } + + .avatar { + height: 25px; + margin-left: 10px; + + text-align: center; + + > img { + top: -1px; + width: 22px; + height: 22px; + border-radius: 100%; + } + } + .name { + float: left; + width: 80%; + font-size: 12px; + margin-left: 11px; + z-index: 10; + font-family: Source Han Serif SC; + font-weight: 400; + color: #000000; + } + .score { + float: right; + width: 20%; + z-index: 20; + text-align: center; + font-size: 11px; + font-family: Source Han Serif SC; + font-weight: 400; + color: #000000; + line-height: 32px; + } + } +} diff --git a/epmet-oper-web/src/components/wx-index/score.vue b/epmet-oper-web/src/components/wx-index/score.vue index c201d56..491a505 100644 --- a/epmet-oper-web/src/components/wx-index/score.vue +++ b/epmet-oper-web/src/components/wx-index/score.vue @@ -5,9 +5,93 @@ @click="focusCpt"> -
-
+
+ +
+
+ +
{{item.configuration.title}}
+
积分排行
+ +
+ +
+
+
+ +
{{item.demoData.info1.title1}}
+
+
+
+ +
网格排名
+
{{item.demoData.info1.no1}}
+
+
+ +
总排名
+
{{item.demoData.info1.no2}}
+
+
+
+ +
+ +
+
+ +
{{item.demoData.info2.title1}}
+
+
+
+
社区排名
+
{{item.demoData.info2.no1}}
+ +
+
+
总排名
+
{{item.demoData.info2.no2}}
+ +
+
+
+
+ +
+ +
+ + +
+ +
+
{{ subitem.name }}
+
{{ subitem.score }}
+
+
+
+ + +
-
+
-->
diff --git a/epmet-oper-web/src/views/modules/customer/customize/CategoryList.vue b/epmet-oper-web/src/views/modules/customer/customize/CategoryList.vue index 5d4c587..6fa7cb1 100644 --- a/epmet-oper-web/src/views/modules/customer/customize/CategoryList.vue +++ b/epmet-oper-web/src/views/modules/customer/customize/CategoryList.vue @@ -6,9 +6,9 @@ {{customerName}} 取消返回 - {{"新增" }} + @click="addShow()">{{"新增" }} -->
@@ -49,10 +49,10 @@ 删除 - {{ "新增二级分类"}} + @click="showAddLevel2(scope.row)">{{ "新增二级分类"}} -->