remark:'commit'

This commit is contained in:
fks-xuxinyue
2024-07-31 15:52:08 +08:00
parent 75df2dfb11
commit 55051da8a5
13 changed files with 724 additions and 133 deletions

View File

@@ -9,33 +9,39 @@
</div>
<a-form layout="inline">
<a-form-item>
<a-input
style="width: 200px"
<a-select
v-model:value="queryParams.accountType"
placeholder="请输入账户类型" />
style="width: 200px"
placeholder="请输入账户类型">
<a-select-option :value="1">全国账户</a-select-option>
<a-select-option :value="2">地方账户</a-select-option>
<a-select-option :value="3">CCER</a-select-option>
</a-select>
</a-form-item>
<a-form-item>
<a-select
ref="select"
<a-cascader
v-model:value="queryParams.transactionType"
multiple
style="width: 200px"
:options="options"
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>
suffix-icon="Shopping Around">
<template #tagRender="data">
<a-tag :key="data.value" color="blue">{{ data.label }}</a-tag>
</template>
</a-cascader>
</a-form-item>
<a-form-item>
<a-date-picker
style="width: 200px"
v-model:value="queryParams.transactionDate"
v-model:value="queryParams.year"
placeholder="请选择账期"
picker="year" />
picker="year"
valueFormat="YYYY" />
</a-form-item>
<a-form-item>
<a-button type="primary">查询</a-button>
<a-button html-type="submit" style="margin-left: 6px">重置</a-button>
<a-button type="primary" @click="searchTableList">查询</a-button>
<a-button html-type="submit" style="margin-left: 6px" @click="reset">重置</a-button>
</a-form-item>
</a-form>
</a-card>
@@ -110,7 +116,11 @@
:label-col="labelCol"
:wrapper-col="wrapperCol">
<a-form-item ref="name" label="账户类型" name="accountType">
<a-input v-model:value="formState.accountType" placeholder="请输入账户类型" />
<a-select v-model:value="formState.accountType" placeholder="请输入账户类型">
<a-select-option value="1">全国账户</a-select-option>
<a-select-option value="2">地方账户</a-select-option>
<a-select-option value="3">CCER</a-select-option>
</a-select>
</a-form-item>
<a-form-item ref="name" label="交易类型" name="transactionType">
<a-cascader
@@ -130,17 +140,19 @@
<a-form-item ref="name" label="交易对象" name="tradingPartner">
<a-input v-model:value="formState.tradingPartner" 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-item ref="name" label="交易凭证" name="tradingPartner">
<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-item>
</a-form>
<template #footer>
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
@@ -155,13 +167,19 @@
import { UploadOutlined } from '@ant-design/icons-vue';
import type { UploadChangeParam } from 'ant-design-vue';
import { Pagination, Modal, message } from 'ant-design-vue';
import { carbonAssetsDetail } from '/@/api/carbonEmissionFactorLibrary';
import { carbonAssets, carbonEmissionFactorLibrary } from '/@/api/carbonEmissionFactorLibrary';
defineOptions({
energyType: 'carbonAssetsDetail', // 与页面路由name一致缓存才可生效
energyType: 'carbonAssets', // 与页面路由name一致缓存才可生效
components: {
'a-pagination': Pagination,
},
});
// 父组件id
const props = defineProps({
parentId: {
type: Number,
},
});
const orgId = ref('');
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
orgId.value = result;
@@ -174,14 +192,20 @@
selectedRowKeys.value = selectedKeys;
};
const total = ref<number>();
const thisYear = ref(new Date().getFullYear().toString());
const queryParams = ref({
pageNum: 1,
pageSize: 10,
orgId: orgId.value,
accountType: props.parentId,
year: thisYear.value,
});
const searchTableList = () => {
getDetailList();
};
// 获取左侧列表数据
const getDetailList = () => {
fetch(carbonAssetsDetail.carbonDetailsList, queryParams.value).then((res) => {
fetch(carbonAssets.carbonDetailsList, queryParams.value).then((res) => {
data.value = res.data.records;
});
};
@@ -239,11 +263,39 @@
},
];
const data = ref([]);
const reset = () => {
queryParams.value = {
pageNum: 1,
pageSize: 10,
orgId: orgId.value,
year: new Date().getFullYear(),
};
getDetailList();
};
const editData = (record) => {
getDictList();
visible.value = true;
formState.value.id = record.id;
formState.value = record;
setTimeout(() => {
let selectDevice = ref([Number(record.transactionType)]);
findParentIds(options.value, record.transactionType, selectDevice.value);
record.transactionType = selectDevice;
formState.value.transactionType = record.transactionType;
formState.value = record;
}, 500);
};
// 定义一个递归函数来查找每一级的id 设备类型回显 层级方法
function findParentIds(tree: any, targetId: number, result: any) {
for (let item of tree) {
if (item.children && item.children.length > 0) {
if (item.children.some((child: any) => child.value === targetId)) {
result.unshift(item.value); // 将当前节点的id添加到结果数组的最前面
findParentIds(tree, item.value, result); // 递归查找父级节点的id
break; // 找到后可以退出循环
}
}
}
}
const delData = (record) => {
Modal.confirm({
title: '警告',
@@ -252,7 +304,7 @@
okType: 'primary',
cancelText: '取消',
onOk() {
fetch(carbonAssetsDetail.delete, { id: record.id }).then((res) => {
fetch(carbonAssets.delete, { id: record.id }).then((res) => {
message.success('操作成功!');
getDetailList();
});
@@ -270,55 +322,48 @@
};
// 新增相关数据
const visible = ref(false);
const formState = ref({});
const formState = ref({
orgId: orgId.value,
});
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',
},
],
},
],
},
];
const options = ref([]);
// 获取字典值
const getDictList = () => {
fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement, { grp: 'TRANSACTION_TYPE' }).then(
(res) => {
options.value = res.data;
options.value = options.value.map((item) => ({
value: item.id,
label: item.cnValue,
children: item.children
? item.children.map((child) => ({
value: child.id,
label: child.cnValue,
}))
: [],
}));
},
);
};
getDictList();
// 点击新增
const addDetail = () => {
visible.value = true;
getDictList();
};
const onSubmit = () => {
formRef.value
.validate()
.then(() => {
console.log('values', formState, toRaw(formState));
fetch(carbonAssetsDetail.createOrUpdate, formState.value).then((res) => {
if (formState.value.transactionType) {
formState.value.transactionType = formState.value.transactionType.join(',').split(',')[1];
}
fetch(carbonAssets.createOrUpdate, formState.value).then((res) => {
message.success('操作成功!');
visible.value = false;
getDetailList();
});
})
@@ -342,36 +387,28 @@
formRef.value.resetFields();
};
// 统计表格
const getTotalTable = () => {
fetch(carbonAssets.quotaStatistics, queryParams.value).then((res) => {
totalData.value = res.data;
});
};
getTotalTable();
const totalColumns = [
{
title: '统计类型',
dataIndex: 'name',
dataIndex: 'statisticType',
},
{
title: '小计',
dataIndex: 'name',
dataIndex: 'subtotal',
},
{
title: '合计',
dataIndex: 'name',
dataIndex: 'amountTo',
},
];
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 totalData = ref([]);
// 点击返回
const emit = defineEmits(['change-data']);
const changeParentData = () => {

View File

@@ -1,15 +1,15 @@
<template>
<div class="mainContant" v-if="homePage">
<a-card class="card" style="margin-right: 1%; margin-bottom: 1%">
<a-card class="card" v-if="nationwide" style="margin-right: 1%; margin-bottom: 1%">
<div class="top" style="background: rgba(252, 139, 78, 0.05)">
<div class="moneyImg"
><img width="68px" height="68px" src="../../../../src/icon/carbonAssetsMoney-1.svg"
/></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)">{{nationwide.valuation}}</div>
<div class="moneyDetail"
><img
@click="viewDetail"
@click="viewDetail(1)"
width="34px"
height="34px"
src="../../../../src/icon/carbonAssetsSearch-1.svg"
@@ -21,12 +21,12 @@
</div>
<div class="bottom">
<div class="calculation TLCard">
<div class="money">75,000.00</div>
<div class="money">{{nationwide.opening}}</div>
<div class="moneyType">期初余额tCO2</div>
</div>
<img width="17px" height="17px" src="../../../../src/icon/carbonAssetsAdd.svg" />
<div class="calculation TLCard">
<div class="money">20,000.00</div>
<div class="money">{{nationwide.income}}</div>
<div class="moneyType">
<img width="20px" height="17px" src="../../../../src/icon/carbonAssetsIncrease.svg" />
增加tCO2
@@ -34,7 +34,7 @@
</div>
<img width="17px" height="17px" src="../../../../src/icon/carbonAssetsReduce.svg" />
<div class="calculation TLCard">
<div class="money">20,000.00</div>
<div class="money">{{nationwide.expenditure}}</div>
<div class="moneyType">
<img width="20px" height="17px" src="../../../../src/icon/carbonAssetsLower.svg" />
减少tCO2
@@ -42,20 +42,24 @@
</div>
<img width="17px" height="17px" src="../../../../src/icon/carbonAssetsEqual.svg" />
<div class="calculation TLCard">
<div class="money">75,000.00</div>
<div class="money">{{nationwide.period}}</div>
<div class="moneyType">期末余额tCO2</div>
</div>
</div>
</a-card>
<a-card class="card" style="margin-bottom: 1%">
<a-card class="card" v-if="place" style="margin-bottom: 1%">
<div class="top" style="background: rgba(234, 71, 54, 0.05)">
<div class="moneyImg"
><img width="68px" height="68px" src="../../../../src/icon/carbonAssetsMoney-2.svg"
/></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)">{{place.valuation}}</div>
<div class="moneyDetail"
><img width="34px" height="34px" src="../../../../src/icon/carbonAssetsSearch-2.svg"
><img
width="34px"
height="34px"
@click="viewDetail(2)"
src="../../../../src/icon/carbonAssetsSearch-2.svg"
/></div>
</div>
<div class="title">
@@ -64,12 +68,12 @@
</div>
<div class="bottom">
<div class="calculation TRCard">
<div class="money">75,000.00</div>
<div class="money">{{place.opening}}</div>
<div class="moneyType">期初余额tCO2</div>
</div>
<img width="17px" height="17px" src="../../../../src/icon/carbonAssetsAdd.svg" />
<div class="calculation TRCard">
<div class="money">20,000.00</div>
<div class="money">{{place.income}}</div>
<div class="moneyType">
<img width="20px" height="17px" src="../../../../src/icon/carbonAssetsIncrease.svg" />
增加tCO2
@@ -77,7 +81,7 @@
</div>
<img width="17px" height="17px" src="../../../../src/icon/carbonAssetsReduce.svg" />
<div class="calculation TRCard">
<div class="money">20,000.00</div>
<div class="money">{{place.expenditure}}</div>
<div class="moneyType">
<img width="20px" height="17px" src="../../../../src/icon/carbonAssetsLower.svg" />
减少tCO2
@@ -85,20 +89,24 @@
</div>
<img width="17px" height="17px" src="../../../../src/icon/carbonAssetsEqual.svg" />
<div class="calculation TRCard">
<div class="money">75,000.00</div>
<div class="money">{{place.period}}</div>
<div class="moneyType">期末余额tCO2</div>
</div>
</div>
</a-card>
<a-card class="card" style="margin-right: 1%">
<a-card class="card" v-if="ccer" style="margin-right: 1%">
<div class="top" style="background: rgba(65, 163, 224, 0.05)">
<div class="moneyImg"
><img width="68px" height="68px" src="../../../../src/icon/carbonAssetsMoney-3.svg"
/></div>
<div class="moneyTitle">CCER资产估值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)">{{ccer.valuation}}</div>
<div class="moneyDetail"
><img width="34px" height="34px" src="../../../../src/icon/carbonAssetsSearch-3.svg"
><img
width="34px"
height="34px"
@click="viewDetail(3)"
src="../../../../src/icon/carbonAssetsSearch-3.svg"
/></div>
</div>
<div class="title">
@@ -107,12 +115,12 @@
</div>
<div class="bottom">
<div class="calculation BLCard">
<div class="money">75,000.00</div>
<div class="money">{{ccer.opening}}</div>
<div class="moneyType">期初余额tCO2</div>
</div>
<img width="17px" height="17px" src="../../../../src/icon/carbonAssetsAdd.svg" />
<div class="calculation BLCard">
<div class="money">20,000.00</div>
<div class="money">{{ccer.income}}</div>
<div class="moneyType">
<img width="20px" height="17px" src="../../../../src/icon/carbonAssetsIncrease.svg" />
增加tCO2
@@ -120,7 +128,7 @@
</div>
<img width="17px" height="17px" src="../../../../src/icon/carbonAssetsReduce.svg" />
<div class="calculation BLCard">
<div class="money">20,000.00</div>
<div class="money">{{ccer.expenditure}}</div>
<div class="moneyType">
<img width="20px" height="17px" src="../../../../src/icon/carbonAssetsLower.svg" />
减少tCO2
@@ -128,18 +136,18 @@
</div>
<img width="17px" height="17px" src="../../../../src/icon/carbonAssetsEqual.svg" />
<div class="calculation BLCard">
<div class="money">75,000.00</div>
<div class="money">{{ccer.period}}</div>
<div class="moneyType">期末余额tCO2</div>
</div>
</div>
</a-card>
<a-card class="card">
<a-card class="card" v-if="whole">
<div class="top" style="background: rgba(37, 192, 150, 0.05)">
<div class="moneyImg"
><img width="68px" height="68px" src="../../../../src/icon/carbonAssetsMoney-4.svg"
/></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)">{{whole.whole}}</div>
</div>
<div class="title" style="justify-content: center">
<img
@@ -150,38 +158,66 @@
</div>
<div class="bottom">
<div class="BRCard">
<div class="money">300,000.00</div>
<div class="money">{{whole.nationwide}}</div>
<div class="moneyType">全国碳账户资产估值</div>
</div>
<img width="17px" height="17px" src="../../../../src/icon/carbonAssetsAdd.svg" />
<div class="BRCard">
<div class="money">300,000.00</div>
<div class="money">{{whole.place}}</div>
<div class="moneyType">地方碳账户资产估值</div>
</div>
<img width="17px" height="17px" src="../../../../src/icon/carbonAssetsAdd.svg" />
<div class="BRCard">
<div class="money">300,000.00</div>
<div class="money">{{whole.ccer}}</div>
<div class="moneyType">CCER碳资产估值</div>
</div>
</div>
</a-card>
</div>
<div class="detail" v-else>
<carbonAssetsDetail @change-data="updateData" />
<carbonAssetsDetail @change-data="updateData" :parentId="parentId" />
</div>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import carbonAssetsDetail from './carbonAssetsDetail/index.vue';
import { http } from '/nerv-lib/util/http';
import { carbonAssets } from '/@/api/carbonEmissionFactorLibrary';
defineOptions({
energyType: 'carbonAssets', // 与页面路由name一致缓存才可生效
});
const orgId = ref('');
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
orgId.value = result;
const fetch = (api, params = { orgId }) => {
return http.post(api, params);
};
const homePage = ref(true);
// 点击跳转详情
const viewDetail = () => {
const parentId = ref(1);
const viewDetail = (data) => {
homePage.value = false;
parentId.value = data;
};
const queryParams = ref({
orgId: orgId.value,
year: new Date().getFullYear(),
});
const nationwide = ref()
const place = ref()
const ccer = ref()
const whole = ref()
const getData = () => {
fetch(carbonAssets.carbonAssets, queryParams.value).then((res) => {
console.log(res);
nationwide.value = res.data.nationwide
place.value = res.data.place
ccer.value = res.data.ccer
whole.value = res.data.whole
});
};
getData();
// 填报页点击返回
const updateData = (type) => {
homePage.value = type;