Merge branch 'temp' of http://123.60.103.97:3000/xuziqiang/SaaS-lib into temp
This commit is contained in:
@@ -85,6 +85,26 @@ const equipment = {
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: 'carbonPlanning',
|
||||||
|
name: 'CarbonPlanning',
|
||||||
|
meta: { title: '碳规划', hideChildren: true, icon: 'tanpaiguanli' },
|
||||||
|
component: Base,
|
||||||
|
redirect: { name: 'CarbonPlanningIndex' },
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: 'index',
|
||||||
|
name: 'CarbonPlanningIndex',
|
||||||
|
// component: () => import('/nerv-lib/saas/view/menuManage/index.vue'),
|
||||||
|
component: () => import('/@/view/carbonEmissionManage/carbonPlanning/index.vue'),
|
||||||
|
meta: {
|
||||||
|
title: '碳规划',
|
||||||
|
keepAlive: false,
|
||||||
|
// backApi: [],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
export default equipment;
|
export default equipment;
|
||||||
|
@@ -1,12 +1,147 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="detailTable">
|
<div class="search">
|
||||||
|
<a-card style="border-radius: 12px">
|
||||||
|
<div class="ns-form-title">
|
||||||
|
<div class="title">查询</div>
|
||||||
|
<div class="operation">
|
||||||
|
<a-button type="primary" @click="changeParentData"> 返回 </a-button>
|
||||||
</div>
|
</div>
|
||||||
<div class="total"> </div>
|
</div>
|
||||||
|
<a-form layout="inline" :model="searchFormState">
|
||||||
|
<a-form-item>
|
||||||
|
<a-input
|
||||||
|
style="width: 200px"
|
||||||
|
v-model:value="searchFormState.value"
|
||||||
|
placeholder="请输入账户类型" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item>
|
||||||
|
<a-select
|
||||||
|
ref="select"
|
||||||
|
v-model:value="searchFormState.value1"
|
||||||
|
style="width: 200px"
|
||||||
|
placeholder="请选择交易类型"
|
||||||
|
@focus="focus"
|
||||||
|
@change="handleChange">
|
||||||
|
<a-select-option value="jack">Jack</a-select-option>
|
||||||
|
<a-select-option value="lucy">Lucy</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item>
|
||||||
|
<a-date-picker
|
||||||
|
style="width: 200px"
|
||||||
|
v-model:value="searchFormState.value5"
|
||||||
|
placeholder="请选择账期"
|
||||||
|
picker="year" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item>
|
||||||
|
<a-button type="primary">查询</a-button>
|
||||||
|
<a-button html-type="submit" style="margin-left: 6px">重置</a-button>
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
|
</a-card>
|
||||||
|
</div>
|
||||||
|
<div style="display: flex; margin-top: 20px; height: calc(84% - 20px)">
|
||||||
|
<div class="detailTable">
|
||||||
|
<a-card>
|
||||||
|
<div class="ns-form-title">
|
||||||
|
<div class="title">交易明细</div>
|
||||||
|
<div class="operation">
|
||||||
|
<a-button type="primary">新增</a-button>
|
||||||
|
<a-button type="primary" style="margin-left: 6px">导入</a-button>
|
||||||
|
<a-button type="primary" style="margin-left: 6px">导出</a-button>
|
||||||
|
<a-button type="primary" style="margin-left: 6px">批量删除</a-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<a-table
|
||||||
|
:columns="columns"
|
||||||
|
:data-source="data"
|
||||||
|
@change="onChange"
|
||||||
|
:rowSelection="{
|
||||||
|
selectedRowKeys: selectedRowKeys,
|
||||||
|
onChange: onSelectionChange,
|
||||||
|
}"
|
||||||
|
:scroll="{ x: 1500, y: 400 }">
|
||||||
|
<template #bodyCell="{ column, text, record }">
|
||||||
|
<template v-if="column.key === 'action'">
|
||||||
|
<span>
|
||||||
|
<a @click="editData(record)">编辑</a>
|
||||||
|
<a-divider type="vertical" />
|
||||||
|
<a @click="delData(record)">删除</a>
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</a-table>
|
||||||
|
</a-card>
|
||||||
|
</div>
|
||||||
|
<div class="total">
|
||||||
|
<a-table :columns="totalColumns" :data-source="totalData" bordered :pagination="false">
|
||||||
|
<template #bodyCell="{ column, text }">
|
||||||
|
<template v-if="column.dataIndex === 'name'">
|
||||||
|
<a>{{ text }}</a>
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</a-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 新增报告弹窗 -->
|
||||||
|
<a-drawer
|
||||||
|
:width="500"
|
||||||
|
:visible="visible"
|
||||||
|
:body-style="{ paddingBottom: '80px' }"
|
||||||
|
:footer-style="{ textAlign: 'right' }"
|
||||||
|
destroyOnClose
|
||||||
|
@close="onClose">
|
||||||
|
<a-form
|
||||||
|
ref="formRef"
|
||||||
|
:model="formState"
|
||||||
|
:rules="rules"
|
||||||
|
:label-col="labelCol"
|
||||||
|
:wrapper-col="wrapperCol">
|
||||||
|
<a-form-item ref="name" label="账户类型" name="reportName">
|
||||||
|
<a-input v-model:value="formState.reportName" placeholder="请输入账户类型" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item ref="name" label="交易类型" name="reportName">
|
||||||
|
<a-cascader
|
||||||
|
v-model:value="formState.value"
|
||||||
|
:options="options"
|
||||||
|
placeholder="请选择交易类型" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item ref="name" label="交易日期" name="reportName">
|
||||||
|
<a-date-picker v-model:value="formState.value1" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item ref="name" label="交易数量" name="reportName">
|
||||||
|
<a-input v-model:value="formState.reportName" placeholder="请输入交易数量" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item ref="name" label="发生金额" name="reportName">
|
||||||
|
<a-input v-model:value="formState.reportName" placeholder="请输入发生金额" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item ref="name" label="交易对象" name="reportName">
|
||||||
|
<a-input v-model:value="formState.reportName" placeholder="请输入交易对象" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-upload
|
||||||
|
v-model:file-list="fileList"
|
||||||
|
name="file"
|
||||||
|
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
|
||||||
|
:headers="headers"
|
||||||
|
@change="handleChange">
|
||||||
|
<a-button>
|
||||||
|
<upload-outlined></upload-outlined>
|
||||||
|
点击上传凭证
|
||||||
|
</a-button>
|
||||||
|
</a-upload>
|
||||||
|
</a-form>
|
||||||
|
<template #footer>
|
||||||
|
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
||||||
|
<a-button type="primary" @click="onSubmit">确定</a-button>
|
||||||
|
</template>
|
||||||
|
</a-drawer>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref } from 'vue';
|
import { ref, defineEmits } from 'vue';
|
||||||
import { http } from '/nerv-lib/util/http';
|
import { http } from '/nerv-lib/util/http';
|
||||||
|
import { UploadOutlined } from '@ant-design/icons-vue';
|
||||||
|
import type { UploadChangeParam } from 'ant-design-vue';
|
||||||
defineOptions({
|
defineOptions({
|
||||||
energyType: 'carbonAssetsDetail', // 与页面路由name一致缓存才可生效
|
energyType: 'carbonAssetsDetail', // 与页面路由name一致缓存才可生效
|
||||||
});
|
});
|
||||||
@@ -16,13 +151,229 @@
|
|||||||
const fetch = (api, params = { orgId }) => {
|
const fetch = (api, params = { orgId }) => {
|
||||||
return http.post(api, params);
|
return http.post(api, params);
|
||||||
};
|
};
|
||||||
|
// 查询部分变量
|
||||||
|
const searchFormState = ref({});
|
||||||
|
// 详情部分变量
|
||||||
|
const selectedRowKeys = ref([]);
|
||||||
|
const onSelectionChange = (selectedKeys, selectedRows) => {
|
||||||
|
selectedRowKeys.value = selectedKeys;
|
||||||
|
};
|
||||||
|
const columns = [
|
||||||
|
{
|
||||||
|
title: '序号',
|
||||||
|
customRender: (text: any) => {
|
||||||
|
return text.index + 1;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '资产类别',
|
||||||
|
dataIndex: 'name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '交易方式',
|
||||||
|
dataIndex: 'name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '交易日期',
|
||||||
|
dataIndex: 'age',
|
||||||
|
sorter: (a, b) => a.age - b.age,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '本期收入(tCO2)',
|
||||||
|
dataIndex: 'age',
|
||||||
|
sorter: (a, b) => a.age - b.age,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '本期支出(tCO2)',
|
||||||
|
dataIndex: 'age',
|
||||||
|
sorter: (a, b) => a.age - b.age,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '发生金额(¥)',
|
||||||
|
dataIndex: 'address',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '交易对象',
|
||||||
|
dataIndex: 'address',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '更新人',
|
||||||
|
dataIndex: 'address',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '更新时间',
|
||||||
|
dataIndex: 'address',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
key: 'action',
|
||||||
|
width: 130,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
const data = [
|
||||||
|
{
|
||||||
|
key: '1',
|
||||||
|
name: 'John Brown',
|
||||||
|
age: 32,
|
||||||
|
address: 'New York No. 1 Lake Park',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '2',
|
||||||
|
name: 'Jim Green',
|
||||||
|
age: 42,
|
||||||
|
address: 'London No. 1 Lake Park',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '3',
|
||||||
|
name: 'Joe Black',
|
||||||
|
age: 32,
|
||||||
|
address: 'Sidney No. 1 Lake Park',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '4',
|
||||||
|
name: 'Jim Red',
|
||||||
|
age: 32,
|
||||||
|
address: 'London No. 2 Lake Park',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
// 新增相关数据
|
||||||
|
const visible = ref(false);
|
||||||
|
const formState = ref({});
|
||||||
|
const formRef = ref();
|
||||||
|
const labelCol = { span: 5 };
|
||||||
|
const wrapperCol = { span: 19 };
|
||||||
|
const options: CascaderProps['options'] = [
|
||||||
|
{
|
||||||
|
value: 'zhejiang',
|
||||||
|
label: 'Zhejiang',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
value: 'hangzhou',
|
||||||
|
label: 'Hangzhou',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
value: 'xihu',
|
||||||
|
label: 'West Lake',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 'jiangsu',
|
||||||
|
label: 'Jiangsu',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
value: 'nanjing',
|
||||||
|
label: 'Nanjing',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
value: 'zhonghuamen',
|
||||||
|
label: 'Zhong Hua Men',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
// 定义form表单的必填
|
||||||
|
const rules: Record<string, Rule[]> = {
|
||||||
|
reportName: [{ required: true, message: '请输入报告名称', trigger: 'change' }],
|
||||||
|
reportYear: [{ required: true, message: '请选择报告年度', trigger: 'change' }],
|
||||||
|
genericStandard: [{ required: true, message: '请输入适用标准', trigger: 'change' }],
|
||||||
|
reportPeriod: [{ required: true, message: '请选择排放类型', trigger: 'change' }],
|
||||||
|
reportScope: [{ required: true, message: '请选择报告范围', trigger: 'change' }],
|
||||||
|
};
|
||||||
|
// 关闭新增抽屉
|
||||||
|
const onClose = () => {
|
||||||
|
visible.value = false;
|
||||||
|
formState.value = {};
|
||||||
|
formRef.value.resetFields();
|
||||||
|
};
|
||||||
|
// 统计表格
|
||||||
|
const totalColumns = [
|
||||||
|
{
|
||||||
|
title: '统计类型',
|
||||||
|
dataIndex: 'name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '小计',
|
||||||
|
dataIndex: 'name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '合计',
|
||||||
|
dataIndex: 'name',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const totalData = [
|
||||||
|
{
|
||||||
|
key: '1',
|
||||||
|
total: '0',
|
||||||
|
name: 'John',
|
||||||
|
money: '¥300,000.00',
|
||||||
|
address: 'New York No. 1 Lake Park',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '2',
|
||||||
|
name: 'Jim',
|
||||||
|
money: '¥1,256,000.00',
|
||||||
|
address: 'London No. 1 Lake Park',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
// 点击返回
|
||||||
|
const emit = defineEmits(['change-data']);
|
||||||
|
const changeParentData = () => {
|
||||||
|
emit('change-data', true);
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
.ns-form-title {
|
||||||
|
font-weight: bold;
|
||||||
|
user-select: text;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.title {
|
||||||
|
text-align: left;
|
||||||
|
height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
font-weight: bold;
|
||||||
|
user-select: text;
|
||||||
|
position: relative;
|
||||||
|
padding-left: 9px;
|
||||||
|
}
|
||||||
|
.title::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
height: 13px;
|
||||||
|
width: 3px;
|
||||||
|
border-radius: 1px;
|
||||||
|
background-color: #2778ff;
|
||||||
|
}
|
||||||
|
:deep(.ant-card-body) {
|
||||||
|
padding: 16px;
|
||||||
|
}
|
||||||
|
.search {
|
||||||
|
height: 16%;
|
||||||
|
}
|
||||||
.detailTable {
|
.detailTable {
|
||||||
height: 80%;
|
width: 65%;
|
||||||
|
margin-right: 20px;
|
||||||
|
height: 100%;
|
||||||
|
background: white;
|
||||||
|
border-radius: 12px;
|
||||||
}
|
}
|
||||||
.total {
|
.total {
|
||||||
height: 20%;
|
width: calc(35% - 20px);
|
||||||
|
height: 100%;
|
||||||
|
background: white;
|
||||||
|
border-radius: 12px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@@ -8,7 +8,11 @@
|
|||||||
<div class="moneyTitle">全国碳账户估值(CNY)</div>
|
<div class="moneyTitle">全国碳账户估值(CNY)</div>
|
||||||
<div class="moneyTotal" style="color: rgba(229, 102, 22, 1)">300,000.00</div>
|
<div class="moneyTotal" style="color: rgba(229, 102, 22, 1)">300,000.00</div>
|
||||||
<div class="moneyDetail"
|
<div class="moneyDetail"
|
||||||
><img width="34px" height="34px" src="../../../../src/icon/carbonAssetsSearch-1.svg"
|
><img
|
||||||
|
@click="viewDetail"
|
||||||
|
width="34px"
|
||||||
|
height="34px"
|
||||||
|
src="../../../../src/icon/carbonAssetsSearch-1.svg"
|
||||||
/></div>
|
/></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="title">
|
<div class="title">
|
||||||
@@ -163,7 +167,7 @@
|
|||||||
</a-card>
|
</a-card>
|
||||||
</div>
|
</div>
|
||||||
<div class="detail" v-else>
|
<div class="detail" v-else>
|
||||||
<carbonAssetsDetail />
|
<carbonAssetsDetail @change-data="updateData" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -174,6 +178,14 @@
|
|||||||
energyType: 'carbonAssets', // 与页面路由name一致缓存才可生效
|
energyType: 'carbonAssets', // 与页面路由name一致缓存才可生效
|
||||||
});
|
});
|
||||||
const homePage = ref(true);
|
const homePage = ref(true);
|
||||||
|
// 点击跳转详情
|
||||||
|
const viewDetail = () => {
|
||||||
|
homePage.value = false;
|
||||||
|
};
|
||||||
|
// 填报页点击返回
|
||||||
|
const updateData = (type) => {
|
||||||
|
homePage.value = type;
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
@@ -316,4 +328,8 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.detail {
|
||||||
|
height: 100%;
|
||||||
|
background: #f0f1f5;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@@ -1010,9 +1010,6 @@
|
|||||||
isClickedPftj.value = false;
|
isClickedPftj.value = false;
|
||||||
isClickedTplx.value = true;
|
isClickedTplx.value = true;
|
||||||
getCarbonFlowDirection();
|
getCarbonFlowDirection();
|
||||||
setTimeout(() => {
|
|
||||||
drawEcharts();
|
|
||||||
}, 500);
|
|
||||||
};
|
};
|
||||||
// 获取碳排流向数据
|
// 获取碳排流向数据
|
||||||
const queryFlowDirection = ref({
|
const queryFlowDirection = ref({
|
||||||
@@ -1021,9 +1018,14 @@
|
|||||||
year: props.year,
|
year: props.year,
|
||||||
categoryId: categoryId.value,
|
categoryId: categoryId.value,
|
||||||
});
|
});
|
||||||
|
const linksData = ref([])
|
||||||
|
const datalist = ref([])
|
||||||
const getCarbonFlowDirection = () => {
|
const getCarbonFlowDirection = () => {
|
||||||
fetch(carbonInventoryCheck.carbonFlowDirection, queryFlowDirection.value).then((res) => {
|
fetch(carbonInventoryCheck.carbonFlowDirection, queryFlowDirection.value).then((res) => {
|
||||||
console.log(res);
|
console.log(res);
|
||||||
|
linksData.value = res.data[0]
|
||||||
|
datalist.value = res.data[1]
|
||||||
|
drawEcharts();
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
// 获取排放统计数据
|
// 获取排放统计数据
|
||||||
@@ -1154,133 +1156,6 @@
|
|||||||
let chartInstance: echarts.ECharts | null = null;
|
let chartInstance: echarts.ECharts | null = null;
|
||||||
const drawEcharts = () => {
|
const drawEcharts = () => {
|
||||||
chartInstance = echarts.init(tplxChart.value);
|
chartInstance = echarts.init(tplxChart.value);
|
||||||
let datalist = [
|
|
||||||
{
|
|
||||||
name: '公共平台',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统0000',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统0011',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统0022',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统0033',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统0044',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统0055',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统11',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统22',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统33',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统44',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统55',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统66',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统77',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统88',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: '系统99',
|
|
||||||
},
|
|
||||||
];
|
|
||||||
let linksData = [
|
|
||||||
{
|
|
||||||
source: '公共平台',
|
|
||||||
target: '系统0000',
|
|
||||||
value: 1044305,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '公共平台',
|
|
||||||
target: '系统0011',
|
|
||||||
value: 651527,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '公共平台',
|
|
||||||
target: '系统0022',
|
|
||||||
value: 651527,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '公共平台',
|
|
||||||
target: '系统0033',
|
|
||||||
value: 486710,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '公共平台',
|
|
||||||
target: '系统0044',
|
|
||||||
value: 212670,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '公共平台',
|
|
||||||
target: '系统0055',
|
|
||||||
value: 210400,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '系统0011',
|
|
||||||
target: '系统11',
|
|
||||||
value: 645246,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '系统0022',
|
|
||||||
target: '系统22',
|
|
||||||
value: 513275,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '系统0011',
|
|
||||||
target: '系统33',
|
|
||||||
value: 282986,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '系统0011',
|
|
||||||
target: '系统44',
|
|
||||||
value: 118655,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '系统0022',
|
|
||||||
target: '系统55',
|
|
||||||
value: 105989,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '系统0022',
|
|
||||||
target: '系统66',
|
|
||||||
value: 95100,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '系统0033',
|
|
||||||
target: '系统77',
|
|
||||||
value: 87796,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '系统0044',
|
|
||||||
target: '系统88',
|
|
||||||
value: 47658,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
source: '系统0055',
|
|
||||||
target: '系统99',
|
|
||||||
value: 243660,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
let Color = [
|
let Color = [
|
||||||
'#61FEFF',
|
'#61FEFF',
|
||||||
'#937FE6',
|
'#937FE6',
|
||||||
@@ -1337,18 +1212,17 @@
|
|||||||
];
|
];
|
||||||
let itemStyleColor = [];
|
let itemStyleColor = [];
|
||||||
let labelSource = [];
|
let labelSource = [];
|
||||||
for (let i = 0; i < datalist.length; i++) {
|
for (let i = 0; i < datalist.value.length; i++) {
|
||||||
datalist[i].label = {
|
datalist.value[i].label = {
|
||||||
normal: {
|
normal: {
|
||||||
position: sourceLabel[i],
|
position: sourceLabel[i],
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
labelSource.push(sourceLabel[i]);
|
labelSource.push(sourceLabel[i]);
|
||||||
}
|
}
|
||||||
for (let d = 0; d < datalist.length; d++) {
|
for (let d = 0; d < datalist.value.length; d++) {
|
||||||
datalist[d].itemStyle = {
|
datalist.value[d].itemStyle = {
|
||||||
normal: {
|
normal: {
|
||||||
// color: Color[d]
|
|
||||||
color: {
|
color: {
|
||||||
type: 'linear',
|
type: 'linear',
|
||||||
x: 0,
|
x: 0,
|
||||||
@@ -1369,28 +1243,13 @@
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
itemStyleColor.push(datalist[d]);
|
itemStyleColor.push(datalist.value[d]);
|
||||||
}
|
}
|
||||||
const option = {
|
const option = {
|
||||||
backgroundColor: 'transparent',
|
backgroundColor: 'transparent',
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: 'item',
|
trigger: 'item',
|
||||||
triggerOn: 'mousemove',
|
triggerOn: 'mousemove',
|
||||||
formatter: function (params) {
|
|
||||||
if (params.name == '公共平台') {
|
|
||||||
return ' 公共平台 ';
|
|
||||||
} else {
|
|
||||||
let value = params.data.value;
|
|
||||||
if (!value && value !== 0) return 0;
|
|
||||||
let str = value.toString();
|
|
||||||
let reg = str.indexOf('.') > -1 ? /(\d)(?=(\d{3})+\.)/g : /(\d)(?=(?:\d{3})+$)/g;
|
|
||||||
if (params.data.source == '公共平台') {
|
|
||||||
return params.data.target + ' : ' + str.replace(reg, '$1,');
|
|
||||||
} else {
|
|
||||||
return params.data.source + ' : ' + str.replace(reg, '$1,');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
@@ -1404,7 +1263,7 @@
|
|||||||
nodeWidth: 25,
|
nodeWidth: 25,
|
||||||
focusNodeAdjacency: 'allEdges',
|
focusNodeAdjacency: 'allEdges',
|
||||||
data: itemStyleColor,
|
data: itemStyleColor,
|
||||||
links: linksData,
|
links: linksData.value,
|
||||||
label: {
|
label: {
|
||||||
normal: {
|
normal: {
|
||||||
color: '#fff',
|
color: '#fff',
|
||||||
|
@@ -0,0 +1,21 @@
|
|||||||
|
<template>
|
||||||
|
<a-tabs v-model:activeKey="activeKey" @change="handleTabChange">
|
||||||
|
<a-tab-pane key="1" tab="全部"> </a-tab-pane>
|
||||||
|
<a-tab-pane key="2" tab="用电量" force-render> </a-tab-pane>
|
||||||
|
<a-tab-pane key="3" tab="用水量"> </a-tab-pane>
|
||||||
|
<a-tab-pane key="4" tab="供水量"> </a-tab-pane>
|
||||||
|
<a-tab-pane key="5" tab="碳排"> </a-tab-pane>
|
||||||
|
<a-tab-pane key="6" tab="供热量"> </a-tab-pane>
|
||||||
|
</a-tabs>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref } from 'vue';
|
||||||
|
defineOptions({
|
||||||
|
name: 'carbonPlanning', // 与页面路由name一致缓存才可生效
|
||||||
|
});
|
||||||
|
const activeKey = ref('1');
|
||||||
|
// 切换tab页的回调
|
||||||
|
const handleTabChange = (key) => {
|
||||||
|
console.log('Tab changed:', key);
|
||||||
|
};
|
||||||
|
</script>
|
Reference in New Issue
Block a user