|
|
|
@ -45,7 +45,7 @@ |
|
|
|
</template> |
|
|
|
</a-tree> |
|
|
|
</div> |
|
|
|
<div class="bottom"> |
|
|
|
<!-- <div class="bottom"> |
|
|
|
<a-form style="width: 100%; margin: 0 auto"> |
|
|
|
<div class="ns-form-title"><div class="title">报告相关</div></div> |
|
|
|
<div class="button" style="padding: 0 16px !important"> |
|
|
|
@ -53,80 +53,88 @@ |
|
|
|
<div :class="{ tplx: isClickedTplx }" @click="showTplx">碳排流向</div> |
|
|
|
</div> |
|
|
|
</a-form> |
|
|
|
</div> |
|
|
|
</div> --> |
|
|
|
</div> |
|
|
|
<div class="right"> |
|
|
|
<div style="display: flex"> |
|
|
|
<div class="ns-table-title ns-title-extra-box">排放源</div> |
|
|
|
<a-button type="primary" style="margin-left: 12px" @click="changeParentData">返回</a-button> |
|
|
|
</div> |
|
|
|
<div style="display: flex; height: 100%" v-if="fillInPage"> |
|
|
|
<div class="mainLeft"> |
|
|
|
<a-tree |
|
|
|
:expandedKeys="expandedKeysR" |
|
|
|
:selectedKeys="selectedKeysR" |
|
|
|
:checkedKeys="checkedKeys" |
|
|
|
:tree-data="treeData" |
|
|
|
@select="onSelectR" |
|
|
|
block-node> |
|
|
|
<template #title="data"> |
|
|
|
<div class="treeRow"> |
|
|
|
<div> |
|
|
|
<span>{{ data.emissionSource }}</span> |
|
|
|
</div> |
|
|
|
<div class="actionMore"> |
|
|
|
<EditOutlined @click="editUnit(data)" /> |
|
|
|
<MinusCircleOutlined style="margin-left: 6px" @click="delUnit(data)" /> |
|
|
|
</div> |
|
|
|
<a-button |
|
|
|
type="primary" |
|
|
|
@click="changeParentData" |
|
|
|
style="position: absolute; right: 25px; top: 10px; z-index: 99"> |
|
|
|
返回 |
|
|
|
</a-button> |
|
|
|
<a-tabs v-model:activeKey="activeKey" @change="handleTabChange" style="height: 100%"> |
|
|
|
<a-tab-pane key="1" tab="排放源"> |
|
|
|
<div style="display: flex; height: 100%"> |
|
|
|
<div class="mainLeft"> |
|
|
|
<a-tree |
|
|
|
:expandedKeys="expandedKeysR" |
|
|
|
:selectedKeys="selectedKeysR" |
|
|
|
:checkedKeys="checkedKeys" |
|
|
|
:tree-data="treeData" |
|
|
|
@select="onSelectR" |
|
|
|
block-node> |
|
|
|
<template #title="data"> |
|
|
|
<div class="treeRow"> |
|
|
|
<div> |
|
|
|
<span>{{ data.emissionSource }}</span> |
|
|
|
</div> |
|
|
|
<div class="actionMore"> |
|
|
|
<EditOutlined @click="editUnit(data)" /> |
|
|
|
<MinusCircleOutlined style="margin-left: 6px" @click="delUnit(data)" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</a-tree> |
|
|
|
<div class="addTreeNode"> |
|
|
|
<a-button type="primary" style="width: 100%" @click="addTreeNodeData" |
|
|
|
>新增</a-button |
|
|
|
> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</a-tree> |
|
|
|
<div class="addTreeNode"> |
|
|
|
<a-button type="primary" style="width: 100%" @click="addTreeNodeData">新增</a-button> |
|
|
|
</div> |
|
|
|
<div class="mainRight"> |
|
|
|
<a-table |
|
|
|
:columns="columns" |
|
|
|
:data-source="data" |
|
|
|
:pagination="false" |
|
|
|
bordered |
|
|
|
size="middle" |
|
|
|
:scroll="{ y: 500 }"> |
|
|
|
<template #title> |
|
|
|
<a-button type="primary" @click="downLoadVoucher">凭证</a-button> |
|
|
|
</template> |
|
|
|
<template #bodyCell="{ column, text, record }"> |
|
|
|
<template v-if="column.dataIndex === 'dataSources'"> |
|
|
|
<span v-if="record.dataSources">{{ record.dataSources.label }}</span> |
|
|
|
</template> |
|
|
|
<template v-if="column.dataIndex === 'carbonSource'"> |
|
|
|
<span v-if="record.carbonSource">{{ record.carbonSource.label }}</span> |
|
|
|
</template> |
|
|
|
<template v-if="column.key === 'action'"> |
|
|
|
<span> |
|
|
|
<a @click="edit(record)">编辑</a> |
|
|
|
</span> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</a-table> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="mainRight"> |
|
|
|
</a-tab-pane> |
|
|
|
<a-tab-pane key="2" tab="排放统计"> |
|
|
|
<a-table |
|
|
|
:columns="columns" |
|
|
|
:data-source="data" |
|
|
|
:pagination="false" |
|
|
|
:columns="pftjColumn" |
|
|
|
:data-source="pftjData" |
|
|
|
bordered |
|
|
|
size="middle" |
|
|
|
:scroll="{ y: 480 }"> |
|
|
|
<template #title> |
|
|
|
<a-button type="primary" @click="downLoadVoucher">凭证</a-button> |
|
|
|
</template> |
|
|
|
:pagination="false" |
|
|
|
:scroll="{ x: 2000, y: 500 }"> |
|
|
|
<template #bodyCell="{ column, text, record }"> |
|
|
|
<template v-if="column.dataIndex === 'dataSources'"> |
|
|
|
<span v-if="record.dataSources">{{ record.dataSources.label }}</span> |
|
|
|
</template> |
|
|
|
<template v-if="column.dataIndex === 'carbonSource'"> |
|
|
|
<span v-if="record.carbonSource">{{ record.carbonSource.label }}</span> |
|
|
|
</template> |
|
|
|
<template v-if="column.key === 'action'"> |
|
|
|
<span> |
|
|
|
<a @click="edit(record)">编辑</a> |
|
|
|
</span> |
|
|
|
</template> |
|
|
|
{{ text || '-' }} |
|
|
|
</template> |
|
|
|
</a-table> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div v-if="isClickedPftj"> |
|
|
|
<a-table |
|
|
|
:columns="pftjColumn" |
|
|
|
:data-source="pftjData" |
|
|
|
bordered |
|
|
|
:pagination="false" |
|
|
|
:scroll="{ x: 2000 }"> |
|
|
|
<template #bodyCell="{ column, text, record }"> |
|
|
|
{{ text || '-' }} |
|
|
|
</template> |
|
|
|
</a-table> |
|
|
|
</div> |
|
|
|
<div v-if="isClickedTplx" style="width: 100%; height: 100%"> |
|
|
|
<div ref="tplxChart" style="width: 100%; height: 68vh"></div> |
|
|
|
</div> |
|
|
|
</a-tab-pane> |
|
|
|
<a-tab-pane key="3" tab="碳排流向"> |
|
|
|
<div ref="tplxChart" style="width: 100%; height: 68vh"></div> |
|
|
|
</a-tab-pane> |
|
|
|
</a-tabs> |
|
|
|
</div> |
|
|
|
<!-- 类别配置 --> |
|
|
|
<a-drawer |
|
|
|
@ -240,7 +248,7 @@ |
|
|
|
</a-drawer> |
|
|
|
<!-- 点击编辑弹出框 --> |
|
|
|
<a-drawer |
|
|
|
:width="700" |
|
|
|
:width="500" |
|
|
|
:visible="editData" |
|
|
|
:body-style="{ paddingBottom: '80px' }" |
|
|
|
:footer-style="{ textAlign: 'right' }" |
|
|
|
@ -252,7 +260,7 @@ |
|
|
|
:label-col="labelCol" |
|
|
|
:wrapper-col="wrapperCol"> |
|
|
|
<a-row> |
|
|
|
<a-col :span="12"> |
|
|
|
<a-col :span="24"> |
|
|
|
<a-form-item ref="name" label="数据来源" name="dataSources"> |
|
|
|
<a-select |
|
|
|
ref="select" |
|
|
|
@ -264,14 +272,29 @@ |
|
|
|
</a-select> |
|
|
|
</a-form-item> |
|
|
|
</a-col> |
|
|
|
<a-col :span="12"> |
|
|
|
<a-col :span="24"> |
|
|
|
<a-form-item ref="name" label="消耗量" name="consumption"> |
|
|
|
<ns-input v-model:value="editFormState.consumption" :disabled="canEdit" /> |
|
|
|
</a-form-item> |
|
|
|
</a-col> |
|
|
|
</a-row> |
|
|
|
<a-row v-if="automatic"> |
|
|
|
<a-col :span="12"> |
|
|
|
<a-col :span="24"> |
|
|
|
<a-form-item label="能耗类型"> |
|
|
|
<a-select |
|
|
|
v-model:value="editFormState.energyConsumptionType" |
|
|
|
@change="changeEnergyType" |
|
|
|
placeholder="请选择能耗类型"> |
|
|
|
<a-select-option |
|
|
|
v-for="(item, index) in energyTypeOptions" |
|
|
|
:key="index" |
|
|
|
:value="item.dicKey"> |
|
|
|
{{ item.cnValue }} |
|
|
|
</a-select-option> |
|
|
|
</a-select> |
|
|
|
</a-form-item> |
|
|
|
</a-col> |
|
|
|
<a-col :span="24"> |
|
|
|
<a-form-item ref="name" label="采集节点" name="collectionNode"> |
|
|
|
<a-tree-select |
|
|
|
v-model:value="editFormState.collectionNode" |
|
|
|
@ -283,12 +306,12 @@ |
|
|
|
</a-col> |
|
|
|
</a-row> |
|
|
|
<a-row> |
|
|
|
<a-col :span="12"> |
|
|
|
<a-col :span="24"> |
|
|
|
<a-form-item ref="name" label="因子值" name="factorId"> |
|
|
|
<ns-input v-model:value="editFormState.factorId" /> |
|
|
|
</a-form-item> |
|
|
|
</a-col> |
|
|
|
<a-col :span="12"> |
|
|
|
<a-col :span="24"> |
|
|
|
<a-form-item ref="name" label="关键字" name="emissionFactors"> |
|
|
|
<a-input-search |
|
|
|
v-model:value="editFormState.emissionFactors" |
|
|
|
@ -303,7 +326,8 @@ |
|
|
|
:data-source="newTableData" |
|
|
|
bordered |
|
|
|
rowKey="id" |
|
|
|
:scroll="{ y: 400 }" |
|
|
|
:scroll="{ y: 300 }" |
|
|
|
size="small" |
|
|
|
style="margin-bottom: 10px" |
|
|
|
:rowSelection="{ |
|
|
|
selectedRowKeys: selectedRowKeysEdit, |
|
|
|
@ -313,25 +337,28 @@ |
|
|
|
:pagination="false"> |
|
|
|
</a-table> |
|
|
|
<a-pagination |
|
|
|
:current="queryParams.pageNum" |
|
|
|
:current="queryData.pageNum" |
|
|
|
:total="total" |
|
|
|
:page-size="queryParams.pageSize" |
|
|
|
:page-size="queryData.pageSize" |
|
|
|
:pageSizeOptions="['5']" |
|
|
|
style="display: flex; justify-content: center; margin-top: 16px" |
|
|
|
:show-size-changer="true" |
|
|
|
:show-quick-jumper="true" |
|
|
|
@change="onChange" /> |
|
|
|
<a-upload |
|
|
|
v-model:file-list="fileList" |
|
|
|
<a-upload-dragger |
|
|
|
v-model:fileList="fileList" |
|
|
|
accept=".pdf" |
|
|
|
name="file" |
|
|
|
accept=".jpg,.jpeg,.png,.gif,.bmp,.pdf" |
|
|
|
@remove="handleFileRemove" |
|
|
|
:before-upload="beforeUpload" |
|
|
|
@change="handleChange"> |
|
|
|
<a-button> |
|
|
|
<upload-outlined></upload-outlined> |
|
|
|
点击上传凭证 |
|
|
|
</a-button> |
|
|
|
</a-upload> |
|
|
|
<p class="ant-upload-drag-icon"> |
|
|
|
<inbox-outlined></inbox-outlined> |
|
|
|
</p> |
|
|
|
<p class="ant-upload-hint">1.仅支持pdf格式文件或文件夹</p> |
|
|
|
<p class="ant-upload-hint">2.文件名命名规则为【能源种类_年份】</p> |
|
|
|
<p class="ant-upload-hint">3.每次上传自动覆盖</p> |
|
|
|
</a-upload-dragger> |
|
|
|
<template #footer> |
|
|
|
<a-button style="margin-right: 8px" @click="onCloseEditData">取消</a-button> |
|
|
|
<a-button type="primary" @click="submitEditData">确定</a-button> |
|
|
|
@ -341,15 +368,16 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script lang="ts" setup> |
|
|
|
import { ref, watch, toRaw, defineEmits } from 'vue'; |
|
|
|
import { ref, watch, toRaw, defineEmits, nextTick } from 'vue'; |
|
|
|
import { http } from '/nerv-lib/util/http'; |
|
|
|
import { Pagination, Modal, message } from 'ant-design-vue'; |
|
|
|
import { Pagination, Modal, message, Upload } from 'ant-design-vue'; |
|
|
|
import type { TreeProps, UploadChangeParam } from 'ant-design-vue'; |
|
|
|
import { |
|
|
|
EditOutlined, |
|
|
|
PlusCircleOutlined, |
|
|
|
MinusCircleOutlined, |
|
|
|
UploadOutlined, |
|
|
|
InboxOutlined, |
|
|
|
} from '@ant-design/icons-vue'; |
|
|
|
import * as echarts from 'echarts'; |
|
|
|
import { voucherColumns, drawerColumns } from '../config'; |
|
|
|
@ -361,6 +389,7 @@ |
|
|
|
} from '/@/api/carbonEmissionFactorLibrary'; |
|
|
|
import { group } from '/@/api/deviceManage'; |
|
|
|
import { debug, log } from 'node:console'; |
|
|
|
import { dict } from '/@/api'; |
|
|
|
defineOptions({ |
|
|
|
energyType: 'fillInPage', // 与页面路由name一致缓存才可生效 |
|
|
|
components: { |
|
|
|
@ -382,12 +411,12 @@ |
|
|
|
type: String, |
|
|
|
}, |
|
|
|
}); |
|
|
|
|
|
|
|
const activeKey = ref('1'); |
|
|
|
const orgId = ref(''); |
|
|
|
const result = JSON.parse(sessionStorage.getItem('ORGID')!); |
|
|
|
orgId.value = result; |
|
|
|
const fetch = (api, params = { orgId: orgId.value }) => { |
|
|
|
return http.post(api, params); |
|
|
|
const fetch = (api, params = { orgId: orgId.value }, config) => { |
|
|
|
return http.post(api, params, config); |
|
|
|
}; |
|
|
|
// 左侧树结构 |
|
|
|
const x = 3; |
|
|
|
@ -865,15 +894,17 @@ |
|
|
|
selectedRowKeys.value.forEach((item) => { |
|
|
|
deleteIds.value.append('ids', item); |
|
|
|
}); |
|
|
|
fetch(uploadPic.downloadZip, deleteIds.value) |
|
|
|
const config = { |
|
|
|
responseType: 'blob', |
|
|
|
}; |
|
|
|
fetch(uploadPic.downloadZip, deleteIds.value, config) |
|
|
|
.then((res) => { |
|
|
|
// 创建一个 URL 对象，指向图片数据的 blob |
|
|
|
const url = window.URL.createObjectURL(new Blob([res.data])); |
|
|
|
const url = window.URL.createObjectURL(new Blob([res])); |
|
|
|
// 创建一个 <a> 标签，用于触发下载 |
|
|
|
const link = document.createElement('a'); |
|
|
|
link.href = url; |
|
|
|
debugger; |
|
|
|
link.setAttribute('download', ''); // 设置下载的文件名 |
|
|
|
link.setAttribute('download', '碳盘查凭证.zip'); // 设置下载的文件名 |
|
|
|
document.body.appendChild(link); |
|
|
|
link.click(); |
|
|
|
|
|
|
|
@ -910,10 +941,15 @@ |
|
|
|
const queryData = ref({ |
|
|
|
orgId: orgId.value, |
|
|
|
pageNum: 1, |
|
|
|
pageSize: 999, |
|
|
|
pageSize: 5, |
|
|
|
}); |
|
|
|
const edit = (record) => { |
|
|
|
getDictList(); |
|
|
|
const energyTypeOptions = ref([]); |
|
|
|
const acquisitionDate = ref(); |
|
|
|
const edit = async (record) => { |
|
|
|
acquisitionDate.value = record.acquisitionDate; |
|
|
|
// 获取能耗类型 |
|
|
|
const options = await dict({ params: { dicKey: 'ENERGY_TYPE' } }); |
|
|
|
energyTypeOptions.value = options.data.data; |
|
|
|
getNewTable(); |
|
|
|
editFormState.value.id = record.id; |
|
|
|
editFormState.value.dataSources = record.dataSources; |
|
|
|
@ -949,46 +985,66 @@ |
|
|
|
if (value === '3') { |
|
|
|
canEdit.value = true; |
|
|
|
automatic.value = true; |
|
|
|
} else { |
|
|
|
automatic.value = false; |
|
|
|
} |
|
|
|
}; |
|
|
|
// 定义采集节点数的变量 |
|
|
|
const collectingNodes = ref<TreeSelectProps['treeData']>([]); |
|
|
|
const getDictList = () => { |
|
|
|
const getTypeConsume = ref(); |
|
|
|
const changeEnergyType = (value) => { |
|
|
|
getTypeConsume.value = value; |
|
|
|
// 获取自动采集节点的数据 |
|
|
|
fetch(group.queryDeviceGroupTree, { energyType: 'ELECTRICITY_USAGE', orgId: orgId.value }).then( |
|
|
|
(res) => { |
|
|
|
collectingNodes.value = res.data; |
|
|
|
collectingNodes.value = collectingNodes.value.map((item) => ({ |
|
|
|
value: item.id, |
|
|
|
label: item.pointName, |
|
|
|
children: item.children |
|
|
|
? item.children.map((child) => ({ |
|
|
|
value: child.id, |
|
|
|
label: child.pointName, |
|
|
|
})) |
|
|
|
: [], |
|
|
|
})); |
|
|
|
}, |
|
|
|
); |
|
|
|
fetch(group.queryDeviceGroupTree, { energyType: value, orgId: orgId.value }).then((res) => { |
|
|
|
collectingNodes.value = res.data; |
|
|
|
collectingNodes.value = collectingNodes.value.map((item) => ({ |
|
|
|
value: item.id, |
|
|
|
label: item.pointName, |
|
|
|
children: item.children |
|
|
|
? item.children.map((child) => ({ |
|
|
|
value: child.id, |
|
|
|
label: child.pointName, |
|
|
|
})) |
|
|
|
: [], |
|
|
|
})); |
|
|
|
}); |
|
|
|
}; |
|
|
|
const selectNode = (value) => { |
|
|
|
debugger; |
|
|
|
const getConsumeData = ref({ |
|
|
|
acquisitionDate: acquisitionDate.value, |
|
|
|
collectionNode: value, |
|
|
|
orgId: orgId.value, |
|
|
|
energyConsumptionType: getTypeConsume.value, |
|
|
|
}); |
|
|
|
fetch(carbonInventoryCheck.nodeCancellationConsumption, getConsumeData.value).then((res) => { |
|
|
|
editFormState.value.consumption = res.data; |
|
|
|
}); |
|
|
|
}; |
|
|
|
// 上传附件 |
|
|
|
const fileList = ref<UploadProps['fileList']>([]); |
|
|
|
const isValidFileName = (filename: string): boolean => { |
|
|
|
const regex = /^[\s\S]+_\d{4}\.pdf$/; |
|
|
|
return regex.test(filename); |
|
|
|
}; |
|
|
|
const beforeUpload: UploadProps['beforeUpload'] = (file) => { |
|
|
|
const filename = file.name; |
|
|
|
if (!isValidFileName(filename)) { |
|
|
|
message.error('文件名不符合规则'); |
|
|
|
return Upload.LIST_IGNORE; // 阻止文件上传 |
|
|
|
} |
|
|
|
return false; |
|
|
|
}; |
|
|
|
const handleChange = (info: UploadChangeParam) => { |
|
|
|
fileList.value = [...info.fileList]; |
|
|
|
if (info.file.status !== 'uploading') { |
|
|
|
console.log(info.file, info.fileList); |
|
|
|
} |
|
|
|
if (info.file.status === 'done') { |
|
|
|
message.success(`${info.file.name} 文件上传成功`); |
|
|
|
} else if (info.file.status === 'error') { |
|
|
|
message.error(`${info.file.name} 文件上传失败`); |
|
|
|
// fileList.value = [...info.fileList]; |
|
|
|
const { fileList: newFileList } = info; |
|
|
|
// 删除fileList中的第一条数据 |
|
|
|
if (newFileList.length > 1) { |
|
|
|
delIds.value.push(info.fileList[0].uid); |
|
|
|
newFileList.shift(); // 删除第一条数据 |
|
|
|
} |
|
|
|
|
|
|
|
// 更新fileList |
|
|
|
fileList.value = [...newFileList]; |
|
|
|
}; |
|
|
|
const delIds = ref([]); |
|
|
|
const handleFileRemove = (file) => { |
|
|
|
@ -1062,8 +1118,8 @@ |
|
|
|
}; |
|
|
|
// 分页器 |
|
|
|
const onChange = (pageNumber: number, size: number) => { |
|
|
|
queryParams.value.pageNum = pageNumber; |
|
|
|
queryParams.value.pageSize = size; |
|
|
|
queryData.value.pageNum = pageNumber; |
|
|
|
queryData.value.pageSize = size; |
|
|
|
getNewTable(); |
|
|
|
}; |
|
|
|
// 点击切换排放统计/碳排流向 |
|
|
|
@ -1388,6 +1444,20 @@ |
|
|
|
chartInstance = echarts.init(tplxChart.value); |
|
|
|
chartInstance.setOption(option); |
|
|
|
}; |
|
|
|
|
|
|
|
const handleTabChange = (key) => { |
|
|
|
console.log('Tab changed:', key); |
|
|
|
// 在这里可以执行需要在页面切换时执行的逻辑 |
|
|
|
if (key === '2') { |
|
|
|
nextTick(() => { |
|
|
|
getEmissionStatistic(); |
|
|
|
}); |
|
|
|
} else if (key === '3') { |
|
|
|
nextTick(() => { |
|
|
|
getCarbonFlowDirection(); |
|
|
|
}); |
|
|
|
} |
|
|
|
}; |
|
|
|
// 点击返回 |
|
|
|
const emit = defineEmits(['change-data']); |
|
|
|
const changeParentData = () => { |
|
|
|
@ -1413,7 +1483,7 @@ |
|
|
|
flex-direction: column; |
|
|
|
.top { |
|
|
|
position: relative; |
|
|
|
height: 80%; |
|
|
|
height: 100%; |
|
|
|
margin-bottom: 20px; |
|
|
|
.ns-form-title { |
|
|
|
font-weight: bold; |
|
|
|
@ -1492,10 +1562,13 @@ |
|
|
|
flex: 1; |
|
|
|
min-width: 0; |
|
|
|
height: 100%; |
|
|
|
padding: @ns-gap; |
|
|
|
background-color: @white; |
|
|
|
border-radius: @ns-border-radius; |
|
|
|
box-shadow: @ns-content-box-shadow; |
|
|
|
position: relative; |
|
|
|
:deep(.ant-tabs-content-holder) { |
|
|
|
padding: 20px; |
|
|
|
} |
|
|
|
.ns-table-title { |
|
|
|
text-align: left; |
|
|
|
font-size: 16px; |
|
|
|
@ -1552,4 +1625,8 @@ |
|
|
|
margin-left: 10%; |
|
|
|
flex-direction: column; |
|
|
|
} |
|
|
|
:deep(.ant-upload.ant-upload-drag) { |
|
|
|
height: 18vh; |
|
|
|
margin-top: 10px; |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
fks-xuxinyue
3 months ago
