taskid:084 remark:'commit'
This commit is contained in:
@@ -8,6 +8,9 @@ export enum carbonEmissionFactorLibrary {
|
|||||||
getCarbonFactorTree = '/carbon-smart/api/carbon/emission/type/getCarbonFactorTree',
|
getCarbonFactorTree = '/carbon-smart/api/carbon/emission/type/getCarbonFactorTree',
|
||||||
creat = '/carbon-smart/api/carbon/emission/type/creatOrUpdate',
|
creat = '/carbon-smart/api/carbon/emission/type/creatOrUpdate',
|
||||||
delTreeNode = '/carbon-smart/api/carbon/emission/type/del',
|
delTreeNode = '/carbon-smart/api/carbon/emission/type/del',
|
||||||
|
// 单位管理
|
||||||
|
dictionaryUnitManagement = '/carbon-smart/api/carbon/emission/factor/dictionaryUnitManagement',
|
||||||
|
findOutermost = '/carbon-smart/api/carbon/emission/factor/findOutermost',
|
||||||
}
|
}
|
||||||
// 碳排管理-碳排统计接口
|
// 碳排管理-碳排统计接口
|
||||||
export enum energyConsumption {
|
export enum energyConsumption {
|
||||||
|
@@ -36,16 +36,17 @@
|
|||||||
:expanded-keys="expandedKeys"
|
:expanded-keys="expandedKeys"
|
||||||
:auto-expand-parent="autoExpandParent"
|
:auto-expand-parent="autoExpandParent"
|
||||||
@expand="onExpand">
|
@expand="onExpand">
|
||||||
<template #title="{ emissionName }">
|
<template #title="data">
|
||||||
<span v-if="emissionName && selectTreeDataValue && emissionName.indexOf(selectTreeDataValue) > -1">
|
<div class="treeRow">
|
||||||
{{ emissionName.substring(0, emissionName.indexOf(selectTreeDataValue)) }}
|
<div>
|
||||||
|
<span v-if="data.emissionName && selectTreeDataValue && data.emissionName.indexOf(selectTreeDataValue) > -1">
|
||||||
|
{{ data.emissionName.substring(0, data.emissionName.indexOf(selectTreeDataValue)) }}
|
||||||
<span style="color: #f50" >{{ selectTreeDataValue }}</span>
|
<span style="color: #f50" >{{ selectTreeDataValue }}</span>
|
||||||
{{ emissionName.substring(emissionName.indexOf(selectTreeDataValue) + selectTreeDataValue.length) }}
|
{{ data.emissionName.substring(data.emissionName.indexOf(selectTreeDataValue) + selectTreeDataValue.length) }}
|
||||||
</span>
|
</span>
|
||||||
<span v-else>{{ emissionName }}</span>
|
<span v-else>{{ data.emissionName }}</span>
|
||||||
</template>
|
</div>
|
||||||
</a-tree>
|
<a-popover placement="rightTop" trigger="focus">
|
||||||
<a-popover v-if="showOperation" placement="rightTop" trigger="focus">
|
|
||||||
<template #content>
|
<template #content>
|
||||||
<div style="display: flex;flex-direction: column;">
|
<div style="display: flex;flex-direction: column;">
|
||||||
<a-button type="text" @click="editTreeNodeData">编辑</a-button>
|
<a-button type="text" @click="editTreeNodeData">编辑</a-button>
|
||||||
@@ -55,8 +56,11 @@
|
|||||||
<a-button type="text" @click="deleteTreeNode">删除</a-button>
|
<a-button type="text" @click="deleteTreeNode">删除</a-button>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<MoreOutlined style="position: absolute;right: 0;top: 16%;font-size: 25px;cursor: pointer;" />
|
<MoreOutlined class="actionMore" />
|
||||||
</a-popover>
|
</a-popover>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</a-tree>
|
||||||
<div class="addTreeNode">
|
<div class="addTreeNode">
|
||||||
<a-button type="primary" style="width:100%;" @click="addTreeNodeData">新增</a-button>
|
<a-button type="primary" style="width:100%;" @click="addTreeNodeData">新增</a-button>
|
||||||
</div>
|
</div>
|
||||||
@@ -92,6 +96,66 @@
|
|||||||
<a-button type="primary" @click="onEdit">确定</a-button>
|
<a-button type="primary" @click="onEdit">确定</a-button>
|
||||||
</template>
|
</template>
|
||||||
</a-drawer>
|
</a-drawer>
|
||||||
|
<!-- 单位管理 -->
|
||||||
|
<a-drawer
|
||||||
|
:width="500"
|
||||||
|
:visible="unitManagement"
|
||||||
|
v-if="unitManagement"
|
||||||
|
:body-style="{ paddingBottom: '80px' }"
|
||||||
|
:footer-style="{ textAlign: 'right' }"
|
||||||
|
destroyOnClose
|
||||||
|
title="单位管理"
|
||||||
|
@close="closeUnitManag">
|
||||||
|
<div class="addButton">
|
||||||
|
<a-button type="primary">新增分组</a-button>
|
||||||
|
<a-button type="primary">新增单位</a-button>
|
||||||
|
</div>
|
||||||
|
<div class="treePart">
|
||||||
|
<div style="width: 100%;height: 7%;display: flex;justify-content: center;align-items: center;">
|
||||||
|
<a-select
|
||||||
|
ref="select"
|
||||||
|
:value="unitTreeParams.cnValue"
|
||||||
|
style="width: 96%"
|
||||||
|
placeholder="选择分组"
|
||||||
|
@change="handleChange"
|
||||||
|
>
|
||||||
|
<a-select-option v-for="(item, index) in groupData" :key="index" :value="item.cnValue">
|
||||||
|
{{ item.cnValue }}
|
||||||
|
</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</div>
|
||||||
|
<a-tree
|
||||||
|
:expandedKeys="unitExpandedKeys"
|
||||||
|
:selectedKeys="unitSelectedKeys"
|
||||||
|
:tree-data="unitTreeData"
|
||||||
|
v-if="unitTreeData && unitTreeData.length > 0"
|
||||||
|
>
|
||||||
|
<template #title="data">
|
||||||
|
<div class="treeRow">
|
||||||
|
<div>
|
||||||
|
<span>{{ data.cnValue }}</span>
|
||||||
|
</div>
|
||||||
|
<a-popover placement="rightTop" trigger="focus">
|
||||||
|
<template #content>
|
||||||
|
<div style="display: flex;flex-direction: column;">
|
||||||
|
<a-button type="text" @click="editTreeNodeData">编辑</a-button>
|
||||||
|
<a-button type="text" @click="addTreeNodeData">新增子节点</a-button>
|
||||||
|
<a-button type="text">上移</a-button>
|
||||||
|
<a-button type="text">下移</a-button>
|
||||||
|
<a-button type="text" @click="deleteTreeNode">删除</a-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<MoreOutlined class="actionMore" />
|
||||||
|
</a-popover>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</a-tree>
|
||||||
|
</div>
|
||||||
|
<template #footer>
|
||||||
|
<a-button style="margin-right: 8px" @click="closeUnitManag">取消</a-button>
|
||||||
|
<a-button type="primary" @click="onEdit">确定</a-button>
|
||||||
|
</template>
|
||||||
|
</a-drawer>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
@@ -116,6 +180,7 @@ import { log } from 'node:console';
|
|||||||
let formData = ref({});
|
let formData = ref({});
|
||||||
const formRef = ref();
|
const formRef = ref();
|
||||||
const visible = ref(false);
|
const visible = ref(false);
|
||||||
|
const unitManagement = ref(false);
|
||||||
const searchValue = ref<string>('');
|
const searchValue = ref<string>('');
|
||||||
const searchValue2 = ref<string>('');
|
const searchValue2 = ref<string>('');
|
||||||
const disabled = ref(false);
|
const disabled = ref(false);
|
||||||
@@ -428,7 +493,9 @@ import { log } from 'node:console';
|
|||||||
formData.value = {};
|
formData.value = {};
|
||||||
userAuthList.value.splice(0);
|
userAuthList.value.splice(0);
|
||||||
};
|
};
|
||||||
|
const closeUnitManag = () => {
|
||||||
|
unitManagement.value = false;
|
||||||
|
};
|
||||||
const onEdit = () => {
|
const onEdit = () => {
|
||||||
formRef.value?.triggerSubmit().then(() => {
|
formRef.value?.triggerSubmit().then(() => {
|
||||||
console.log(formData.value, 'formData.value');
|
console.log(formData.value, 'formData.value');
|
||||||
@@ -497,6 +564,20 @@ import { log } from 'node:console';
|
|||||||
api: carbonEmissionFactorLibrary.del,
|
api: carbonEmissionFactorLibrary.del,
|
||||||
dynamicParams: { ids: 'id[]' },
|
dynamicParams: { ids: 'id[]' },
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
label: '单位管理',
|
||||||
|
type: 'primary',
|
||||||
|
name: 'userAdd',
|
||||||
|
handle: () => {
|
||||||
|
unitManagement.value = true,
|
||||||
|
fetch(carbonEmissionFactorLibrary.findOutermost).then((res) => {
|
||||||
|
groupData.value = res.data
|
||||||
|
});
|
||||||
|
fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement, unitTreeParams.value).then((res) => {
|
||||||
|
unitTreeData.value = res.data
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
],
|
],
|
||||||
columns: [
|
columns: [
|
||||||
{
|
{
|
||||||
@@ -679,6 +760,22 @@ import { log } from 'node:console';
|
|||||||
// pagination: { defaultPageSize: 10 },
|
// pagination: { defaultPageSize: 10 },
|
||||||
rowKey: 'id',
|
rowKey: 'id',
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// 单位管理
|
||||||
|
const unitExpandedKeys = ref<string[]>();
|
||||||
|
const unitSelectedKeys = ref<string[]>([]);
|
||||||
|
const unitTreeParams = ref({
|
||||||
|
grp: 'MEASUREMENT_UNIT'
|
||||||
|
})
|
||||||
|
const groupData = ref([])
|
||||||
|
const unitTreeData = ref<TreeProps['treeData']>(genData);
|
||||||
|
const handleChange = (value: string) => {
|
||||||
|
unitTreeParams.value.cnValue = value
|
||||||
|
fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement, unitTreeParams.value).then((res) => {
|
||||||
|
unitTreeData.value = res.data
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.main {
|
.main {
|
||||||
@@ -696,7 +793,6 @@ import { log } from 'node:console';
|
|||||||
// box-shadow: @ns-content-box-shadow;
|
// box-shadow: @ns-content-box-shadow;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
.top{
|
.top{
|
||||||
@@ -727,4 +823,34 @@ import { log } from 'node:console';
|
|||||||
padding-bottom: 10px;
|
padding-bottom: 10px;
|
||||||
border-bottom: 1px solid #e9e9e9;
|
border-bottom: 1px solid #e9e9e9;
|
||||||
}
|
}
|
||||||
|
.treeRow {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.addButton{
|
||||||
|
width: 70%;
|
||||||
|
height: 5vh;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
}
|
||||||
|
.treePart{
|
||||||
|
width: 70%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
border: 1px solid #bfbfbf;
|
||||||
|
margin-left: 10%;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
.actionMore {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
:deep(.ant-tree-node-content-wrapper) {
|
||||||
|
&:hover {
|
||||||
|
.actionMore {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@@ -78,3 +78,45 @@ export const tableColumns = [
|
|||||||
width: 130
|
width: 130
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
export const columns = [
|
||||||
|
{
|
||||||
|
title: '序号',
|
||||||
|
customRender: (text: any) => {
|
||||||
|
return text.index + 1;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '因子值',
|
||||||
|
dataIndex: 'energyType',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '计量单位',
|
||||||
|
className: 'unit',
|
||||||
|
dataIndex: 'unit',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '更新时间',
|
||||||
|
className: 'unit',
|
||||||
|
dataIndex: 'unit',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '启用时间',
|
||||||
|
className: 'unit',
|
||||||
|
dataIndex: 'unit',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '结束时间',
|
||||||
|
className: 'unit',
|
||||||
|
dataIndex: 'unit',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '数据来源',
|
||||||
|
className: 'unit',
|
||||||
|
dataIndex: 'unit',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
key: 'action',
|
||||||
|
width: 130
|
||||||
|
},
|
||||||
|
];
|
@@ -0,0 +1,401 @@
|
|||||||
|
<!-- @format -->
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="main">
|
||||||
|
<div class="left">
|
||||||
|
<div class="top">
|
||||||
|
<a-form style="width: 100%;margin: 0 auto;">
|
||||||
|
<div class="ns-form-title"><span>排放分类</span></div>
|
||||||
|
<div style="padding: 0 16px !important;width: 100%;">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="24" style="margin-bottom: 16px;">
|
||||||
|
<a-input-search
|
||||||
|
v-model:value="selectTreeDataValue"
|
||||||
|
placeholder="请输入关键词"
|
||||||
|
@search="onSearchTreeData"
|
||||||
|
/>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</div>
|
||||||
|
</a-form>
|
||||||
|
<a-tree
|
||||||
|
v-if="gData && gData.length > 0"
|
||||||
|
class="draggable-tree"
|
||||||
|
style="padding: 0 16px !important;"
|
||||||
|
show-line
|
||||||
|
block-node
|
||||||
|
:tree-data="gData"
|
||||||
|
:checkedKeys="checkedTreeNodeKeys"
|
||||||
|
:selectedKeys="selectedKeys"
|
||||||
|
@check="checkTreeNode"
|
||||||
|
@select="onSelect"
|
||||||
|
:expanded-keys="expandedKeys"
|
||||||
|
:auto-expand-parent="autoExpandParent"
|
||||||
|
@expand="onExpand">
|
||||||
|
<template #title="{ emissionName }">
|
||||||
|
<span v-if="emissionName && selectTreeDataValue && emissionName.indexOf(selectTreeDataValue) > -1">
|
||||||
|
{{ emissionName.substring(0, emissionName.indexOf(selectTreeDataValue)) }}
|
||||||
|
<span style="color: #f50">{{ selectTreeDataValue }}</span>
|
||||||
|
{{ emissionName.substring(emissionName.indexOf(selectTreeDataValue) + selectTreeDataValue.length) }}
|
||||||
|
</span>
|
||||||
|
<span v-else>{{ emissionName }}</span>
|
||||||
|
</template>
|
||||||
|
</a-tree>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="right">
|
||||||
|
<a-table :columns="columns" :data-source="tableData" bordered :pagination="false">
|
||||||
|
<template #bodyCell="{ column, text }">
|
||||||
|
<template v-if="column.dataIndex === 'name'">
|
||||||
|
<a>{{ text }}</a>
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
<template #title>Header</template>
|
||||||
|
</a-table>
|
||||||
|
</div>
|
||||||
|
<!-- 新增树节点 -->
|
||||||
|
<ns-modal :visible="treeNodeAdd" :title="operationTree" @ok="handleOk" @cancel="handleCancel">
|
||||||
|
<ns-input
|
||||||
|
v-model:value="addTreeNode"
|
||||||
|
class="input"
|
||||||
|
placeholder="请输入排放类型"/>
|
||||||
|
</ns-modal>
|
||||||
|
<!-- 新增数据库数据 -->
|
||||||
|
<a-drawer
|
||||||
|
:width="500"
|
||||||
|
:visible="visible"
|
||||||
|
:body-style="{ paddingBottom: '80px' }"
|
||||||
|
:footer-style="{ textAlign: 'right' }"
|
||||||
|
destroyOnClose
|
||||||
|
@close="onClose">
|
||||||
|
<ns-form
|
||||||
|
ref="formRef"
|
||||||
|
:model="formData"
|
||||||
|
class="form"
|
||||||
|
:wrapperCol="{ span: 20 }"
|
||||||
|
formLayout="vertical" />
|
||||||
|
<template #footer>
|
||||||
|
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
||||||
|
<a-button type="primary" @click="onEdit">确定</a-button>
|
||||||
|
</template>
|
||||||
|
</a-drawer>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { Modal } from 'ant-design-vue';
|
||||||
|
import { computed, createVNode, defineComponent, reactive, ref, watchEffect,watch } from 'vue';
|
||||||
|
import { http } from '/nerv-lib/util/http';
|
||||||
|
import { NsMessage, NsModal } from '/nerv-lib/component';
|
||||||
|
import { carbonEmissionFactorLibrary } from '/@/api/carbonEmissionFactorLibrary';
|
||||||
|
import type {
|
||||||
|
AntTreeNodeDragEnterEvent,
|
||||||
|
AntTreeNodeDropEvent,
|
||||||
|
TreeProps,
|
||||||
|
} from 'ant-design-vue/es/tree';
|
||||||
|
import { log } from 'node:console';
|
||||||
|
|
||||||
|
defineOptions({ name: 'QuickCalculation' });
|
||||||
|
const selectTreeDataValue = ref<string>('');
|
||||||
|
const data = reactive({});
|
||||||
|
let formData = ref({});
|
||||||
|
const formRef = ref();
|
||||||
|
const visible = ref(false);
|
||||||
|
const searchValue = ref<string>('');
|
||||||
|
const searchValue2 = ref<string>('');
|
||||||
|
const disabled = ref(false);
|
||||||
|
const treeNodeAdd = ref<boolean>(false);
|
||||||
|
const operationTree = ref<string>('新增');
|
||||||
|
|
||||||
|
const opMap: any = ref({
|
||||||
|
type: 'add',
|
||||||
|
fuc: () => {},
|
||||||
|
record: {},
|
||||||
|
});
|
||||||
|
watchEffect(() => {
|
||||||
|
disabled.value = opMap.value.type === 'edit';
|
||||||
|
});
|
||||||
|
const casData = ref([]);
|
||||||
|
const treeData = ref([]);
|
||||||
|
const userAuthList = ref([]);
|
||||||
|
const orgId = ref('');
|
||||||
|
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||||
|
orgId.value = result;
|
||||||
|
const dynamicDisabled = computed(() => {
|
||||||
|
return formRef.value?.validateResult && userAuthList.value?.length;
|
||||||
|
});
|
||||||
|
const fetch = (api, params = { orgId }) => {
|
||||||
|
return http.post(api, params);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 树结构
|
||||||
|
const x = 3;
|
||||||
|
const y = 2;
|
||||||
|
const z = 1;
|
||||||
|
const genData: TreeProps['treeData'] = [];
|
||||||
|
|
||||||
|
const generateData = (_level: number, _preKey?: string, _tns?: TreeProps['treeData']) => {
|
||||||
|
const preKey = _preKey || '0';
|
||||||
|
const tns = _tns || genData;
|
||||||
|
|
||||||
|
const children = [];
|
||||||
|
for (let i = 0; i < x; i++) {
|
||||||
|
const key = `${preKey}-${i}`;
|
||||||
|
tns.push({ title: key, key });
|
||||||
|
if (i < y) {
|
||||||
|
children.push(key);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (_level < 0) {
|
||||||
|
return tns;
|
||||||
|
}
|
||||||
|
const level = _level - 1;
|
||||||
|
children.forEach((key, index) => {
|
||||||
|
tns[index].children = [];
|
||||||
|
return generateData(level, key, tns[index].children);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
generateData(z);
|
||||||
|
type TreeDataItem = TreeProps['treeData'][number];
|
||||||
|
const gData = ref<TreeProps['treeData']>(genData);
|
||||||
|
const dataList: TreeProps['treeData'] = [];
|
||||||
|
const generateList = (data: TreeProps['treeData']) => {
|
||||||
|
for (let i = 0; i < data.length; i++) {
|
||||||
|
const node = data[i];
|
||||||
|
const key = node.key;
|
||||||
|
dataList.push({ key, title: key });
|
||||||
|
if (node.children) {
|
||||||
|
generateList(node.children);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
generateList(genData);
|
||||||
|
|
||||||
|
const getParentKey = (
|
||||||
|
key: string | number,
|
||||||
|
tree: TreeProps['treeData'],
|
||||||
|
): string | number | undefined => {
|
||||||
|
let parentKey;
|
||||||
|
for (let i = 0; i < tree.length; i++) {
|
||||||
|
const node = tree[i];
|
||||||
|
if (node.children) {
|
||||||
|
if (node.children.some(item => item.key === key)) {
|
||||||
|
parentKey = node.key;
|
||||||
|
} else if (getParentKey(key, node.children)) {
|
||||||
|
parentKey = getParentKey(key, node.children);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return parentKey;
|
||||||
|
};
|
||||||
|
const expandedKeys = ref<(string | number)[]>([]);
|
||||||
|
const autoExpandParent = ref<boolean>(true);
|
||||||
|
|
||||||
|
const onExpand = (keys: string[]) => {
|
||||||
|
expandedKeys.value = keys;
|
||||||
|
autoExpandParent.value = false;
|
||||||
|
};
|
||||||
|
watch(selectTreeDataValue, value => {
|
||||||
|
const expanded = dataList
|
||||||
|
.map((item: TreeProps['treeData'][number]) => {
|
||||||
|
if (item.title.indexOf(value) > -1) {
|
||||||
|
return getParentKey(item.key, gData.value);
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
})
|
||||||
|
.filter((item, i, self) => item && self.indexOf(item) === i);
|
||||||
|
expandedKeys.value = expanded;
|
||||||
|
selectTreeDataValue.value = value;
|
||||||
|
autoExpandParent.value = true;
|
||||||
|
});
|
||||||
|
// 筛选树结构中的数据
|
||||||
|
const onSearchTreeData = (selectTreeDataValue: string) => {
|
||||||
|
console.log('use value', selectTreeDataValue);
|
||||||
|
console.log('or use this.value', value.value);
|
||||||
|
};
|
||||||
|
// 点击数据点的复选框
|
||||||
|
const checkedIds = ref([])
|
||||||
|
const emissionType = ref()
|
||||||
|
const checkTreeNode = (checkedKeys, info) => {
|
||||||
|
checkedIds.value = []
|
||||||
|
info.checkedNodes.forEach(item=>{
|
||||||
|
checkedIds.value.push(item.id)
|
||||||
|
})
|
||||||
|
sessionStorage.setItem('checkedTreeNode', checkedIds.value);
|
||||||
|
emissionType.value = checkedIds.value.join(',')
|
||||||
|
}
|
||||||
|
// 新增/编辑树节点点击确定
|
||||||
|
const addTreeNode =ref()
|
||||||
|
const handleOk = (e: MouseEvent) => {
|
||||||
|
editTreeNode.value.emissionName = addTreeNode.value
|
||||||
|
http.post(carbonEmissionFactorLibrary.creat,editTreeNode.value).then(() => {
|
||||||
|
getOrgTree()
|
||||||
|
NsMessage.success('操作成功');
|
||||||
|
addTreeNode.value = ''
|
||||||
|
treeNodeAdd.value = false;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
const handleCancel = () => {
|
||||||
|
addTreeNode.value = ''
|
||||||
|
treeNodeAdd.value = false;
|
||||||
|
};
|
||||||
|
// 获取排放分类树
|
||||||
|
const getOrgTree = (params?) => {
|
||||||
|
fetch(carbonEmissionFactorLibrary.getCarbonFactorTree, params).then((res) => {
|
||||||
|
gData.value = res.data
|
||||||
|
// 找到匹配的节点数据
|
||||||
|
const selectedNodes = [];
|
||||||
|
checkedTreeNodeKeys.value.forEach(key => {
|
||||||
|
const [parentId, childId] = key.split('-').map(Number);
|
||||||
|
if (parentId >= 0 && childId >= 0 && gData.value[parentId]?.children?.[childId]) {
|
||||||
|
selectedNodes.push(gData.value[parentId]);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
getOrgTree();
|
||||||
|
// 被选中的树节点
|
||||||
|
const editTreeNode = ref({})
|
||||||
|
const onSelect = (selectedKeys: string[], info: any) => {
|
||||||
|
if(info.selected){
|
||||||
|
editTreeNode.value = {
|
||||||
|
id:info.selectedNodes[0].id,
|
||||||
|
level:info.selectedNodes[0].level,
|
||||||
|
dataNumber:info.selectedNodes[0].dataNumber,
|
||||||
|
sortNumber:info.selectedNodes[0].sortNumber,
|
||||||
|
parentEmissionId:info.selectedNodes[0].parentEmissionId,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const onSearch = () => {
|
||||||
|
console.log(searchValue.value);
|
||||||
|
getOrgTree({ orgName: searchValue.value, orgId });
|
||||||
|
};
|
||||||
|
|
||||||
|
const tableFetch = (params) => {
|
||||||
|
console.log(params, 'sdfasfasdfasdfasdf');
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
mainRef.value?.nsTableRef.reload();
|
||||||
|
}, 100);
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleSelect = (selectedKeys: any, info: any) => {
|
||||||
|
fetch(carbonEmissionFactorLibrary.queryDeptTree, { orgId: info.node?.orgInfo.orgId }).then((res) => {
|
||||||
|
treeData2.value = res.data;
|
||||||
|
});
|
||||||
|
tableFetch({ orgId: info.node?.orgInfo.orgId });
|
||||||
|
};
|
||||||
|
const columns = [
|
||||||
|
{
|
||||||
|
title: 'Name',
|
||||||
|
dataIndex: 'name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Cash Assets',
|
||||||
|
className: 'column-money',
|
||||||
|
dataIndex: 'money',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'Address',
|
||||||
|
dataIndex: 'address',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const tableData = [
|
||||||
|
{
|
||||||
|
key: '1',
|
||||||
|
name: 'John Brown',
|
||||||
|
money: '¥300,000.00',
|
||||||
|
address: 'New York No. 1 Lake Park',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '2',
|
||||||
|
name: 'Jim Green',
|
||||||
|
money: '¥1,256,000.00',
|
||||||
|
address: 'London No. 1 Lake Park',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '3',
|
||||||
|
name: 'Joe Black',
|
||||||
|
money: '¥120,000.00',
|
||||||
|
address: 'Sidney No. 1 Lake Park',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const onClose = () => {
|
||||||
|
visible.value = false;
|
||||||
|
formData.value = {};
|
||||||
|
userAuthList.value.splice(0);
|
||||||
|
};
|
||||||
|
|
||||||
|
const onEdit = () => {
|
||||||
|
formRef.value?.triggerSubmit().then(() => {
|
||||||
|
console.log(formData.value, 'formData.value');
|
||||||
|
// if (!userAuthList.value.length) {
|
||||||
|
// NsMessage.error('请添加用户权限');
|
||||||
|
// return;
|
||||||
|
// }
|
||||||
|
|
||||||
|
opMap.value.fuc &&
|
||||||
|
opMap.value.fuc({ ...formData.value });
|
||||||
|
});
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.main {
|
||||||
|
background-color: @ns-content-bg;
|
||||||
|
display: flex;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.left {
|
||||||
|
width: 300px;
|
||||||
|
// max-height: calc(100vh - 96px);
|
||||||
|
margin-right: @ns-gap;
|
||||||
|
min-width: fit-content;
|
||||||
|
> div {
|
||||||
|
background-color: @white;
|
||||||
|
// box-shadow: @ns-content-box-shadow;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
.top{
|
||||||
|
position: relative;
|
||||||
|
.addTreeNode{
|
||||||
|
width: 100%;
|
||||||
|
padding: 16px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.right {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
::v-deep .ant-table-container{
|
||||||
|
padding: 0px 16px;
|
||||||
|
}
|
||||||
|
.top {
|
||||||
|
overflow: auto;
|
||||||
|
// height: 50%;
|
||||||
|
// border-bottom: 5px solid rgb(229, 235, 240);
|
||||||
|
// overflow-y: auto;
|
||||||
|
}
|
||||||
|
.ns-form-title{
|
||||||
|
font-weight: bold;
|
||||||
|
user-select: text;
|
||||||
|
padding: 16px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #e9e9e9;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<style scoped>
|
||||||
|
th.column-money,
|
||||||
|
td.column-money {
|
||||||
|
text-align: right !important;
|
||||||
|
}
|
||||||
|
</style>
|
@@ -1,16 +1,14 @@
|
|||||||
<!-- @format -->
|
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="main">
|
<div class="main">
|
||||||
<div class="left">
|
<div class="left">
|
||||||
<div class="top">
|
<div class="top">
|
||||||
<a-form style="width: 100%;margin: 0 auto;">
|
<a-form style="width: 100%;margin: 0 auto;">
|
||||||
<div class="ns-form-title"><span>排放分类</span></div>
|
<div class="ns-form-title"><span>因子分类</span></div>
|
||||||
<div style="padding: 0 16px !important;width: 100%;">
|
<div style="padding: 0 16px !important;width: 100%;">
|
||||||
<a-row>
|
<a-row>
|
||||||
<a-col :span="24" style="margin-bottom: 16px;">
|
<a-col :span="24" style="margin-bottom: 16px;">
|
||||||
<a-input-search
|
<a-input-search
|
||||||
v-model:value="selectTreeDataValue"
|
v-model:value="searchValue"
|
||||||
placeholder="请输入关键词"
|
placeholder="请输入关键词"
|
||||||
@search="onSearchTreeData"
|
@search="onSearchTreeData"
|
||||||
/>
|
/>
|
||||||
@@ -19,45 +17,54 @@
|
|||||||
</div>
|
</div>
|
||||||
</a-form>
|
</a-form>
|
||||||
<a-tree
|
<a-tree
|
||||||
v-if="gData && gData.length > 0"
|
|
||||||
class="draggable-tree"
|
|
||||||
style="padding: 0 16px !important;"
|
|
||||||
draggable
|
|
||||||
show-line
|
|
||||||
checkable
|
|
||||||
block-node
|
|
||||||
:tree-data="gData"
|
|
||||||
:checkedKeys="checkedTreeNodeKeys"
|
|
||||||
:selectedKeys="selectedKeys"
|
|
||||||
@dragenter="onDragEnter"
|
|
||||||
@drop="onDrop"
|
|
||||||
@check="checkTreeNode"
|
|
||||||
@select="onSelect"
|
|
||||||
:expanded-keys="expandedKeys"
|
:expanded-keys="expandedKeys"
|
||||||
:auto-expand-parent="autoExpandParent"
|
:auto-expand-parent="autoExpandParent"
|
||||||
@expand="onExpand">
|
:tree-data="gData"
|
||||||
<template #title="{ emissionName }">
|
@expand="onExpand"
|
||||||
<span v-if="emissionName && selectTreeDataValue && emissionName.indexOf(selectTreeDataValue) > -1">
|
style="padding: 0 16px !important;"
|
||||||
{{ emissionName.substring(0, emissionName.indexOf(selectTreeDataValue)) }}
|
>
|
||||||
<span style="color: #f50">{{ selectTreeDataValue }}</span>
|
<template #title="{ title }">
|
||||||
{{ emissionName.substring(emissionName.indexOf(selectTreeDataValue) + selectTreeDataValue.length) }}
|
<span v-if="title.indexOf(searchValue) > -1">
|
||||||
|
{{ title.substring(0, title.indexOf(searchValue)) }}
|
||||||
|
<span style="color: #f50">{{ searchValue }}</span>
|
||||||
|
{{ title.substring(title.indexOf(searchValue) + searchValue.length) }}
|
||||||
</span>
|
</span>
|
||||||
<span v-else>{{ emissionName }}</span>
|
<span v-else>{{ title }}</span>
|
||||||
</template>
|
</template>
|
||||||
</a-tree>
|
</a-tree>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
<div class="right">
|
||||||
<ns-view-list-table v-bind="tableConfig" :model="data" ref="mainRef" :scroll="{ x: 2000}"/>
|
<a-table
|
||||||
|
:columns="columns"
|
||||||
|
:data-source="tableData"
|
||||||
|
bordered
|
||||||
|
:pagination="false">
|
||||||
|
<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>
|
||||||
|
<template #title>
|
||||||
|
<div class="ns-table-title"><span>排放因子库</span></div>
|
||||||
|
<div class="buttonGroup">
|
||||||
|
<a-button type="primary" @click="addNewData">新增</a-button>
|
||||||
</div>
|
</div>
|
||||||
<!-- 新增树节点 -->
|
</template>
|
||||||
<ns-modal :visible="treeNodeAdd" :title="operationTree" @ok="handleOk" @cancel="handleCancel">
|
</a-table>
|
||||||
<ns-input
|
<a-pagination
|
||||||
v-model:value="addTreeNode"
|
:current="queryParams.pageNum"
|
||||||
class="input"
|
:total="total"
|
||||||
placeholder="请输入排放类型"/>
|
:page-size="queryParams.pageSize"
|
||||||
</ns-modal>
|
style="display: flex;justify-content: center;margin-top: 16px;"
|
||||||
<!-- 新增数据库数据 -->
|
:show-size-changer="true"
|
||||||
|
:show-quick-jumper="true"
|
||||||
|
@change="onChange" />
|
||||||
|
<!-- 新增/编辑 -->
|
||||||
<a-drawer
|
<a-drawer
|
||||||
:width="500"
|
:width="500"
|
||||||
:visible="visible"
|
:visible="visible"
|
||||||
@@ -65,72 +72,74 @@
|
|||||||
:footer-style="{ textAlign: 'right' }"
|
:footer-style="{ textAlign: 'right' }"
|
||||||
destroyOnClose
|
destroyOnClose
|
||||||
@close="onClose">
|
@close="onClose">
|
||||||
<ns-form
|
<a-form
|
||||||
ref="formRef"
|
ref="formRef"
|
||||||
:model="formData"
|
:model="formState"
|
||||||
class="form"
|
:rules="rules"
|
||||||
:wrapperCol="{ span: 20 }"
|
:label-col="labelCol"
|
||||||
formLayout="vertical" />
|
:wrapper-col="wrapperCol"
|
||||||
|
>
|
||||||
|
<a-form-item ref="name" label="能源种类" name="energyType">
|
||||||
|
<a-input v-model:value="formState.energyType" placeholder="请输入能源种类" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="计量单位" name="unit">
|
||||||
|
<a-cascader v-model:value="formState.unit" :options="options" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="自动采集节点" name="collectionNode">
|
||||||
|
<a-tree-select
|
||||||
|
v-model:value="formState.collectionNode"
|
||||||
|
:tree-line="true"
|
||||||
|
:tree-data="treeData"
|
||||||
|
tree-node-filter-prop="title"
|
||||||
|
>
|
||||||
|
</a-tree-select>
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="计算碳排" name="isComputeCarbon">
|
||||||
|
<a-radio-group v-model:value="formState.isComputeCarbon" @change="changeRadio">
|
||||||
|
<a-radio :value="0">是</a-radio>
|
||||||
|
<a-radio :value="1">否</a-radio>
|
||||||
|
</a-radio-group>
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="排放类型" name="emissionType">
|
||||||
|
<a-select v-model:value="formState.emissionType" placeholder="请选择排放类型">
|
||||||
|
<a-select-option v-for="(item, index) in emissionTypeDic" :key="index" :value="item.cnValue">
|
||||||
|
{{ item.cnValue }}
|
||||||
|
</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-form-item>
|
||||||
|
</a-form>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
||||||
<a-button type="primary" @click="onEdit">确定</a-button>
|
<a-button type="primary" @click="onSubmit">确定</a-button>
|
||||||
</template>
|
</template>
|
||||||
</a-drawer>
|
</a-drawer>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { Modal } from 'ant-design-vue';
|
import { ref, watch } from 'vue';
|
||||||
import { computed, createVNode, defineComponent, reactive, ref, watchEffect,watch } from 'vue';
|
import type { TreeProps } from 'ant-design-vue';
|
||||||
|
import { Pagination } from 'ant-design-vue';
|
||||||
|
import { columns } from '../config';
|
||||||
import { http } from '/nerv-lib/util/http';
|
import { http } from '/nerv-lib/util/http';
|
||||||
import { NsMessage, NsModal } from '/nerv-lib/component';
|
defineOptions({
|
||||||
import { carbonEmissionFactorLibrary } from '/@/api/carbonEmissionFactorLibrary';
|
energyType: 'quickCalculation', // 与页面路由name一致缓存才可生效
|
||||||
import type {
|
components: {
|
||||||
AntTreeNodeDragEnterEvent,
|
'a-pagination': Pagination,
|
||||||
AntTreeNodeDropEvent,
|
},
|
||||||
TreeProps,
|
|
||||||
} from 'ant-design-vue/es/tree';
|
|
||||||
import { log } from 'node:console';
|
|
||||||
|
|
||||||
defineOptions({ name: 'QuickCalculation' });
|
|
||||||
const selectTreeDataValue = ref<string>('');
|
|
||||||
const mainRef = ref();
|
|
||||||
const data = reactive({});
|
|
||||||
let formData = ref({});
|
|
||||||
const formRef = ref();
|
|
||||||
const visible = ref(false);
|
|
||||||
const searchValue = ref<string>('');
|
|
||||||
const searchValue2 = ref<string>('');
|
|
||||||
const disabled = ref(false);
|
|
||||||
const treeNodeAdd = ref<boolean>(false);
|
|
||||||
const operationTree = ref<string>('新增');
|
|
||||||
|
|
||||||
const opMap: any = ref({
|
|
||||||
type: 'add',
|
|
||||||
fuc: () => {},
|
|
||||||
record: {},
|
|
||||||
});
|
});
|
||||||
watchEffect(() => {
|
|
||||||
disabled.value = opMap.value.type === 'edit';
|
|
||||||
});
|
|
||||||
const casData = ref([]);
|
|
||||||
const treeData = ref([]);
|
|
||||||
const userAuthList = ref([]);
|
|
||||||
const orgId = ref('');
|
const orgId = ref('');
|
||||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||||
orgId.value = result;
|
orgId.value = result;
|
||||||
const dynamicDisabled = computed(() => {
|
|
||||||
return formRef.value?.validateResult && userAuthList.value?.length;
|
|
||||||
});
|
|
||||||
const fetch = (api, params = { orgId } ) => {
|
const fetch = (api, params = { orgId } ) => {
|
||||||
return http.post(api, params);
|
return http.post(api, params);
|
||||||
};
|
};
|
||||||
|
// 数结构
|
||||||
// 树结构
|
|
||||||
const x = 3;
|
const x = 3;
|
||||||
const y = 2;
|
const y = 2;
|
||||||
const z = 1;
|
const z = 1;
|
||||||
const genData: TreeProps['treeData'] = [];
|
const genData: TreeProps['treeData'] = [];
|
||||||
const checkedTreeNodeKeys = ref<string[]>(['0-0']);
|
|
||||||
|
|
||||||
const generateData = (_level: number, _preKey?: string, _tns?: TreeProps['treeData']) => {
|
const generateData = (_level: number, _preKey?: string, _tns?: TreeProps['treeData']) => {
|
||||||
const preKey = _preKey || '0';
|
const preKey = _preKey || '0';
|
||||||
@@ -154,70 +163,7 @@ import { log } from 'node:console';
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
generateData(z);
|
generateData(z);
|
||||||
type TreeDataItem = TreeProps['treeData'][number];
|
|
||||||
const gData = ref<TreeProps['treeData']>(genData);
|
|
||||||
const onDragEnter = (info: AntTreeNodeDragEnterEvent) => {
|
|
||||||
console.log(info);
|
|
||||||
// expandedKeys 需要展开时
|
|
||||||
// expandedKeys.value = info.expandedKeys;
|
|
||||||
};
|
|
||||||
|
|
||||||
const onDrop = (info: AntTreeNodeDropEvent) => {
|
|
||||||
console.log(info);
|
|
||||||
const dropKey = info.node.key;
|
|
||||||
const dragKey = info.dragNode.key;
|
|
||||||
const dropPos = info.node.pos.split('-');
|
|
||||||
const dropPosition = info.dropPosition - Number(dropPos[dropPos.length - 1]);
|
|
||||||
const loop = (data: TreeProps['treeData'], key: string | number, callback: any) => {
|
|
||||||
data.forEach((item, index) => {
|
|
||||||
if (item.key === key) {
|
|
||||||
return callback(item, index, data);
|
|
||||||
}
|
|
||||||
if (item.children) {
|
|
||||||
return loop(item.children, key, callback);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const data = [...gData.value];
|
|
||||||
|
|
||||||
// Find dragObject
|
|
||||||
let dragObj: TreeDataItem;
|
|
||||||
loop(data, dragKey, (item: TreeDataItem, index: number, arr: TreeProps['treeData']) => {
|
|
||||||
arr.splice(index, 1);
|
|
||||||
dragObj = item;
|
|
||||||
});
|
|
||||||
if (!info.dropToGap) {
|
|
||||||
// Drop on the content
|
|
||||||
loop(data, dropKey, (item: TreeDataItem) => {
|
|
||||||
item.children = item.children || [];
|
|
||||||
/// where to insert 示例添加到头部,可以是随意位置
|
|
||||||
item.children.unshift(dragObj);
|
|
||||||
});
|
|
||||||
} else if (
|
|
||||||
(info.node.children || []).length > 0 && // Has children
|
|
||||||
info.node.expanded && // Is expanded
|
|
||||||
dropPosition === 1 // On the bottom gap
|
|
||||||
) {
|
|
||||||
loop(data, dropKey, (item: TreeDataItem) => {
|
|
||||||
item.children = item.children || [];
|
|
||||||
// where to insert 示例添加到头部,可以是随意位置
|
|
||||||
item.children.unshift(dragObj);
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
let ar: TreeProps['treeData'] = [];
|
|
||||||
let i = 0;
|
|
||||||
loop(data, dropKey, (_item: TreeDataItem, index: number, arr: TreeProps['treeData']) => {
|
|
||||||
ar = arr;
|
|
||||||
i = index;
|
|
||||||
});
|
|
||||||
if (dropPosition === -1) {
|
|
||||||
ar.splice(i, 0, dragObj);
|
|
||||||
} else {
|
|
||||||
ar.splice(i + 1, 0, dragObj);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
gData.value = data;
|
|
||||||
};
|
|
||||||
const dataList: TreeProps['treeData'] = [];
|
const dataList: TreeProps['treeData'] = [];
|
||||||
const generateList = (data: TreeProps['treeData']) => {
|
const generateList = (data: TreeProps['treeData']) => {
|
||||||
for (let i = 0; i < data.length; i++) {
|
for (let i = 0; i < data.length; i++) {
|
||||||
@@ -249,13 +195,16 @@ import { log } from 'node:console';
|
|||||||
return parentKey;
|
return parentKey;
|
||||||
};
|
};
|
||||||
const expandedKeys = ref<(string | number)[]>([]);
|
const expandedKeys = ref<(string | number)[]>([]);
|
||||||
|
const searchValue = ref<string>('');
|
||||||
const autoExpandParent = ref<boolean>(true);
|
const autoExpandParent = ref<boolean>(true);
|
||||||
|
const gData = ref<TreeProps['treeData']>(genData);
|
||||||
|
|
||||||
const onExpand = (keys: string[]) => {
|
const onExpand = (keys: string[]) => {
|
||||||
expandedKeys.value = keys;
|
expandedKeys.value = keys;
|
||||||
autoExpandParent.value = false;
|
autoExpandParent.value = false;
|
||||||
};
|
};
|
||||||
watch(selectTreeDataValue, value => {
|
|
||||||
|
watch(searchValue, value => {
|
||||||
const expanded = dataList
|
const expanded = dataList
|
||||||
.map((item: TreeProps['treeData'][number]) => {
|
.map((item: TreeProps['treeData'][number]) => {
|
||||||
if (item.title.indexOf(value) > -1) {
|
if (item.title.indexOf(value) > -1) {
|
||||||
@@ -265,273 +214,64 @@ import { log } from 'node:console';
|
|||||||
})
|
})
|
||||||
.filter((item, i, self) => item && self.indexOf(item) === i);
|
.filter((item, i, self) => item && self.indexOf(item) === i);
|
||||||
expandedKeys.value = expanded;
|
expandedKeys.value = expanded;
|
||||||
selectTreeDataValue.value = value;
|
searchValue.value = value;
|
||||||
autoExpandParent.value = true;
|
autoExpandParent.value = true;
|
||||||
});
|
});
|
||||||
// 筛选树结构中的数据
|
// 列表数据
|
||||||
const onSearchTreeData = (selectTreeDataValue: string) => {
|
const total = ref<number>()
|
||||||
console.log('use value', selectTreeDataValue);
|
const queryParams = ref({
|
||||||
console.log('or use this.value', value.value);
|
pageNum: 1,
|
||||||
};
|
pageSize: 10,
|
||||||
// 点击数据点的复选框
|
|
||||||
const checkedIds = ref([])
|
|
||||||
const emissionType = ref()
|
|
||||||
const checkTreeNode = (checkedKeys, info) => {
|
|
||||||
checkedTreeNodeKeys.value = checkedKeys
|
|
||||||
checkedIds.value = []
|
|
||||||
info.checkedNodes.forEach(item=>{
|
|
||||||
checkedIds.value.push(item.id)
|
|
||||||
})
|
})
|
||||||
sessionStorage.setItem('checkedTreeNode', checkedIds.value);
|
const tableData = [
|
||||||
emissionType.value = checkedIds.value.join(',')
|
{
|
||||||
mainRef.value?.nsTableRef.reload();
|
key: '1',
|
||||||
}
|
name: 'John Brown',
|
||||||
// 新增/编辑树节点点击确定
|
money: '¥300,000.00',
|
||||||
const addTreeNode =ref()
|
address: 'New York No. 1 Lake Park',
|
||||||
const handleOk = (e: MouseEvent) => {
|
},
|
||||||
editTreeNode.value.emissionName = addTreeNode.value
|
{
|
||||||
http.post(carbonEmissionFactorLibrary.creat,editTreeNode.value).then(() => {
|
key: '2',
|
||||||
getOrgTree()
|
name: 'Jim Green',
|
||||||
NsMessage.success('操作成功');
|
money: '¥1,256,000.00',
|
||||||
addTreeNode.value = ''
|
address: 'London No. 1 Lake Park',
|
||||||
treeNodeAdd.value = false;
|
},
|
||||||
});
|
{
|
||||||
};
|
key: '3',
|
||||||
const handleCancel = () => {
|
name: 'Joe Black',
|
||||||
addTreeNode.value = ''
|
money: '¥120,000.00',
|
||||||
treeNodeAdd.value = false;
|
address: 'Sidney No. 1 Lake Park',
|
||||||
};
|
},
|
||||||
// 获取排放分类树
|
];
|
||||||
const getOrgTree = (params?) => {
|
// 分页器
|
||||||
fetch(carbonEmissionFactorLibrary.getCarbonFactorTree, params).then((res) => {
|
const onChange = (pageNumber: number,size: number) => {
|
||||||
gData.value = res.data
|
queryParams.value.pageNum = pageNumber;
|
||||||
// 找到匹配的节点数据
|
queryParams.value.pageSize = size;
|
||||||
const selectedNodes = [];
|
// getTableList()
|
||||||
checkedTreeNodeKeys.value.forEach(key => {
|
|
||||||
const [parentId, childId] = key.split('-').map(Number);
|
|
||||||
if (parentId >= 0 && childId >= 0 && gData.value[parentId]?.children?.[childId]) {
|
|
||||||
selectedNodes.push(gData.value[parentId]);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
// 获取默认选中节点的所有id
|
|
||||||
getDefaultIds(selectedNodes)
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const defaultIds = ref([])
|
|
||||||
const getDefaultIds = (selectedNodes) => {
|
|
||||||
selectedNodes.forEach(items => {
|
|
||||||
defaultIds.value.push(items.id)
|
|
||||||
if(items.children){
|
|
||||||
getDefaultIds(items.children)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
emissionType.value = defaultIds.value.join(',')
|
|
||||||
checkedIds.value = defaultIds.value
|
|
||||||
sessionStorage.setItem('checkedTreeNode', checkedIds.value);
|
|
||||||
}
|
|
||||||
getOrgTree();
|
|
||||||
// 被选中的树节点
|
|
||||||
const editTreeNode = ref({})
|
|
||||||
const onSelect = (selectedKeys: string[], info: any) => {
|
|
||||||
if(info.selected){
|
|
||||||
editTreeNode.value = {
|
|
||||||
id:info.selectedNodes[0].id,
|
|
||||||
level:info.selectedNodes[0].level,
|
|
||||||
dataNumber:info.selectedNodes[0].dataNumber,
|
|
||||||
sortNumber:info.selectedNodes[0].sortNumber,
|
|
||||||
parentEmissionId:info.selectedNodes[0].parentEmissionId,
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
// 新增/编辑
|
||||||
|
const formRef = ref();
|
||||||
|
const labelCol = { span: 5 };
|
||||||
|
const wrapperCol = { span: 19 };
|
||||||
|
const formState = ref({})
|
||||||
|
const visible = ref(false);
|
||||||
|
|
||||||
const onSearch = () => {
|
// 定义form表单的必填
|
||||||
console.log(searchValue.value);
|
const rules: Record<string, Rule[]> = {
|
||||||
getOrgTree({ orgName: searchValue.value, orgId });
|
energyType: [{ required: true, message: '请输入能源种类', trigger: 'change' }],
|
||||||
|
isComputeCarbon: [{ required: true, message: '请选择是否计算碳排', trigger: 'change' }]
|
||||||
};
|
};
|
||||||
|
// 点击编辑按钮
|
||||||
const tableFetch = (params) => {
|
const editData = (record) =>{
|
||||||
console.log(params, 'sdfasfasdfasdfasdf');
|
visible.value = true
|
||||||
|
|
||||||
tableConfig.value.params = {
|
|
||||||
...mainRef.value.params,
|
|
||||||
...params,
|
|
||||||
};
|
};
|
||||||
|
// 关闭新增抽屉
|
||||||
setTimeout(() => {
|
|
||||||
mainRef.value?.nsTableRef.reload();
|
|
||||||
}, 100);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleSelect = (selectedKeys: any, info: any) => {
|
|
||||||
fetch(carbonEmissionFactorLibrary.queryDeptTree, { orgId: info.node?.orgInfo.orgId }).then((res) => {
|
|
||||||
treeData2.value = res.data;
|
|
||||||
});
|
|
||||||
tableFetch({ orgId: info.node?.orgInfo.orgId });
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
const onClose = () => {
|
const onClose = () => {
|
||||||
visible.value = false;
|
visible.value = false;
|
||||||
formData.value = {};
|
formRef.value.resetFields();
|
||||||
userAuthList.value.splice(0);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const onEdit = () => {
|
|
||||||
formRef.value?.triggerSubmit().then(() => {
|
|
||||||
console.log(formData.value, 'formData.value');
|
|
||||||
// if (!userAuthList.value.length) {
|
|
||||||
// NsMessage.error('请添加用户权限');
|
|
||||||
// return;
|
|
||||||
// }
|
|
||||||
|
|
||||||
opMap.value.fuc &&
|
|
||||||
opMap.value.fuc({ ...formData.value });
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const tableConfig = ref({
|
|
||||||
title: '数据库',
|
|
||||||
api: carbonEmissionFactorLibrary.getTableList,
|
|
||||||
params: {
|
|
||||||
orgId,
|
|
||||||
emissionType
|
|
||||||
},
|
|
||||||
headerActions: [
|
|
||||||
{
|
|
||||||
label: '新增',
|
|
||||||
name: 'userAdd',
|
|
||||||
type: 'primary',
|
|
||||||
handle: () => {
|
|
||||||
opMap.value.type = 'add';
|
|
||||||
setTimeout(() => {
|
|
||||||
formData.value = {
|
|
||||||
carbonEmissionPrefix:'t',
|
|
||||||
numberOfReferences:'10'
|
|
||||||
};
|
|
||||||
userAuthList.value.splice(0);
|
|
||||||
});
|
|
||||||
opMap.value.fuc = (formData: any) => {
|
|
||||||
formData.emissionType = formData.emissionType[formData.emissionType.length - 1]
|
|
||||||
return http.post(carbonEmissionFactorLibrary.creatOrUpdate, formData).then(() => {
|
|
||||||
mainRef.value?.nsTableRef.reload();
|
|
||||||
visible.value = false;
|
|
||||||
NsMessage.success('操作成功');
|
|
||||||
});
|
|
||||||
};
|
|
||||||
visible.value = true;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '导入',
|
|
||||||
type: 'primary',
|
|
||||||
name: 'userImport',
|
|
||||||
handle: () => {},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '导出',
|
|
||||||
type: 'primary',
|
|
||||||
name: 'userExports',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '批量删除',
|
|
||||||
type: 'primary',
|
|
||||||
name: 'userBatchDel',
|
|
||||||
dynamicDisabled: (data: any) => {
|
|
||||||
return data.list.length === 0;
|
|
||||||
},
|
|
||||||
confirm: true,
|
|
||||||
isReload: true,
|
|
||||||
isClearCheck: true,
|
|
||||||
api: carbonEmissionFactorLibrary.del,
|
|
||||||
dynamicParams: { ids: 'id[]' },
|
|
||||||
},
|
|
||||||
],
|
|
||||||
columns: [
|
|
||||||
{
|
|
||||||
title: 'id',
|
|
||||||
customRender: (text: any) => {
|
|
||||||
return text.index + 1;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '排放源',
|
|
||||||
dataIndex: 'emissionSources',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '排放类型',
|
|
||||||
dataIndex: 'emissionTypeColumn',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '排放气体',
|
|
||||||
dataIndex: 'emissionGas',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '排放环节',
|
|
||||||
dataIndex: 'emissionProcess',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '排放因子',
|
|
||||||
dataIndex: 'emissionFactors',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '排放因子单位',
|
|
||||||
dataIndex: 'emissionFactorUnits',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '数据来源',
|
|
||||||
dataIndex: 'dataSources',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '数据库',
|
|
||||||
dataIndex: 'carbonDatabase',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '参考文献',
|
|
||||||
dataIndex: 'reference',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '引用数量',
|
|
||||||
dataIndex: 'numberOfReferences',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
columnActions: {
|
|
||||||
title: '操作',
|
|
||||||
actions: [
|
|
||||||
{
|
|
||||||
label: '编辑',
|
|
||||||
name: 'userEdit',
|
|
||||||
handle: (record: any) => {
|
|
||||||
userAuthList.value.splice(0);
|
|
||||||
setTimeout(() => {
|
|
||||||
console.log(record.id);
|
|
||||||
|
|
||||||
http.post(carbonEmissionFactorLibrary.findById,{ id: record.id } ).then((res) => {
|
|
||||||
formData.value = res.data;
|
|
||||||
});
|
|
||||||
}, 10);
|
|
||||||
opMap.value.type = 'edit';
|
|
||||||
opMap.value.fuc = (formData: any) => {
|
|
||||||
return http.post(carbonEmissionFactorLibrary.creatOrUpdate, formData).then(() => {
|
|
||||||
mainRef.value?.nsTableRef.reload();
|
|
||||||
visible.value = false;
|
|
||||||
NsMessage.success('操作成功');
|
|
||||||
});
|
|
||||||
};
|
|
||||||
visible.value = true;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: '删除',
|
|
||||||
name: 'userDelete',
|
|
||||||
dynamicParams: { ids: 'id[]' },
|
|
||||||
confirm: true,
|
|
||||||
isReload: true,
|
|
||||||
api: carbonEmissionFactorLibrary.del,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
rowKey: 'id',
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.main {
|
.main {
|
||||||
background-color: @ns-content-bg;
|
background-color: @ns-content-bg;
|
||||||
@@ -540,13 +280,10 @@ import { log } from 'node:console';
|
|||||||
}
|
}
|
||||||
.left {
|
.left {
|
||||||
width: 300px;
|
width: 300px;
|
||||||
// max-height: calc(100vh - 96px);
|
|
||||||
margin-right: @ns-gap;
|
margin-right: @ns-gap;
|
||||||
min-width: fit-content;
|
min-width: fit-content;
|
||||||
> div {
|
> div {
|
||||||
border-radius: @ns-border-radius;
|
|
||||||
background-color: @white;
|
background-color: @white;
|
||||||
// box-shadow: @ns-content-box-shadow;
|
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -565,12 +302,14 @@ import { log } from 'node:console';
|
|||||||
.right {
|
.right {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
|
height: 100%;
|
||||||
|
background: #ffffff;
|
||||||
|
}
|
||||||
|
::v-deep .ant-table-container{
|
||||||
|
padding: 0px 16px;
|
||||||
}
|
}
|
||||||
.top {
|
.top {
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
// height: 50%;
|
|
||||||
// border-bottom: 5px solid rgb(229, 235, 240);
|
|
||||||
// overflow-y: auto;
|
|
||||||
}
|
}
|
||||||
.ns-form-title{
|
.ns-form-title{
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
@@ -580,4 +319,24 @@ import { log } from 'node:console';
|
|||||||
padding-bottom: 10px;
|
padding-bottom: 10px;
|
||||||
border-bottom: 1px solid #e9e9e9;
|
border-bottom: 1px solid #e9e9e9;
|
||||||
}
|
}
|
||||||
|
::v-deep .ant-table-title{
|
||||||
|
display: flex;
|
||||||
|
height: 100%;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.ns-table-title{
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.buttonGroup{
|
||||||
|
margin-left: 1vw;
|
||||||
|
width: 5vw;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<style scoped>
|
||||||
|
th.column-money,
|
||||||
|
td.column-money {
|
||||||
|
text-align: right !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
Reference in New Issue
Block a user