Compare commits
3 Commits
86693c48f3
...
10e833c6c9
| Author | SHA1 | Date |
|---|---|---|
 caoqianming
|
10e833c6c9 | |
|
caoqianming
|
27d6fb9e2f | |
|
caoqianming
|
5ef2098852 |
|
|
@ -0,0 +1,397 @@
|
||||||
|
{
|
||||||
|
"essos": {
|
||||||
|
"color": [
|
||||||
|
"#893448",
|
||||||
|
"#d95850",
|
||||||
|
"#eb8146",
|
||||||
|
"#ffb248",
|
||||||
|
"#f2d643",
|
||||||
|
"#ebdba4"
|
||||||
|
],
|
||||||
|
"backgroundColor": "rgba(242,234,191,0.15)",
|
||||||
|
"textStyle": { },
|
||||||
|
"title": {
|
||||||
|
"textStyle": {
|
||||||
|
"color": "#893448"
|
||||||
|
},
|
||||||
|
"subtextStyle": {
|
||||||
|
"color": "#d95850"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"line": {
|
||||||
|
"itemStyle": {
|
||||||
|
"borderWidth": "2"
|
||||||
|
},
|
||||||
|
"lineStyle": {
|
||||||
|
"width": "2"
|
||||||
|
},
|
||||||
|
"symbolSize": "6",
|
||||||
|
"symbol": "emptyCircle",
|
||||||
|
"smooth": true
|
||||||
|
},
|
||||||
|
"radar": {
|
||||||
|
"itemStyle": {
|
||||||
|
"borderWidth": "2"
|
||||||
|
},
|
||||||
|
"lineStyle": {
|
||||||
|
"width": "2"
|
||||||
|
},
|
||||||
|
"symbolSize": "6",
|
||||||
|
"symbol": "emptyCircle",
|
||||||
|
"smooth": true
|
||||||
|
},
|
||||||
|
"bar": {
|
||||||
|
"itemStyle": {
|
||||||
|
"barBorderWidth": 0,
|
||||||
|
"barBorderColor": "#ccc"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"pie": {
|
||||||
|
"itemStyle": {
|
||||||
|
"borderWidth": 0,
|
||||||
|
"borderColor": "#ccc"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"scatter": {
|
||||||
|
"itemStyle": {
|
||||||
|
"borderWidth": 0,
|
||||||
|
"borderColor": "#ccc"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"boxplot": {
|
||||||
|
"itemStyle": {
|
||||||
|
"borderWidth": 0,
|
||||||
|
"borderColor": "#ccc"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"parallel": {
|
||||||
|
"itemStyle": {
|
||||||
|
"borderWidth": 0,
|
||||||
|
"borderColor": "#ccc"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"sankey": {
|
||||||
|
"itemStyle": {
|
||||||
|
"borderWidth": 0,
|
||||||
|
"borderColor": "#ccc"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"funnel": {
|
||||||
|
"itemStyle": {
|
||||||
|
"borderWidth": 0,
|
||||||
|
"borderColor": "#ccc"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"gauge": {
|
||||||
|
"itemStyle": {
|
||||||
|
"borderWidth": 0,
|
||||||
|
"borderColor": "#ccc"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"candlestick": {
|
||||||
|
"itemStyle": {
|
||||||
|
"color": "#eb8146",
|
||||||
|
"color0": "transparent",
|
||||||
|
"borderColor": "#d95850",
|
||||||
|
"borderColor0": "#58c470",
|
||||||
|
"borderWidth": "2"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"graph": {
|
||||||
|
"itemStyle": {
|
||||||
|
"borderWidth": 0,
|
||||||
|
"borderColor": "#ccc"
|
||||||
|
},
|
||||||
|
"lineStyle": {
|
||||||
|
"width": 1,
|
||||||
|
"color": "#aaaaaa"
|
||||||
|
},
|
||||||
|
"symbolSize": "6",
|
||||||
|
"symbol": "emptyCircle",
|
||||||
|
"smooth": true,
|
||||||
|
"color": [
|
||||||
|
"#893448",
|
||||||
|
"#d95850",
|
||||||
|
"#eb8146",
|
||||||
|
"#ffb248",
|
||||||
|
"#f2d643",
|
||||||
|
"#ebdba4"
|
||||||
|
],
|
||||||
|
"label": {
|
||||||
|
"color": "#ffffff"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"map": {
|
||||||
|
"itemStyle": {
|
||||||
|
"areaColor": "#f3f3f3",
|
||||||
|
"borderColor": "#999999",
|
||||||
|
"borderWidth": 0.5
|
||||||
|
},
|
||||||
|
"label": {
|
||||||
|
"color": "#893448"
|
||||||
|
},
|
||||||
|
"emphasis": {
|
||||||
|
"itemStyle": {
|
||||||
|
"areaColor": "#ffb248",
|
||||||
|
"borderColor": "#eb8146",
|
||||||
|
"borderWidth": 1
|
||||||
|
},
|
||||||
|
"label": {
|
||||||
|
"color": "#893448"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"geo": {
|
||||||
|
"itemStyle": {
|
||||||
|
"areaColor": "#f3f3f3",
|
||||||
|
"borderColor": "#999999",
|
||||||
|
"borderWidth": 0.5
|
||||||
|
},
|
||||||
|
"label": {
|
||||||
|
"color": "#893448"
|
||||||
|
},
|
||||||
|
"emphasis": {
|
||||||
|
"itemStyle": {
|
||||||
|
"areaColor": "#ffb248",
|
||||||
|
"borderColor": "#eb8146",
|
||||||
|
"borderWidth": 1
|
||||||
|
},
|
||||||
|
"label": {
|
||||||
|
"color": "#893448"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"categoryAxis": {
|
||||||
|
"axisLine": {
|
||||||
|
"show": true,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": "#aaaaaa"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"axisTick": {
|
||||||
|
"show": false,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": "#333"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"axisLabel": {
|
||||||
|
"show": true,
|
||||||
|
"color": "#999999"
|
||||||
|
},
|
||||||
|
"splitLine": {
|
||||||
|
"show": true,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": [
|
||||||
|
"#e6e6e6"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"splitArea": {
|
||||||
|
"show": false,
|
||||||
|
"areaStyle": {
|
||||||
|
"color": [
|
||||||
|
"rgba(250,250,250,0.05)",
|
||||||
|
"rgba(200,200,200,0.02)"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"valueAxis": {
|
||||||
|
"axisLine": {
|
||||||
|
"show": true,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": "#aaaaaa"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"axisTick": {
|
||||||
|
"show": false,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": "#333"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"axisLabel": {
|
||||||
|
"show": true,
|
||||||
|
"color": "#999999"
|
||||||
|
},
|
||||||
|
"splitLine": {
|
||||||
|
"show": true,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": [
|
||||||
|
"#e6e6e6"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"splitArea": {
|
||||||
|
"show": false,
|
||||||
|
"areaStyle": {
|
||||||
|
"color": [
|
||||||
|
"rgba(250,250,250,0.05)",
|
||||||
|
"rgba(200,200,200,0.02)"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"logAxis": {
|
||||||
|
"axisLine": {
|
||||||
|
"show": true,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": "#aaaaaa"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"axisTick": {
|
||||||
|
"show": false,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": "#333"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"axisLabel": {
|
||||||
|
"show": true,
|
||||||
|
"color": "#999999"
|
||||||
|
},
|
||||||
|
"splitLine": {
|
||||||
|
"show": true,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": [
|
||||||
|
"#e6e6e6"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"splitArea": {
|
||||||
|
"show": false,
|
||||||
|
"areaStyle": {
|
||||||
|
"color": [
|
||||||
|
"rgba(250,250,250,0.05)",
|
||||||
|
"rgba(200,200,200,0.02)"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"timeAxis": {
|
||||||
|
"axisLine": {
|
||||||
|
"show": true,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": "#aaaaaa"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"axisTick": {
|
||||||
|
"show": false,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": "#333"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"axisLabel": {
|
||||||
|
"show": true,
|
||||||
|
"color": "#999999"
|
||||||
|
},
|
||||||
|
"splitLine": {
|
||||||
|
"show": true,
|
||||||
|
"lineStyle": {
|
||||||
|
"color": [
|
||||||
|
"#e6e6e6"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"splitArea": {
|
||||||
|
"show": false,
|
||||||
|
"areaStyle": {
|
||||||
|
"color": [
|
||||||
|
"rgba(250,250,250,0.05)",
|
||||||
|
"rgba(200,200,200,0.02)"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"toolbox": {
|
||||||
|
"iconStyle": {
|
||||||
|
"borderColor": "#999999"
|
||||||
|
},
|
||||||
|
"emphasis": {
|
||||||
|
"iconStyle": {
|
||||||
|
"borderColor": "#666666"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"legend": {
|
||||||
|
"textStyle": {
|
||||||
|
"color": "#999999"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"tooltip": {
|
||||||
|
"axisPointer": {
|
||||||
|
"lineStyle": {
|
||||||
|
"color": "#cccccc",
|
||||||
|
"width": 1
|
||||||
|
},
|
||||||
|
"crossStyle": {
|
||||||
|
"color": "#cccccc",
|
||||||
|
"width": 1
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"timeline": {
|
||||||
|
"lineStyle": {
|
||||||
|
"color": "#893448",
|
||||||
|
"width": 1
|
||||||
|
},
|
||||||
|
"itemStyle": {
|
||||||
|
"color": "#893448",
|
||||||
|
"borderWidth": 1
|
||||||
|
},
|
||||||
|
"controlStyle": {
|
||||||
|
"color": "#893448",
|
||||||
|
"borderColor": "#893448",
|
||||||
|
"borderWidth": 0.5
|
||||||
|
},
|
||||||
|
"checkpointStyle": {
|
||||||
|
"color": "#eb8146",
|
||||||
|
"borderColor": "#ffb248"
|
||||||
|
},
|
||||||
|
"label": {
|
||||||
|
"color": "#893448"
|
||||||
|
},
|
||||||
|
"emphasis": {
|
||||||
|
"itemStyle": {
|
||||||
|
"color": "#ffb248"
|
||||||
|
},
|
||||||
|
"controlStyle": {
|
||||||
|
"color": "#893448",
|
||||||
|
"borderColor": "#893448",
|
||||||
|
"borderWidth": 0.5
|
||||||
|
},
|
||||||
|
"label": {
|
||||||
|
"color": "#893448"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"visualMap": {
|
||||||
|
"color": [
|
||||||
|
"#893448",
|
||||||
|
"#d95850",
|
||||||
|
"#eb8146",
|
||||||
|
"#ffb248",
|
||||||
|
"#f2d643",
|
||||||
|
"rgb(247,238,173)"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"dataZoom": {
|
||||||
|
"backgroundColor": "rgba(255,255,255,0)",
|
||||||
|
"dataBackgroundColor": "rgba(255,178,72,0.5)",
|
||||||
|
"fillerColor": "rgba(255,178,72,0.15)",
|
||||||
|
"handleColor": "#ffb248",
|
||||||
|
"handleSize": "100%",
|
||||||
|
"textStyle": {
|
||||||
|
"color": "#333"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"markPoint": {
|
||||||
|
"label": {
|
||||||
|
"color": "#ffffff"
|
||||||
|
},
|
||||||
|
"emphasis": {
|
||||||
|
"label": {
|
||||||
|
"color": "#ffffff"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,42 @@
|
||||||
|
<template>
|
||||||
|
<div ref="myChart" :style="{ width: width, height: height }"></div>
|
||||||
|
</template>
|
||||||
|
<script setup>
|
||||||
|
import { onMounted, ref, defineProps, watch, onUnmounted } from 'vue'
|
||||||
|
import * as echarts from "echarts";
|
||||||
|
import echartTheme from "@/assets/echarts_theme.json";
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
option: { type: Object, default: () => ({}) },
|
||||||
|
theme: { type: String, default: "essos" },
|
||||||
|
width: { type: String, default: "100%" },
|
||||||
|
height: { type: String, default: "300px" }
|
||||||
|
})
|
||||||
|
|
||||||
|
const myChart = ref(null)
|
||||||
|
let myChartInstance = null;
|
||||||
|
onMounted(() => {
|
||||||
|
if (props.theme in echartTheme) {
|
||||||
|
echarts.registerTheme(props.theme, echartTheme[props.theme]);
|
||||||
|
} else{
|
||||||
|
console.warn("echarts未找到该主题")
|
||||||
|
}
|
||||||
|
myChartInstance = echarts.init(myChart.value, props.theme);
|
||||||
|
myChartInstance.setOption(props.option);
|
||||||
|
window.addEventListener("resize", ()=>{myChartInstance?.resize()})
|
||||||
|
})
|
||||||
|
|
||||||
|
watch(() => props.option, (newOption) => {
|
||||||
|
if (myChartInstance) {
|
||||||
|
myChartInstance.setOption(newOption);
|
||||||
|
}
|
||||||
|
}, { deep: true })
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
// 清理资源
|
||||||
|
if (myChartInstance) {
|
||||||
|
myChartInstance.dispose();
|
||||||
|
myChartInstance = null;
|
||||||
|
}
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
@ -1,25 +1,77 @@
|
||||||
<template>
|
<template>
|
||||||
<t-row>
|
<t-row>
|
||||||
<t-col :span="3">
|
<t-col :flex="3">
|
||||||
<t-card hoverShadow class="bigNav" @click="goDq">
|
<t-card hoverShadow header-bordered>
|
||||||
双碳贷前计算器
|
<template #header>
|
||||||
|
<div class="redTitle" @click="goDq">转型金融贷前计算器</div>
|
||||||
|
</template>
|
||||||
|
<xt-chart :option="option"></xt-chart>
|
||||||
|
<t-table
|
||||||
|
row-key="key"
|
||||||
|
:data="tableData"
|
||||||
|
:columns="columns"
|
||||||
|
lazy-load
|
||||||
|
@active-change="onActiveChange"
|
||||||
|
></t-table>
|
||||||
</t-card>
|
</t-card>
|
||||||
</t-col>
|
</t-col>
|
||||||
<t-col :span="3">
|
<t-col :flex="3">
|
||||||
<t-card hoverShadow class="bigNav" @click="goDh">
|
<t-card hoverShadow header-bordered>
|
||||||
双碳贷后计算器
|
<template #header>
|
||||||
|
<div class="redTitle" @click="goDq">转型金融贷后计算器</div>
|
||||||
|
</template>
|
||||||
|
<div class="bigNav">暂未开放</div>
|
||||||
</t-card>
|
</t-card>
|
||||||
</t-col>
|
</t-col>
|
||||||
</t-row>
|
</t-row>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import router from '@/router'
|
import router from '@/router'
|
||||||
|
import { ref, onMounted } from 'vue'
|
||||||
|
import xtChart from "@/components/xtChart/index.vue";
|
||||||
|
|
||||||
const goDq = () => {
|
const goDq = () => {
|
||||||
router.push('/dq')
|
router.push('/dq')
|
||||||
}
|
}
|
||||||
const goDh = () => {
|
const goDh = () => {
|
||||||
router.push('/dh')
|
router.push('/dh')
|
||||||
}
|
}
|
||||||
|
const option = {
|
||||||
|
title: {
|
||||||
|
text: '核算雷达图'
|
||||||
|
},
|
||||||
|
radar: {
|
||||||
|
center: ['50%', '55%'],
|
||||||
|
// shape: 'circle',
|
||||||
|
indicator: [
|
||||||
|
{ name: '技术路径', max: 35 },
|
||||||
|
{ name: '碳排放', max: 20 },
|
||||||
|
{ name: '企业碳治理', max: 10 },
|
||||||
|
{ name: '融资计划', max: 10 },
|
||||||
|
{ name: '社会与治理协同效益', max: 10 },
|
||||||
|
{ name: '数字化与智能化水平', max: 8 },
|
||||||
|
{ name: '环境协同效益', max: 7 }
|
||||||
|
],
|
||||||
|
axisName: {
|
||||||
|
formatter: function(value, indicator) {
|
||||||
|
return `${value}\n(${indicator.max})`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
series: []
|
||||||
|
};
|
||||||
|
|
||||||
|
const tableData = [
|
||||||
|
{"pf": "低于10%及以上", "score": "80~100", "level": "领先"},
|
||||||
|
{"pf": "低于5%（含）~0%", "score": "60~79", "level": "良好"},
|
||||||
|
{"pf": "低于0~5%", "score": "30~59", "level": "一般"},
|
||||||
|
{"pf": "高于", "score": "0~29", "level": "较差"}
|
||||||
|
];
|
||||||
|
const columns = [
|
||||||
|
{ colKey: 'pf', title: '项目碳排放量', width: '300' },
|
||||||
|
{ colKey: 'score', title: '企业分值区间' },
|
||||||
|
{ colKey: 'level', title: '企业/项目等级', ellipsis: true }
|
||||||
|
];
|
||||||
</script>
|
</script>
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.bigNav {
|
.bigNav {
|
||||||
|
|
@ -31,4 +83,10 @@ const goDh = () => {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
.redTitle {
|
||||||
|
color: var(--td-brand-color);
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: 500;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
@ -28,7 +28,7 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref } from 'vue';
|
import { ref, onMounted } from 'vue';
|
||||||
import router from '@/router';
|
import router from '@/router';
|
||||||
import { authToken, systemInfo, userInfo } from '@/store/index.js'
|
import { authToken, systemInfo, userInfo } from '@/store/index.js'
|
||||||
import { MessagePlugin } from "tdesign-vue-next"
|
import { MessagePlugin } from "tdesign-vue-next"
|
||||||
|
|
@ -39,6 +39,11 @@ const formData = ref({
|
||||||
password: "",
|
password: "",
|
||||||
});
|
});
|
||||||
const submitLoading = ref(false);
|
const submitLoading = ref(false);
|
||||||
|
onMounted(() => {
|
||||||
|
http.get("/system_info/").then(res=>{
|
||||||
|
Object.assign(systemInfo, res)
|
||||||
|
})
|
||||||
|
})
|
||||||
const handleLogin = () => {
|
const handleLogin = () => {
|
||||||
submitLoading.value = true;
|
submitLoading.value = true;
|
||||||
http.post("/login/", formData.value).then(res=>{
|
http.post("/login/", formData.value).then(res=>{
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue