|
|
|
@ -100,7 +100,6 @@ |
|
|
|
<a-table-summary-row> |
|
|
|
<a-table-summary-cell></a-table-summary-cell> |
|
|
|
<a-table-summary-cell :colSpan="2">合计</a-table-summary-cell> |
|
|
|
<a-table-summary-cell></a-table-summary-cell> |
|
|
|
<a-table-summary-cell> |
|
|
|
<a-typography-text>{{ totalLastYearActualUsage + unit }}</a-typography-text> |
|
|
|
</a-table-summary-cell> |
|
|
|
@ -153,88 +152,120 @@ |
|
|
|
</a-form> |
|
|
|
</a-modal> |
|
|
|
<!-- 基准值设置 --> |
|
|
|
<a-modal :visible="visible" @ok="onSubmit" @cancel="onClose"> |
|
|
|
<a-tooltip placement="top"> |
|
|
|
<template #title> |
|
|
|
<span>月基准值设置：使用基准年相应月份的数据作为当前年相应月份的基准值。</span> |
|
|
|
</template> |
|
|
|
<QuestionCircleOutlined style="position: absolute; right: 60px; top: 22px; z-index: 7" /> |
|
|
|
</a-tooltip> |
|
|
|
<div style="display: flex; margin-top: 20px; justify-content: space-between"> |
|
|
|
<span> 节点：{{ props.nodeName }} </span> |
|
|
|
<a-date-picker |
|
|
|
v-if="activeKey === '1'" |
|
|
|
v-model:value="selectYear" |
|
|
|
picker="year" |
|
|
|
valueFormat="YYYY" |
|
|
|
@change="changeYearData" /> |
|
|
|
</div> |
|
|
|
<a-tabs v-model:activeKey="activeKey" @change="handleTabChange"> |
|
|
|
<a-tab-pane key="1" tab="年基准值设置"> |
|
|
|
<a-table |
|
|
|
:columns="yearColumns" |
|
|
|
:data-source="yearTableData" |
|
|
|
bordered |
|
|
|
:rowKey="(record, index) => record.referenceYear" |
|
|
|
:rowSelection="{ |
|
|
|
selectedRowKeys: selectedRowKeysSet, |
|
|
|
onChange: onSelectionChangeSet, |
|
|
|
type: 'radio', |
|
|
|
}" |
|
|
|
:pagination="false"> |
|
|
|
</a-table> |
|
|
|
</a-tab-pane> |
|
|
|
<a-tab-pane key="2" tab="月基准值设置" force-render> |
|
|
|
<a-table :columns="monthColumns" :data-source="dataSource" bordered :pagination="false"> |
|
|
|
<template #bodyCell="{ column, text, record }"> |
|
|
|
<template v-if="['referenceValue'].includes(column.dataIndex)"> |
|
|
|
<div> |
|
|
|
<a-input |
|
|
|
v-if="editableData[record.yearMonth]" |
|
|
|
v-model:value="editableData[record.yearMonth][column.dataIndex]" |
|
|
|
style="margin: -5px 0" /> |
|
|
|
<template v-else> |
|
|
|
{{ text }} |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<template v-else-if="column.dataIndex === 'operation'"> |
|
|
|
<div class="editable-row-operations"> |
|
|
|
<span v-if="editableData[record.yearMonth]"> |
|
|
|
<a-popconfirm |
|
|
|
title="确定要保存?" |
|
|
|
ok-text="确定" |
|
|
|
cancel-text="取消" |
|
|
|
@confirm="save(record.yearMonth)" |
|
|
|
@cancel="cancel(record.yearMonth)"> |
|
|
|
<a>保存</a> |
|
|
|
</a-popconfirm> |
|
|
|
</span> |
|
|
|
<span v-else> |
|
|
|
<a-button |
|
|
|
type="link" |
|
|
|
@click="edit(record.yearMonth)" |
|
|
|
:disabled="record.isAutoObtained === 0 ? true : false"> |
|
|
|
编辑 |
|
|
|
</a-button> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<template v-if="column.key === 'isAutoObtained'"> |
|
|
|
<a-switch |
|
|
|
checked-children="是" |
|
|
|
un-checked-children="否" |
|
|
|
:checked="record.isAutoObtained === 0 ? true : false" |
|
|
|
:class="{ |
|
|
|
'blue-background': record.isAutoObtained === 0 ? true : false, |
|
|
|
'grey-background': record.isAutoObtained === 0 ? false : true, |
|
|
|
}" |
|
|
|
@click="changeSwitch(record)" /> |
|
|
|
<a-modal |
|
|
|
:visible="visible" |
|
|
|
@ok="onSubmit" |
|
|
|
@cancel="onClose" |
|
|
|
:style="{ top: '20px', left: '-100px' }" |
|
|
|
:bodyStyle="{ maxHeight: '800px', overflowY: 'auto' }"> |
|
|
|
<a-spin :spinning="loading"> |
|
|
|
<a-tooltip placement="top"> |
|
|
|
<template #title> |
|
|
|
<span>月基准值设置：使用基准年相应月份的数据作为当前年相应月份的基准值。</span> |
|
|
|
</template> |
|
|
|
<QuestionCircleOutlined style="position: absolute; right: 60px; top: 22px; z-index: 7" /> |
|
|
|
</a-tooltip> |
|
|
|
<a-tabs v-model:activeKey="activeKey" @change="handleTabChange"> |
|
|
|
<a-tab-pane key="1" tab="年基准值设置"> |
|
|
|
<div |
|
|
|
style=" |
|
|
|
display: flex; |
|
|
|
margin-bottom: 10px; |
|
|
|
justify-content: space-between; |
|
|
|
margin-top: 10px; |
|
|
|
"> |
|
|
|
<span> 节点：{{ props.nodeName }} </span> |
|
|
|
<a-date-picker |
|
|
|
v-model:value="selectYear" |
|
|
|
picker="year" |
|
|
|
valueFormat="YYYY" |
|
|
|
@change="changeYearData" /> |
|
|
|
</div> |
|
|
|
<a-table |
|
|
|
:columns="yearColumns" |
|
|
|
:data-source="yearTableData" |
|
|
|
bordered |
|
|
|
:rowKey="(record, index) => record.referenceYear" |
|
|
|
:rowSelection="{ |
|
|
|
selectedRowKeys: selectedRowKeysSet, |
|
|
|
onChange: onSelectionChangeSet, |
|
|
|
type: 'radio', |
|
|
|
}" |
|
|
|
:pagination="false"> |
|
|
|
</a-table> |
|
|
|
<a-pagination |
|
|
|
v-model:current="queryData.pageNum" |
|
|
|
simple |
|
|
|
:total="total" |
|
|
|
@change="onChange" |
|
|
|
style="display: flex; justify-content: end; margin-top: 10px" /> |
|
|
|
</a-tab-pane> |
|
|
|
<a-tab-pane key="2" tab="月基准值设置" force-render> |
|
|
|
<div |
|
|
|
style=" |
|
|
|
display: flex; |
|
|
|
margin-bottom: 10px; |
|
|
|
justify-content: space-between; |
|
|
|
margin-top: 10px; |
|
|
|
"> |
|
|
|
<span> 节点：{{ props.nodeName }} </span> |
|
|
|
</div> |
|
|
|
<a-table |
|
|
|
:columns="monthColumns" |
|
|
|
:data-source="dataSource" |
|
|
|
size="small" |
|
|
|
bordered |
|
|
|
:pagination="false"> |
|
|
|
<template #bodyCell="{ column, text, record }"> |
|
|
|
<template v-if="['referenceValue'].includes(column.dataIndex)"> |
|
|
|
<div> |
|
|
|
<a-input |
|
|
|
v-if="editableData[record.yearMonth]" |
|
|
|
v-model:value="editableData[record.yearMonth][column.dataIndex]" |
|
|
|
style="margin: -5px 0" /> |
|
|
|
<template v-else> |
|
|
|
{{ text }} |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<template v-else-if="column.dataIndex === 'operation'"> |
|
|
|
<div class="editable-row-operations"> |
|
|
|
<span v-if="editableData[record.yearMonth]"> |
|
|
|
<a-popconfirm |
|
|
|
title="确定要保存?" |
|
|
|
ok-text="确定" |
|
|
|
cancel-text="取消" |
|
|
|
@confirm="save(record.yearMonth)" |
|
|
|
@cancel="cancel(record.yearMonth)"> |
|
|
|
<a>保存</a> |
|
|
|
</a-popconfirm> |
|
|
|
</span> |
|
|
|
<span v-else> |
|
|
|
<a-button |
|
|
|
type="link" |
|
|
|
@click="edit(record.yearMonth)" |
|
|
|
:disabled="record.isAutoObtained === 0 ? true : false"> |
|
|
|
编辑 |
|
|
|
</a-button> |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<template v-if="column.key === 'isAutoObtained'"> |
|
|
|
<a-switch |
|
|
|
checked-children="是" |
|
|
|
un-checked-children="否" |
|
|
|
:checked="record.isAutoObtained === 0 ? true : false" |
|
|
|
:class="{ |
|
|
|
'blue-background': record.isAutoObtained === 0 ? true : false, |
|
|
|
'grey-background': record.isAutoObtained === 0 ? false : true, |
|
|
|
}" |
|
|
|
@click="changeSwitch(record)" /> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</a-table> |
|
|
|
</a-tab-pane> |
|
|
|
</a-tabs> |
|
|
|
</a-table> |
|
|
|
</a-tab-pane> |
|
|
|
</a-tabs> |
|
|
|
</a-spin> |
|
|
|
</a-modal> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
@ -255,7 +286,13 @@ |
|
|
|
import * as echarts from 'echarts'; |
|
|
|
import { any, string } from 'vue-types'; |
|
|
|
import type { Dayjs } from 'dayjs'; |
|
|
|
import { Pagination } from 'ant-design-vue'; |
|
|
|
|
|
|
|
defineOptions({ |
|
|
|
components: { |
|
|
|
'a-pagination': Pagination, |
|
|
|
}, |
|
|
|
}); |
|
|
|
// 父组件id |
|
|
|
const props = defineProps({ |
|
|
|
parentId: { |
|
|
|
@ -383,8 +420,10 @@ |
|
|
|
formState.value.ids = [record.id]; |
|
|
|
if (record.lastYear === '是') { |
|
|
|
formState.value.isLastYear = 1; |
|
|
|
disabled.value = false; |
|
|
|
} else { |
|
|
|
formState.value.isLastYear = 0; |
|
|
|
disabled.value = true; |
|
|
|
} |
|
|
|
formState.value.conversionRate = record.conversionRate; |
|
|
|
formState.value.lastYearList = [record.lastYearActualUsage]; |
|
|
|
@ -454,7 +493,14 @@ |
|
|
|
orgId: orgId.value, |
|
|
|
type: props.type, |
|
|
|
itemizeId: props.parentId, |
|
|
|
pageSize: 10, |
|
|
|
pageNum: 1, |
|
|
|
}); |
|
|
|
const total = ref(); |
|
|
|
const onChange = (page, pageSize) => { |
|
|
|
queryData.value.pageNum = page; |
|
|
|
setBasicData(); |
|
|
|
}; |
|
|
|
const changeYearData = () => { |
|
|
|
queryData.value.referenceYear = selectYear.value; |
|
|
|
setBasicData(); |
|
|
|
@ -462,7 +508,8 @@ |
|
|
|
const yearTableData = ref([]); |
|
|
|
const setBasicData = () => { |
|
|
|
fetch(carbonPlanning.benchmarkSetting, queryData.value).then((res) => { |
|
|
|
yearTableData.value = res.data; |
|
|
|
yearTableData.value = res.data.records; |
|
|
|
total.value = res.data.total; |
|
|
|
}); |
|
|
|
visible.value = true; |
|
|
|
}; |
|
|
|
@ -507,6 +554,7 @@ |
|
|
|
{ |
|
|
|
title: '日期', |
|
|
|
dataIndex: 'yearMonth', |
|
|
|
width: '20%', |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '用电量', |
|
|
|
@ -543,7 +591,9 @@ |
|
|
|
const cancel = (yearMonth: string) => { |
|
|
|
delete editableData[yearMonth]; |
|
|
|
}; |
|
|
|
const loading = ref(false); |
|
|
|
const onSubmit = () => { |
|
|
|
loading.value = true; |
|
|
|
const benchmark = monthData.value; |
|
|
|
fetch(carbonPlanning.benchmarkSubmit, { |
|
|
|
benchmark: benchmark, |
|
|
|
@ -555,6 +605,7 @@ |
|
|
|
visible.value = false; |
|
|
|
activeKey.value = '1'; |
|
|
|
selectedRowKeysSet.value = []; |
|
|
|
loading.value = false; |
|
|
|
getTableData(); |
|
|
|
}); |
|
|
|
}; |
|
|
|
@ -623,8 +674,8 @@ |
|
|
|
props.year + '年预算', |
|
|
|
'基准值', |
|
|
|
], |
|
|
|
top: '0', |
|
|
|
right: '0', |
|
|
|
top: '1%', |
|
|
|
right: '1%', |
|
|
|
textStyle: { |
|
|
|
color: '#666', |
|
|
|
fontSize: 12, |
|
|
|
@ -781,7 +832,6 @@ |
|
|
|
<style lang="less" scoped> |
|
|
|
.detailContant { |
|
|
|
height: 100%; |
|
|
|
margin: 12px; |
|
|
|
} |
|
|
|
.ns-form-title { |
|
|
|
font-weight: bold; |
|
|
|
@ -791,7 +841,7 @@ |
|
|
|
align-items: center; |
|
|
|
width: 100%; |
|
|
|
height: 5vh; |
|
|
|
|
|
|
|
padding: 12px 12px 0 12px; |
|
|
|
.title { |
|
|
|
text-align: left; |
|
|
|
height: 32px; |
|
|
|
@ -826,11 +876,15 @@ |
|
|
|
width: 100%; |
|
|
|
height: calc(95% - 5vh); |
|
|
|
overflow: auto; |
|
|
|
padding: 12px; |
|
|
|
.chartsPart { |
|
|
|
width: 100%; |
|
|
|
height: 63%; |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
border-radius: 12px; |
|
|
|
background: rgba(255, 255, 255, 1); |
|
|
|
box-shadow: 0px 2px 20px rgb(69 123 234 / 20%); |
|
|
|
.chart { |
|
|
|
width: 100%; |
|
|
|
height: 65%; |
|
|
|
@ -938,6 +992,9 @@ |
|
|
|
right: 10px; |
|
|
|
top: 5px; |
|
|
|
} |
|
|
|
:deep(.ant-card-bordered) { |
|
|
|
border: unset; |
|
|
|
} |
|
|
|
</style> |
|
|
|
<style scoped> |
|
|
|
.editable-row-operations a { |
|
|
|
|
fks-xuxinyue
3 months ago