|
|
@@ -3,7 +3,6 @@
|
|
|
import * as echarts from 'echarts'
|
|
|
import { useThemeStore } from '@/stores/modules/theme'
|
|
|
import { onMounted, ref, reactive, watch, computed } from 'vue'
|
|
|
-import updateIcon from '../image/xiazai.png'
|
|
|
import * as XLSX from 'xlsx'
|
|
|
import { formatNumber } from '@/utils/tools'
|
|
|
|
|
|
@@ -123,7 +122,6 @@ const exportData = ({ filename }: any) => {
|
|
|
}
|
|
|
]
|
|
|
let formatJson = (filterVal: any, jsonData: any = []) => {
|
|
|
- console.log(filterVal, jsonData, 'value')
|
|
|
return jsonData?.map((v: any) => filterVal.map((j: any) => v[j]))
|
|
|
}
|
|
|
for (var i in result) {
|
|
|
@@ -294,11 +292,18 @@ const initOption = reactive({
|
|
|
top: 6,
|
|
|
right: 8,
|
|
|
feature: {
|
|
|
- saveAsImage: { show: true, name: downloadName.value, pixelRatio: 2 },
|
|
|
+ saveAsImage: {
|
|
|
+ icon: 'path://M588.8 821.44H179.52a38.4 38.4 0 0 1-38.4-38.4v-105.088l202.432-115.584 112.96 64.576c7.872 4.48 17.6 4.48 25.472 0l400.768-228.8-0.32-0.512h0.64v-156.8a89.6 89.6 0 0 0-89.6-89.6H179.456a89.6 89.6 0 0 0-89.6 89.6v542.208a89.6 89.6 0 0 0 89.6 89.6H588.8v-51.2zM141.184 240.896a38.4 38.4 0 0 1 38.4-38.4h613.824a38.4 38.4 0 0 1 38.4 38.4v127.36L469.248 575.104 356.288 510.72a25.6 25.6 0 0 0-19.2-2.496l-6.144 2.56-189.76 108.288V240.896z m168.448 226.432c44.416 0 80.96-33.792 85.376-76.992l0.384-8.768c0-44.416-33.728-80.96-76.992-85.376l-8.768-0.448c-47.36 0-85.824 38.4-85.824 85.76l0.448 8.832c4.096 40.32 36.16 72.448 76.544 76.544l8.832 0.448z m0-51.2a34.624 34.624 0 1 1 0-69.312 34.624 34.624 0 0 1 0 69.312z m445.888 449.024a25.6 25.6 0 0 0 36.224-0.064l138.368-138.368-36.224-36.224-94.592 94.656V545.536h-51.2v239.616l-94.72-94.656-36.224 36.224 138.368 138.432z',
|
|
|
+ show: true,
|
|
|
+ name: 'Revenue Spent',
|
|
|
+ pixelRatio: 2
|
|
|
+ },
|
|
|
myTool1: {
|
|
|
show: true,
|
|
|
title: 'update',
|
|
|
- icon: 'image://' + updateIcon,
|
|
|
+ icon:
|
|
|
+ 'path://' +
|
|
|
+ 'M571.648 956.864v-51.2H230.144a38.4 38.4 0 0 1-38.4-38.4V195.2a38.4 38.4 0 0 1 38.4-38.4h306.368v167.488c0 49.472 40.128 89.6 89.6 89.6h167.552v88.768h51.264V384h-0.448a25.472 25.472 0 0 0-7.04-13.76L580.224 113.088a25.6 25.6 0 0 0-19.84-7.424h-330.24c-49.408 0-89.6 40.128-89.6 89.6v672c0 49.472 40.128 89.6 89.6 89.6h341.504z m54.464-594.112a38.4 38.4 0 0 1-38.4-38.4V193.088l169.728 169.664H626.112z m-224.896 346.24a20.48 20.48 0 0 0 8.576-1.92 19.008 19.008 0 0 0 7.232-6.592l52.032-82.368a22.912 22.912 0 0 0 1.408-1.92c0.448-0.64 0.896-1.28 1.28-2.048l34.816 86.4a18.176 18.176 0 0 0 4.16 5.76c1.92 1.728 4.672 2.624 8.064 2.624h47.168l-56.512-128L587.52 473.6h-55.232a11.84 11.84 0 0 0-6.272 1.664 18.048 18.048 0 0 0-5.056 5.12l-41.28 67.2a59.392 59.392 0 0 0-3.84 6.272l-31.04-74.24a9.6 9.6 0 0 0-3.776-4.544c-1.408-0.96-3.84-1.472-7.232-1.472h-47.808l51.072 109.632-88.512 125.696h52.608z m357.824 240.384a25.6 25.6 0 0 0 36.224 0l147.072-147.2-36.16-36.16-103.424 103.488V610.56h-51.264v258.752l-103.36-103.36-36.288 36.224 147.2 147.136z',
|
|
|
onclick: function () {
|
|
|
let filename =
|
|
|
'Revenue Spent Details ' +
|
|
|
@@ -406,7 +411,7 @@ const initChart = () => {
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
- <div class="com-container">
|
|
|
+ <div class="com-container" :class="{ 'dark-theme': themeStore.theme === 'dark' }">
|
|
|
<div ref="bar_ref" id="bar_chart" :style="props.barHeight"></div>
|
|
|
</div>
|
|
|
</template>
|
|
|
@@ -417,6 +422,30 @@ const initChart = () => {
|
|
|
height: 100%;
|
|
|
overflow: hidden;
|
|
|
position: relative;
|
|
|
+ // 默认（亮色）
|
|
|
+ :deep(.echarts-toolbox) {
|
|
|
+ .icon {
|
|
|
+ path {
|
|
|
+ stroke: #2b2f36 !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .icon:hover path {
|
|
|
+ stroke: #ff7500 !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // 暗黑模式
|
|
|
+ &.dark-theme {
|
|
|
+ :deep(.echarts-toolbox) {
|
|
|
+ .icon {
|
|
|
+ path {
|
|
|
+ stroke: #f0f1f3 !important; // 暗色下的默认色
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .icon:hover path {
|
|
|
+ stroke: #ff7500 !important; // hover 保持橙色
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
#bar_chart {
|
|
|
width: 100%;
|
Jack Zhou
