zhaohy 4 months ago
parent
commit
16d7f81f0e
  1. 20
      hx-ai-intelligent/src/router/carbonEmissionManage.ts
  2. 359
      hx-ai-intelligent/src/view/carbonEmissionManage/carbonAssets/carbonAssetsDetail/index.vue
  3. 20
      hx-ai-intelligent/src/view/carbonEmissionManage/carbonAssets/index.vue
  4. 163
      hx-ai-intelligent/src/view/carbonEmissionManage/carbonInventoryCheck/fillInPage/index.vue
  5. 21
      hx-ai-intelligent/src/view/carbonEmissionManage/carbonPlanning/index.vue

20
hx-ai-intelligent/src/router/carbonEmissionManage.ts

@ -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;

359
hx-ai-intelligent/src/view/carbonEmissionManage/carbonAssets/carbonAssetsDetail/index.vue

@ -1,12 +1,147 @@
<template> <template>
<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>
<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"> <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>
<div class="total"> </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>

20
hx-ai-intelligent/src/view/carbonEmissionManage/carbonAssets/index.vue

@ -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>

163
hx-ai-intelligent/src/view/carbonEmissionManage/carbonInventoryCheck/fillInPage/index.vue

@ -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',

21
hx-ai-intelligent/src/view/carbonEmissionManage/carbonPlanning/index.vue

@ -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>
Loading…
Cancel
Save