提交

public/js/system.config.js

@@ -7,7 +7,7 @@ const SystemConfig = {
   // 默认分页每页显示数量
   DEFAULT_PAGE_SIZE: 30,
   // 默认主题颜色
-  DEFAULT_PRIMARY: '#0d867f',
+  DEFAULT_PRIMARY_COLOR: '#0d867f',
   // onlyoffice 文档url
   DOCUMENT_SERVER_URL: 'http://192.168.0.102/',
   DOCUMENT_SERVER_URL2: 'http://192.168.0.120:18050/',

src/api/bigScreen.js

+import { post } from '@/utils/http'
+import {
+  EADC_ARRCHITECTURE,
+  EADC_SHARED_ABILITY
+} from '@/config/micromodule'
+
+const base = '/creen'
+// 统推项目和自建项目占比
+export function getProjPercent(params) {
+  return post(EADC_ARRCHITECTURE + `${base}/getProjPercent`, params)
+}
+// 截止于所选年度的总部统推项目数、在建项目数、项目金额、在建项目金额【卡片】
+export function getHQEndYearProjInfo(params) {
+  return post(EADC_ARRCHITECTURE + `${base}/getHQEndYearProjInfo`, params)
+}
+// 横轴省公司，各省截止于所选年度的自建项目数、在建项目数【柱图】
+export function getProEndYearProjInfoNum(params) {
+  return post(EADC_ARRCHITECTURE + `${base}/getProEndYearProjInfoNum`, params)
+}
+// 横轴省公司，各省截止于所选年度的自建项目金额、在建项目金额【折线图】
+export function getProEndYearProjInfoAmount(params) {
+  return post(EADC_ARRCHITECTURE + `${base}/getProEndYearProjInfoAmount`, params)
+}
+// 总部统推项目，以选择年度为节点，近5年数量【折线图】
+export function getLastYearHqProjNum(params) {
+  return post(EADC_ARRCHITECTURE + `${base}/getLastYearHqProjNum`, params)
+}
+// 各省自建项目，以选择年度为节点，近5年数量；省份多选，以颜色区分【折线图】
+export function getLastYearByProProjNum(params) {
+  return post(EADC_ARRCHITECTURE + `${base}/getLastYearByProProjNum`, params)
+}
+
+// 查询省份
+export function getProinceList(params) {
+  return post (EADC_SHARED_ABILITY + '/org/getOrgList', params)
+}
+// 根据架构、元素对资产数据进行分类展示 
+export function getAssetTypeDataByYearCount(params) {
+  return post(EADC_ARRCHITECTURE + `${base}/getAssetTypeDataByYearCount`, params)
+}
\ No newline at end of file

src/components/Charts/BaseChart.vue

+<template>
+  <div :id="id" :ref="id" :style="{ height, width}" class="wh100" />
+</template>
+
+<script>
+import resize from './mixins/resize'
+
+export default {
+  mixins: [resize],
+  props: {
+    id: {
+      type: String,
+      default: 'basechart'
+    },
+    width: {
+      type: String,
+      default: '100%'
+    },
+    height: {
+      type: String,
+      default: '100%'
+    },
+    maxHeight: {
+      type: String
+      // default: '100%'
+    },
+    option: {
+      type: Object,
+      required: true
+    }
+  },
+  data() {
+    return {
+      chart: null
+    }
+  },
+  watch: {
+    option: {
+      handler(val) {
+        this.chart.setOption(val, true)
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    this.renderChart()
+  },
+  beforeDestroy() {
+    if (!this.chart) {
+      return
+    }
+    this.chart.dispose()
+    this.chart = null
+  },
+  methods: {
+    renderChart() {
+      this.chart = this.$echarts.init(this.$refs[this.id])
+      this.chart.setOption(this.option)
+
+      this.chart.on('click', params => {
+        this.$emit('click', params)
+      })
+
+      this.chart.on('legendselectchanged', params => {
+        this.$emit('legendselectchanged', params)
+      })
+    }
+  }
+}
+</script>
+<style>
+.wh100 {
+  width: 100%;
+  height: 100%;
+}
+</style>

src/components/Charts/mixins/resize.js

+import { debounce } from '@/utils'
+
+export default {
+  data () {
+    return {
+      $_sidebarElm: null
+    }
+  },
+  mounted () {
+    this.__resizeHandler = debounce(() => {
+      if (this.chart) {
+        this.chart.resize()
+      }
+    }, 100)
+    window.addEventListener('resize', this.__resizeHandler)
+
+    this.$_sidebarElm = document.getElementsByClassName('sidebar-container')[0]
+    this.$_sidebarElm && this.$_sidebarElm.addEventListener('transitionend', this.$_sidebarResizeHandler)
+  },
+  beforeDestroy () {
+    window.removeEventListener('resize', this.__resizeHandler)
+
+    this.$_sidebarElm && this.$_sidebarElm.removeEventListener('transitionend', this.$_sidebarResizeHandler)
+  },
+  methods: {
+    // use $_ for mixins properties
+    // https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential
+    $_sidebarResizeHandler (e) {
+      if (e.propertyName === 'width') {
+        this.__resizeHandler()
+      }
+    }
+  },
+  activated() {
+    // 这里处理，为了防止在其他页面改变窗口大小，然后再返回到有图表的页面，图表会变成100px问题
+    if (this.chart) {
+      this.chart.resize()
+    }
+  }
+}

src/components/VueCountTo/index.js

+import CountTo from './vue-countTo.vue'
+
+export default CountTo
+if (typeof window !== 'undefined' && window.Vue) {
+  window.Vue.component('count-to', CountTo)
+}

src/components/VueCountTo/index.vue

+<template>
+  <span>
+    {{ displayValue }}
+  </span>
+</template>
+<script>
+import { requestAnimationFrame, cancelAnimationFrame } from './requestAnimationFrame.js'
+
+export default {
+  props: {
+    startVal: {
+      type: Number,
+      required: false,
+      default: 0
+    },
+    endVal: {
+      type: Number,
+      required: false,
+      default: 0
+    },
+    duration: {
+      type: Number,
+      required: false,
+      default: 3000
+    },
+    autoplay: {
+      type: Boolean,
+      required: false,
+      default: true
+    },
+    decimals: {
+      type: Number,
+      required: false,
+      default: 0,
+      validator(value) {
+        return value >= 0
+      }
+    },
+    decimal: {
+      type: String,
+      required: false,
+      default: '.'
+    },
+    separator: {
+      type: String,
+      required: false,
+      default: ','
+    },
+    prefix: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    suffix: {
+      type: String,
+      required: false,
+      default: ''
+    },
+    useEasing: {
+      type: Boolean,
+      required: false,
+      default: true
+    }
+  },
+  data() {
+    return {
+      localStartVal: this.startVal,
+      displayValue: 0,
+      printVal: null,
+      paused: false,
+      localDuration: this.duration,
+      startTime: null,
+      timestamp: null,
+      remaining: null,
+      rAF: null
+    }
+  },
+  computed: {
+    countDown() {
+      return this.startVal > this.endVal
+    }
+  },
+  watch: {
+    startVal() {
+      if (this.autoplay) {
+        this.start()
+      }
+    },
+    endVal() {
+      if (this.autoplay) {
+        this.start()
+      }
+    }
+  },
+  created() {
+    this.displayValue = this.formatNumber(this.startVal)
+  },
+  mounted() {
+    if (this.autoplay) {
+      this.start()
+    }
+    /* eslint-disable */
+    this.$emit('mountedCallback')
+  },
+  methods: {
+    easingFn(t, b, c, d) {
+      return c * (-Math.pow(2, -10 * t / d) + 1) * 1024 / 1023 + b
+    },
+    start() {
+      this.localStartVal = this.startVal
+      this.startTime = null
+      this.localDuration = this.duration
+      this.paused = false
+      this.rAF = requestAnimationFrame(this.count)
+    },
+    pauseResume() {
+      if (this.paused) {
+        this.resume()
+        this.paused = false
+      } else {
+        this.pause()
+        this.paused = true
+      }
+    },
+    pause() {
+      cancelAnimationFrame(this.rAF)
+    },
+    resume() {
+      this.startTime = null
+      this.localDuration = +this.remaining
+      this.localStartVal = +this.printVal
+      requestAnimationFrame(this.count)
+    },
+    reset() {
+      this.startTime = null
+      cancelAnimationFrame(this.rAF)
+      this.displayValue = this.formatNumber(this.startVal)
+    },
+    count(timestamp) {
+      if (!this.startTime) this.startTime = timestamp
+      this.timestamp = timestamp
+      const progress = timestamp - this.startTime
+      this.remaining = this.localDuration - progress
+
+      if (this.useEasing) {
+        if (this.countDown) {
+          this.printVal = this.localStartVal - this.easingFn(progress, 0, this.localStartVal - this.endVal, this.localDuration)
+        } else {
+          this.printVal = this.easingFn(progress, this.localStartVal, this.endVal - this.localStartVal, this.localDuration)
+        }
+      } else {
+        if (this.countDown) {
+          this.printVal = this.localStartVal - ((this.localStartVal - this.endVal) * (progress / this.localDuration))
+        } else {
+          // 当前值  = 起始值+ 总值 x（已消耗时间/ 总时间）
+          this.printVal = this.localStartVal + (this.endVal - this.localStartVal) * (progress / this.localDuration)
+        }
+      }
+      if (this.countDown) {
+        this.printVal = this.printVal < this.endVal ? this.endVal : this.printVal
+      } else {
+        this.printVal = this.printVal > this.endVal ? this.endVal : this.printVal
+      }
+
+      this.displayValue = this.formatNumber(this.printVal)
+      if (progress < this.localDuration) {
+        this.rAF = requestAnimationFrame(this.count)
+      } else {
+        this.$emit('callback')
+      }
+    },
+    isNumber(val) {
+      return !isNaN(parseFloat(val))
+    },
+    formatNumber(num) {
+      num = num.toFixed(this.decimals)
+      num += ''
+      const x = num.split('.')
+      let x1 = x[0]
+      const x2 = x.length > 1 ? this.decimal + x[1] : ''
+      const rgx = /(\d+)(\d{3})/
+      if (this.separator && !this.isNumber(this.separator)) {
+        while (rgx.test(x1)) {
+          x1 = x1.replace(rgx, '$1' + this.separator + '$2')
+        }
+      }
+      return this.prefix + x1 + x2 + this.suffix
+    }
+  },
+  destroyed() {
+    cancelAnimationFrame(this.rAF)
+  }
+}
+</script>

src/components/VueCountTo/requestAnimationFrame.js

+let lastTime = 0
+const prefixes = 'webkit moz ms o'.split(' ') // 各浏览器前缀
+
+let requestAnimationFrame
+let cancelAnimationFrame
+
+const isServer = typeof window === 'undefined'
+if (isServer) {
+  requestAnimationFrame = function () {
+  }
+  cancelAnimationFrame = function () {
+  }
+} else {
+  requestAnimationFrame = window.requestAnimationFrame
+  cancelAnimationFrame = window.cancelAnimationFrame
+  let prefix
+  // 通过遍历各浏览器前缀，来得到requestAnimationFrame和cancelAnimationFrame在当前浏览器的实现形式
+  for (let i = 0; i < prefixes.length; i++) {
+    if (requestAnimationFrame && cancelAnimationFrame) {
+      break
+    }
+    prefix = prefixes[i]
+    requestAnimationFrame = requestAnimationFrame || window[prefix + 'RequestAnimationFrame']
+    cancelAnimationFrame = cancelAnimationFrame || window[prefix + 'CancelAnimationFrame'] || window[prefix + 'CancelRequestAnimationFrame']
+  }
+
+  // 如果当前浏览器不支持requestAnimationFrame和cancelAnimationFrame，则会退到setTimeout
+  if (!requestAnimationFrame || !cancelAnimationFrame) {
+    requestAnimationFrame = function (callback) {
+      const currTime = new Date().getTime()
+      // 为了使setTimteout的尽可能的接近每秒60帧的效果
+      const timeToCall = Math.max(0, 16 - (currTime - lastTime))
+      const id = window.setTimeout(() => {
+        // eslint-disable-next-line standard/no-callback-literal
+        callback(currTime + timeToCall)
+      }, timeToCall)
+      lastTime = currTime + timeToCall
+      return id
+    }
+
+    cancelAnimationFrame = function (id) {
+      window.clearTimeout(id)
+    }
+  }
+}
+
+export { requestAnimationFrame, cancelAnimationFrame }

src/config/index.js

@@ -4,7 +4,13 @@ export const documentServerUrl2 = SystemConfig.DOCUMENT_SERVER_URL2
 
 // 元素颜色配置
 // '业务架构元素': '#d2edfd', '应用架构元素': '#a0ce62', '数据架构元素': '#fbe8d0', '技术架构元素': '#e4d3fc', '安全架构元素': '#fffe55'
-export const archiEleColor = ['#d2edfd', '#a0ce62', '#fbe8d0', '#e4d3fc', '#fffe55']
+export const archiEleColor = [
+  '#d2edfd',
+  '#a0ce62',
+  '#fbe8d0',
+  '#e4d3fc',
+  '#fffe55',
+]
 // 自动成图图例颜色 遵从： #527aba  完善： #e79f4e 新增： #acc756
 export const dataMappingLegendColor = ['#527aba', '#e79f4e', '#acc756']
 
@@ -26,7 +32,8 @@ export const relationIcons = [
     url: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPCEtLSBEbyBub3QgZWRpdCB0aGlzIGZpbGUgd2l0aCBlZGl0b3JzIG90aGVyIHRoYW4gZHJhdy5pbyAtLT4KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI2OHB4IiBoZWlnaHQ9IjY4cHgiIHZpZXdCb3g9Ii0wLjUgLTAuNSA2OCA2OCIgY29udGVudD0iJmx0O214ZmlsZSBob3N0PSZxdW90O2xvY2FsaG9zdCZxdW90OyBtb2RpZmllZD0mcXVvdDsyMDIzLTEyLTExVDA4OjM3OjExLjE3MlomcXVvdDsgYWdlbnQ9JnF1b3Q7TW96aWxsYS81LjAgKFdpbmRvd3MgTlQgMTAuMDsgV2luNjQ7IHg2NCkgQXBwbGVXZWJLaXQvNTM3LjM2IChLSFRNTCwgbGlrZSBHZWNrbykgQ2hyb21lLzEyMC4wLjAuMCBTYWZhcmkvNTM3LjM2JnF1b3Q7IGV0YWc9JnF1b3Q7cGJJZGhlY29zS293VWFCWmJKWksmcXVvdDsgdmVyc2lvbj0mcXVvdDtARFJBV0lPLVZFUlNJT05AJnF1b3Q7IHR5cGU9JnF1b3Q7ZGV2aWNlJnF1b3Q7Jmd0OyZsdDtkaWFncmFtIG5hbWU9JnF1b3Q756ysIDEg6aG1JnF1b3Q7IGlkPSZxdW90Oy0wVURfeWZMblg5dVcxaWU0d2NEJnF1b3Q7Jmd0O2paUExic01nRUVXL3hzdEtOamh4dW16UzlMR29GRFZTMmkweUV4c1Ztd2h3SHYzNjRnTEcyS3JVbGVFd2MyZTRqQk84YWE3UGtwenFOMEdCSnlpbDF3US9KZ2hsT1VyTnB5YzNTNHBzWlVFbEdYVkJBZXpaTnpqbzhxcU9VVkJSb0JhQ2EzYUtZU25hRmtvZE1TS2x1TVJoUjhIanFpZFN3UXpzUzhMbjlJTlJYVnU2UWtYZ0w4Q3EybGZPbHZmMnBDRSsyTjFFMVlTS3l3amhiWUkzVWdodFY4MTFBN3czei90aTg1NytPQjBhazlEcS95Ujhkdmk0UGtoMWVGVlp2bHVvOTBKKzNTMnR5cG53emwzWU5hdHYzZ0ZvNlVOdnBObVZuQ2pGeWdTdmxTWlN6M0d0RzI1QVpwWlNkQzJGdm5acWRsWVY2TXpzMEgwMmVHS0dDVVFEV3Q1TXlDVzR2bkJPMWlQRFBaUEFpV2JuV0o2NHg2OEd1YUhDVGpCVEdLVnVVTEhYY1dPS2l6U1dVS0tUSmJpc3Njc1RvVHlkQ0tHSmtER3VBajBUTW92UnRRUDZmVVMvRGNOaXc4TXZoN2MvJmx0Oy9kaWFncmFtJmd0OyZsdDsvbXhmaWxlJmd0OyIgc3R5bGU9ImJhY2tncm91bmQtY29sb3I6IHJnYigyNTUsIDI1NSwgMjU1KTsiPjxkZWZzLz48Zz48cGF0aCBkPSJNIDEyLjUgNTMuNSBMIDUzLjUgMTIuNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSJyZ2IoMCwgMCwgMCkiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIgcG9pbnRlci1ldmVudHM9InN0cm9rZSIvPjxwYXRoIGQ9Ik0gOC43OSA1Ny4yMSBMIDExLjI3IDQ5Ljc4IEwgMTIuNSA1My41IEwgMTYuMjIgNTQuNzMgWiIgZmlsbD0icmdiKDAsIDAsIDApIiBzdHJva2U9InJnYigwLCAwLCAwKSIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBwb2ludGVyLWV2ZW50cz0iYWxsIi8+PHBhdGggZD0iTSA1Ny4yMSA4Ljc5IEwgNTQuNzMgMTYuMjIgTCA1My41IDEyLjUgTCA0OS43OCAxMS4yNyBaIiBmaWxsPSJyZ2IoMCwgMCwgMCkiIHN0cm9rZT0icmdiKDAsIDAsIDApIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHBvaW50ZXItZXZlbnRzPSJhbGwiLz48L2c+PC9zdmc+',
   },
   {
-    label: 'edgeStyle=elbowEdgeStyle;elbow=horizontal;endArrow=classic;html=1;curved=0;rounded=0;endSize=8;startSize=8;',
+    label:
+      'edgeStyle=elbowEdgeStyle;elbow=horizontal;endArrow=classic;html=1;curved=0;rounded=0;endSize=8;startSize=8;',
     value: 'img4',
     url: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPCEtLSBEbyBub3QgZWRpdCB0aGlzIGZpbGUgd2l0aCBlZGl0b3JzIG90aGVyIHRoYW4gZHJhdy5pbyAtLT4KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI3MHB4IiBoZWlnaHQ9IjcwcHgiIHZpZXdCb3g9Ii0wLjUgLTAuNSA3MCA3MCIgY29udGVudD0iJmx0O214ZmlsZSBob3N0PSZxdW90O2xvY2FsaG9zdCZxdW90OyBtb2RpZmllZD0mcXVvdDsyMDIzLTEyLTExVDA4OjQ5OjMwLjMzMVomcXVvdDsgYWdlbnQ9JnF1b3Q7TW96aWxsYS81LjAgKFdpbmRvd3MgTlQgMTAuMDsgV2luNjQ7IHg2NCkgQXBwbGVXZWJLaXQvNTM3LjM2IChLSFRNTCwgbGlrZSBHZWNrbykgQ2hyb21lLzEyMC4wLjAuMCBTYWZhcmkvNTM3LjM2JnF1b3Q7IGV0YWc9JnF1b3Q7NXJ5Y1k5X2pldUVsOGJVemhNck4mcXVvdDsgdmVyc2lvbj0mcXVvdDtARFJBV0lPLVZFUlNJT05AJnF1b3Q7IHR5cGU9JnF1b3Q7ZGV2aWNlJnF1b3Q7Jmd0OyZsdDtkaWFncmFtIG5hbWU9JnF1b3Q756ysIDEg6aG1JnF1b3Q7IGlkPSZxdW90Oy0wVURfeWZMblg5dVcxaWU0d2NEJnF1b3Q7Jmd0O2paTmJiNEl3Rk1jL0RZOUxnT0prajFQWjVXR0ptWW5iYTBlUDBLeHdURnRFL2ZRcnRseXFNZGtUUGIrZTY3K0hnQ3lyNDZ1aysvSURHWWdnRHRreElLc2dqcU1rRHMybkl5ZEw1bEZxUVNFNWMwNGoyUEF6T09qaWlvWXpVSjZqUmhTYTczMllZMTFEcmoxR3BjVFdkOXVoOEt2dWFRRTNZSk5UY1V1L09OT2xwV2s4SC9rYjhLTHNLMGVQVC9hbW9yMnptMFNWbEdFN1FTUUx5RklpYW51cWprc1FuWGk5TGpidTVjN3QwSmlFV3Y4bjRMc2h1OFZXcXUyN2lwTDFUSDNPNWU5REwvT0Jpc1pON0xyVnAxNENZRVlSWjRMNHdUWWJ3ZUlDekVXSmtwK3gxbFIwc0diUG5mYUc1NElxeFhNRFMxMlp1MVZram5rakQ5QzFGUnBEWWxPendUS2hiZ2xTWXlsTnBaN1l0cmV1b2JzaVJJTzBaaWNCSzlEeVpGemE4ZkZtYnVaeThtNDlreUNvNWdjL1BYVTdWQXpwaGdwcjVLWndITHA5VDBLWHgyMTdRa0kvaGNKRzV1Q2lwbzkxbldqbUp5THBWU0lqVEFINkpwRTVUTVllMFdVWGVuUGNPZXMrL3Jrayt3TT0mbHQ7L2RpYWdyYW0mZ3Q7Jmx0Oy9teGZpbGUmZ3Q7IiBzdHlsZT0iYmFja2dyb3VuZC1jb2xvcjogcmdiKDI1NSwgMjU1LCAyNTUpOyI+PGRlZnMvPjxnPjxwYXRoIGQ9Ik0gOSA1OSBMIDM0IDU5IEwgMzQgOSBMIDUxLjEzIDkiIGZpbGw9Im5vbmUiIHN0cm9rZT0icmdiKDAsIDAsIDApIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHBvaW50ZXItZXZlbnRzPSJzdHJva2UiLz48cGF0aCBkPSJNIDU3Ljg4IDkgTCA0OC44OCAxMy41IEwgNTEuMTMgOSBMIDQ4Ljg4IDQuNSBaIiBmaWxsPSJyZ2IoMCwgMCwgMCkiIHN0cm9rZT0icmdiKDAsIDAsIDApIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHBvaW50ZXItZXZlbnRzPSJhbGwiLz48L2c+PC9zdmc+',
   },
@@ -36,3 +43,111 @@ export const relationIcons = [
     url: 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPCEtLSBEbyBub3QgZWRpdCB0aGlzIGZpbGUgd2l0aCBlZGl0b3JzIG90aGVyIHRoYW4gZHJhdy5pbyAtLT4KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHdpZHRoPSI1MHB4IiBoZWlnaHQ9IjU1cHgiIHZpZXdCb3g9Ii0wLjUgLTAuNSA1MCA1NSIgY29udGVudD0iJmx0O214ZmlsZSBob3N0PSZxdW90O2xvY2FsaG9zdCZxdW90OyBtb2RpZmllZD0mcXVvdDsyMDIzLTEyLTExVDA4OjQ5OjU1LjkzMFomcXVvdDsgYWdlbnQ9JnF1b3Q7TW96aWxsYS81LjAgKFdpbmRvd3MgTlQgMTAuMDsgV2luNjQ7IHg2NCkgQXBwbGVXZWJLaXQvNTM3LjM2IChLSFRNTCwgbGlrZSBHZWNrbykgQ2hyb21lLzEyMC4wLjAuMCBTYWZhcmkvNTM3LjM2JnF1b3Q7IGV0YWc9JnF1b3Q7ZUhTUFRhNXk3YzA4NzVubFRrRlUmcXVvdDsgdmVyc2lvbj0mcXVvdDtARFJBV0lPLVZFUlNJT05AJnF1b3Q7IHR5cGU9JnF1b3Q7ZGV2aWNlJnF1b3Q7Jmd0OyZsdDtkaWFncmFtIG5hbWU9JnF1b3Q756ysIDEg6aG1JnF1b3Q7IGlkPSZxdW90Oy0wVURfeWZMblg5dVcxaWU0d2NEJnF1b3Q7Jmd0O2pWUExib013RVB3YWpwVXdKazF5Yk5MMGNhZ1VOVkxhcTRVM1lOVmdaSnNrOU90cllodHdVS0tlOEk1blozZkhTNFRYNWZsVmtycjRFQlI0bE1UMEhPSG5LRWxRbXNUbTB5R3RSZVpvWVlGY011cElBN0JqditCQWw1YzNqSUlLaUZvSXJsa2RncG1vS3NoMGdCRXB4U21rSFFRUHE5WWtod213eXdpZm9sK002c0tpaTJRKzRHL0E4c0pYUm85TGUxTVNUM2FUcUlKUWNScEJlQlBodFJSQzIxTjVYZ1B2elBPKzJMeVhHN2Q5WXhJcS9aK0U3d1lmVm51cDl1OEtwZHVaK3B6TG53ZmtaSTZFTjI1aTE2MXV2UVZaSTQvUWlhQUlyNkNpVDUydEpzdzRVWXBsQml4MHlkMjlGRTFGTCt6WVJGWUw2TVRqb1duVVcyRjJDRVFKV3JhR2Nock1uamtEaTVIUEhwUEFpV2JIVUo2NE44OTd1YjdDVmpCVE9JbmRmdUtGMDNIYmlaZHhLS0ZFSXpOd1dXTnpyNFJTZkNXVVhnbHBJblBRRXlIakpXbEh0TG9qcU5zTlQrb3M0N3Q5VFFaTUE3NDUyQTU4TkhxREFib3NrZytIaGJYMDRiZkhtejg9Jmx0Oy9kaWFncmFtJmd0OyZsdDsvbXhmaWxlJmd0OyIgc3R5bGU9ImJhY2tncm91bmQtY29sb3I6IHJnYigyNTUsIDI1NSwgMjU1KTsiPjxkZWZzLz48Zz48cGF0aCBkPSJNIDAgNTQgUSA1MCA1NCAyNSAyOSBRIDAgNCA0My42MyA0IiBmaWxsPSJub25lIiBzdHJva2U9InJnYigwLCAwLCAwKSIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIiBwb2ludGVyLWV2ZW50cz0ic3Ryb2tlIi8+PHBhdGggZD0iTSA0OC44OCA0IEwgNDEuODggNy41IEwgNDMuNjMgNCBMIDQxLjg4IDAuNSBaIiBmaWxsPSJyZ2IoMCwgMCwgMCkiIHN0cm9rZT0icmdiKDAsIDAsIDApIiBzdHJva2UtbWl0ZXJsaW1pdD0iMTAiIHBvaW50ZXItZXZlbnRzPSJhbGwiLz48L2c+PC9zdmc+',
   },
 ]
+
+// 各省自建项目近五年走势 （各省线条颜色）
+export const provinceLineColor = [
+  {
+    name: '北京',
+    color: '#66a6a4',
+  },
+  {
+    name: '天津',
+    color: '#67a66a',
+  },
+  {
+    name: '河北',
+    color: '#86a65b',
+  },
+  {
+    name: '冀北',
+    color: '#a59459',
+  },
+  {
+    name: '山东',
+    color: '#90a1f8',
+  },
+  {
+    name: '上海',
+    color: '#9c75c7',
+  },
+  {
+    name: '江苏',
+    color: '#905984',
+  },
+  {
+    name: '浙江',
+    color: '#4e3b63',
+  },
+  {
+    name: '安徽',
+    color: '#603c58',
+  },
+  {
+    name: '福建',
+    color: '#567721',
+  },
+  {
+    name: '湖北',
+    color: '#347724',
+  },
+  {
+    name: '湖南',
+    color: '#337764',
+  },
+  {
+    name: '河南',
+    color: '#123975',
+  },
+  {
+    name: '江西',
+    color: '#1a0a74',
+  },
+  {
+    name: '四川',
+    color: '#6d1775',
+  },
+  {
+    name: '重庆',
+    color: '#6f1326',
+  },
+  {
+    name: '辽宁',
+    color: '#6d1775',
+  },
+  {
+    name: '吉林',
+    color: '#aa223b',
+  },
+  {
+    name: '黑龙江',
+    color: '#781a82',
+  },
+  {
+    name: '内蒙古',
+    color: '#ee742f',
+  },
+  {
+    name: '陕西',
+    color: '#e3fd52',
+  },
+  {
+    name: '甘肃',
+    color: '#d76829',
+  },
+  {
+    name: '青海',
+    color: '#cde449',
+  },
+  {
+    name: '宁夏',
+    color: '#61c93c',
+  },
+  {
+    name: '新疆',
+    color: '#50b16f',
+  },
+  {
+    name: '西藏',
+    color: '#2c6b97',
+  },
+]

src/styles/common.scss

 $color-primary: #0d867f;
 @for $i from 0 through 50 {
+  .font-#{$i} {
+    font-size: #{$i}px;
+  }
   .m-#{$i} {
     margin: #{$i}px;
   }
@@ -111,6 +114,9 @@ $color-primary: #0d867f;
 .h-100 {
   height: 100%;
 }
+.font-bold {
+  font-weight: bold;
+}
 
 .searchTable {
   width: 100%;

src/utils/http.js

@@ -82,13 +82,33 @@ axios.interceptors.response.use(response => {
 			})
 		})
 	}
-	export function post(url, data = {}) {
+  const loadingOption = {
+    lock: true,
+    text: '保存中',
+    spinner: 'el-icon-loading',
+  }
+ /**
+  * @description: post 接口封装
+  * @param {String} url 接口url
+  * @param {Object} data 接口入参
+  * @param {Boolean} hasLoading 是否展示loading
+  * @param {Object} loadingParams loading配置项
+  * @return {Promise}
+  * @author: pan
+  */ 
+	export function post(url, data = {}, hasLoading = false, loadingParams) {
+    let loadingInstance = null
+    if(hasLoading) {
+      loadingInstance = Loading.service(loadingParams || loadingOption);
+    }
 		return new Promise((resolve, reject) => {
 			axios.post(url, data).then(response => {
+        loadingInstance?.close();
 				if(response){
 					resolve(response.data);
 				}
 			}, err => {
+        loadingInstance?.close();
 				reject(err);
 			})
 		})

src/utils/index.js

@@ -53,13 +53,16 @@ export async function getDictTypeOptions(key) {
 }
 /**
  * @description: svg字符串转base64
- * @param {String} svgCode 
+ * @param {String} svgCode
  * @return {String} base64
  * @author: pan
  */
-export  function svgToBase64(svgCode) {
-  const utf8Bytes = new TextEncoder().encode(svgCode);
-  return 'data:image/svg+xml;base64,' + btoa(String.fromCharCode.apply(null, utf8Bytes));
+export function svgToBase64(svgCode) {
+  const utf8Bytes = new TextEncoder().encode(svgCode)
+  return (
+    'data:image/svg+xml;base64,' +
+    btoa(String.fromCharCode.apply(null, utf8Bytes))
+  )
 }
 
 export function deepClone(source) {
@@ -67,7 +70,7 @@ export function deepClone(source) {
     throw new Error('error arguments', 'deepClone')
   }
   const targetObj = source.constructor === Array ? [] : {}
-  Object.keys(source).forEach(keys => {
+  Object.keys(source).forEach((keys) => {
     if (source[keys] && typeof source[keys] === 'object') {
       targetObj[keys] = deepClone(source[keys])
     } else {
@@ -85,5 +88,59 @@ export function deepClone(source) {
  */
 export function deduplication(list, key) {
   let map = new Map()
-  return list.filter((item) => !map.has(item[key].toString()) && map.set(item[key].toString()))
-}
\ No newline at end of file
+  return list.filter(
+    (item) => !map.has(item[key].toString()) && map.set(item[key].toString()),
+  )
+}
+
+/**
+ * @param {Function} func
+ * @param {number} wait
+ * @param {boolean} immediate
+ * @return {*}
+ */
+export function debounce(func, wait, immediate) {
+  let timeout, args, context, timestamp, result
+
+  const later = function () {
+    // 据上一次触发时间间隔
+    const last = +new Date() - timestamp
+
+    // 上次被包装函数被调用时间间隔 last 小于设定时间间隔 wait
+    if (last < wait && last > 0) {
+      timeout = setTimeout(later, wait - last)
+    } else {
+      timeout = null
+      // 如果设定为immediate===true，因为开始边界已经调用过了此处无需调用
+      if (!immediate) {
+        result = func.apply(context, args)
+        if (!timeout) context = args = null
+      }
+    }
+  }
+
+  return function (...args) {
+    context = this
+    timestamp = +new Date()
+    const callNow = immediate && !timeout
+    // 如果延时不存在，重新设定延时
+    if (!timeout) timeout = setTimeout(later, wait)
+    if (callNow) {
+      result = func.apply(context, args)
+      context = args = null
+    }
+
+    return result
+  }
+}
+
+/**
+ * @description: 获取近5年数组
+ * @return {Array}
+ * @author: pan
+ */
+export function getPastFiveYearList() {
+  const currentYear = new Date().getFullYear()
+  const years = Array.from({ length: 5 }, (_, i) => currentYear - i)
+  return years.reverse()
+}

src/views/Main/index.scss

@@ -7,6 +7,10 @@
 .main {
   height: 100%;
 }
+.menu_item {
+  padding-left: 25px;
+  margin-right: 48px;
+}
 .top_menu_container {
   /* margin-bottom: 20px; */
   height: 125px;

src/views/Main/index.vue

@@ -28,7 +28,7 @@
         <el-popover
           placement="bottom"
           class="menu_item"
-          style="margin-right: 80px; cursor: pointer; position: relative"
+          style="cursor: pointer; position: relative"
           trigger="hover"
           :width="item.width"
           v-for="(item, index) in menuOptions"

src/views/busi-assets-list/RelationPage.vue

@@ -4,7 +4,7 @@
  * @Autor: pan
  * @Date: 2024-05-10 17:20:35
  * @LastEditors: pan
- * @LastEditTime: 2024-05-11 16:11:33
+ * @LastEditTime: 2024-05-28 14:18:21
 -->
 <template>
   <div class="searchTable">
@@ -104,7 +104,7 @@ export default {
               'span',
               {
                 style: {
-                  color: SystemConfig.DEFAULT_PRIMARY,
+                  color: SystemConfig.DEFAULT_PRIMARY_COLOR,
                   cursor: 'pointer',
                   borderBottom: '1px solid #0b8680',
                 },