数据云图样式修改

des
吕天方 6 months ago
parent db9b3e9281
commit eae427a1f2

@ -5,8 +5,8 @@ VUE_APP_TITLE = 金鸡湖现代服务业品牌管理系统
ENV = 'development'
# 金鸡湖现代服务业品牌管理系统/开发环境
# VUE_APP_BASE_API = 'http://192.168.0.114:9040'
VUE_APP_BASE_API = 'http://39.101.188.84:9040'
VUE_APP_BASE_API = 'http://192.168.0.106:9040'
# VUE_APP_BASE_API = 'http://39.101.188.84:9040'
# VUE_APP_BASE_API = 'https://idp.sipac.gov.cn/api'
# 路由懒加载

@ -1,6 +1,6 @@
{
"name": "ruoyi",
"version": "1.0.202407151033",
"version": "1.0.202407181334",
"description": "金鸡湖现代服务业品牌管理系统",
"author": "若依",
"license": "MIT",

@ -0,0 +1,19 @@
import request from "@/utils/request"
// 数据云图荣誉情况
export function honor(params) {
return request({
url: "/jjh/dataScreen/honor",
method: "get",
params
})
}
// 数据云图项目追踪情况
export function projectTracking(params) {
return request({
url: "/jjh/dataScreen/projectTracking",
method: "get",
params
})
}

@ -1,3 +1,11 @@
/*
* @Descripttion:
* @version:
* @Author: JC9527
* @Date: 2024-03-19 11:31:40
* @LastEditors: JC9527
* @LastEditTime: 2024-07-18 14:01:11
*/
import request from '@/utils/request'
// 查询菜单列表
@ -45,8 +53,8 @@ export function addMenu(data) {
// 修改菜单
export function updateMenu(data) {
return request({
url: '/system/menu',
method: 'post/edit',
url: '/system/menu/edit',
method: 'post',
data: data
})
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 642 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 604 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 553 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 827 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.3 KiB

@ -1,7 +1,7 @@
/* @font-face {
font-family: "PingFang-SC";
@font-face {
font-family: "PingFang-SC-Heavy";
src: url("./font/PingFang_Heavy.ttf");
} */
}
/* @font-face {
font-family: "PingFang-SC";
src: url("./font/PingFang_Regular.ttf");
@ -14,10 +14,10 @@
font-family: "PingFang-SC";
src: url("./font/PingFang_ExtraLight.ttf");
} */
/* @font-face {
font-family: "PingFang-SC";
@font-face {
font-family: "PingFang-SC-Medium";
src: url("./font/PingFang_Medium.ttf");
} */
}
@font-face {
font-family: "PingFang-SC";
src: url("./font/PingFang_Bold.ttf");
@ -33,4 +33,8 @@
@font-face {
font-family: "AlibabaPuHuiTiM";
src: url("./font/Alibaba-PuHuiTi-Medium.ttf");
}
@font-face {
font-family: "DINCondensed";
src: url("./font/DIN_CONDENSED_BOLD.TTF");
}

@ -1315,7 +1315,9 @@
//
.dataCloudMap {
height: 100%;
height: calc(100% - 55px);
padding: 10px;
box-sizing: border-box;
background-color: #f1f5f8;
.dataCloudMap-main {
height: 100%;
@ -1329,7 +1331,7 @@
.dataCloudMap-left-top {
height: 50%;
background-color: #fff;
border-radius: 5px;
border-radius: 10px;
padding: 10px 20px;
.echart-title {
display: flex;
@ -1343,7 +1345,7 @@
display: flex;
align-items: center;
.dataCloudMap-birght {
width: 10px;
width: 6px;
height: 18px;
background: #0086FF;
box-shadow: 3px 0 3px 0px #0086FF;
@ -1387,8 +1389,8 @@
border-radius: 5px;
.change-grey-birght {
width: 12px;
height: 12px;
width: 8px;
height: 8px;
background: #C7DAEE;
border-radius: 50%;
margin-right: 5px;
@ -1417,7 +1419,7 @@
.echarts-data-box {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
margin-top: 20px;
margin-top: 10px;
.E-box-item {
display: flex;
.img-box {
@ -1425,18 +1427,18 @@
height: 50px;
border-radius: 50%;
margin-right: 10px;
background-size: cover; /* 图片大小适应容器 */
background-size: contain; /* 图片大小适应容器 */
background-position: center; /* 图片居中 */
background-repeat: no-repeat; /* 不重复显示背景图 */
}
.img-box-one {
background-image: url("../images/warn-blue.png");
background-image: url("../images/mapIconOne.png");
}
.img-box-two {
background-image: url("../images/warn-blue.png");
background-image: url("../images/mapIconTwo.png");
}
.img-box-three {
background-image: url("../images/warn-blue.png");
background-image: url("../images/mapIconThree.png");
}
.data-box {
display: flex;
@ -1446,9 +1448,9 @@
display: flex;
align-items: flex-end;
.number-yuan {
font-family: PingFang-SC, PingFang-SC;
font-family: DINCondensed, DINCondensed;
font-weight: bold;
font-size: 26px;
font-size: 36px;
line-height: 30px;
margin-right: 5px;
color: #333333;
@ -1457,12 +1459,12 @@
font-family: PingFang-SC, PingFang-SC;
font-weight: bold;
font-size: 12px;
line-height: 22px;
line-height: 18px;
color: #666666;
}
}
.box-bottom {
font-family: PingFang-SC, PingFang-SC;
font-family: PingFang-SC-Medium;
font-weight: 500;
font-size: 12px;
color: #666666;
@ -1472,13 +1474,14 @@
}
#echarts {
width: 100%;
height: 100%;
height: calc(100% - 100px);
}
}
//
.dataCloudMap-left-bottom {
height: 49%;
background-color: #fff;
border-radius: 5px;
border-radius: 10px;
padding: 10px 20px;
.industry-title {
display: flex;
@ -1491,7 +1494,7 @@
display: flex;
align-items: center;
.dataCloudMap-birght {
width: 10px;
width: 6px;
height: 18px;
background: #0086FF;
box-shadow: 3px 0 3px 0px #0086FF;
@ -1511,7 +1514,7 @@
}
}
.rightBtn {
font-family: PingFang-SC, PingFang-SC;
font-family: PingFang-SC-Medium;
font-weight: 500;
font-size: 12px;
color: #0086FF;
@ -1522,7 +1525,7 @@
}
}
section {
margin-top: 20px;
margin-top: 10px;
// width: 100%;
// height: calc(100% - 20px);
// overflow-y: auto;
@ -1531,8 +1534,8 @@
height: 0;
}
.el-table {
margin-bottom: 25px;
th {
font-family: AlibabaPuHuiTiM;
font-weight: bold;
font-size: 14px;
color: #333333;
@ -1541,39 +1544,48 @@
color: #333333;
}
.Table-unit {
font-family: AlibabaPuHuiTiR;
font-size: 12px;
font-weight: 400;
color: #333333;
}
}
td {
font-weight: 500;
font-size: 14px;
font-family: PingFang-SC, PingFang-SC;
font-weight: bold;
font-size: 16px;
color: #666666;
border-bottom: none;
}
.evenNumber-row {
background-color: #F6F9FD;
}
.project-name {
text-decoration: underline;
font-weight: 500;
font-size: 14px;
color: #1890FF;
cursor: pointer;
.project-trace-table-number {
font-family: DINCondensed, DINCondensed;
font-weight: bold;
font-size: 20px;
span {
font-family: PingFang-SC-Heavy;
font-size: 14px;
font-weight: bold;
line-height: 18px;
color: #666666;
}
}
}
}
}
}
//
.dataCloudMap-main-right {
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
.dataCloudMap-right-top {
height: 40%;
height: 42%;
background-color: #fff;
border-radius: 5px;
border-radius: 10px;
padding: 10px 20px;
.right-top-title {
// display: grid;
@ -1585,7 +1597,7 @@
display: flex;
align-items: center;
.dataCloudMap-birght {
width: 10px;
width: 6px;
height: 18px;
background: #0086FF;
box-shadow: 3px 0 3px 0px #0086FF;
@ -1604,11 +1616,199 @@
color: #999999;
}
}
.dataCloudMap-enterprise {
margin: 10px 0;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-column-gap: 10px;
.el-card {
background-color: #fff;
border: none;
// height: 120px;
.el-card__header {
border-bottom: none;
padding: 10px 15px 3px;
.clearfix {
text-align: center;
font-family: PingFang-SC, PingFang-SC;
font-weight: bold;
font-size: 16px;
color: #333333;
}
}
.el-card__body {
padding: 7px 20px 10px 20px;
}
.card-items {
margin-bottom: 10px;
padding: 5px 10px;
background-color: #F6F9FD;
display: flex;
justify-content: space-between;
align-items: center;
.card-item-left {
display: flex;
align-items: center;
.card-img {
width: 15px;
height: 15px;
background-image: url("../images/mapIconFour.png");
margin-right: 5px;
background-size: contain; /* 图片大小适应容器 */
background-position: center; /* 图片居中 */
background-repeat: no-repeat; /* 不重复显示背景图 */
}
.card-type {
font-size: 12px;
font-family: PingFang-SC, PingFang-SC;
font-weight: 500;
color: #666666;
}
.card-img-two {
background-image: url("../images/mapIconFive.png");
}
.card-img-three {
background-image: url("../images/mapIconSix.png");
}
}
.card-item-right {
display: flex;
align-items: flex-end;
.card-number {
font-family: DINCondensed, DINCondensed;
font-weight: bold;
font-size: 26px;
color: #0086FF;
margin-right: 5px;
cursor: pointer;
font-style: normal;
text-decoration-line: underline;
text-transform: none;
}
.card-unit {
font-family: PingFang-SC, PingFang-SC;
font-weight: bold;
font-size: 12px;
color: #999999;
}
.number-two {
color: #FF9600;
text-decoration-line: none;
}
.number-three {
color: #32B16C;
text-decoration-line: none;
}
.unit-two {
line-height: 24px;
}
}
}
}
}
.dataCloudMap-statistics {
margin-top: 20px;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
background: radial-gradient( 0% 0% at 0% 0%, #E8F3FC 0%, #F6F9FD 0%), #E8F3FC;
padding: 10px 0;
width: 100%;
.statistics-title {
text-align: center;
border-right: 1px solid #C7DAEE;
font-family: AlibabaPuHuiTiM;
font-size: 18px;
color: #333333;
}
.statistics-items {
border-right: 1px solid #C7DAEE;
.statistics-item {
display: flex;
align-items: center;
justify-content: center;
.statistics-item-img {
width: 15px;
height: 15px;
background-image: url("../images/mapIconSeven.png");
margin-right: 5px;
background-size: contain; /* 图片大小适应容器 */
background-position: center; /* 图片居中 */
background-repeat: no-repeat; /* 不重复显示背景图 */
}
.item-img-two {
background-image: url("../images/mapIconEight.png");
}
.item-img-three {
background-image: url("../images/mapIconNine.png");
}
.statistics-item-type {
font-family: PingFang-SC, PingFang-SC;
font-weight: bold;
font-size: 15px;
margin-right: 10px;
color: #666666;
}
.statistics-item-right {
display: flex;
align-items: flex-end;
.statistics-item-number {
font-family: DINCondensed, DINCondensed;
font-weight: bold;
font-size: 26px;
color: #0086FF;
margin-right: 5px;
cursor: pointer;
font-style: normal;
text-decoration-line: underline;
text-transform: none;
}
.statistics-item-unit {
font-family: PingFang-SC, PingFang-SC;
font-weight: bold;
font-size: 12px;
line-height: 20px;
color: #999999;
.popover-Tooltip {
font-family: PingFang-SC-Medium;
font-weight: 500;
font-size: 5px;
color: #333333;
}
}
.number-two {
color: #FF9600;
text-decoration-line: none;
}
.number-three {
color: #32B16C;
text-decoration-line: none;
}
.unit-two {
line-height: 24px;
position: relative;
img {
position: absolute;
top: -5px;
right: -9px;
width: 9px;
height: 9px;
cursor: pointer;
}
}
}
}
}
.statistics-items-none {
border-right: none;
}
}
}
//
.dataCloudMap-right-middle {
height: 29%;
height: 27%;
background-color: #fff;
border-radius: 5px;
border-radius: 10px;
padding: 10px 20px;
.honor-title {
display: flex;
@ -1624,7 +1824,7 @@
display: flex;
align-items: center;
.dataCloudMap-birght {
width: 10px;
width: 6px;
height: 18px;
background: #0086FF;
box-shadow: 3px 0 3px 0px #0086FF;
@ -1644,7 +1844,7 @@
}
}
.rightBtn {
font-family: PingFang-SC, PingFang-SC;
font-family: PingFang-SC-Medium;
font-weight: 500;
font-size: 12px;
color: #0086FF;
@ -1654,11 +1854,48 @@
text-transform: none;
}
}
.honor-data {
margin-top: 13px;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 10px;
.honor-item {
display: flex;
padding: 20px;
justify-content: space-between;
background-color: #F6F9FD;
.honor-item-left {
font-family: PingFang-SC, PingFang-SC;
font-weight: bold;
font-size: 16px;
color: #666666;
}
.honor-item-right {
display: flex;
align-items: flex-end;
.honor-item-number {
font-family: DINCondensed, DINCondensed;
font-weight: bold;
font-size: 26px;
color: #0086FF;
margin-right: 5px;
}
.honor-item-home {
font-family: PingFang-SC, PingFang-SC;
font-weight: bold;
font-size: 12px;
line-height: 24px;
color: #999999;
}
}
}
}
}
//
.dataCloudMap-right-bottom {
height: 29%;
background-color: #fff;
border-radius: 5px;
border-radius: 10px;
padding: 10px 20px;
.project-trace-title {
display: flex;
@ -1673,7 +1910,7 @@
display: flex;
align-items: center;
.dataCloudMap-birght {
width: 10px;
width: 6px;
height: 18px;
background: #0086FF;
box-shadow: 3px 0 3px 0px #0086FF;
@ -1693,7 +1930,7 @@
}
}
.rightBtn {
font-family: PingFang-SC, PingFang-SC;
font-family: PingFang-SC-Medium;
font-weight: 500;
font-size: 12px;
color: #0086FF;
@ -1704,35 +1941,290 @@
}
}
section {
margin-top: 20px;
margin-top: 15px;
.el-table::before {
height: 0;
}
.el-table {
margin-bottom: 25px;
th {
font-family: AlibabaPuHuiTiM;
font-weight: bold;
font-size: 14px;
color: #333333;
}
td {
font-weight: 500;
font-size: 14px;
font-family: PingFang-SC, PingFang-SC;
font-weight: bold;
font-size: 16px;
color: #666666;
border-bottom: none;
}
.evenNumber-row {
background-color: #F6F9FD;
}
.project-name {
text-decoration: underline;
font-weight: 500;
font-size: 14px;
color: #1890FF;
cursor: pointer;
.project-trace-table-number {
font-family: DINCondensed, DINCondensed;
font-weight: bold;
font-size: 20px;
color: #FF844D;
}
}
}
}
}
}
}
//
.honor-dialog {
.el-dialog__header {
border-bottom: 1px solid #F0F0F0;
}
section {
.el-table--border {
border: 1px solid #dfe6ec;
}
.el-table {
// tr:hover>td {
// background-color: initial !important;
// }
.project-trace-table-number {
font-family: PingFang-SC, PingFang-SC;
font-weight: 500;
font-size: 14px;
color: #134EE6;
font-style: normal;
text-decoration-line: underline;
text-transform: none;
cursor: pointer;
}
.evenNumber-row {
background-color: #F6F9FD;
}
.evenNumber-row-border {
border-bottom: none;
}
}
}
}
//
.headquarterEnterprise-dialog {
.el-dialog__body {
padding: 20px;
}
.el-dialog__header {
border-bottom: 1px solid #F0F0F0;
}
.headquarterEnterprise-box {
.radio_btn {
margin: 10px 0;
}
.headquarterEnterprise-form {
.el-button--primary.is-active,
.el-button--primary:active {
background: oklab(0.7 -0.3 -0.4);
border-color: #1890FF;
color: #FFFEFE;
}
.el-button--primary {
background: #1890FF;
border-color: #1890FF;
color: #FFFEFE;
}
.el-button--primary:focus,
.el-button--primary:hover {
background: oklab(0.7 -0.3 -0.4);
border-color: #1890FF;
color: #FFFEFE;
}
.el-button--default:hover,
.el-button--primary:hover {
background-color: oklab(0.65 -0.06 -0.18);
border-color: #1890FF;
color: #FFFEFE;
}
.el-button--default {
border-color: #1890FF;
color: #000000;
}
}
section {
.el-table {
.project-trace-table-number {
font-family: PingFang-SC, PingFang-SC;
font-weight: 500;
font-size: 14px;
color: #134EE6;
font-style: normal;
text-decoration-line: underline;
text-transform: none;
cursor: pointer;
}
th {
font-weight: bold;
font-size: 14px;
color: #000;
}
td {
font-weight: 500;
font-size: 14px;
color: #666666;
border-bottom: none;
}
.evenNumber-row {
background-color: #F6F9FD;
}
}
.my-pagination-container {
margin-top: 10px;
.el-pagination.is-background .el-pager li:not(.is-disabled).active {
background-color: #1890FF; /*进行修改选中项背景和字体 */
color: #fff;
}
.el-pagination {
.btn-prev,.btn-next {
padding: 0px 20px;
}
}
}
}
}
}
//
.serviceIndustry-dialog {
.el-dialog__body {
padding: 20px;
}
.el-dialog__header {
border-bottom: 1px solid #F0F0F0;
}
.serviceIndustry-box {
.radio_btn {
margin: 10px 0;
}
.serviceIndustry-form {
.el-button--primary.is-active,
.el-button--primary:active {
background: oklab(0.7 -0.3 -0.4);
border-color: #1890FF;
color: #FFFEFE;
}
.el-button--primary {
background: #1890FF;
border-color: #1890FF;
color: #FFFEFE;
}
.el-button--primary:focus,
.el-button--primary:hover {
background: oklab(0.7 -0.3 -0.4);
border-color: #1890FF;
color: #FFFEFE;
}
.el-button--default:hover,
.el-button--primary:hover {
background-color: oklab(0.65 -0.06 -0.18);
border-color: #1890FF;
color: #FFFEFE;
}
.el-button--default {
border-color: #1890FF;
color: #000000;
}
}
section {
.el-table {
.project-trace-table-number {
font-family: PingFang-SC, PingFang-SC;
font-weight: 500;
font-size: 14px;
color: #134EE6;
font-style: normal;
text-decoration-line: underline;
text-transform: none;
cursor: pointer;
}
th {
font-weight: bold;
font-size: 14px;
color: #000;
text-align: center;
}
td {
font-weight: 500;
font-size: 14px;
color: #666666;
border-bottom: none;
}
.evenNumber-row-childred {
background-color: #E8F3FC;
}
.evenNumber-row {
background-color: #F6F9FD;
}
}
.my-pagination-container {
margin-top: 10px;
.el-pagination.is-background .el-pager li:not(.is-disabled).active {
background-color: #1890FF; /*进行修改选中项背景和字体 */
color: #fff;
}
.el-pagination {
.btn-prev,.btn-next {
padding: 0px 20px;
}
}
}
}
}
}
//
.collectDialog-dialog {
.el-dialog__body {
padding: 20px;
}
.el-dialog__header {
border-bottom: 1px solid #F0F0F0;
}
.collectDialog-box {
.radio_btn {
margin: 10px 0;
}
section {
.el-table {
.project-trace-table-number {
font-family: PingFang-SC, PingFang-SC;
font-weight: 500;
font-size: 14px;
color: #134EE6;
font-style: normal;
text-decoration-line: underline;
text-transform: none;
cursor: pointer;
}
th {
font-weight: bold;
font-size: 14px;
color: #000;
text-align: center;
}
td {
font-weight: 500;
font-size: 14px;
color: #666666;
border-bottom: none;
}
.evenNumber-row-childred {
background-color: #E8F3FC;
}
.evenNumber-row {
background-color: #F6F9FD;
}
}
}
}
}

@ -19,7 +19,7 @@ export default {
$route: {
handler(route) {
// console.log(route,"route");
if(route.path == "/workbench") {
if(route.path == "/workbench" || route.path == "/dataCloudMap") {
this.breadcrumb = false;
} else {
this.breadcrumb = true;

@ -60,7 +60,7 @@ export default {
$route: {
handler(route) {
// console.log(route,"route");
if(route.path == "/workbench") {
if(route.path == "/workbench" || route.path == "/dataCloudMap") {
this.breadcrumbShow = false;
} else {
this.breadcrumbShow = true;

@ -0,0 +1,143 @@
<template>
<el-dialog
title="服务业分行业汇总"
:visible.sync="infoVisible"
:close-on-click-modal="false"
:close-on-press-escape="false"
@close="infoClose"
custom-class="collectDialog-dialog"
append-to-body
width="60%"
>
<div class="collectDialog-box">
<section>
<el-table
v-loading="loading"
row-key="id"
class="dataMap-two-table"
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
:data="tableData"
:row-class-name="tableRowClassName"
:header-cell-style="{background:'#D1D9E6'}"
height="550px"
> <!-- :max-height="tabHeader" -->
<el-table-column label="行业" prop="industry" width="300"/>
<el-table-column label="全年营收" prop="revenue" align="center"/>
<el-table-column label="增加值(亿元)" prop="valueAdded" align="center" />
<el-table-column label="增加值增速(按不变价)" prop="speedUp" align="center" />
<el-table-column label="增加值占GDP比重" prop="proportion" align="center" />
</el-table>
</section>
</div>
</el-dialog>
</template>
<script>
export default {
name: "honorDialog",
data() {
return {
infoVisible: false,
loading: false,
tableData:[
{
id: 1,
industry:"批发和零售业",
revenue:"506.63",
valueAdded:"201",
speedUp:"0.89%",
proportion:"11%",
children:[
{
id: 11,
industry:"批发业",
revenue:"506.63",
valueAdded:"201",
speedUp:"0.89%",
proportion:"11%",
},{
id: 12,
industry:"零售业",
revenue:"506.63",
valueAdded:"201",
speedUp:"0.89%",
proportion:"11%",
},
]
},{
id: 2,
industry:"交通运输、仓储和邮政业",
revenue:"506.63",
valueAdded:"201",
speedUp:"0.89%",
proportion:"11%",
children:[
{
id: 21,
industry:"铁路运输业",
revenue:"506.63",
valueAdded:"201",
speedUp:"0.89%",
proportion:"11%",
},{
id: 22,
industry:"道路运输业",
revenue:"506.63",
valueAdded:"201",
speedUp:"0.89%",
proportion:"11%",
},{
id: 23,
industry:"水上运输业",
revenue:"506.63",
valueAdded:"201",
speedUp:"0.89%",
proportion:"11%",
}
]
},{
id: 3,
industry:"住宿和餐饮业",
revenue:"506.63",
valueAdded:"201",
speedUp:"0.89%",
proportion:"11%",
children:[],
},{
id: 4,
industry:"信息传输、软件和信息技术服务业",
revenue:"506.63",
valueAdded:"201",
speedUp:"0.89%",
proportion:"11%",
children:[],
},
],
}
},
methods:{
open(){
this.infoVisible = true;
},
infoClose(){
this.infoVisible = false;
},
// table
tableRowClassName({row, rowIndex}){
if(row.children) {
console.log(rowIndex);
}
if (!row.children) {
return 'evenNumber-row-childred';
} else if(row.children && rowIndex % 2 !== 0){
return 'evenNumber-row';
}
return '';
},
},
}
</script>
<style lang="scss" scoped>
::v-deep .collectDialog-dialog {
margin-top: 14vh !important;
}
</style>

@ -0,0 +1,176 @@
<template>
<el-dialog
title="总部企业"
:visible.sync="infoVisible"
:close-on-click-modal="false"
:close-on-press-escape="false"
@close="infoClose"
custom-class="headquarterEnterprise-dialog"
append-to-body
width="75%"
>
<div class="headquarterEnterprise-box">
<el-form :inline="true" :model="formInline" size="small" class="headquarterEnterprise-form" ref="queryFrom">
<el-col :span="21">
<el-form-item label="企业名称:">
<el-input v-model.trim="formInline.enterpriseName" placeholder="请输入内容"></el-input>
</el-form-item>
<el-form-item label="统一社会信用代码:"> <!-- 申报单位 -->
<el-input v-model.trim="formInline.creditCode" placeholder="请输入统一社会信用代码"></el-input>
</el-form-item>
<el-form-item label="总部类型:">
<el-select class="ignoreElement" v-model="formInline.status" placeholder="请选择总部类型">
<!-- <el-option
v-for="dict in dict.type.bms_approval_status"
:key="dict.value"
:label="dict.label"
:value="dict.value">
</el-option> -->
</el-select>
</el-form-item>
</el-col>
<el-col :span="3">
<el-form-item>
<el-button size="mini" @click="resetQuery('queryFrom')"></el-button>
<el-button size="mini" type="primary" @click="handleQuery('queryFrom')"></el-button>
</el-form-item>
</el-col>
</el-form>
<!-- <el-row class="radio_btn"> -->
<el-col class="radio_btn">
<el-radio-group v-model="formInline.statusChange" @change="toggleOptionsEnter" fill="#134EE6">
<el-radio-button label="0">全部(343)</el-radio-button>
<el-radio-button label="1">省级总部(67)</el-radio-button>
<el-radio-button label="2">市级总部(149)</el-radio-button>
<el-radio-button label="3">区级总部(127)</el-radio-button>
</el-radio-group>
</el-col>
<!-- </el-row> -->
<section>
<el-table
v-loading="loading"
class="dataMap-two-table"
:data="tableData"
:row-class-name="tableRowClassName"
:header-cell-style="{background:'#D1D9E6'}"
height="500px"
> <!-- :max-height="tabHeader" -->
<el-table-column label="序号" type="index" align="center" width="50"/>
<el-table-column label="企业名称" prop="enterpriseName" align="center"/>
<el-table-column label="统一信用代码" prop="creditCode" align="center" />
<el-table-column label="总部类型" prop="type" align="center" width="100">
<template slot-scope="scope">
<div>{{ scope.row.type }}</div>
</template>
</el-table-column>
<el-table-column label="税收(亿元)" prop="taxRevenue" align="center" width="100"/>
<el-table-column label="产值(亿元)" prop="productionValue" align="center" width="100"/>
<el-table-column label="营收(亿元)" prop="revenue" align="center" width="100" />
<el-table-column label="销售额(亿元)" prop="sale" align="center" width="100" />
<el-table-column label="操作" align="center" width="100">
<template slot-scope="scope">
<div class="project-trace-table-number" @click="enterpriseInfo(scope.row)"></div>
</template>
</el-table-column>
</el-table>
<my-pagination
:total="total"
:page="pagination.current"
:limit="pagination.size"
@pagination="getPagination"
:current-page.sync="pagination.current"
></my-pagination>
</section>
</div>
</el-dialog>
</template>
<script>
import myPagination from "@/views/components/Pagination/index.vue"
export default {
components:{myPagination},
name: "honorDialog",
data() {
return {
infoVisible: false,
loading: false,
tableData:[
{
enterpriseName:"XX信息技术服务有限公司",
creditCode:"91310311118959380R",
type:"制造业总部",
taxRevenue:"506.63",
productionValue:"201",
revenue:"188",
sale:"199",
},{
enterpriseName:"XX信息技术服务有限公司",
creditCode:"91310311118959380R",
type:"制造业总部",
taxRevenue:"506.63",
productionValue:"201",
revenue:"188",
sale:"199",
},{
enterpriseName:"XX信息技术服务有限公司",
creditCode:"91310311118959380R",
type:"制造业总部",
taxRevenue:"506.63",
productionValue:"201",
revenue:"188",
sale:"199",
},
],
formInline:{
enterpriseName:"",
creditCode:"",
statusChange:"0"
},
pagination: {
current:1,
size:10,
},
total:40,
}
},
methods:{
open(){
this.infoVisible = true;
},
infoClose(){
this.infoVisible = false;
},
//
getPagination(pages) {
this.pagination.current = pages.page;
this.pagination.size = pages.limit;
},
//
resetQuery(){},
//
handleQuery(){},
//
enterpriseInfo(row){
// this.$router.push({
// name: 'enterpriselibraryInfo',
// query: { userId: row.id, creditCode: row.tyshxydm }
// })
},
// tab
toggleOptionsEnter(val){
// this.handleQuery();
},
// table
tableRowClassName({row, rowIndex}){
if (rowIndex % 2 !== 0) {
return 'evenNumber-row';
}
return '';
},
},
}
</script>
<style lang="scss" scoped>
::v-deep .headquarterEnterprise-dialog {
margin-top: 10vh !important;
}
</style>

@ -0,0 +1,167 @@
<template>
<el-dialog
title="荣誉情况"
:visible.sync="infoVisible"
:close-on-click-modal="false"
:close-on-press-escape="false"
@close="infoClose"
custom-class="honor-dialog"
append-to-body
width="60%"
>
<div>
<section>
<el-table
v-loading="loading"
border
class="dataMap-two-table"
:data="tableData"
:cell-class-name="tableRowClassName"
:cell-style="tableCellStyle"
:header-cell-style="{background:'#D1D9E6'}"
:span-method="objectSpanMethod"
height="550px"
> <!-- :max-height="tabHeader" -->
<el-table-column label="项目大类" prop="projectBigName" align="center"/>
<el-table-column label="数量" prop="count1" align="center" width="100">
<template slot-scope="scope">
<div class="project-trace-table-number" @click="bigNumber(scope.row)">{{ scope.row.count1 }}</div>
</template>
</el-table-column>
<el-table-column label="项目中类" prop="projectMiddleName" align="center"/>
<el-table-column label="数量" prop="count2" align="center" width="100">
<template slot-scope="scope">
<div class="project-trace-table-number" @click="middleNumber(scope.row)">{{ scope.row.count2 }}</div>
</template>
</el-table-column>
<el-table-column label="项目小类" prop="projectSmallName" align="center"/>
<el-table-column label="数量" prop="count3" align="center" width="100">
<template slot-scope="scope">
<div class="project-trace-table-number" @click="smallNumber(scope.row)">{{ scope.row.count3 }}</div>
</template>
</el-table-column>
<el-table-column label="2024年新增" prop="currentYearAdd" align="center" width="100">
<template slot-scope="scope">
<div class="project-trace-table-number" @click="YrarNumber(scope.row)">{{ scope.row.currentYearAdd }}</div>
</template>
</el-table-column>
</el-table>
</section>
</div>
</el-dialog>
</template>
<script>
export default {
name: "honorDialog",
data() {
return {
infoVisible: false,
loading: false,
tableData:[],
}
},
methods:{
open(data){
this.infoVisible = true;
this.tableData = data
const effectMerge = {
projectBigName: ['projectMiddleName'], //
//
projectSmallName: [], //
projectBigName: [] //
};
this.setTabelRowSpan(this.tableData, ['projectBigName', 'count1', 'projectMiddleName', 'count2', 'projectSmallName', 'count3', 'currentYearAdd'], effectMerge);
},
infoClose(){
this.infoVisible = false;
},
//
bigNumber(row){
},
//
middleNumber(row){
},
//
smallNumber(row){
},
// 2024
YrarNumber(row){
this.$router.push({
name: 'Project',
params: { projectYear: 2024, projectBigType: row.projectBigType, projectMiddleType: row.projectMiddleType, projectSmallType: row.projectSmallType }
})
},
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
if (row.mergeCell.includes(column.property)) {
const rowspan = row[`rowspan_${column.property}`];
if (rowspan) {
return { rowspan: rowspan, colspan: 1 };
} else {
return { rowspan: 0, colspan: 0 };
}
}
},
setTabelRowSpan(tableData, fieldArr, effectMerge = {}, isFieldAll = false) {
let lastItem = {};
fieldArr.forEach((field, index) => {
let judgeArr = fieldArr.slice(0, index + 1);
if (isFieldAll) {
judgeArr = [...fieldArr];
} else if (effectMerge[field]) {
judgeArr = [...effectMerge[field], field];
}
tableData.forEach(item => {
item.mergeCell = fieldArr;
const rowSpan = `rowspan_${field}`;
//
if (judgeArr.every(e => lastItem[e] === item[e] && item[e] !== '')) {
//
//
item[rowSpan] = 0;
lastItem[rowSpan] += 1;
} else {
// lastItem
item[rowSpan] = 1;
lastItem = item;
}
});
});
},
// table
tableRowClassName({row, column, rowIndex, columnIndex}){
if(columnIndex == 4 || columnIndex == 5 || columnIndex == 6 ) {
if(rowIndex == 0 || rowIndex == 1 || rowIndex == 5 || rowIndex == 10 || rowIndex == 11 || rowIndex == 14 || rowIndex == 15 || rowIndex == 16 || rowIndex == 18 || rowIndex == 19 || rowIndex == 21 ) {
return 'evenNumber-row-border';
}
}
if(columnIndex == 0 || columnIndex == 1 ) {
if(rowIndex == 3 || rowIndex == 5 || rowIndex == 8 || rowIndex == 10) {
return 'evenNumber-row';
}
}
if(columnIndex == 2 || columnIndex == 3 ) {
if(rowIndex == 3 || rowIndex == 5 || rowIndex == 8 || rowIndex == 10 || rowIndex == 14 || rowIndex == 21) {
return 'evenNumber-row';
}
}
return '';
},
// table
tableCellStyle({row, column, rowIndex, columnIndex}){
if(columnIndex == 4 || columnIndex == 5 || columnIndex == 6 ) {
if (rowIndex == 3 || rowIndex == 5 || rowIndex == 6 || rowIndex == 8 || rowIndex == 10 || rowIndex == 11 || rowIndex == 12 || rowIndex == 14 || rowIndex == 15 || rowIndex == 16 || rowIndex == 17 || rowIndex == 21 || rowIndex == 22) {
return " background-color: #F6F9FD;"
}
}
},
},
}
</script>
<style lang="scss" scoped>
::v-deep .honor-dialog {
margin-top: 12vh !important;
}
</style>

@ -0,0 +1,136 @@
<template>
<el-dialog
:title="title"
:visible.sync="infoVisible"
:close-on-click-modal="false"
:close-on-press-escape="false"
@close="infoClose"
custom-class="serviceIndustry-dialog"
append-to-body
>
<div class="serviceIndustry-box">
<el-form :inline="true" :model="formInline" size="small" class="serviceIndustry-form" ref="queryFrom">
<el-col :span="20">
<el-form-item label="企业名称:">
<el-input v-model.trim="formInline.enterpriseName" placeholder="请输入内容"></el-input>
</el-form-item>
<el-form-item label="统一社会信用代码:"> <!-- 申报单位 -->
<el-input v-model.trim="formInline.creditCode" placeholder="请输入统一社会信用代码"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item>
<el-button size="mini" @click="resetQuery('queryFrom')"></el-button>
<el-button size="mini" type="primary" @click="handleQuery('queryFrom')"></el-button>
</el-form-item>
</el-col>
</el-form>
<section>
<el-table
v-loading="loading"
class="dataMap-two-table"
:data="tableData"
:row-class-name="tableRowClassName"
:header-cell-style="{background:'#D1D9E6'}"
height="550px"
> <!-- :max-height="tabHeader" -->
<el-table-column label="序号" type="index" align="center" width="50"/>
<el-table-column label="企业名称" prop="enterpriseName" align="center"/>
<el-table-column label="统一信用代码" prop="creditCode" align="center" />
<el-table-column label="全年营收(亿元)" prop="revenue" align="center" width="150" />
<el-table-column label="操作" align="center" width="150">
<template slot-scope="scope">
<div class="project-trace-table-number" @click="enterpriseInfo(scope.row)"></div>
</template>
</el-table-column>
</el-table>
<my-pagination
:total="total"
:page="pagination.current"
:limit="pagination.size"
@pagination="getPagination"
:current-page.sync="pagination.current"
></my-pagination>
</section>
</div>
</el-dialog>
</template>
<script>
import myPagination from "@/views/components/Pagination/index.vue"
export default {
components:{myPagination},
name: "honorDialog",
data() {
return {
infoVisible: false,
loading: false,
tableData:[
{
enterpriseName:"XX信息技术服务有限公司",
creditCode:"91310311118959380R",
revenue:"188",
},{
enterpriseName:"XX信息技术服务有限公司",
creditCode:"91310311118959380R",
revenue:"188",
},{
enterpriseName:"XX信息技术服务有限公司",
creditCode:"91310311118959380R",
revenue:"188",
},
],
formInline:{
enterpriseName:"",
creditCode:"",
},
pagination: {
current:1,
size:10,
},
total:40,
}
},
props:{
title:{
typeof:String,
default:"企业列表",
}
},
methods:{
open(){
this.infoVisible = true;
},
infoClose(){
this.infoVisible = false;
},
//
getPagination(pages) {
this.pagination.current = pages.page;
this.pagination.size = pages.limit;
},
//
resetQuery(){},
//
handleQuery(){},
//
enterpriseInfo(row){
// this.$router.push({
// name: 'enterpriselibraryInfo',
// query: { userId: row.id, creditCode: row.tyshxydm }
// })
},
// table
tableRowClassName({row, rowIndex}){
if (rowIndex % 2 !== 0) {
return 'evenNumber-row';
}
return '';
},
},
}
</script>
<style lang="scss" scoped>
::v-deep .serviceIndustry-dialog {
margin-top: 10vh !important;
}
</style>

@ -1,7 +1,8 @@
<template>
<div class="dataCloudMap" v-if="true">
<div class="dataCloudMap">
<el-row class="dataCloudMap-main">
<el-col :span="11" class="dataCloudMap-main-left">
<!-- 服务业发展总览 -->
<div class="dataCloudMap-left-top">
<div class="echart-title">
<div class="echart-left-title">
@ -60,6 +61,8 @@
</div>
<div id="echarts"></div>
</div>
<!-- 行业纵深情况 -->
<div class="dataCloudMap-left-bottom">
<div class="industry-title">
<div class="bottom-left-title">
@ -69,30 +72,45 @@
</div>
<span class="dataCloudMap-data">统计数据截至2024-01</span>
</div>
<div class="rightBtn">查看更多数据>></div>
<div class="rightBtn" @click="industryBtn">>></div>
</div>
<section>
<el-table v-loading="loadingOne" class="dataMap-two-table" :data="tableOneData" :row-class-name="tableRowClassName" :header-cell-style="{background:'#E8F3FC'}"> <!-- :max-height="tabHeader" -->
<el-table-column label="行业大类" prop="bigType" width="320"/>
<el-table-column label="全年营收" prop="revenue" width="130" align="center"/>
<el-table v-loading="loadingOne" class="dataMap-two-table" :data="tableOneData" :row-class-name="tableRowClassName" :height="330" :header-cell-style="{background:'#E8F3FC'}"> <!-- :max-height="tabHeader" -->
<el-table-column label="行业大类" prop="bigType" width="320" align="center"/>
<el-table-column label="全年营收" prop="revenue" width="130" align="center">
<template slot-scope="scope">
<div class="project-trace-table-number">{{ scope.row.revenue }}</div>
</template>
</el-table-column>
<el-table-column label="增加值(亿元)" prop="yuan" width="100" align="center">
<template slot="header" slot-scope="scope">
<div class="Table-header">增加值</div>
<span class="Table-unit">(亿元)</span>
</template>
<template slot-scope="scope">
<div class="project-trace-table-number">{{ scope.row.yuan }}</div>
</template>
</el-table-column>
<el-table-column label="增加值增速(按不变价)" prop="speedUp" width="180" align="center">
<template slot="header" slot-scope="scope">
<div class="Table-header">增加值增速</div>
<span class="Table-unit">(按不变价)</span>
</template>
<template slot-scope="scope">
<div class="project-trace-table-number">{{ scope.row.speedUp }} <span>%</span></div>
</template>
</el-table-column>
<el-table-column label="增加值占GDP比重" prop="proportion" align="center">
<template slot-scope="scope">
<div class="project-trace-table-number">{{ scope.row.proportion }} <span>%</span></div>
</template>
</el-table-column>
<el-table-column label="增加值占GDP比重" prop="proportion" align="right"/>
</el-table>
</section>
</div>
</el-col>
<el-col :span="13" class="dataCloudMap-main-right">
<!-- 企业情况 -->
<div class="dataCloudMap-right-top">
<div class="right-top-title">
<div class="L-title-left">
@ -101,7 +119,217 @@
</div>
<span class="dataCloudMap-data">统计数据截至2024-01</span>
</div>
<div class="dataCloudMap-enterprise">
<!-- 第一个卡片 -->
<el-card shadow="always">
<div slot="header" class="clearfix">
<span>生产性服务业</span>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img"></div>
<div class="card-type">规上企业数量:</div>
</div>
<div class="card-item-right">
<div class="card-number" @click="enterInfo('生产性服务业企业')">768</div>
<div class="card-unit"></div>
</div>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img card-img-two"></div>
<div class="card-type">规上企业营收:</div>
</div>
<div class="card-item-right">
<div class="card-number number-two">1913</div>
<div class="card-unit unit-two">亿</div>
</div>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img card-img-three"></div>
<div class="card-type">全口径增加值:</div>
</div>
<div class="card-item-right">
<div class="card-number number-three">132</div>
<div class="card-unit unit-two">亿</div>
</div>
</div>
</el-card>
<!-- 第二个卡片 -->
<el-card shadow="always">
<div slot="header" class="clearfix">
<span>生活性服务业</span>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img"></div>
<div class="card-type">规上企业数量:</div>
</div>
<div class="card-item-right">
<div class="card-number" @click="enterInfo('生活性服务业企业')">768</div>
<div class="card-unit"></div>
</div>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img card-img-two"></div>
<div class="card-type">规上企业营收:</div>
</div>
<div class="card-item-right">
<div class="card-number number-two">1913</div>
<div class="card-unit unit-two">亿</div>
</div>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img card-img-three"></div>
<div class="card-type">全口径增加值:</div>
</div>
<div class="card-item-right">
<div class="card-number number-three">132</div>
<div class="card-unit unit-two">亿</div>
</div>
</div>
</el-card>
<!-- 第三个卡片 -->
<el-card shadow="always">
<div slot="header" class="clearfix">
<span>新兴服务业</span>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img"></div>
<div class="card-type">规上企业数量:</div>
</div>
<div class="card-item-right">
<div class="card-number" @click="enterInfo('新兴服务业企业')">768</div>
<div class="card-unit"></div>
</div>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img card-img-two"></div>
<div class="card-type">规上企业营收:</div>
</div>
<div class="card-item-right">
<div class="card-number number-two">1913</div>
<div class="card-unit unit-two">亿</div>
</div>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img card-img-three"></div>
<div class="card-type">全口径增加值:</div>
</div>
<div class="card-item-right">
<div class="card-number number-three">132</div>
<div class="card-unit unit-two">亿</div>
</div>
</div>
</el-card>
<!-- 第四个卡片 -->
<el-card shadow="always">
<div slot="header" class="clearfix">
<span>限上批零住餐</span>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img"></div>
<div class="card-type">规上企业数量:</div>
</div>
<div class="card-item-right">
<div class="card-number" @click="enterInfo('限上批零住餐企业')">768</div>
<div class="card-unit"></div>
</div>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img card-img-two"></div>
<div class="card-type">规上企业营收:</div>
</div>
<div class="card-item-right">
<div class="card-number number-two">1913</div>
<div class="card-unit unit-two">亿</div>
</div>
</div>
<div class="card-items">
<div class="card-item-left">
<div class="card-img card-img-three"></div>
<div class="card-type">全口径增加值:</div>
</div>
<div class="card-item-right">
<div class="card-number number-three">132</div>
<div class="card-unit unit-two">亿</div>
</div>
</div>
</el-card>
</div>
<div class="dataCloudMap-statistics">
<div class="statistics-title">
总部企业
</div>
<div class="statistics-items">
<div class="statistics-item">
<div class="statistics-item-img"></div>
<div class="statistics-item-type">企业数量:</div>
<div class="statistics-item-right">
<div class="statistics-item-number" @click="headqEnterpriseBtn">365</div>
<div class="statistics-item-unit">
<span></span>
</div>
</div>
</div>
</div>
<div class="statistics-items">
<div class="statistics-item">
<div class="statistics-item-img item-img-two"></div>
<div class="statistics-item-type">税收贡献:</div>
<div class="statistics-item-right">
<div class="statistics-item-number number-two">1913</div>
<div class="statistics-item-unit unit-two">
<span>亿</span>
<el-popover
placement="top"
width="207"
trigger="click"
>
<div class="popover-Tooltip">增值税+企业所得税-免抵调库</div>
<img slot="reference" src="@/assets/images/Mapi.png" alt="">
</el-popover>
</div>
</div>
</div>
</div>
<div class="statistics-items statistics-items-none">
<div class="statistics-item">
<div class="statistics-item-img item-img-three"></div>
<div class="statistics-item-type">经营数据:</div>
<div class="statistics-item-right">
<div class="statistics-item-number number-three">132</div>
<div class="statistics-item-unit unit-two">
<span>亿</span>
<el-popover
placement="top"
width="170"
trigger="click"
>
<div class="popover-Tooltip">
<div>制造业总部提供产值</div>
<div>服务业总部提供营收</div>
<div>建筑业总部提供产值</div>
<div>贸易类总部提供销售额</div>
</div>
<img slot="reference" src="@/assets/images/Mapi.png" alt="">
</el-popover>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 荣誉情况 -->
<div class="dataCloudMap-right-middle">
<div class="honor-title">
<div class="right-middle-title">
@ -111,9 +339,55 @@
</div>
<span class="dataCloudMap-data">统计数据截至2024-01</span>
</div>
<div class="rightBtn">查看更多数据>></div>
<div class="rightBtn" @click="honorBtn">>></div>
</div>
<div class="honor-data">
<div class="honor-item">
<span class="honor-item-left">领军企业</span>
<div class="honor-item-right">
<span class="honor-item-number">{{ honorData.count1 }}</span>
<span class="honor-item-home"></span>
</div>
</div>
<div class="honor-item">
<span class="honor-item-left">两业融合试点</span>
<div class="honor-item-right">
<span class="honor-item-number">{{ honorData.count2 }}</span>
<span class="honor-item-home"></span>
</div>
</div>
<div class="honor-item">
<span class="honor-item-left">工业设计</span>
<div class="honor-item-right">
<span class="honor-item-number">{{ honorData.count3 }}</span>
<span class="honor-item-home"></span>
</div>
</div>
<div class="honor-item">
<span class="honor-item-left">服务型制造示范</span>
<div class="honor-item-right">
<span class="honor-item-number">{{ honorData.count4 }}</span>
<span class="honor-item-home"></span>
</div>
</div>
<div class="honor-item">
<span class="honor-item-left">现代服务业集聚区</span>
<div class="honor-item-right">
<span class="honor-item-number">{{ honorData.count5 }}</span>
<span class="honor-item-home"></span>
</div>
</div>
<div class="honor-item">
<span class="honor-item-left">楼宇经济</span>
<div class="honor-item-right">
<span class="honor-item-number">{{ honorData.count6 }}</span>
<span class="honor-item-home"></span>
</div>
</div>
</div>
</div>
<!-- 项目追踪情况 -->
<div class="dataCloudMap-right-bottom">
<div class="project-trace-title">
<div class="right-bottom-title">
@ -123,23 +397,42 @@
</div>
<span class="dataCloudMap-data">统计数据截至2024-01</span>
</div>
<div class="rightBtn">查看更多数据>></div>
<div class="rightBtn" @click="projectBtn">>></div>
</div>
<section>
<el-table v-loading="loadingTwo" class="dataMap-two-table" :data="tableTwoData" :row-class-name="tableRowClassName" :header-cell-style="{background:'#E8F3FC'}"> <!-- :max-height="tabHeader" -->
<el-table-column label="申报任务名称" prop="name" width="320"/>
<el-table-column label="填报时间" prop="time" width="200" align="center"/>
<el-table-column label="已填报企业数" prop="number" align="right"/>
<el-table v-loading="loadingTwo" class="dataMap-two-table" :data="tableTwoData" :row-class-name="tableRowClassName" :height="170" :header-cell-style="{background:'#E8F3FC'}"> <!-- :max-height="tabHeader" -->
<el-table-column label="申报任务名称" prop="enterpriseDirectory" width="500" align="center"/>
<el-table-column label="填报时间" prop="time" align="center">
<template slot-scope="scope">
<div v-if="scope.row.startTime && scope.row.endTime">{{ scope.row.startTime }}~{{ scope.row.endTime }}</div>
<div v-else></div>
</template>
</el-table-column>
<el-table-column label="已填报企业数" prop="count" align="center">
<template slot-scope="scope">
<div class="project-trace-table-number">{{ scope.row.count }}</div>
</template>
</el-table-column>
</el-table>
</section>
</div>
</el-col>
</el-row>
<honorDialogVue ref="honorDialog" />
<headqEnterprise ref="headqEnterprise" />
<serviceIndustry :title="titleDialog" ref="serviceIndustry" />
<collectDialog ref="collectDialog" />
</div>
</template>
<script>
import * as echarts from "echarts";
import honorDialogVue from './components/honorDialog.vue';
import headqEnterprise from './components/headquarterEnterprise.vue'
import serviceIndustry from './components/serviceIndustry.vue'
import collectDialog from './components/collectDialog.vue'
import { honor, projectTracking } from "@/api/jin_ji_hu/dataCloudMap"
export default {
components:{honorDialogVue,headqEnterprise,serviceIndustry,collectDialog},
data() {
return {
activeIndex:0,
@ -161,41 +454,94 @@ export default {
bigType:"科学研究和技术服务业",
revenue:"506.63",
yuan:"201",
speedUp:"0.89%",
proportion:"11%",
speedUp:"0.89",
proportion:"11",
},
{
bigType:"科学研究和技术服务业",
revenue:"506.63",
yuan:"201",
speedUp:"0.89%",
proportion:"11%",
speedUp:"0.89",
proportion:"11",
},{
bigType:"科学研究和技术服务业",
revenue:"506.63",
yuan:"201",
speedUp:"0.89",
proportion:"11",
},
],
loadingTwo: false,
tableTwoData: [
{
name:"2024年第二批金融服务项目落户奖补申报任务",
time:"2024-05-10 ~ 2024-05-12",
number:"201"
},{
name:"2024年第二批金融服务项目落户奖补申报任务",
time:"2024-05-10 ~ 2024-05-12",
number:"198"
bigType:"科学研究和技术服务业",
revenue:"506.63",
yuan:"201",
speedUp:"0.89",
proportion:"11",
},{
name:"2024年第二批金融服务项目落户奖补申报任务",
time:"2024-05-10 ~ 2024-05-12",
number:"131"
bigType:"科学研究和技术服务业",
revenue:"506.63",
yuan:"201",
speedUp:"0.89",
proportion:"11",
},
]
{
bigType:"科学研究和技术服务业",
revenue:"506.63",
yuan:"201",
speedUp:"0.89",
proportion:"11",
}
],
loadingTwo: false,
tableTwoData: [],
honorData: {
count1:0,
count2:0,
count3:0,
count4:0,
count5:0,
count6:0,
},
honorTableData:[],
titleDialog:"",
}
},
mounted(){
this.$nextTick(()=>{
this.initEchart();
})
this.getHonorList();
this.getProjectList();
},
methods:{
//
getHonorList(){
honor().then(res=>{
this.honorTableData = res.data;
res.data.map(item=>{
if(item.projectBigName == "省市服务业领军企业") {
this.honorData.count1 = item.count1
} else if(item.projectBigName == "两业融合试点单位") {
this.honorData.count2 = item.count1
} else if(item.projectBigName == "工业设计中心") {
this.honorData.count3 = item.count1
} else if(item.projectBigName == "服务型制造示范") {
this.honorData.count4 = item.count1
} else if(item.projectBigName == "省级现代服务业集聚区") {
this.honorData.count5 = item.count1
} else if(item.projectBigName == "楼宇经济") {
this.honorData.count6 = item.count1
}
})
})
},
//
getProjectList(){
this.loadingTwo = true;
projectTracking().then(res=>{
this.loadingTwo = false;
this.tableTwoData = res.data;
})
},
initEchart(){
var chartDom = document.getElementById("echarts");
var myChart = echarts.init(chartDom);
@ -214,7 +560,7 @@ export default {
top: "8%",
left: "3%",
right: "3%",
bottom: "35%", //leftright
bottom: "8%", //leftright
},
// tooltip: {
// trigger: "axis",
@ -287,10 +633,14 @@ export default {
color: "#FFBB00",
borderColor: "#fff",
borderWidth: 2,
shadowColor: 'rgba(255, 187, 0, 0.7)',
shadowBlur: 10
},
lineStyle: {
type: "solid",
color: "#FFBB00",
shadowColor: 'rgba(255, 187, 0, 0.5)',
shadowBlur: 4
},
// 线
// areaStyle: {
@ -323,6 +673,28 @@ export default {
};
myChart.setOption(option)
},
//
honorBtn(){
this.$refs.honorDialog.open(this.honorTableData);
},
//
headqEnterpriseBtn(){
this.$refs.headqEnterprise.open();
},
//
enterInfo(title) {
this.titleDialog = title;
this.$refs.serviceIndustry.open()
},
//
industryBtn(){
this.$refs.collectDialog.open();
},
projectBtn(){
this.$router.push({
name: 'EnterpriseDirectory',
})
},
active(e) {
this.activeIndex = e;
},

@ -190,6 +190,13 @@ export default {
components:{myPagination, myDialog},
dicts: ['alert_type', "project_small_type"],
data() {
let validateTime = (rule, value, callback) => {
if (new Date(value) < new Date()) {
callback(new Error('选择结束时间需大于当前时间'))
} else {
callback()
}
}
return {
total:0,
pagination: {
@ -224,6 +231,7 @@ export default {
],
alertTime:[
{ required: true, message: '请选择日期', trigger: 'change' },
{validator: validateTime, trigger: 'blur'},
],
alertContent:[
{ required: true, message: '请填写提醒内容', trigger: 'blur' },

@ -347,6 +347,21 @@ export default {
this.formInline.projectClassify = this.$route.params.projectId + '';
this.pagination = { ...this.pagination,...this.formInline };
}
if(this.$route.params.projectYear && this.$route.params.projectBigType && this.$route.params.projectMiddleType && this.$route.params.projectSmallType) {
let arr = [];
arr.push(this.$route.params.projectBigType + '')
arr.push(this.$route.params.projectMiddleType + '')
arr.push(this.$route.params.projectSmallType + '')
this.echoCascader(arr)
this.formInline.projectYear = this.$route.params.projectYear + '';
this.formInline.projectBigType = arr[0]
this.formInline.projectMiddleType = arr[1]
this.formInline.projectSmallType = arr[2]
this.pagination = { ...this.pagination,...this.formInline };
this.formInline.projectClassify = arr
} else {
this.getDataList();
}
// if(this.$route.params.projectName) {
// this.formInline.projectName = this.$route.params.projectName;
// this.pagination = { ...this.pagination,...this.formInline };
@ -360,13 +375,52 @@ export default {
}
this.cancalDebounce();
window.addEventListener('resize', this.cancalDebounce);
this.getDataList();
this.getList();
},
destroyed() {
window.removeEventListener('resize', this.cancalDebounce);
},
methods:{
/** 回显Cascader 级联选择器数据 */
echoCascader(arr){
getAllList({dictType:"project_categories"}).then(res=>{
let obj = {};
let objTwo = {};
let objThree = {};
res.data.map(item => {
if(arr[0] == item.dictValue) {
obj.value = item.dictValue;
obj.label = item.dictLabel;
obj.dict = item.remark;
obj.children = [];
getAllList({dictType: item.remark}).then(resTwo=>{
resTwo.data.map((itemTwo)=>{
if(arr[1] == itemTwo.dictValue) {
objTwo.value = itemTwo.dictValue;
objTwo.label = itemTwo.dictLabel;
objTwo.dict = itemTwo.remark;
objTwo.children = [];
obj.children.push(objTwo)
getAllList({dictType: itemTwo.remark}).then(resThree => {
resThree.data.map((itemThree)=>{
if(arr[2] == itemThree.dictValue) {
objThree.value = itemThree.dictValue;
objThree.label = itemThree.dictLabel;
objThree.dict = itemThree.remark;
objThree.leaf = 'leaf';
objTwo.children.push(objThree)
this.options.push(obj);
}
})
})
}
})
})
}
})
})
},
handleItemChange(value){
this.importFromChange = {
projectBigType: value[0],

Loading…
Cancel
Save