diff --git a/jwtech-admin-page/src/assets/css/largeScreen_index.scss b/jwtech-admin-page/src/assets/css/largeScreen_index.scss index 6da4ebab..5597cef6 100644 --- a/jwtech-admin-page/src/assets/css/largeScreen_index.scss +++ b/jwtech-admin-page/src/assets/css/largeScreen_index.scss @@ -156,7 +156,7 @@ margin-top: 9px; } .text-wrapper_4 { - background-color: rgba(102, 255, 255, 0.1); + // background-color: rgba(102, 255, 255, 0.1); height: 40px; margin-left: 96px; width: 100px; @@ -175,7 +175,7 @@ } } .text-wrapper_5 { - background-color: rgba(0, 0, 0, 0.3); + // background-color: rgba(0, 0, 0, 0.3); height: 40px; width: 100px; .text_10 { @@ -381,7 +381,7 @@ text-align: left; white-space: nowrap; line-height: 30px; - margin: 6px 0 0 31px; + margin: 2px 0 0 31px; } } .block_1 { @@ -430,7 +430,7 @@ text-align: left; white-space: nowrap; line-height: 30px; - margin: 0px 0 0 41px; + margin: 2px 0 0 28px; } } } diff --git a/jwtech-admin-page/src/assets/largeScreen/SketchPng4fdba202f3827116f4ed2008efa2e40bb0a2712581b49d05069ee7c61b8a92ea.png b/jwtech-admin-page/src/assets/largeScreen/SketchPng4fdba202f3827116f4ed2008efa2e40bb0a2712581b49d05069ee7c61b8a92ea.png new file mode 100644 index 00000000..219ad394 Binary files /dev/null and b/jwtech-admin-page/src/assets/largeScreen/SketchPng4fdba202f3827116f4ed2008efa2e40bb0a2712581b49d05069ee7c61b8a92ea.png differ diff --git a/jwtech-admin-page/src/assets/largeScreen/SketchPngdca9ac124b282e29155b16c823d2354338bbd88ad086975980fab072867ef946.png b/jwtech-admin-page/src/assets/largeScreen/SketchPngdca9ac124b282e29155b16c823d2354338bbd88ad086975980fab072867ef946.png new file mode 100644 index 00000000..f730e284 Binary files /dev/null and b/jwtech-admin-page/src/assets/largeScreen/SketchPngdca9ac124b282e29155b16c823d2354338bbd88ad086975980fab072867ef946.png differ diff --git a/jwtech-admin-page/src/views/largeScreen/index2.vue b/jwtech-admin-page/src/views/largeScreen/index2.vue index bc9fb7a5..6c5be143 100644 --- a/jwtech-admin-page/src/views/largeScreen/index2.vue +++ b/jwtech-admin-page/src/views/largeScreen/index2.vue @@ -20,10 +20,20 @@
项目类型 -
+
重大项目
-
+
面上项目
@@ -91,7 +101,12 @@
- 风险管控 + 风险管控
序号 @@ -105,10 +120,36 @@ v-for="(item, index) in warnInfo" :key="item.warnType + index" > - {{index + 1}} - {{zdWarningType(item.warnType)}} - {{item.alert_type == "0" ? item.number : 0}} - {{item.alert_type == "1" ? item.number : 0}} + {{ index + 1 }} + {{ + zdWarningType(item.warnType) + }} +
+ {{ item.alert_type == "0" ? item.number : 0 }} + + {{ item.alert_type == "1" ? item.number : 0 }} +
信用等级 -
+ +
失信惩戒 @@ -433,6 +479,7 @@ export default { lat: null, }, viewCenter: [113.36502, 22.9787], + tirggerChartIndex: 1, }; }, created() { @@ -485,7 +532,7 @@ export default { }); this.total = Number(this.acc["acc"]) + Number(this.acc["noAcc"]); console.log(this.projectType); - this.eleInit(); + this.eleInit(this.projectType); }); }, mounted() { @@ -493,17 +540,27 @@ export default { information().then((res) => { this.rightInfoData = res.data; this.FunnelChartInit(); + this.CreditRatingChartInit(); }); this.initMap(); }, methods: { + tirggerChart(i) { + console.log(i); + this.tirggerChartIndex = i; + this.eleInit(this.projectType); + }, goIndex() { this.status = true; this.$router.push("/"); }, - eleInit() { + eleInit(data) { let chartDom = this.$refs.Ele; let myChart = echarts.init(chartDom); + let chartData = data.map((item) => ({ + ...item, + name: this.truncateName(item.name), + })); let option = { tooltip: { trigger: "item", @@ -531,8 +588,9 @@ export default { series: [ { type: "pie", - radius: ["35%", "50%"], - center: ["40%", "50%"], + radius: ["40%", "60%"], + // center: ["30%", "50%"], + selectedMode: "single", avoidLabelOverlap: true, padAngle: 5, itemStyle: { @@ -567,10 +625,7 @@ export default { labelLinePoints: points, }; }, - data: this.projectType.map((item) => ({ - ...item, - name: this.truncateName(item.name), - })), + data: chartData, }, ], }; @@ -788,6 +843,57 @@ export default { myChart.resize(); }); }, + CreditRatingChartInit() { + let Chartkeys = ["总承包等级", "总承包一级", "总承包二级", "总承包三级"]; + let chartDom = this.$refs.CreditRating; + let myChart = echarts.init(chartDom); + let chartData = Object.keys(this.rightInfoData.qualificationLevel).map( + (item, index) => { + return { value: item, name: Chartkeys[index] }; + } + ); + + let option = { + tooltip: { + trigger: "item", + }, + + legend: { + orient: "vertical", + left: "right", + top: "center", + + textStyle: { + color: "#fff", + }, + }, + color: ["#2E8B57", "#66CDAA", "#20B2AA", "#3CB371", "#228B22"], // 设置绿色系颜色 + series: [ + { + type: "pie", + radius: [20, 85], + center: ["33%", "50%"], + roseType: "radius", + itemStyle: { + borderRadius: 5, + }, + label: { + show: false, + }, + // emphasis: { + // label: { + // show: true, + // }, + // }, + data: chartData, + }, + ], + }; + option && myChart.setOption(option); + window.addEventListener("resize", function () { + myChart.resize(); + }); + }, truncateName(name) { if (name.length > 4) { return name.substring(0, 4) + ".."; @@ -1265,55 +1371,89 @@ export default { } } -.box_20{ - background: url(../../assets/largeScreen/SketchPngb17bd5d6a32ab917904999b43c489793e886f8365186e092148a1a42c6ad90de.png) 100% no-repeat !important; +.proType { + background-color: rgba(0, 0, 0, 0.3); +} + +.active { + background-color: rgba(102, 255, 255, 0.1); +} + +.box_20 { + background: url(../../assets/largeScreen/SketchPngb17bd5d6a32ab917904999b43c489793e886f8365186e092148a1a42c6ad90de.png) + 100% no-repeat !important; } -.text-wrapper_14{ - background: url(../../assets/largeScreen/SketchPng5a689be5f426491ccb01c63758d41a89e6a0ad54632ecbfe4ebe3a9155dcb76e.png) 100% no-repeat !important; +.text-wrapper_14 { + background: url(../../assets/largeScreen/SketchPng5a689be5f426491ccb01c63758d41a89e6a0ad54632ecbfe4ebe3a9155dcb76e.png) + 100% no-repeat !important; } -.text-wrapper_15{ - background: url(../../assets/largeScreen/SketchPng5a689be5f426491ccb01c63758d41a89e6a0ad54632ecbfe4ebe3a9155dcb76e.png) 100% no-repeat !important; +.text-wrapper_15 { + background: url(../../assets/largeScreen/SketchPngdca9ac124b282e29155b16c823d2354338bbd88ad086975980fab072867ef946.png) + 100% no-repeat !important; } -.text-wrapper_1, .text-wrapper_8, .text-wrapper_33, .text-wrapper_21{ - background: url(../../assets/largeScreen/SketchPng63f10181aa031c65c96106d94b41dac68fa3ee5763ccd6bdd5e38d60c8aa8cb1.png) 100% no-repeat !important; +.text-wrapper_1, +.text-wrapper_8, +.text-wrapper_33, +.text-wrapper_21 { + background: url(../../assets/largeScreen/SketchPng63f10181aa031c65c96106d94b41dac68fa3ee5763ccd6bdd5e38d60c8aa8cb1.png) + 100% no-repeat !important; } -.text-wrapper_16{ - background: url(../../assets/largeScreen/SketchPng2cf1efa063f97c7cc95190f4d3843302469022bd1ba407a8e536e8aa0f9e035e.png) 100% no-repeat !important; +.text-wrapper_16 { + background: url(../../assets/largeScreen/SketchPng2cf1efa063f97c7cc95190f4d3843302469022bd1ba407a8e536e8aa0f9e035e.png) + 100% no-repeat !important; } -.box_2{ - background: url(../../assets/largeScreen/SketchPng6fb85028c70767889cb37f024909ec13773b5df572a3c72a5b19698deac19d60.png) 100% no-repeat !important; +.box_2 { + background: url(../../assets/largeScreen/SketchPng6fb85028c70767889cb37f024909ec13773b5df572a3c72a5b19698deac19d60.png) + 100% no-repeat !important; } -.box_3{ - background: url(../../assets/largeScreen/SketchPng9499597bcdad8bae409896200f271efdf82cb282934f4b92717b23824a12b5cb.png) 100% no-repeat !important; +.box_3 { + background: url(../../assets/largeScreen/SketchPng9499597bcdad8bae409896200f271efdf82cb282934f4b92717b23824a12b5cb.png) + 100% no-repeat !important; } -.box_8,.group_9{ - background: url(../../assets/largeScreen/SketchPngeb3ec3b942cfa65d727ba6b7389b60701d10695e653f214cb26821dd67b3a33d.png) 100% no-repeat !important; +.box_8, +.group_9 { + background: url(../../assets/largeScreen/SketchPngeb3ec3b942cfa65d727ba6b7389b60701d10695e653f214cb26821dd67b3a33d.png) + 100% no-repeat !important; } -.group_9{ - background: url(../../assets/largeScreen/SketchPng2cd95b8579505ed8b793f6131ff776da696bed7d4d7c0f628c5db883172bee69.png) 100% no-repeat !important; +.group_9 { + background: url(../../assets/largeScreen/SketchPng2cd95b8579505ed8b793f6131ff776da696bed7d4d7c0f628c5db883172bee69.png) + 100% no-repeat !important; } -.group_7{ - background: url(../../assets/largeScreen/SketchPng708711275332cf0b46e8725a99d33e095c86e83f74946cd75309a1be65241dd8.png) 100% no-repeat !important; +.group_7 { + background: url(../../assets/largeScreen/SketchPng708711275332cf0b46e8725a99d33e095c86e83f74946cd75309a1be65241dd8.png) + 100% no-repeat !important; } -.text-wrapper_22{ - background: url(../../assets/largeScreen/SketchPng38466183dea96a643cb70188413b906983403e73a896d36f32b675a8165a6662.png) 100% no-repeat !important; +.text-wrapper_22 { + background: url(../../assets/largeScreen/SketchPng38466183dea96a643cb70188413b906983403e73a896d36f32b675a8165a6662.png) + 100% no-repeat !important; } -.block_2{ - background: url(../../assets/largeScreen/SketchPngdc7ababbdd850fec35eb2b9b76427ac6389120ff3084708d17f40cb9f2a3e07f.png) 100% no-repeat !important; +.block_2 { + background: url(../../assets/largeScreen/SketchPngdc7ababbdd850fec35eb2b9b76427ac6389120ff3084708d17f40cb9f2a3e07f.png) + 100% no-repeat !important; } -.text-wrapper_27{ - background: url(../../assets/largeScreen/SketchPngb4af6214107e80fcd547ebaf24237190a3906cb67002c0a95533d7abc6587e22.png) 100% no-repeat !important; +.text-wrapper_27 { + background: url(../../assets/largeScreen/SketchPngb4af6214107e80fcd547ebaf24237190a3906cb67002c0a95533d7abc6587e22.png) + 100% no-repeat !important; } -.text-wrapper_28,.text-wrapper_29,.text-wrapper_30,.text-wrapper_31{ - background: url(../../assets/largeScreen/SketchPng58eddce8ccfe77d443bb77bb9a0a77da701718636f7953874f987d8c610ce815.png) 100% no-repeat !important; +.text-wrapper_28, +.text-wrapper_29, +.text-wrapper_30, +.text-wrapper_31 { + background: url(../../assets/largeScreen/SketchPng58eddce8ccfe77d443bb77bb9a0a77da701718636f7953874f987d8c610ce815.png) + 100% no-repeat !important; } -.group_16{ - background: url(../../assets/largeScreen/SketchPng708711275332cf0b46e8725a99d33e095c86e83f74946cd75309a1be65241dd8.png) 100% no-repeat !important; +.group_16 { + background: url(../../assets/largeScreen/SketchPng708711275332cf0b46e8725a99d33e095c86e83f74946cd75309a1be65241dd8.png) + 100% no-repeat !important; } +.block_1 { + background: url(../../assets/largeScreen/SketchPng4fdba202f3827116f4ed2008efa2e40bb0a2712581b49d05069ee7c61b8a92ea.png) + 100% no-repeat !important; +}