Merge branch 'temp' of http://123.60.103.97:3000/xuziqiang/SaaS-lib into temp
This commit is contained in:
fks-yangshouda
@@ -51,10 +51,17 @@
|
||||
<a-card>
|
||||
<div class="ns-form-title">
|
||||
<div class="title">交易明细</div>
|
||||
<div class="operation">
|
||||
<div class="operation" style="display: flex">
|
||||
<a-button type="primary" @click="addDetail">新增</a-button>
|
||||
<a-button type="primary" style="margin-left: 6px">导入</a-button>
|
||||
<a-button type="primary" style="margin-left: 6px">导出</a-button>
|
||||
<a-upload
|
||||
v-model:file-list="importFileList"
|
||||
name="file"
|
||||
accept=".xlsx"
|
||||
:showUploadList="false"
|
||||
:custom-request="importFile">
|
||||
<a-button type="primary" style="margin-left: 6px">导入</a-button>
|
||||
</a-upload>
|
||||
<a-button type="primary" style="margin-left: 6px" @click="exportFile">导出</a-button>
|
||||
<a-button
|
||||
type="primary"
|
||||
style="margin-left: 6px"
|
||||
@@ -196,8 +203,8 @@
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const fetch = (api, params = { orgId }) => {
|
||||
return http.post(api, params);
|
||||
const fetch = (api, params = { orgId }, config) => {
|
||||
return http.post(api, params, config);
|
||||
};
|
||||
// 详情部分变量
|
||||
const selectedRowKeys = ref([]);
|
||||
@@ -400,6 +407,52 @@
|
||||
visible.value = true;
|
||||
getDictList();
|
||||
};
|
||||
const importFileList = ref<UploadProps['fileList']>([]);
|
||||
const importFile = (options: UploadRequestOption) => {
|
||||
const { file, onSuccess, onError } = options;
|
||||
const formData = ref(new FormData());
|
||||
formData.value.append('file', file as any);
|
||||
formData.value.append('orgId', orgId.value);
|
||||
formData.value.append('year', queryParams.value.year);
|
||||
fetch(carbonAssets.import, formData.value)
|
||||
.then((res) => {
|
||||
message.success('操作成功！');
|
||||
getDetailList();
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('error', error);
|
||||
});
|
||||
};
|
||||
const exportFile = () => {
|
||||
const exportQuery = ref({
|
||||
orgId: orgId.value,
|
||||
pageNum: 1,
|
||||
pageSize: 999,
|
||||
year: queryParams.value.year,
|
||||
ids: selectedRowKeys.value,
|
||||
});
|
||||
const config = {
|
||||
responseType: 'blob',
|
||||
};
|
||||
fetch(carbonAssets.export, exportQuery.value, config)
|
||||
.then((res) => {
|
||||
// 创建一个 URL 对象，指向图片数据的 blob
|
||||
const url = window.URL.createObjectURL(new Blob([res]));
|
||||
// 创建一个 <a> 标签，用于触发下载
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.setAttribute('download', 'carbonTradeDetails.xlsx'); // 设置下载的文件名
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
|
||||
// 清理 URL 对象
|
||||
window.URL.revokeObjectURL(url);
|
||||
selectedRowKeys.value = []
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('下载失败：', error);
|
||||
});
|
||||
};
|
||||
// 上传附件
|
||||
const fileList = ref<UploadProps['fileList']>([]);
|
||||
const beforeUpload: UploadProps['beforeUpload'] = (file) => {
|
||||
|
||||
@@ -429,7 +429,7 @@
|
||||
};
|
||||
// 点击数据点的复选框
|
||||
const checkedIds = ref([]);
|
||||
const emissionType = ref();
|
||||
const emissionList = ref([]);
|
||||
const checkTreeNode = (checkedKeys, info) => {
|
||||
checkedTreeNodeKeys.value = checkedKeys;
|
||||
checkedIds.value = [];
|
||||
@@ -437,7 +437,7 @@
|
||||
checkedIds.value.push(item.id);
|
||||
});
|
||||
sessionStorage.setItem('checkedTreeNode', checkedIds.value);
|
||||
emissionType.value = checkedIds.value.join(',');
|
||||
emissionList.value = checkedIds.value;
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
};
|
||||
// 点击新增树节点
|
||||
@@ -522,7 +522,7 @@
|
||||
getDefaultIds(items.children);
|
||||
}
|
||||
});
|
||||
emissionType.value = defaultIds.value.join(',');
|
||||
emissionList.value = defaultIds.value.join(',');
|
||||
checkedIds.value = defaultIds.value;
|
||||
sessionStorage.setItem('checkedTreeNode', checkedIds.value);
|
||||
};
|
||||
@@ -609,7 +609,7 @@
|
||||
api: carbonEmissionFactorLibrary.getTableList,
|
||||
params: {
|
||||
orgId,
|
||||
emissionType,
|
||||
emissionList,
|
||||
},
|
||||
headerActions: [
|
||||
{
|
||||
@@ -661,10 +661,12 @@
|
||||
label: '导出',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
// console.log( mainRef.value.nsTableRef.tableState.selectedRowKeys)
|
||||
const exportQuery = {
|
||||
orgId: orgId.value,
|
||||
pageNum: 1,
|
||||
pageSize: 999,
|
||||
ids: mainRef.value.nsTableRef.tableState.selectedRowKeys,
|
||||
};
|
||||
const config = {
|
||||
responseType: 'blob',
|
||||
@@ -682,6 +684,7 @@
|
||||
|
||||
// 清理 URL 对象
|
||||
window.URL.revokeObjectURL(url);
|
||||
mainRef.value.nsTableRef.tableState.selectedRowKeys = [];
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('下载失败：', error);
|
||||
|
||||
@@ -1,952 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- <a-table
|
||||
:columns="tableColumns"
|
||||
:data-source="data"
|
||||
bordered
|
||||
:pagination="false"
|
||||
:scroll="{ x: 2000 }">
|
||||
<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>
|
||||
<a-date-picker v-model:value="selectYear" picker="year" @change="changeYearData" valueFormat="YYYY" />
|
||||
<div class="buttonGroup">
|
||||
<a-button type="primary" @click="addNewData">新增</a-button>
|
||||
<a-button type="primary">导入</a-button>
|
||||
<a-button type="primary">导出</a-button>
|
||||
<a-button type="primary">模板下载</a-button>
|
||||
<a-button type="primary" @click="uploadVoucher">上传凭证</a-button>
|
||||
<a-button type="primary">凭证下载</a-button>
|
||||
</div>
|
||||
</template>
|
||||
</a-table> -->
|
||||
<ns-view-list-table
|
||||
v-bind="tableConfig"
|
||||
:model="data"
|
||||
ref="mainRef"
|
||||
:scroll="{ x: 1500, y: 350 }">
|
||||
<!-- <template #bodyCell="{ column, text, record }">
|
||||
<template v-if="column.dataIndex === 'janFlag'">
|
||||
<span v-if="record.janFlag===1" style="color: rgba(243, 97, 99, 1);">{{text}}</span>
|
||||
<span v-else style="color: rgba(57, 215, 287, 1);">{{text}}</span>
|
||||
</template>
|
||||
</template> -->
|
||||
</ns-view-list-table>
|
||||
<!-- <a-pagination
|
||||
:current="queryParams.pageNum"
|
||||
:total="total"
|
||||
:page-size="queryParams.pageSize"
|
||||
style="display: flex;justify-content: center;margin-top: 16px;"
|
||||
:show-size-changer="true"
|
||||
:show-quick-jumper="true"
|
||||
@change="onChange" /> -->
|
||||
<!-- 新增数据库数据 -->
|
||||
<a-drawer
|
||||
:width="500"
|
||||
:visible="visible"
|
||||
:body-style="{ paddingBottom: '80px' }"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
destroyOnClose
|
||||
@close="onClose">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="formState"
|
||||
:rules="rules"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol">
|
||||
<a-form-item ref="name" label="能耗名称" name="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="measurementUnit" />
|
||||
</a-form-item>
|
||||
<a-form-item label="能耗类型" name="emissionType" :required="isRequired">
|
||||
<a-select v-model:value="formState.emissionType" 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-form-item label="自动采集节点" name="collectionNode">
|
||||
<a-tree-select
|
||||
v-model:value="formState.collectionNode"
|
||||
:tree-line="true"
|
||||
:tree-data="treeData">
|
||||
</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" :required="isRequired">
|
||||
<a-select v-model:value="formState.emissionType" placeholder="请选择排放类型">
|
||||
<a-select-option v-for="(item, index) in emissionTypeDic" :key="index" :value="item.id">
|
||||
{{ item.cnValue }}
|
||||
</a-select-option>
|
||||
</a-select>
|
||||
</a-form-item>
|
||||
<a-row>
|
||||
<a-col :span="24" style="display: flex; justify-content: space-around">
|
||||
<a-form-item
|
||||
label="1月"
|
||||
name="janFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.janFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="2月"
|
||||
name="febFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.febFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="3月"
|
||||
name="marFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.marFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24" style="display: flex; justify-content: space-around">
|
||||
<a-form-item
|
||||
label="4月"
|
||||
name="aprFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.aprFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="5月"
|
||||
name="mayFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.mayFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="6月"
|
||||
name="junFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.junFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24" style="display: flex; justify-content: space-around">
|
||||
<a-form-item
|
||||
label="7月"
|
||||
name="julFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.julFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="8月"
|
||||
name="augFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.augFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="9月"
|
||||
name="sepFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.sepFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24" style="display: flex; justify-content: space-around">
|
||||
<a-form-item
|
||||
label="10月"
|
||||
name="octFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.octFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="11月"
|
||||
name="novFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.novFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
<a-form-item
|
||||
label="12月"
|
||||
name="decFlag"
|
||||
:label-col="switchLabelCol"
|
||||
:wrapper-col="switchWrapperCol">
|
||||
<a-switch
|
||||
v-model:checked="formState.decFlag"
|
||||
:checked-value="1"
|
||||
:unCheckedValue="0" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<a-form-item ref="name" label="上传凭证">
|
||||
<a-upload
|
||||
:file-list="fileList"
|
||||
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>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<template #footer>
|
||||
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
||||
<a-button type="primary" @click="onSubmit">确定</a-button>
|
||||
</template>
|
||||
</a-drawer>
|
||||
<!-- 上传凭证弹窗 -->
|
||||
<!-- <a-modal :visible="openUpload" title="凭证上传" @ok="handleOk" @cancel="closeOpenUpload">
|
||||
<a-upload-dragger
|
||||
v-model:fileList="fileList"
|
||||
name="file"
|
||||
:multiple="true"
|
||||
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
|
||||
@change="handleChange"
|
||||
@drop="handleDrop"
|
||||
>
|
||||
<p class="ant-upload-drag-icon">
|
||||
<inbox-outlined></inbox-outlined>
|
||||
</p>
|
||||
<p class="ant-upload-hint" style="display: flex;flex-direction: column;">
|
||||
<p>1.仅支持pdf格式文件或文件夹</p>
|
||||
<p>2.文件命名规则为【能源种类_年份】</p>
|
||||
<p>3.每次上传自动覆盖</p>
|
||||
</p>
|
||||
</a-upload-dragger>
|
||||
</a-modal> -->
|
||||
<!-- 凭证下载 -->
|
||||
<a-drawer
|
||||
:visible="downLoadVisible"
|
||||
title="凭证列表"
|
||||
:width="500"
|
||||
@close="onCloseDownLoad"
|
||||
:footer-style="{ textAlign: 'right' }">
|
||||
<div></div>
|
||||
<a-table
|
||||
:columns="downLoadColumns"
|
||||
:data-source="downLoadData"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:rowSelection="{
|
||||
selectedRowKeys: selectedRowKeysSet,
|
||||
onChange: onSelectionChangeSet,
|
||||
}"
|
||||
:pagination="false">
|
||||
<template #bodyCell="{ column, text, record }">
|
||||
<template v-if="column.key === 'action'">
|
||||
<span>
|
||||
<a @click="downLoad(record)">下载</a>
|
||||
</span>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
<template #footer>
|
||||
<a-button style="margin-right: 8px" @click="onCloseDownLoad">取消</a-button>
|
||||
<a-button type="primary" @click="onSubmitDownLoad">确定</a-button>
|
||||
</template>
|
||||
</a-drawer>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, toRaw, defineExpose } from 'vue';
|
||||
import type { Rule } from 'ant-design-vue/es/form';
|
||||
import { Pagination, message, Modal } from 'ant-design-vue';
|
||||
import { UploadOutlined } from '@ant-design/icons-vue';
|
||||
import type { TreeSelectProps, UploadChangeParam, UploadProps } from 'ant-design-vue';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import dayjs, { Dayjs } from 'dayjs';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { Cookies } from '/nerv-lib/util/cookie';
|
||||
import { tableColumns } from '../config';
|
||||
import {
|
||||
energyConsumption,
|
||||
carbonEmissionFactorLibrary,
|
||||
uploadPic,
|
||||
} from '/@/api/carbonEmissionFactorLibrary';
|
||||
import { dict } from '/@/api';
|
||||
import { group } from '/@/api/deviceManage';
|
||||
defineOptions({
|
||||
energyType: 'EnergyConsumption', // 与页面路由name一致缓存才可生效
|
||||
components: {
|
||||
'a-pagination': Pagination,
|
||||
},
|
||||
});
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const fetch = (api, params = { orgId }, config) => {
|
||||
return http.post(api, params, config);
|
||||
};
|
||||
const selectYear = ref<Dayjs>(dayjs(new Date().getFullYear().toString()));
|
||||
const total = ref<number>();
|
||||
const queryParams = ref({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
orgId: orgId.value,
|
||||
year: selectYear.value.format('YYYY'),
|
||||
});
|
||||
const isRequired = ref(false);
|
||||
const visible = ref(false);
|
||||
const openUpload = ref<boolean>(false);
|
||||
const data = ref([]);
|
||||
interface FormState {
|
||||
energyType: string;
|
||||
unit: string;
|
||||
collectionNode: string;
|
||||
emissionType: string | undefined;
|
||||
isComputeCarbon: string;
|
||||
janFlag: string;
|
||||
febFlag: string;
|
||||
marFlag: string;
|
||||
aprFlag: string;
|
||||
mayFlag: string;
|
||||
junFlag: string;
|
||||
julFlag: string;
|
||||
augFlag: string;
|
||||
sepFlag: string;
|
||||
octFlag: string;
|
||||
novFlag: string;
|
||||
decFlag: string;
|
||||
}
|
||||
const formRef = ref();
|
||||
const labelCol = { span: 5 };
|
||||
const wrapperCol = { span: 19 };
|
||||
const switchLabelCol = { span: 10 };
|
||||
const switchWrapperCol = { span: 14 };
|
||||
const formState = ref({
|
||||
orgId: orgId.value,
|
||||
});
|
||||
// 定义form表单的必填
|
||||
const rules: Record<string, Rule[]> = {
|
||||
energyType: [{ required: true, message: '请输入能源种类', trigger: 'change' }],
|
||||
isComputeCarbon: [{ required: true, message: '请选择是否计算碳排', trigger: 'change' }],
|
||||
unit: [{ required: true, message: '请选择计量单位', trigger: 'change' }],
|
||||
};
|
||||
// 排放类型的变量
|
||||
const emissionTypeDic = ref();
|
||||
// 计量单位的变量
|
||||
const measurementUnit = ref([]);
|
||||
// 定义自动采集节点数的变量
|
||||
const treeData = ref<TreeSelectProps['treeData']>([]);
|
||||
// 年份选择改变触发
|
||||
const changeYearData = () => {
|
||||
queryParams.value.year = selectYear.value;
|
||||
getTableList();
|
||||
};
|
||||
const mainRef = ref();
|
||||
const year = selectYear.value.format('YYYY');
|
||||
const tableConfig = ref({
|
||||
title: '能耗统计',
|
||||
api: energyConsumption.pageList,
|
||||
params: queryParams.value,
|
||||
headerActions: [
|
||||
{
|
||||
label: '新增',
|
||||
name: 'userAdd',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
getDictList();
|
||||
visible.value = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '导入',
|
||||
type: 'primary',
|
||||
name: 'userImport',
|
||||
handle: () => {},
|
||||
},
|
||||
{
|
||||
label: '导出',
|
||||
type: 'primary',
|
||||
name: 'userExports',
|
||||
},
|
||||
{
|
||||
label: '模板下载',
|
||||
type: 'primary',
|
||||
},
|
||||
// {
|
||||
// label: '上传凭证',
|
||||
// type: 'primary',
|
||||
// handle: () => {
|
||||
// openUpload.value = true;
|
||||
// },
|
||||
// },
|
||||
{
|
||||
label: '凭证下载',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
fetch(energyConsumption.voucherDownloadList, { bizType: 3 }).then((res) => {
|
||||
downLoadData.value = res.data;
|
||||
});
|
||||
downLoadVisible.value = true;
|
||||
},
|
||||
},
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
title: '序号',
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '能源种类',
|
||||
dataIndex: 'energyType',
|
||||
},
|
||||
{
|
||||
title: '计量单位',
|
||||
className: 'unitName',
|
||||
dataIndex: 'unitName',
|
||||
},
|
||||
{
|
||||
title: '全年',
|
||||
dataIndex: 'yearly',
|
||||
},
|
||||
{
|
||||
title: '1月',
|
||||
dataIndex: 'jan',
|
||||
// customRender: ({ text }: { text: string }) => {
|
||||
// return <span :style="{ color: getColor(text) }">{text}</span>;
|
||||
// }
|
||||
},
|
||||
{
|
||||
title: '2月',
|
||||
dataIndex: 'feb',
|
||||
},
|
||||
{
|
||||
title: '3月',
|
||||
dataIndex: 'mar',
|
||||
},
|
||||
{
|
||||
title: '4月',
|
||||
dataIndex: 'apr',
|
||||
},
|
||||
{
|
||||
title: '5月',
|
||||
dataIndex: 'may',
|
||||
},
|
||||
{
|
||||
title: '6月',
|
||||
dataIndex: 'jun',
|
||||
},
|
||||
{
|
||||
title: '7月',
|
||||
dataIndex: 'jul',
|
||||
},
|
||||
{
|
||||
title: '8月',
|
||||
dataIndex: 'aug',
|
||||
},
|
||||
{
|
||||
title: '9月',
|
||||
dataIndex: 'sep',
|
||||
},
|
||||
{
|
||||
title: '10月',
|
||||
dataIndex: 'oct',
|
||||
},
|
||||
{
|
||||
title: '11月',
|
||||
dataIndex: 'nov',
|
||||
},
|
||||
{
|
||||
title: '12月',
|
||||
dataIndex: 'dec',
|
||||
},
|
||||
],
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'userEdit',
|
||||
handle: (record: any) => {
|
||||
getDictList();
|
||||
visible.value = true;
|
||||
fetch(energyConsumption.findById, { id: record.id }).then((res) => {
|
||||
if (res.data.emissionType) {
|
||||
res.data.emissionType = Number(res.data.emissionType);
|
||||
}
|
||||
if (res.data.unit) {
|
||||
let selectDevice = ref([Number(res.data.unit)]);
|
||||
findParentIds(measurementUnit.value, res.data.unit, selectDevice.value);
|
||||
res.data.unit = selectDevice;
|
||||
}
|
||||
formState.value = res.data;
|
||||
emissionType.value = res.data.emissionType;
|
||||
if (formState.value.isComputeCarbon === 0) {
|
||||
isRequired.value = true;
|
||||
} else {
|
||||
isRequired.value = false;
|
||||
}
|
||||
});
|
||||
fetch(uploadPic.select, { bizId: record.id, bizType: 3 }).then((res) => {
|
||||
fileList.value = res.data.map((item) => ({
|
||||
uid: item.id.toString(), // 使用文件的id作为唯一标识
|
||||
name: item.fileName, // 文件名
|
||||
status: 'done', // 设置默认状态为已完成
|
||||
type: 'done',
|
||||
url: item.filePath, // 文件的URL，这里假设用示例的URL格式
|
||||
}));
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
name: 'userDelete',
|
||||
dynamicParams: { id: 'id' },
|
||||
confirm: true,
|
||||
isReload: true,
|
||||
api: energyConsumption.del,
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'year',
|
||||
label: '年份',
|
||||
component: 'NsDatePicker',
|
||||
componentProps: {
|
||||
picker: 'year',
|
||||
valueFormat: 'YYYY',
|
||||
defaultValue: selectYear.value.format('YYYY'),
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
rowKey: 'id',
|
||||
});
|
||||
const getColor = (value: string | number): string => {
|
||||
debugger;
|
||||
if (typeof value === 'string') {
|
||||
switch (value) {
|
||||
case 'active':
|
||||
return 'green';
|
||||
case 'inactive':
|
||||
return 'red';
|
||||
default:
|
||||
return 'black';
|
||||
}
|
||||
} else if (typeof value === 'number') {
|
||||
return value > 30 ? 'blue' : 'purple'; // 示例：根据年龄设置颜色
|
||||
}
|
||||
return 'black';
|
||||
};
|
||||
|
||||
defineExpose({
|
||||
mainRef,
|
||||
});
|
||||
// 定义一个递归函数来查找每一级的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 getTableList = () => {
|
||||
fetch(energyConsumption.pageList, queryParams.value).then((res) => {
|
||||
data.value = res.data.records;
|
||||
});
|
||||
};
|
||||
// 分页器
|
||||
const onChange = (pageNumber: number, size: number) => {
|
||||
queryParams.value.pageNum = pageNumber;
|
||||
queryParams.value.pageSize = size;
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
};
|
||||
// 计算碳排切换
|
||||
const emissionType = ref();
|
||||
const changeRadio = (e) => {
|
||||
if (e.target.value === 0) {
|
||||
isRequired.value = true;
|
||||
if (emissionType.value) {
|
||||
formState.value.emissionType = emissionType.value;
|
||||
}
|
||||
} else {
|
||||
isRequired.value = false;
|
||||
formState.value.emissionType = '';
|
||||
}
|
||||
};
|
||||
// 点击确定提交
|
||||
const onSubmit = () => {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
console.log('values', formState, toRaw(formState));
|
||||
formState.value.year = selectYear.value.format('YYYY');
|
||||
if (formState.value.unit) {
|
||||
formState.value.unit = formState.value.unit.join(',').split(',')[1];
|
||||
}
|
||||
if (formState.value.id) {
|
||||
fetch(energyConsumption.update, formState.value).then((res) => {
|
||||
if (fileList.value.length !== 0) {
|
||||
const formData = ref(new FormData());
|
||||
fileList.value.forEach((file) => {
|
||||
if (file.type !== 'done') {
|
||||
formData.value.append('files', file.originFileObj);
|
||||
}
|
||||
});
|
||||
formData.value.append('bizType', 3);
|
||||
formData.value.append('bizId', formState.value.id);
|
||||
delIds.value.forEach((item) => {
|
||||
formData.value.append('deleteList', item);
|
||||
});
|
||||
fetch(uploadPic.uploadfiles, formData.value)
|
||||
.then((res) => {
|
||||
message.success('操作成功！');
|
||||
visible.value = false;
|
||||
delIds.value = [];
|
||||
formState.value = {
|
||||
orgId: orgId.value,
|
||||
};
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('error', error);
|
||||
});
|
||||
} else {
|
||||
visible.value = false;
|
||||
delIds.value = [];
|
||||
formState.value = {
|
||||
orgId: orgId.value,
|
||||
};
|
||||
message.success('操作成功！');
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
fetch(energyConsumption.creat, formState.value).then((res) => {
|
||||
if (res.data === '新增数据已存在') {
|
||||
visible.value = false;
|
||||
delIds.value = [];
|
||||
NsMessage.warning(res.data);
|
||||
} else {
|
||||
if (fileList.value.length !== 0) {
|
||||
const formData = ref(new FormData());
|
||||
fileList.value.forEach((file) => {
|
||||
formData.value.append('files', file.originFileObj);
|
||||
});
|
||||
formData.value.append('bizType', 3);
|
||||
formData.value.append('bizId', res.data);
|
||||
fetch(uploadPic.uploadfiles, formData.value)
|
||||
.then((res) => {
|
||||
message.success('操作成功！');
|
||||
visible.value = false;
|
||||
delIds.value = [];
|
||||
formState.value = {
|
||||
orgId: orgId.value,
|
||||
};
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('error', error);
|
||||
});
|
||||
} else {
|
||||
visible.value = false;
|
||||
delIds.value = [];
|
||||
formState.value = {
|
||||
orgId: orgId.value,
|
||||
};
|
||||
message.success('操作成功！');
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('error', error);
|
||||
});
|
||||
};
|
||||
const energyTypeOptions = ref([]);
|
||||
// 获取字典值
|
||||
const getDictList = async () => {
|
||||
// 获取能耗类型
|
||||
const options = await dict({ params: { dicKey: 'ENERGY_TYPE' } });
|
||||
energyTypeOptions.value = options.data.data
|
||||
console.log(energyTypeOptions);
|
||||
debugger
|
||||
// 获取排放类型的数据
|
||||
fetch(energyConsumption.getDicList, { grp: 'EMISSION_TYPE' }).then((res) => {
|
||||
emissionTypeDic.value = res.data;
|
||||
});
|
||||
// 获取计量单位的数据
|
||||
fetch(carbonEmissionFactorLibrary.dictionaryUnitManagement, { grp: 'MEASUREMENT_UNIT' }).then(
|
||||
(res) => {
|
||||
measurementUnit.value = res.data;
|
||||
measurementUnit.value = measurementUnit.value.map((item) => ({
|
||||
value: item.id,
|
||||
label: item.cnValue,
|
||||
children: item.children
|
||||
? item.children.map((child) => ({
|
||||
value: child.id,
|
||||
label: child.cnValue,
|
||||
}))
|
||||
: [],
|
||||
}));
|
||||
},
|
||||
);
|
||||
// 获取自动采集节点的数据
|
||||
fetch(group.queryDeviceGroupTree, { energyType: 'ELECTRICITY_USAGE', orgId: orgId.value }).then(
|
||||
(res) => {
|
||||
treeData.value = res.data;
|
||||
treeData.value = treeData.value.map((item) => ({
|
||||
value: item.id,
|
||||
label: item.pointName,
|
||||
children: item.children
|
||||
? item.children.map((child) => ({
|
||||
value: child.id,
|
||||
label: child.pointName,
|
||||
}))
|
||||
: [],
|
||||
}));
|
||||
},
|
||||
);
|
||||
};
|
||||
// 点击新增按钮
|
||||
const addNewData = () => {
|
||||
getDictList();
|
||||
visible.value = true;
|
||||
};
|
||||
// 点击编辑按钮
|
||||
const editData = (record) => {
|
||||
getDictList();
|
||||
visible.value = true;
|
||||
fetch(energyConsumption.findById, { id: record.id }).then((res) => {
|
||||
if (res.data.unitName) {
|
||||
res.data.unitName = res.data.unitName.split(',');
|
||||
}
|
||||
formState.value = res.data;
|
||||
});
|
||||
};
|
||||
// 点击删除
|
||||
const delData = (record) => {
|
||||
Modal.confirm({
|
||||
title: '警告',
|
||||
content: '确定要删除吗?',
|
||||
okText: '确定',
|
||||
okType: 'primary',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
fetch(energyConsumption.del, { id: record.id }).then((res) => {
|
||||
message.success('操作成功！');
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
});
|
||||
};
|
||||
// 关闭新增抽屉
|
||||
const onClose = () => {
|
||||
visible.value = false;
|
||||
delIds.value = [];
|
||||
formState.value = {
|
||||
orgId: orgId.value,
|
||||
};
|
||||
formRef.value.resetFields();
|
||||
};
|
||||
// 点击上传凭证按钮
|
||||
const uploadVoucher = () => {
|
||||
openUpload.value = true;
|
||||
};
|
||||
// 上传凭证弹窗点击确定
|
||||
const handleOk = (e: MouseEvent) => {
|
||||
console.log(e);
|
||||
openUpload.value = false;
|
||||
};
|
||||
// 上传凭证相关方法及变量
|
||||
const fileList = ref<UploadProps['fileList']>([]);
|
||||
const beforeUpload: UploadProps['beforeUpload'] = (file) => {
|
||||
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} 文件上传失败`);
|
||||
}
|
||||
};
|
||||
const delIds = ref([]);
|
||||
const handleFileRemove = (file) => {
|
||||
delIds.value.push(file.uid);
|
||||
const newFileList = [];
|
||||
fileList.value.forEach((item) => {
|
||||
if (item.uid !== file.uid) {
|
||||
newFileList.push(item);
|
||||
}
|
||||
});
|
||||
fileList.value = newFileList;
|
||||
};
|
||||
// 关闭上传凭证弹窗
|
||||
const closeOpenUpload = () => {
|
||||
openUpload.value = false;
|
||||
};
|
||||
// 凭证下载
|
||||
const downLoadVisible = ref(false);
|
||||
const downLoadColumns = [
|
||||
{
|
||||
title: '序号',
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '能源类型',
|
||||
dataIndex: 'bizName',
|
||||
},
|
||||
{
|
||||
title: '文件名',
|
||||
dataIndex: 'fileName',
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
},
|
||||
];
|
||||
const downLoadData = ref([]);
|
||||
const selectedRowKeysSet = ref([]);
|
||||
const onSelectionChangeSet = (selectedKeys, selectedRows) => {
|
||||
selectedRowKeysSet.value = selectedKeys;
|
||||
};
|
||||
const downLoad = (record) => {
|
||||
const deleteId = ref(new FormData());
|
||||
deleteId.value.append('id', record.id);
|
||||
const config = {
|
||||
headers: {
|
||||
responseType: 'blob',
|
||||
},
|
||||
};
|
||||
fetch(uploadPic.download, deleteId.value, config)
|
||||
.then((res) => {
|
||||
// 创建一个 URL 对象，指向图片数据的 blob
|
||||
const url = window.URL.createObjectURL(new Blob([res.data]));
|
||||
// 创建一个 <a> 标签，用于触发下载
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.setAttribute('download', record.fileName); // 设置下载的文件名
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
|
||||
// 清理 URL 对象
|
||||
window.URL.revokeObjectURL(url);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('下载图片失败：', error);
|
||||
});
|
||||
};
|
||||
const onSubmitDownLoad = () => {
|
||||
const deleteIds = ref(new FormData());
|
||||
selectedRowKeysSet.value.forEach((item) => {
|
||||
deleteIds.value.append('ids', item);
|
||||
});
|
||||
fetch(uploadPic.downloadZip, deleteIds.value)
|
||||
.then((res) => {
|
||||
// 创建一个 URL 对象，指向图片数据的 blob
|
||||
const url = window.URL.createObjectURL(new Blob([res.data]));
|
||||
// 创建一个 <a> 标签，用于触发下载
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
debugger;
|
||||
link.setAttribute('download', ''); // 设置下载的文件名
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
|
||||
// 清理 URL 对象
|
||||
window.URL.revokeObjectURL(url);
|
||||
onCloseDownLoad();
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('下载图片失败：', error);
|
||||
});
|
||||
};
|
||||
const onCloseDownLoad = () => {
|
||||
selectedRowKeysSet.value = [];
|
||||
downLoadVisible.value = false;
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
:deep(.ant-table-title) {
|
||||
display: flex;
|
||||
}
|
||||
:deep(.ant-table-container) {
|
||||
padding: 0px 16px;
|
||||
}
|
||||
.buttonGroup {
|
||||
margin-left: 1vw;
|
||||
width: 30vw;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
</style>
|
||||
<style scoped>
|
||||
th.column-money,
|
||||
td.column-money {
|
||||
text-align: right !important;
|
||||
}
|
||||
</style>
|
||||
@@ -210,22 +210,33 @@
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
<div class="ns-form-title"><div class="title">凭证上传</div></div>
|
||||
<div class="ns-form-title" style="display: flex">
|
||||
<div class="title">凭证上传</div>
|
||||
</div>
|
||||
<a-upload
|
||||
:file-list="fileList"
|
||||
name="file"
|
||||
accept=".jpg,.jpeg,.png,.gif,.bmp,.pdf"
|
||||
accept=".pdf"
|
||||
@remove="handleFileRemove"
|
||||
:before-upload="beforeUpload"
|
||||
@change="handleChange">
|
||||
<a-button>
|
||||
<a-button style="margin-left: 6px; color: #4f95ff; border-color: #4f95ff">
|
||||
<upload-outlined></upload-outlined>
|
||||
上传
|
||||
上传凭证
|
||||
</a-button>
|
||||
</a-upload>
|
||||
<div style="display: flex; flex-direction: column">
|
||||
<div
|
||||
style="
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-radius: 4px;
|
||||
background: rgba(250, 250, 250, 1);
|
||||
color: rgba(153, 153, 153, 1);
|
||||
padding: 5px;
|
||||
">
|
||||
<span>1.仅支持pdf格式文件或文件夹</span>
|
||||
<span>2.文件名命名规则为【能源种类_年份】</span>
|
||||
<span>3.每次上传自动覆盖</span>
|
||||
</div>
|
||||
|
||||
<template #footer>
|
||||
@@ -289,7 +300,7 @@
|
||||
<script lang="ts" setup>
|
||||
import { ref, toRaw, defineExpose, createVNode } from 'vue';
|
||||
import type { Rule } from 'ant-design-vue/es/form';
|
||||
import { Pagination, message, Modal } from 'ant-design-vue';
|
||||
import { Pagination, message, Modal, Upload } from 'ant-design-vue';
|
||||
import { UploadOutlined } from '@ant-design/icons-vue';
|
||||
import type { TreeSelectProps, UploadChangeParam, UploadProps } from 'ant-design-vue';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
@@ -1058,19 +1069,29 @@
|
||||
};
|
||||
// 上传凭证相关方法及变量
|
||||
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;
|
||||
delIds.value.push(info.fileList[0].uid);
|
||||
// 删除fileList中的第一条数据
|
||||
if (newFileList.length > 1) {
|
||||
newFileList.shift(); // 删除第一条数据
|
||||
}
|
||||
|
||||
// 更新fileList
|
||||
fileList.value = [...newFileList];
|
||||
};
|
||||
const delIds = ref([]);
|
||||
const handleFileRemove = (file) => {
|
||||
@@ -1229,6 +1250,13 @@
|
||||
.grey-background.ant-switch .ant-switch-handle {
|
||||
background-color: rgba(238, 238, 238, 1) !important;
|
||||
}
|
||||
|
||||
.ant-switch-checked {
|
||||
background-color: rgba(57, 215, 187, 1) !important;
|
||||
}
|
||||
.grey-background.ant-switch .ant-switch-handle {
|
||||
background-color: rgba(238, 238, 238, 1) !important;
|
||||
}
|
||||
</style>
|
||||
<style scoped>
|
||||
th.column-money,
|
||||
|
||||
@@ -0,0 +1,587 @@
|
||||
<template>
|
||||
<div class="main">
|
||||
<div class="left">
|
||||
<div class="top">
|
||||
<a-form style="width: 100%; margin: 0 auto">
|
||||
<div class="ns-form-title"><div class="title">因子分类</div></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="searchValue"
|
||||
placeholder="请输入关键词"
|
||||
@search="onSearchTreeData" />
|
||||
</a-col>
|
||||
</a-row>
|
||||
</div>
|
||||
</a-form>
|
||||
<a-tree
|
||||
v-if="gData && gData.length > 0"
|
||||
:expanded-keys="expandedKeys"
|
||||
:auto-expand-parent="autoExpandParent"
|
||||
:selectedKeys="selectedKeys"
|
||||
:tree-data="gData"
|
||||
show-line
|
||||
@expand="onExpand"
|
||||
@select="onSelect"
|
||||
style="padding: 0 16px !important">
|
||||
<template #title="data">
|
||||
<span
|
||||
v-if="data.energyType && searchValue && data.energyType.indexOf(searchValue) > -1">
|
||||
{{ data.energyType.substring(0, data.energyType.indexOf(searchValue)) }}
|
||||
<span style="color: #f50">{{ searchValue }}</span>
|
||||
{{
|
||||
data.energyType.substring(data.energyType.indexOf(searchValue) + searchValue.length)
|
||||
}}
|
||||
</span>
|
||||
<span v-else>{{ data.energyType }}</span>
|
||||
</template>
|
||||
</a-tree>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<!-- <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>
|
||||
</template>
|
||||
</a-table> -->
|
||||
<ns-view-list-table
|
||||
v-bind="tableConfig"
|
||||
:model="tableData"
|
||||
ref="mainRef"
|
||||
:scroll="{ x: 1000 }" />
|
||||
<a-pagination
|
||||
:current="queryParams.pageNum"
|
||||
:total="total"
|
||||
:page-size="queryParams.pageSize"
|
||||
style="display: flex; justify-content: center; margin-top: 16px"
|
||||
:show-size-changer="true"
|
||||
:show-quick-jumper="true"
|
||||
@change="onChange" />
|
||||
<!-- 新增/编辑 -->
|
||||
<a-drawer
|
||||
:width="500"
|
||||
:visible="visible"
|
||||
:body-style="{ paddingBottom: '80px' }"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
destroyOnClose
|
||||
@close="onClose">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="formState"
|
||||
:rules="rules"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol">
|
||||
<a-row>
|
||||
<a-col :span="24">
|
||||
<a-form-item ref="name" label="日期范围" name="dateRange">
|
||||
<a-range-picker
|
||||
v-model:value="formState.dateRange"
|
||||
picker="month"
|
||||
valueFormat="YYYY-MM" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="24">
|
||||
<a-form-item ref="name" label="排放因子" name="emissionFactors">
|
||||
<ns-input v-model:value="formState.emissionFactors" disabled />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
<span
|
||||
key=""
|
||||
style="font-size: 16px; font-weight: 700; color: rgba(51, 51, 51, 1); text-align: left">
|
||||
因子列表
|
||||
</span>
|
||||
<a-row>
|
||||
<a-col :span="12">
|
||||
<a-form-item ref="name">
|
||||
<ns-input style="margin-top: 5px" v-model:value="selectData" @change="keyChange" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
<a-table
|
||||
:columns="drawerColumns"
|
||||
:data-source="newTableData"
|
||||
bordered
|
||||
rowKey="id"
|
||||
:rowSelection="{
|
||||
selectedRowKeys: selectedRowKeys,
|
||||
onChange: onSelectionChange,
|
||||
type: 'radio',
|
||||
}"
|
||||
:pagination="false">
|
||||
</a-table>
|
||||
<template #footer>
|
||||
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
||||
<a-button type="primary" @click="onSubmit">确定</a-button>
|
||||
</template>
|
||||
</a-drawer>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, watch, toRaw, defineExpose } from 'vue';
|
||||
import type { TreeProps } from 'ant-design-vue';
|
||||
import { Pagination, Modal } from 'ant-design-vue';
|
||||
import { columns, drawerColumns } from '../config';
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import {
|
||||
quickCalculation,
|
||||
carbonEmissionFactorLibrary,
|
||||
} from '/@/api/carbonEmissionFactorLibrary';
|
||||
import { or } from '@vueuse/core';
|
||||
defineOptions({
|
||||
energyType: 'quickCalculation', // 与页面路由name一致缓存才可生效
|
||||
components: {
|
||||
'a-pagination': Pagination,
|
||||
},
|
||||
});
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const fetch = (api, params = { orgId }) => {
|
||||
return http.post(api, params);
|
||||
};
|
||||
const mainRef = ref();
|
||||
// 数结构
|
||||
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);
|
||||
|
||||
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)[]>(['0-0']);
|
||||
const selectedKeys = ref<string[]>(['0-0-0']);
|
||||
const searchValue = ref<string>('');
|
||||
const autoExpandParent = ref<boolean>(true);
|
||||
const gData = ref<TreeProps['treeData']>(genData);
|
||||
|
||||
const onExpand = (keys: string[]) => {
|
||||
expandedKeys.value = keys;
|
||||
autoExpandParent.value = false;
|
||||
};
|
||||
// 被选中的树节点
|
||||
const energyType = ref();
|
||||
const onSelect = (selectedKey: string[], info: any) => {
|
||||
selectedKeys.value = selectedKey;
|
||||
if (info.selected) {
|
||||
energyType.value = info.node.id;
|
||||
statsId.value = info.node.id;
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
}
|
||||
};
|
||||
|
||||
watch(searchValue, (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;
|
||||
searchValue.value = value;
|
||||
autoExpandParent.value = true;
|
||||
});
|
||||
// 查询因子分类树数据
|
||||
const onSearchTreeData = () => {};
|
||||
const statsId = ref();
|
||||
// 获取因子分类树数据
|
||||
const getTreeData = () => {
|
||||
fetch(quickCalculation.carbonQuickTree, { orgId: orgId.value }).then((res) => {
|
||||
gData.value = res.data;
|
||||
energyType.value = gData.value[0].children[0].id;
|
||||
statsId.value = gData.value[0].children[0].id;
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
};
|
||||
getTreeData();
|
||||
// 列表数据
|
||||
const total = ref<number>();
|
||||
const queryParams = ref({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
orgId: orgId.value,
|
||||
});
|
||||
const tableData = ref([]);
|
||||
const emissionSources = ref();
|
||||
const tableConfig = ref({
|
||||
title: '排放因子库',
|
||||
api: quickCalculation.queryCarbonEmissionPage,
|
||||
params: {
|
||||
orgId,
|
||||
energyType,
|
||||
},
|
||||
headerActions: [
|
||||
{
|
||||
label: '新增',
|
||||
name: 'userAdd',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
visible.value = true;
|
||||
// getNewTable();
|
||||
},
|
||||
},
|
||||
],
|
||||
columns: [
|
||||
{
|
||||
title: '序号',
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '因子值',
|
||||
dataIndex: 'emissionFactors',
|
||||
},
|
||||
{
|
||||
title: '计量单位',
|
||||
className: 'carbonEmissionSuffix',
|
||||
dataIndex: 'carbonEmissionSuffix',
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
className: 'updateTime',
|
||||
dataIndex: 'updateTime',
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: '启用时间',
|
||||
className: 'startTime',
|
||||
dataIndex: 'startTime',
|
||||
},
|
||||
{
|
||||
title: '结束时间',
|
||||
className: 'endTime',
|
||||
dataIndex: 'endTime',
|
||||
},
|
||||
{
|
||||
title: '数据来源',
|
||||
className: 'dataSources',
|
||||
dataIndex: 'dataSources',
|
||||
},
|
||||
],
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'userEdit',
|
||||
handle: (record: any) => {
|
||||
selectedRowKeys.value = [record.factorId];
|
||||
formState.value.id = record.id;
|
||||
formState.value.emissionFactors = record.emissionFactors;
|
||||
formState.value.dateRange = [record.startTime, record.endTime];
|
||||
formState.value.factorId = record.factorId;
|
||||
visible.value = true;
|
||||
emissionSources.value = record.emissionSources;
|
||||
queryData.value.emissionSources = emissionSources.value;
|
||||
getNewTable();
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
name: 'userDelete',
|
||||
dynamicParams: { id: 'id' },
|
||||
confirm: true,
|
||||
isReload: true,
|
||||
api: quickCalculation.del,
|
||||
},
|
||||
],
|
||||
},
|
||||
rowKey: 'id',
|
||||
});
|
||||
|
||||
defineExpose({
|
||||
getTreeData,
|
||||
});
|
||||
// 获取列表数据
|
||||
const getTableList = () => {
|
||||
fetch(quickCalculation.queryCarbonEmissionPage, queryParams.value).then((res) => {
|
||||
tableData.value = res.data.records;
|
||||
total.value = res.data.total;
|
||||
});
|
||||
};
|
||||
// 分页器
|
||||
const onChange = (pageNumber: number, size: number) => {
|
||||
queryParams.value.pageNum = pageNumber;
|
||||
queryParams.value.pageSize = size;
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
};
|
||||
// 新增/编辑
|
||||
const formRef = ref();
|
||||
const labelCol = { span: 6 };
|
||||
const wrapperCol = { span: 18 };
|
||||
const formState = ref({
|
||||
orgId: orgId.value,
|
||||
});
|
||||
const visible = ref(false);
|
||||
|
||||
// 定义form表单的必填
|
||||
const rules: Record<string, Rule[]> = {
|
||||
dateRange: [{ required: true, message: '请选择日期范围', trigger: 'change' }],
|
||||
emissionFactors: [{ required: true, message: '请输入能源种类', trigger: 'change' }],
|
||||
};
|
||||
// 点击新增按钮
|
||||
const addNewData = () => {
|
||||
visible.value = true;
|
||||
// getNewTable();
|
||||
};
|
||||
// 获取新增页面的列表
|
||||
const selectedRowKeys = ref([]);
|
||||
const onSelectionChange = (selectedKeys, selectedRows) => {
|
||||
selectedRowKeys.value = selectedKeys;
|
||||
formState.value.emissionFactors = selectedRows[0].emissionFactors;
|
||||
formState.value.factorId = selectedRows[0].id;
|
||||
};
|
||||
const queryData = ref({
|
||||
orgId: orgId.value,
|
||||
pageNum: 1,
|
||||
pageSize: 999,
|
||||
});
|
||||
const newTableData = ref([]);
|
||||
const getNewTable = () => {
|
||||
fetch(carbonEmissionFactorLibrary.getTableList, queryData.value).then((res) => {
|
||||
newTableData.value = res.data.records;
|
||||
});
|
||||
};
|
||||
const selectData = ref();
|
||||
const keyChange = () => {
|
||||
if (selectData.value === '') {
|
||||
queryData.value.emissionSources = emissionSources.value;
|
||||
} else {
|
||||
queryData.value.emissionSources = selectData.value;
|
||||
}
|
||||
getNewTable();
|
||||
};
|
||||
// 点击编辑按钮
|
||||
const editData = (record) => {
|
||||
selectedRowKeys.value = [record.factorId];
|
||||
formState.value.id = record.id;
|
||||
formState.value.emissionFactors = record.emissionFactors;
|
||||
formState.value.dateRange = [record.startTime, record.endTime];
|
||||
formState.value.factorId = record.factorId;
|
||||
visible.value = true;
|
||||
getNewTable();
|
||||
};
|
||||
// 点击确定提交
|
||||
const onSubmit = () => {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
formState.value.statsId = statsId.value;
|
||||
formState.value.startTime = formState.value.dateRange[0];
|
||||
formState.value.endTime = formState.value.dateRange[1];
|
||||
console.log('values', formState, toRaw(formState));
|
||||
if (formState.value.id) {
|
||||
fetch(quickCalculation.update, formState.value).then((res) => {
|
||||
visible.value = false;
|
||||
selectedRowKeys.value = [];
|
||||
formState.value = {};
|
||||
formRef.value.resetFields();
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
} else {
|
||||
fetch(quickCalculation.creat, formState.value).then((res) => {
|
||||
visible.value = false;
|
||||
selectedRowKeys.value = [];
|
||||
formState.value = {};
|
||||
formRef.value.resetFields();
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('error', error);
|
||||
});
|
||||
};
|
||||
// 删除数据
|
||||
const delData = (record) => {
|
||||
Modal.confirm({
|
||||
title: '警告',
|
||||
content: '确定要删除吗?',
|
||||
okText: '确定',
|
||||
okType: 'primary',
|
||||
cancelText: '取消',
|
||||
onOk() {
|
||||
fetch(quickCalculation.del, { id: record.id }).then((res) => {
|
||||
message.success('操作成功！');
|
||||
getTableList();
|
||||
});
|
||||
},
|
||||
onCancel() {
|
||||
console.log('Cancel');
|
||||
},
|
||||
});
|
||||
};
|
||||
// 关闭新增抽屉
|
||||
const onClose = () => {
|
||||
visible.value = false;
|
||||
selectedRowKeys.value = [];
|
||||
formState.value = {};
|
||||
formRef.value.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.main {
|
||||
background-color: @ns-content-bg;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
}
|
||||
.left {
|
||||
width: 300px;
|
||||
margin-right: @ns-gap;
|
||||
min-width: fit-content;
|
||||
> div {
|
||||
background-color: @white;
|
||||
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;
|
||||
height: 100%;
|
||||
background: #ffffff;
|
||||
}
|
||||
:deep(.ant-table-container) {
|
||||
padding: 0px 16px;
|
||||
}
|
||||
:deep(.ns-table-main) {
|
||||
margin-top: unset !important;
|
||||
}
|
||||
.top {
|
||||
overflow: auto;
|
||||
}
|
||||
.ns-form-title {
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
padding: 16px;
|
||||
margin-bottom: 16px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
}
|
||||
.title {
|
||||
text-align: left;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-weight: bold;
|
||||
user-select: text;
|
||||
position: relative;
|
||||
padding-left: 9px;
|
||||
}
|
||||
.title::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
height: 13px;
|
||||
width: 3px;
|
||||
border-radius: 1px;
|
||||
background-color: #2778ff;
|
||||
}
|
||||
:deep(.ant-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>
|
||||
@@ -66,14 +66,14 @@
|
||||
:model="tableData"
|
||||
ref="mainRef"
|
||||
:scroll="{ x: 1000 }" />
|
||||
<a-pagination
|
||||
<!-- <a-pagination
|
||||
:current="queryParams.pageNum"
|
||||
:total="total"
|
||||
:page-size="queryParams.pageSize"
|
||||
style="display: flex; justify-content: center; margin-top: 16px"
|
||||
:show-size-changer="true"
|
||||
:show-quick-jumper="true"
|
||||
@change="onChange" />
|
||||
@change="onChange" /> -->
|
||||
<!-- 新增/编辑 -->
|
||||
<a-drawer
|
||||
:width="500"
|
||||
@@ -499,14 +499,19 @@
|
||||
background-color: @ns-content-bg;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
padding: 16px;
|
||||
}
|
||||
.left {
|
||||
width: 300px;
|
||||
margin-right: @ns-gap;
|
||||
min-width: fit-content;
|
||||
border-radius: 8px;
|
||||
background: rgba(255, 255, 255, 1);
|
||||
box-shadow: 0px 2px 20px rgb(69 123 234 / 20%);
|
||||
> div {
|
||||
background-color: @white;
|
||||
flex: 1;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
display: flex;
|
||||
@@ -526,6 +531,11 @@
|
||||
min-width: 0;
|
||||
height: 100%;
|
||||
background: #ffffff;
|
||||
border-radius: 8px !important;
|
||||
box-shadow: 0px 2px 20px rgb(69 123 234 / 20%);
|
||||
:deep(.ns-table-main) {
|
||||
border-radius: 8px !important;
|
||||
}
|
||||
}
|
||||
:deep(.ant-table-container) {
|
||||
padding: 0px 16px;
|
||||
|
||||
@@ -248,7 +248,7 @@
|
||||
</a-drawer>
|
||||
<!-- 点击编辑弹出框 -->
|
||||
<a-drawer
|
||||
:width="700"
|
||||
:width="500"
|
||||
:visible="editData"
|
||||
:body-style="{ paddingBottom: '80px' }"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
@@ -260,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"
|
||||
@@ -272,14 +272,14 @@
|
||||
</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 ref="name" label="采集节点" name="collectionNode">
|
||||
<a-tree-select
|
||||
v-model:value="editFormState.collectionNode"
|
||||
@@ -291,12 +291,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"
|
||||
@@ -325,24 +325,14 @@
|
||||
:current="queryData.pageNum"
|
||||
:total="total"
|
||||
: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"
|
||||
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> -->
|
||||
<a-upload-dragger
|
||||
v-model:fileList="fileList"
|
||||
accept=".pdf"
|
||||
name="file"
|
||||
@remove="handleFileRemove"
|
||||
:before-upload="beforeUpload"
|
||||
@@ -365,7 +355,7 @@
|
||||
<script lang="ts" setup>
|
||||
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,
|
||||
@@ -935,7 +925,7 @@
|
||||
const queryData = ref({
|
||||
orgId: orgId.value,
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
pageSize: 5,
|
||||
});
|
||||
const edit = (record) => {
|
||||
getDictList();
|
||||
@@ -975,6 +965,8 @@
|
||||
if (value === '3') {
|
||||
canEdit.value = true;
|
||||
automatic.value = true;
|
||||
} else {
|
||||
automatic.value = false;
|
||||
}
|
||||
};
|
||||
// 定义采集节点数的变量
|
||||
@@ -997,24 +989,31 @@
|
||||
},
|
||||
);
|
||||
};
|
||||
const selectNode = (value) => {
|
||||
debugger;
|
||||
};
|
||||
// 上传附件
|
||||
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;
|
||||
delIds.value.push(info.fileList[0].uid);
|
||||
// 删除fileList中的第一条数据
|
||||
if (newFileList.length > 1) {
|
||||
newFileList.shift(); // 删除第一条数据
|
||||
}
|
||||
|
||||
// 更新fileList
|
||||
fileList.value = [...newFileList];
|
||||
};
|
||||
const delIds = ref([]);
|
||||
const handleFileRemove = (file) => {
|
||||
|
||||
@@ -68,8 +68,8 @@
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const fetch = (api, params = { orgId }) => {
|
||||
return http.post(api, params);
|
||||
const fetch = (api, params = { orgId }, config) => {
|
||||
return http.post(api, params, config);
|
||||
};
|
||||
// 判断展示哪个页面
|
||||
const isMainPage = ref(true);
|
||||
@@ -205,7 +205,30 @@
|
||||
{
|
||||
label: '下载',
|
||||
name: 'download',
|
||||
handle: (record: any) => {},
|
||||
handle: (record: any) => {
|
||||
const deleteId = ref(new FormData());
|
||||
deleteId.value.append('id', record.id);
|
||||
const config = {
|
||||
responseType: 'blob',
|
||||
};
|
||||
fetch(carbonInventoryCheck.downloadZip, deleteId.value, config)
|
||||
.then((res) => {
|
||||
// 创建一个 URL 对象，指向图片数据的 blob
|
||||
const url = window.URL.createObjectURL(new Blob([res]));
|
||||
// 创建一个 <a> 标签，用于触发下载
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.setAttribute('download', '碳盘查凭证.zip'); // 设置下载的文件名
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
|
||||
// 清理 URL 对象
|
||||
window.URL.revokeObjectURL(url);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('下载图片失败：', error);
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
|
||||
@@ -100,8 +100,20 @@
|
||||
const drawEcharts = () => {
|
||||
data.value.forEach((item, index) => {
|
||||
const chart = echarts.init(document.getElementById(`ydlChart_${index}`)!);
|
||||
|
||||
const handred = 100;
|
||||
const bottomColor = [
|
||||
'rgba(219, 222, 232, 1)',
|
||||
'rgba(221, 226, 223, 1)',
|
||||
'rgba(233, 228, 219, 1)',
|
||||
'rgba(221, 216, 235, 1)',
|
||||
'rgba(240, 228, 228, 1)',
|
||||
];
|
||||
const mianColor = [
|
||||
'rgba(24, 106, 255, 1)',
|
||||
'rgba(58, 194, 127, 1)',
|
||||
'rgba(249, 183, 50, 1)',
|
||||
'rgba(120, 76, 212, 1)',
|
||||
'rgba(255, 55, 103, 1)',
|
||||
];
|
||||
let point = parseInt(item.budgetAchievement.replace('%', ''));
|
||||
const option = {
|
||||
backgroundColor: 'transparent',
|
||||
@@ -127,55 +139,61 @@
|
||||
},
|
||||
},
|
||||
],
|
||||
// tooltip: {
|
||||
// formatter: function (params) {
|
||||
// return params.name + '：' + params.percent + ' %';
|
||||
// },
|
||||
// },
|
||||
series: [
|
||||
{
|
||||
name: 'circle',
|
||||
type: 'pie',
|
||||
clockWise: true,
|
||||
radius: ['40%', '50%'],
|
||||
center: ['50%', '40%'],
|
||||
itemStyle: {
|
||||
label: {
|
||||
normal: {
|
||||
label: {
|
||||
show: false,
|
||||
},
|
||||
labelLine: {
|
||||
show: false,
|
||||
},
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
hoverAnimation: false,
|
||||
data: [
|
||||
{
|
||||
value: point,
|
||||
name: '占比',
|
||||
name: '',
|
||||
value: 100,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#4FADFD',
|
||||
label: {
|
||||
show: false,
|
||||
},
|
||||
labelLine: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: '剩余',
|
||||
value: handred - point,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#E1E8EE',
|
||||
color: bottomColor[index],
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
zlevel: 1,
|
||||
},
|
||||
{
|
||||
name: 'main',
|
||||
type: 'pie',
|
||||
radius: ['38%', '55%'],
|
||||
center: ['50%', '40%'],
|
||||
data: [
|
||||
{
|
||||
value: point,
|
||||
label: {
|
||||
show: true,
|
||||
position: 'center',
|
||||
fontSize: 40,
|
||||
},
|
||||
labelLine: { show: false },
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: mianColor[index],
|
||||
shadowBlur: 10,
|
||||
shadowColor: mianColor[index],
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
value: 100 - point,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: 'transparent',
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
zlevel: 2,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
@@ -459,7 +459,26 @@
|
||||
barWidth: 18,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#6395f9',
|
||||
color: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(45, 178, 246, 1)', // 0% 处的颜色
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(255, 255, 255, 0)', // 100% 处的颜色
|
||||
},
|
||||
],
|
||||
false,
|
||||
),
|
||||
borderWidth: 2,
|
||||
borderColor: 'rgba(45, 178, 246, 1)',
|
||||
padding: 0,
|
||||
},
|
||||
},
|
||||
data: lastYearActualUsageList.value,
|
||||
@@ -469,9 +488,26 @@
|
||||
type: 'bar',
|
||||
barWidth: 18,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: '#62daab',
|
||||
},
|
||||
color: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: 'rgba(28, 184, 142, 1)', // 0% 处的颜色
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: 'rgba(255, 255, 255, 0)', // 100% 处的颜色
|
||||
},
|
||||
],
|
||||
false,
|
||||
),
|
||||
borderWidth: 2,
|
||||
borderColor: 'rgba(28, 184, 142, 1)',
|
||||
padding: 0,
|
||||
},
|
||||
data: actualUsageList.value,
|
||||
},
|
||||
@@ -481,7 +517,7 @@
|
||||
smooth: true, // 开启平滑曲线
|
||||
symbol: 'none', //标记的图形为实心圆
|
||||
lineStyle: {
|
||||
color: '#f4664a',
|
||||
color: 'rgba(255, 188, 70, 1)',
|
||||
width: 2,
|
||||
},
|
||||
data: budgetList.value,
|
||||
@@ -492,7 +528,7 @@
|
||||
smooth: true, // 开启平滑曲线
|
||||
symbol: 'none', //标记的图形为实心圆
|
||||
lineStyle: {
|
||||
color: '#f4664a',
|
||||
color: 'rgba(195, 142, 255, 1)',
|
||||
width: 2,
|
||||
},
|
||||
data: referenceValueList.value,
|
||||
@@ -559,6 +595,7 @@
|
||||
.contant {
|
||||
width: 100%;
|
||||
height: calc(100% - 5vh);
|
||||
overflow: auto;
|
||||
.chartsPart {
|
||||
width: 100%;
|
||||
height: 63%;
|
||||
|
||||
@@ -260,25 +260,45 @@
|
||||
series: [
|
||||
{
|
||||
name: '实际用量',
|
||||
type: 'bar',
|
||||
barWidth: 18,
|
||||
type: 'pictorialBar',
|
||||
symbol: 'rect',
|
||||
itemStyle: {
|
||||
color: '#6395f9',
|
||||
},
|
||||
symbolRepeat: true,
|
||||
symbolSize: [14, 4],
|
||||
symbolMargin: 0.5,
|
||||
symbolPosition: 'start',
|
||||
z: -20,
|
||||
data: actualUsage.value,
|
||||
label: {
|
||||
normal: {
|
||||
color: '#6395f9',
|
||||
show: false,
|
||||
position: 'top',
|
||||
verticalAlign: 'top',
|
||||
},
|
||||
},
|
||||
data: actualUsage.value,
|
||||
},
|
||||
{
|
||||
name: '预算量',
|
||||
type: 'bar',
|
||||
barWidth: 18,
|
||||
type: 'pictorialBar',
|
||||
symbol: 'rect',
|
||||
itemStyle: {
|
||||
color: '#62daab',
|
||||
},
|
||||
symbolRepeat: true,
|
||||
symbolSize: [14, 4],
|
||||
symbolMargin: 0.5,
|
||||
symbolPosition: 'start',
|
||||
z: -20,
|
||||
data: budget.value,
|
||||
label: {
|
||||
normal: {
|
||||
color: '#62daab',
|
||||
show: false,
|
||||
position: 'top',
|
||||
verticalAlign: 'top',
|
||||
},
|
||||
},
|
||||
data: budget.value,
|
||||
},
|
||||
{
|
||||
name: '基准线',
|
||||
|
||||
@@ -23,7 +23,7 @@
|
||||
visible = !visible;
|
||||
}
|
||||
">
|
||||
<template v-for="index in 4">
|
||||
<template v-for="(item, index) in dataSource" :key="item.deviceInfoCode">
|
||||
<div
|
||||
style="
|
||||
flex: 1;
|
||||
@@ -33,8 +33,8 @@
|
||||
border: 1px solid #ab8757;
|
||||
font-weight: 500;
|
||||
"
|
||||
:style="{ 'background-color': ['#e43e1e', '#f59a23', '#bbcf10', '#62d7a7'][index - 1] }">
|
||||
{{ ['A号门', 'B号门', 'C号门', 'D号门'][index - 1] }}
|
||||
:style="{ 'background-color': ['#e43e1e', '#f59a23', '#bbcf10', '#62d7a7'][0] }">
|
||||
{{ ['A号门', 'B号门', 'C号门', 'D号门'][0] }}
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
@@ -54,14 +54,14 @@
|
||||
:pagination="false"
|
||||
:customRow="customRow">
|
||||
<template #bodyCell="{ record, column }">
|
||||
<template v-if="column.dataIndex === 'state'">
|
||||
<template v-if="column.dataIndex === 'EGstRu'">
|
||||
<a-tag
|
||||
style="background-color: rgba(0, 0, 0, 0.5); width: 50px"
|
||||
:style="{
|
||||
border: '1px solid' + ['#39d7bb', '#f3614d', '#ffa403'][record.status - 1],
|
||||
color: ['#39d7bb', '#f3614d', '#ffa403'][record.status - 1],
|
||||
border: '1px solid' + ['#39d7bb', '#f3614d', '#ffa403'][record.EGstRu],
|
||||
color: ['#39d7bb', '#f3614d', '#ffa403'][record.EGstRu],
|
||||
}"
|
||||
>{{ record.state }}</a-tag
|
||||
>{{ record.EGstRu }}</a-tag
|
||||
>
|
||||
</template>
|
||||
</template>
|
||||
@@ -98,13 +98,28 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onUnmounted } from 'vue';
|
||||
import electricDoorTables from './tables.vue';
|
||||
|
||||
import { electricDoorApi } from '/@/api/electricDoor';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { DoubleLeftOutlined, DoubleRightOutlined } from '@ant-design/icons-vue';
|
||||
|
||||
// 全局变量
|
||||
import { items } from '/@/store/item';
|
||||
// 全局变量
|
||||
const state = items();
|
||||
const getDoorList = () => {
|
||||
console.log('数据');
|
||||
http
|
||||
.get(electricDoorApi.getDeviceState, {
|
||||
projectId: state.projectId,
|
||||
siteId: state.siteId,
|
||||
floor: 1,
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.msg === 'success') {
|
||||
console.log(res, '数据');
|
||||
dataSource.value = res.data;
|
||||
}
|
||||
});
|
||||
};
|
||||
const intervalId = setInterval(getDoorList, 3000);
|
||||
const intervalId = setInterval(getDoorList, 10000);
|
||||
//页面 创建
|
||||
onMounted(() => {
|
||||
//调用电梯接口 定时获取电梯接口 获取当前门状态
|
||||
@@ -139,47 +154,21 @@
|
||||
},
|
||||
{
|
||||
title: '执行时间',
|
||||
dataIndex: 'age',
|
||||
key: 'age',
|
||||
dataIndex: 'time',
|
||||
key: 'time',
|
||||
width: 100,
|
||||
customRender: ({ value }) => {
|
||||
return value.substring(11, 19);
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'state',
|
||||
key: 'state',
|
||||
dataIndex: 'EGstRu',
|
||||
key: 'EGstRu',
|
||||
width: 160,
|
||||
},
|
||||
];
|
||||
const dataSource = [
|
||||
{
|
||||
key: '1',
|
||||
name: 'A号门',
|
||||
age: '23:50:20',
|
||||
state: '开启',
|
||||
status: 1,
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
name: 'B号门',
|
||||
age: '23:50:20',
|
||||
state: '关闭',
|
||||
status: 2,
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
name: 'C号门',
|
||||
age: '23:50:20',
|
||||
state: '维护中',
|
||||
status: 3,
|
||||
},
|
||||
{
|
||||
key: '4',
|
||||
name: 'D号门',
|
||||
age: '23:50:20',
|
||||
state: '维护中',
|
||||
status: 3,
|
||||
},
|
||||
];
|
||||
const dataSource = ref([]);
|
||||
const visible = ref(false);
|
||||
//详情属性
|
||||
const detailed = ref(false);
|
||||
|
||||
@@ -12,6 +12,13 @@
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { ref } from 'vue';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { electricDoorApi } from '/@/api/electricDoor';
|
||||
|
||||
// 全局变量
|
||||
import { items } from '/@/store/item';
|
||||
// 全局变量
|
||||
const state = items();
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
@@ -21,6 +28,7 @@
|
||||
pagination.value.pageSize = pageSize;
|
||||
console.log(current, pageSize);
|
||||
};
|
||||
const info = ref({});
|
||||
const pagination = ref({
|
||||
total: 0,
|
||||
size: 'small',
|
||||
@@ -48,7 +56,7 @@
|
||||
width: 80,
|
||||
},
|
||||
];
|
||||
const dataSourceLog = [
|
||||
const dataSourceLog = ref([
|
||||
{ age: '2024-07-26 23:50:20', state: '开启' },
|
||||
{ age: '2024-07-26 23:50:20', state: '关闭' },
|
||||
{ age: '2024-07-26 23:50:20', state: '开启' },
|
||||
@@ -74,11 +82,36 @@
|
||||
{ age: '2024-07-26 23:50:20', state: '开启' },
|
||||
{ age: '2024-07-26 23:50:20', state: '关闭' },
|
||||
{ age: '2024-07-26 23:50:20', state: '开启' },
|
||||
];
|
||||
const toggle = (data: any) => {
|
||||
console.log(data, '数据');
|
||||
]);
|
||||
const getList = () => {
|
||||
http
|
||||
.get(electricDoorApi.getDeviceRecordList, {
|
||||
projectId: state.projectId,
|
||||
siteId: state.siteId,
|
||||
codeList: info.value.deviceInfoCode,
|
||||
page: pagination.value.current,
|
||||
size: pagination.value.pageSize,
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.msg === 'success') {
|
||||
console.log(res, '数据');
|
||||
dataSourceLog.value = res.data;
|
||||
}
|
||||
});
|
||||
};
|
||||
const toggle = (data: any) => {
|
||||
info.value = data;
|
||||
getList();
|
||||
};
|
||||
return {
|
||||
columnLog,
|
||||
dataSourceLog,
|
||||
toggle,
|
||||
pagination,
|
||||
handleChangePage,
|
||||
info,
|
||||
getList,
|
||||
};
|
||||
return { columnLog, dataSourceLog, toggle, pagination, handleChangePage };
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14.6484375" height="14.6502685546875" viewBox="0 0 14.6484375 14.6502685546875" fill="none">
|
||||
<path d="M0 0.586563L0 13.5965C0 14.1778 0.472382 14.6503 1.05357 14.6503L13.5949 14.6503C14.1762 14.6503 14.6485 14.1778 14.6485 13.5965L14.6485 1.0537C14.6485 0.472435 14.1762 0 13.5949 0L0.586494 0C0.263397 0 0 0.26342 0 0.586563ZM10.4552 9.30261L11.8653 9.30261C11.9461 9.30261 12.011 9.36758 12.011 9.44839L12.011 10.3282C12.011 10.3669 11.9952 10.4038 11.9689 10.4319C11.9408 10.46 11.9039 10.474 11.8653 10.474L10.4552 10.474C10.1988 11.259 9.46833 11.7912 8.64301 11.7929C7.79662 11.7929 7.07666 11.2379 6.83083 10.474L2.78326 10.474C2.70245 10.474 2.6375 10.4073 2.6375 10.3282L2.6375 9.45014C2.6375 9.3676 2.70245 9.30437 2.78326 9.30437L6.82908 9.30437C7.08543 8.51934 7.81596 7.98724 8.64124 7.98547C9.48939 7.98547 10.2094 8.53868 10.4552 9.30261ZM7.81944 4.18152L7.8177 4.17624L11.8635 4.17624C11.9443 4.17624 12.0093 4.24125 12.0093 4.32201L12.0093 5.20011C12.0093 5.23876 11.9934 5.2774 11.9671 5.30376C11.939 5.33185 11.9021 5.34766 11.8635 5.34766L7.81944 5.34766L7.82121 5.33887C7.56835 6.12738 6.83434 6.66127 6.00724 6.66127C5.18019 6.66127 4.44618 6.12738 4.19155 5.34061L4.19333 5.3494L2.78326 5.3494C2.70245 5.3494 2.6375 5.28266 2.6375 5.20189L2.6375 4.32201C2.6375 4.24299 2.70245 4.17624 2.78326 4.17624L4.19333 4.17624L4.19155 4.18327C4.44444 3.39474 5.17844 2.86089 6.00552 2.86089C6.8326 2.86089 7.56657 3.39474 7.81944 4.18152ZM6.00552 5.42139C6.24783 5.43195 6.4761 5.309 6.60077 5.10002C6.72546 4.89104 6.72546 4.63288 6.60077 4.42389C6.47663 4.21533 6.24793 4.09186 6.00552 4.10249C5.65253 4.11656 5.37334 4.40808 5.37334 4.76108C5.37509 5.11584 5.65253 5.40734 6.00552 5.42139ZM8.32342 9.31318L8.27953 9.33949C8.27778 9.33949 8.27778 9.34127 8.27602 9.34127L8.25318 9.35708C8.22861 9.37639 8.20401 9.3957 8.18294 9.41852L8.17767 9.42204L8.15836 9.44488C8.14432 9.45892 8.13026 9.47472 8.11974 9.49227L8.11974 9.49406L8.10394 9.51689L8.09865 9.5239C8.08285 9.54671 8.07056 9.56957 8.05827 9.5959C8.0565 9.59943 8.05476 9.60468 8.05125 9.60821L8.04247 9.62752L8.03543 9.64682C8.03191 9.65563 8.02664 9.66439 8.02664 9.67318L8.01963 9.69603L8.01434 9.71355L8.00909 9.73817C8.00733 9.74342 8.00733 9.74693 8.0056 9.75044L7.99856 9.78909C7.99856 9.79259 7.99856 9.79613 7.9968 9.80139L7.9933 9.83125L7.99155 9.84353L7.98978 9.88569C7.98978 9.9015 7.98978 9.91376 7.99155 9.92781L7.9933 9.94013C7.9933 9.95066 7.99503 9.96117 7.9968 9.97173C7.9968 9.97701 7.9968 9.98053 7.99856 9.98403L8.0056 10.0227C8.00733 10.0262 8.00733 10.0315 8.00909 10.035L8.01434 10.0613L8.01963 10.0789L8.02664 10.1017L8.03543 10.128L8.04247 10.1474L8.05125 10.1667C8.05302 10.1702 8.05476 10.1755 8.05827 10.179C8.07056 10.2018 8.08461 10.2264 8.09865 10.251L8.10394 10.258L8.11974 10.2808L8.11974 10.2826L8.15836 10.33C8.16539 10.337 8.17065 10.3458 8.17767 10.3528L8.18116 10.3563C8.20226 10.3774 8.22332 10.3967 8.24617 10.4143L8.25143 10.4178L8.27425 10.4336C8.27602 10.4336 8.27602 10.4354 8.27778 10.4354L8.32169 10.4617L8.33046 10.467C8.52536 10.5706 8.7589 10.5706 8.9538 10.467L8.96262 10.4617L9.00652 10.4354C9.00825 10.4354 9.00825 10.4336 9.01001 10.4336L9.03282 10.4178C9.05742 10.4003 9.082 10.3792 9.10313 10.3563L9.10836 10.3528L9.12767 10.33C9.14171 10.3159 9.15575 10.3001 9.16631 10.2826L9.16631 10.2808L9.18209 10.258L9.18738 10.251C9.20142 10.2281 9.21724 10.2036 9.22776 10.1807C9.22952 10.1755 9.23129 10.1702 9.23481 10.1667L9.24355 10.1474L9.2506 10.128C9.25412 10.1193 9.25762 10.1105 9.25937 10.1017L9.26642 10.0789L9.27168 10.063L9.27694 10.0367C9.27868 10.0332 9.27868 10.0279 9.28043 10.0244L9.28748 9.98579C9.28748 9.98229 9.28748 9.97701 9.28923 9.97349L9.29272 9.94364C9.29272 9.94013 9.29272 9.93484 9.2945 9.93133L9.29625 9.88918C9.29625 9.87514 9.29625 9.86284 9.2945 9.84705L9.29272 9.83475C9.29272 9.82246 9.29102 9.81192 9.28923 9.80311C9.28923 9.79965 9.28923 9.79435 9.28748 9.79082L9.28043 9.7522C9.27868 9.74871 9.27868 9.74342 9.27694 9.73993L9.27168 9.71355L9.26642 9.69776C9.26464 9.68898 9.26113 9.68196 9.25937 9.67494L9.2506 9.64682L9.24355 9.62752L9.23481 9.60821C9.23303 9.60468 9.23129 9.59943 9.22776 9.5959C9.21548 9.57133 9.20142 9.54671 9.18738 9.5239L9.18209 9.51689L9.16631 9.49406L9.16631 9.49227C9.15401 9.47647 9.13997 9.45892 9.12767 9.44488C9.12066 9.43785 9.11537 9.42905 9.10836 9.42204L9.10485 9.41852C9.082 9.39746 9.05742 9.37639 9.03282 9.35708L9.01001 9.34127C9.00825 9.34127 9.00825 9.33949 9.00652 9.33949L8.96262 9.31318L8.9538 9.30789C8.7589 9.20429 8.52536 9.20429 8.33046 9.30789C8.3287 9.30964 8.32517 9.31142 8.32342 9.31318Z" fill="#5757FF" >
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.6 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14.6484375" height="14.6502685546875" viewBox="0 0 14.6484375 14.6502685546875" fill="none">
|
||||
<path d="M0 0.586563L0 13.5965C0 14.1778 0.472382 14.6503 1.05357 14.6503L13.5949 14.6503C14.1762 14.6503 14.6485 14.1778 14.6485 13.5965L14.6485 1.0537C14.6485 0.472435 14.1762 0 13.5949 0L0.586494 0C0.263397 0 0 0.26342 0 0.586563ZM10.4552 9.30261L11.8653 9.30261C11.9461 9.30261 12.011 9.36758 12.011 9.44839L12.011 10.3282C12.011 10.3669 11.9952 10.4038 11.9689 10.4319C11.9408 10.46 11.9039 10.474 11.8653 10.474L10.4552 10.474C10.1988 11.259 9.46833 11.7912 8.64301 11.7929C7.79662 11.7929 7.07666 11.2379 6.83083 10.474L2.78326 10.474C2.70245 10.474 2.6375 10.4073 2.6375 10.3282L2.6375 9.45014C2.6375 9.3676 2.70245 9.30437 2.78326 9.30437L6.82908 9.30437C7.08543 8.51934 7.81596 7.98724 8.64124 7.98547C9.48939 7.98547 10.2094 8.53868 10.4552 9.30261ZM7.81944 4.18152L7.8177 4.17624L11.8635 4.17624C11.9443 4.17624 12.0093 4.24125 12.0093 4.32201L12.0093 5.20011C12.0093 5.23876 11.9934 5.2774 11.9671 5.30376C11.939 5.33185 11.9021 5.34766 11.8635 5.34766L7.81944 5.34766L7.82121 5.33887C7.56835 6.12738 6.83434 6.66127 6.00724 6.66127C5.18019 6.66127 4.44618 6.12738 4.19155 5.34061L4.19333 5.3494L2.78326 5.3494C2.70245 5.3494 2.6375 5.28266 2.6375 5.20189L2.6375 4.32201C2.6375 4.24299 2.70245 4.17624 2.78326 4.17624L4.19333 4.17624L4.19155 4.18327C4.44444 3.39474 5.17844 2.86089 6.00552 2.86089C6.8326 2.86089 7.56657 3.39474 7.81944 4.18152ZM6.00552 5.42139C6.24783 5.43195 6.4761 5.309 6.60077 5.10002C6.72546 4.89104 6.72546 4.63288 6.60077 4.42389C6.47663 4.21533 6.24793 4.09186 6.00552 4.10249C5.65253 4.11656 5.37334 4.40808 5.37334 4.76108C5.37509 5.11584 5.65253 5.40734 6.00552 5.42139ZM8.32342 9.31318L8.27953 9.33949C8.27778 9.33949 8.27778 9.34127 8.27602 9.34127L8.25318 9.35708C8.22861 9.37639 8.20401 9.3957 8.18294 9.41852L8.17767 9.42204L8.15836 9.44488C8.14432 9.45892 8.13026 9.47472 8.11974 9.49227L8.11974 9.49406L8.10394 9.51689L8.09865 9.5239C8.08285 9.54671 8.07056 9.56957 8.05827 9.5959C8.0565 9.59943 8.05476 9.60468 8.05125 9.60821L8.04247 9.62752L8.03543 9.64682C8.03191 9.65563 8.02664 9.66439 8.02664 9.67318L8.01963 9.69603L8.01434 9.71355L8.00909 9.73817C8.00733 9.74342 8.00733 9.74693 8.0056 9.75044L7.99856 9.78909C7.99856 9.79259 7.99856 9.79613 7.9968 9.80139L7.9933 9.83125L7.99155 9.84353L7.98978 9.88569C7.98978 9.9015 7.98978 9.91376 7.99155 9.92781L7.9933 9.94013C7.9933 9.95066 7.99503 9.96117 7.9968 9.97173C7.9968 9.97701 7.9968 9.98053 7.99856 9.98403L8.0056 10.0227C8.00733 10.0262 8.00733 10.0315 8.00909 10.035L8.01434 10.0613L8.01963 10.0789L8.02664 10.1017L8.03543 10.128L8.04247 10.1474L8.05125 10.1667C8.05302 10.1702 8.05476 10.1755 8.05827 10.179C8.07056 10.2018 8.08461 10.2264 8.09865 10.251L8.10394 10.258L8.11974 10.2808L8.11974 10.2826L8.15836 10.33C8.16539 10.337 8.17065 10.3458 8.17767 10.3528L8.18116 10.3563C8.20226 10.3774 8.22332 10.3967 8.24617 10.4143L8.25143 10.4178L8.27425 10.4336C8.27602 10.4336 8.27602 10.4354 8.27778 10.4354L8.32169 10.4617L8.33046 10.467C8.52536 10.5706 8.7589 10.5706 8.9538 10.467L8.96262 10.4617L9.00652 10.4354C9.00825 10.4354 9.00825 10.4336 9.01001 10.4336L9.03282 10.4178C9.05742 10.4003 9.082 10.3792 9.10313 10.3563L9.10836 10.3528L9.12767 10.33C9.14171 10.3159 9.15575 10.3001 9.16631 10.2826L9.16631 10.2808L9.18209 10.258L9.18738 10.251C9.20142 10.2281 9.21724 10.2036 9.22776 10.1807C9.22952 10.1755 9.23129 10.1702 9.23481 10.1667L9.24355 10.1474L9.2506 10.128C9.25412 10.1193 9.25762 10.1105 9.25937 10.1017L9.26642 10.0789L9.27168 10.063L9.27694 10.0367C9.27868 10.0332 9.27868 10.0279 9.28043 10.0244L9.28748 9.98579C9.28748 9.98229 9.28748 9.97701 9.28923 9.97349L9.29272 9.94364C9.29272 9.94013 9.29272 9.93484 9.2945 9.93133L9.29625 9.88918C9.29625 9.87514 9.29625 9.86284 9.2945 9.84705L9.29272 9.83475C9.29272 9.82246 9.29102 9.81192 9.28923 9.80311C9.28923 9.79965 9.28923 9.79435 9.28748 9.79082L9.28043 9.7522C9.27868 9.74871 9.27868 9.74342 9.27694 9.73993L9.27168 9.71355L9.26642 9.69776C9.26464 9.68898 9.26113 9.68196 9.25937 9.67494L9.2506 9.64682L9.24355 9.62752L9.23481 9.60821C9.23303 9.60468 9.23129 9.59943 9.22776 9.5959C9.21548 9.57133 9.20142 9.54671 9.18738 9.5239L9.18209 9.51689L9.16631 9.49406L9.16631 9.49227C9.15401 9.47647 9.13997 9.45892 9.12767 9.44488C9.12066 9.43785 9.11537 9.42905 9.10836 9.42204L9.10485 9.41852C9.082 9.39746 9.05742 9.37639 9.03282 9.35708L9.01001 9.34127C9.00825 9.34127 9.00825 9.33949 9.00652 9.33949L8.96262 9.31318L8.9538 9.30789C8.7589 9.20429 8.52536 9.20429 8.33046 9.30789C8.3287 9.30964 8.32517 9.31142 8.32342 9.31318Z" fill="#55d1ff" >
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.6 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14.6484375" height="14.6502685546875" viewBox="0 0 14.6484375 14.6502685546875" fill="none">
|
||||
<path d="M0 0.586563L0 13.5965C0 14.1778 0.472382 14.6503 1.05357 14.6503L13.5949 14.6503C14.1762 14.6503 14.6485 14.1778 14.6485 13.5965L14.6485 1.0537C14.6485 0.472435 14.1762 0 13.5949 0L0.586494 0C0.263397 0 0 0.26342 0 0.586563ZM10.4552 9.30261L11.8653 9.30261C11.9461 9.30261 12.011 9.36758 12.011 9.44839L12.011 10.3282C12.011 10.3669 11.9952 10.4038 11.9689 10.4319C11.9408 10.46 11.9039 10.474 11.8653 10.474L10.4552 10.474C10.1988 11.259 9.46833 11.7912 8.64301 11.7929C7.79662 11.7929 7.07666 11.2379 6.83083 10.474L2.78326 10.474C2.70245 10.474 2.6375 10.4073 2.6375 10.3282L2.6375 9.45014C2.6375 9.3676 2.70245 9.30437 2.78326 9.30437L6.82908 9.30437C7.08543 8.51934 7.81596 7.98724 8.64124 7.98547C9.48939 7.98547 10.2094 8.53868 10.4552 9.30261ZM7.81944 4.18152L7.8177 4.17624L11.8635 4.17624C11.9443 4.17624 12.0093 4.24125 12.0093 4.32201L12.0093 5.20011C12.0093 5.23876 11.9934 5.2774 11.9671 5.30376C11.939 5.33185 11.9021 5.34766 11.8635 5.34766L7.81944 5.34766L7.82121 5.33887C7.56835 6.12738 6.83434 6.66127 6.00724 6.66127C5.18019 6.66127 4.44618 6.12738 4.19155 5.34061L4.19333 5.3494L2.78326 5.3494C2.70245 5.3494 2.6375 5.28266 2.6375 5.20189L2.6375 4.32201C2.6375 4.24299 2.70245 4.17624 2.78326 4.17624L4.19333 4.17624L4.19155 4.18327C4.44444 3.39474 5.17844 2.86089 6.00552 2.86089C6.8326 2.86089 7.56657 3.39474 7.81944 4.18152ZM6.00552 5.42139C6.24783 5.43195 6.4761 5.309 6.60077 5.10002C6.72546 4.89104 6.72546 4.63288 6.60077 4.42389C6.47663 4.21533 6.24793 4.09186 6.00552 4.10249C5.65253 4.11656 5.37334 4.40808 5.37334 4.76108C5.37509 5.11584 5.65253 5.40734 6.00552 5.42139ZM8.32342 9.31318L8.27953 9.33949C8.27778 9.33949 8.27778 9.34127 8.27602 9.34127L8.25318 9.35708C8.22861 9.37639 8.20401 9.3957 8.18294 9.41852L8.17767 9.42204L8.15836 9.44488C8.14432 9.45892 8.13026 9.47472 8.11974 9.49227L8.11974 9.49406L8.10394 9.51689L8.09865 9.5239C8.08285 9.54671 8.07056 9.56957 8.05827 9.5959C8.0565 9.59943 8.05476 9.60468 8.05125 9.60821L8.04247 9.62752L8.03543 9.64682C8.03191 9.65563 8.02664 9.66439 8.02664 9.67318L8.01963 9.69603L8.01434 9.71355L8.00909 9.73817C8.00733 9.74342 8.00733 9.74693 8.0056 9.75044L7.99856 9.78909C7.99856 9.79259 7.99856 9.79613 7.9968 9.80139L7.9933 9.83125L7.99155 9.84353L7.98978 9.88569C7.98978 9.9015 7.98978 9.91376 7.99155 9.92781L7.9933 9.94013C7.9933 9.95066 7.99503 9.96117 7.9968 9.97173C7.9968 9.97701 7.9968 9.98053 7.99856 9.98403L8.0056 10.0227C8.00733 10.0262 8.00733 10.0315 8.00909 10.035L8.01434 10.0613L8.01963 10.0789L8.02664 10.1017L8.03543 10.128L8.04247 10.1474L8.05125 10.1667C8.05302 10.1702 8.05476 10.1755 8.05827 10.179C8.07056 10.2018 8.08461 10.2264 8.09865 10.251L8.10394 10.258L8.11974 10.2808L8.11974 10.2826L8.15836 10.33C8.16539 10.337 8.17065 10.3458 8.17767 10.3528L8.18116 10.3563C8.20226 10.3774 8.22332 10.3967 8.24617 10.4143L8.25143 10.4178L8.27425 10.4336C8.27602 10.4336 8.27602 10.4354 8.27778 10.4354L8.32169 10.4617L8.33046 10.467C8.52536 10.5706 8.7589 10.5706 8.9538 10.467L8.96262 10.4617L9.00652 10.4354C9.00825 10.4354 9.00825 10.4336 9.01001 10.4336L9.03282 10.4178C9.05742 10.4003 9.082 10.3792 9.10313 10.3563L9.10836 10.3528L9.12767 10.33C9.14171 10.3159 9.15575 10.3001 9.16631 10.2826L9.16631 10.2808L9.18209 10.258L9.18738 10.251C9.20142 10.2281 9.21724 10.2036 9.22776 10.1807C9.22952 10.1755 9.23129 10.1702 9.23481 10.1667L9.24355 10.1474L9.2506 10.128C9.25412 10.1193 9.25762 10.1105 9.25937 10.1017L9.26642 10.0789L9.27168 10.063L9.27694 10.0367C9.27868 10.0332 9.27868 10.0279 9.28043 10.0244L9.28748 9.98579C9.28748 9.98229 9.28748 9.97701 9.28923 9.97349L9.29272 9.94364C9.29272 9.94013 9.29272 9.93484 9.2945 9.93133L9.29625 9.88918C9.29625 9.87514 9.29625 9.86284 9.2945 9.84705L9.29272 9.83475C9.29272 9.82246 9.29102 9.81192 9.28923 9.80311C9.28923 9.79965 9.28923 9.79435 9.28748 9.79082L9.28043 9.7522C9.27868 9.74871 9.27868 9.74342 9.27694 9.73993L9.27168 9.71355L9.26642 9.69776C9.26464 9.68898 9.26113 9.68196 9.25937 9.67494L9.2506 9.64682L9.24355 9.62752L9.23481 9.60821C9.23303 9.60468 9.23129 9.59943 9.22776 9.5959C9.21548 9.57133 9.20142 9.54671 9.18738 9.5239L9.18209 9.51689L9.16631 9.49406L9.16631 9.49227C9.15401 9.47647 9.13997 9.45892 9.12767 9.44488C9.12066 9.43785 9.11537 9.42905 9.10836 9.42204L9.10485 9.41852C9.082 9.39746 9.05742 9.37639 9.03282 9.35708L9.01001 9.34127C9.00825 9.34127 9.00825 9.33949 9.00652 9.33949L8.96262 9.31318L8.9538 9.30789C8.7589 9.20429 8.52536 9.20429 8.33046 9.30789C8.3287 9.30964 8.32517 9.31142 8.32342 9.31318Z" fill="#0090FF" >
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.6 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="14.6484375" height="14.6502685546875" viewBox="0 0 14.6484375 14.6502685546875" fill="none">
|
||||
<path d="M0 0.586563L0 13.5965C0 14.1778 0.472382 14.6503 1.05357 14.6503L13.5949 14.6503C14.1762 14.6503 14.6485 14.1778 14.6485 13.5965L14.6485 1.0537C14.6485 0.472435 14.1762 0 13.5949 0L0.586494 0C0.263397 0 0 0.26342 0 0.586563ZM10.4552 9.30261L11.8653 9.30261C11.9461 9.30261 12.011 9.36758 12.011 9.44839L12.011 10.3282C12.011 10.3669 11.9952 10.4038 11.9689 10.4319C11.9408 10.46 11.9039 10.474 11.8653 10.474L10.4552 10.474C10.1988 11.259 9.46833 11.7912 8.64301 11.7929C7.79662 11.7929 7.07666 11.2379 6.83083 10.474L2.78326 10.474C2.70245 10.474 2.6375 10.4073 2.6375 10.3282L2.6375 9.45014C2.6375 9.3676 2.70245 9.30437 2.78326 9.30437L6.82908 9.30437C7.08543 8.51934 7.81596 7.98724 8.64124 7.98547C9.48939 7.98547 10.2094 8.53868 10.4552 9.30261ZM7.81944 4.18152L7.8177 4.17624L11.8635 4.17624C11.9443 4.17624 12.0093 4.24125 12.0093 4.32201L12.0093 5.20011C12.0093 5.23876 11.9934 5.2774 11.9671 5.30376C11.939 5.33185 11.9021 5.34766 11.8635 5.34766L7.81944 5.34766L7.82121 5.33887C7.56835 6.12738 6.83434 6.66127 6.00724 6.66127C5.18019 6.66127 4.44618 6.12738 4.19155 5.34061L4.19333 5.3494L2.78326 5.3494C2.70245 5.3494 2.6375 5.28266 2.6375 5.20189L2.6375 4.32201C2.6375 4.24299 2.70245 4.17624 2.78326 4.17624L4.19333 4.17624L4.19155 4.18327C4.44444 3.39474 5.17844 2.86089 6.00552 2.86089C6.8326 2.86089 7.56657 3.39474 7.81944 4.18152ZM6.00552 5.42139C6.24783 5.43195 6.4761 5.309 6.60077 5.10002C6.72546 4.89104 6.72546 4.63288 6.60077 4.42389C6.47663 4.21533 6.24793 4.09186 6.00552 4.10249C5.65253 4.11656 5.37334 4.40808 5.37334 4.76108C5.37509 5.11584 5.65253 5.40734 6.00552 5.42139ZM8.32342 9.31318L8.27953 9.33949C8.27778 9.33949 8.27778 9.34127 8.27602 9.34127L8.25318 9.35708C8.22861 9.37639 8.20401 9.3957 8.18294 9.41852L8.17767 9.42204L8.15836 9.44488C8.14432 9.45892 8.13026 9.47472 8.11974 9.49227L8.11974 9.49406L8.10394 9.51689L8.09865 9.5239C8.08285 9.54671 8.07056 9.56957 8.05827 9.5959C8.0565 9.59943 8.05476 9.60468 8.05125 9.60821L8.04247 9.62752L8.03543 9.64682C8.03191 9.65563 8.02664 9.66439 8.02664 9.67318L8.01963 9.69603L8.01434 9.71355L8.00909 9.73817C8.00733 9.74342 8.00733 9.74693 8.0056 9.75044L7.99856 9.78909C7.99856 9.79259 7.99856 9.79613 7.9968 9.80139L7.9933 9.83125L7.99155 9.84353L7.98978 9.88569C7.98978 9.9015 7.98978 9.91376 7.99155 9.92781L7.9933 9.94013C7.9933 9.95066 7.99503 9.96117 7.9968 9.97173C7.9968 9.97701 7.9968 9.98053 7.99856 9.98403L8.0056 10.0227C8.00733 10.0262 8.00733 10.0315 8.00909 10.035L8.01434 10.0613L8.01963 10.0789L8.02664 10.1017L8.03543 10.128L8.04247 10.1474L8.05125 10.1667C8.05302 10.1702 8.05476 10.1755 8.05827 10.179C8.07056 10.2018 8.08461 10.2264 8.09865 10.251L8.10394 10.258L8.11974 10.2808L8.11974 10.2826L8.15836 10.33C8.16539 10.337 8.17065 10.3458 8.17767 10.3528L8.18116 10.3563C8.20226 10.3774 8.22332 10.3967 8.24617 10.4143L8.25143 10.4178L8.27425 10.4336C8.27602 10.4336 8.27602 10.4354 8.27778 10.4354L8.32169 10.4617L8.33046 10.467C8.52536 10.5706 8.7589 10.5706 8.9538 10.467L8.96262 10.4617L9.00652 10.4354C9.00825 10.4354 9.00825 10.4336 9.01001 10.4336L9.03282 10.4178C9.05742 10.4003 9.082 10.3792 9.10313 10.3563L9.10836 10.3528L9.12767 10.33C9.14171 10.3159 9.15575 10.3001 9.16631 10.2826L9.16631 10.2808L9.18209 10.258L9.18738 10.251C9.20142 10.2281 9.21724 10.2036 9.22776 10.1807C9.22952 10.1755 9.23129 10.1702 9.23481 10.1667L9.24355 10.1474L9.2506 10.128C9.25412 10.1193 9.25762 10.1105 9.25937 10.1017L9.26642 10.0789L9.27168 10.063L9.27694 10.0367C9.27868 10.0332 9.27868 10.0279 9.28043 10.0244L9.28748 9.98579C9.28748 9.98229 9.28748 9.97701 9.28923 9.97349L9.29272 9.94364C9.29272 9.94013 9.29272 9.93484 9.2945 9.93133L9.29625 9.88918C9.29625 9.87514 9.29625 9.86284 9.2945 9.84705L9.29272 9.83475C9.29272 9.82246 9.29102 9.81192 9.28923 9.80311C9.28923 9.79965 9.28923 9.79435 9.28748 9.79082L9.28043 9.7522C9.27868 9.74871 9.27868 9.74342 9.27694 9.73993L9.27168 9.71355L9.26642 9.69776C9.26464 9.68898 9.26113 9.68196 9.25937 9.67494L9.2506 9.64682L9.24355 9.62752L9.23481 9.60821C9.23303 9.60468 9.23129 9.59943 9.22776 9.5959C9.21548 9.57133 9.20142 9.54671 9.18738 9.5239L9.18209 9.51689L9.16631 9.49406L9.16631 9.49227C9.15401 9.47647 9.13997 9.45892 9.12767 9.44488C9.12066 9.43785 9.11537 9.42905 9.10836 9.42204L9.10485 9.41852C9.082 9.39746 9.05742 9.37639 9.03282 9.35708L9.01001 9.34127C9.00825 9.34127 9.00825 9.33949 9.00652 9.33949L8.96262 9.31318L8.9538 9.30789C8.7589 9.20429 8.52536 9.20429 8.33046 9.30789C8.3287 9.30964 8.32517 9.31142 8.32342 9.31318Z" fill="#bfcde2" >
|
||||
</path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.6 KiB |
@@ -0,0 +1,11 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.35638427734375" height="14.547119140625" viewBox="0 0 16.35638427734375 14.547119140625" fill="none">
|
||||
<path d="M12.6691 13.2533L12.1257 14.1938C11.9846 14.4383 11.672 14.522 11.4275 14.3809C11.183 14.2397 11.0993 13.9271 11.2404 13.6827L11.6994 12.8878L10.6976 12.8878C10.4153 12.8878 10.1865 12.659 10.1865 12.3767C10.1865 12.0944 10.4153 11.8656 10.6976 11.8656L11.8681 11.8656L11.2404 10.7789C11.0993 10.5344 11.183 10.2218 11.4275 10.0807C11.672 9.93953 11.9846 10.0233 12.1257 10.2678L12.6691 11.2083L13.2119 10.2678C13.353 10.0233 13.6656 9.93953 13.9101 10.0807C14.1546 10.2218 14.2383 10.5344 14.0972 10.7789L13.47 11.8656L14.6405 11.8656C14.9228 11.8656 15.1517 12.0944 15.1517 12.3767C15.1517 12.659 14.9228 12.8878 14.6405 12.8878L13.6387 12.8878L14.0972 13.6827C14.2384 13.9271 14.1546 14.2397 13.9101 14.3809C13.6656 14.522 13.353 14.4383 13.2119 14.1938L12.6691 13.2533ZM0.511139 1.52588e-05L15.8453 1.52588e-05C16.1276 1.52588e-05 16.3564 0.228851 16.3564 0.511139L16.3564 7.15594C16.3564 8.00282 15.6699 8.68936 14.823 8.68936L1.53341 8.68936C0.686531 8.68936 0 8.00282 0 7.15594L0 0.511139C0 0.228851 0.228844 0 0.511131 0L0.511139 1.52588e-05ZM2.04456 6.13367C1.76225 6.13367 1.53341 6.36252 1.53341 6.64481C1.53341 6.92709 1.76225 7.15594 2.04456 7.15594L14.3119 7.15594C14.5942 7.15594 14.823 6.92709 14.823 6.64481C14.823 6.36252 14.5942 6.13367 14.3119 6.13367L2.04456 6.13367ZM4.65442 10.0761C4.73544 9.80563 5.02035 9.65208 5.29079 9.73311C5.56123 9.81412 5.71478 10.099 5.63376 10.3695L5.43952 11.0171C5.35449 11.301 5.39153 11.6075 5.54175 11.863C5.83617 12.3634 5.90977 12.963 5.7457 13.5196L5.55044 14.1805C5.4706 14.4513 5.18634 14.606 4.91559 14.5261C4.64484 14.4462 4.49013 14.1619 4.57002 13.8912L4.76482 13.2303C4.84916 12.9451 4.81133 12.6374 4.66055 12.3818C4.36599 11.8811 4.29338 11.2802 4.46018 10.7237L4.65442 10.0761ZM7.72125 10.0761C7.80227 9.80563 8.08718 9.65208 8.35762 9.73311C8.62806 9.81412 8.7816 10.099 8.7006 10.3695L8.50636 11.0171C8.42132 11.301 8.45836 11.6075 8.60859 11.863C8.903 12.3634 8.9766 12.963 8.81253 13.5196L8.61728 14.1805C8.53743 14.4513 8.25317 14.606 7.98243 14.5261C7.71167 14.4462 7.55696 14.1619 7.63685 13.8912L7.83165 13.2303C7.916 12.9451 7.87817 12.6374 7.72738 12.3818C7.43282 11.8811 7.36021 11.2802 7.52702 10.7237L7.72125 10.0761ZM1.5876 10.0761C1.66862 9.80563 1.95353 9.65208 2.22397 9.73311C2.49441 9.81412 2.64796 10.099 2.56694 10.3695L2.3727 11.0171C2.28767 11.301 2.32471 11.6075 2.47494 11.863C2.76935 12.3634 2.84296 12.963 2.67888 13.5196L2.48363 14.1805C2.40379 14.4513 2.11952 14.606 1.84877 14.5261C1.57803 14.4462 1.42331 14.1619 1.50321 13.8912L1.69801 13.2303C1.78234 12.9451 1.74452 12.6374 1.59373 12.3818C1.29917 11.8811 1.22656 11.2802 1.39336 10.7237L1.5876 10.0761Z" fill="#55D1FF" >
|
||||
</path>
|
||||
<defs>
|
||||
<linearGradient id="linear_fill_160_5944" x1="8.178192138671875" y1="0" x2="8.178192138671875" y2="14.547119140625" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stop-color="#FFBB00" />
|
||||
<stop offset="0.9121009707450867" stop-color="#FFA303" />
|
||||
<stop offset="1" stop-color="#55D1FF" />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.1 KiB |
@@ -0,0 +1,11 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.35638427734375" height="14.547119140625" viewBox="0 0 16.35638427734375 14.547119140625" fill="none">
|
||||
<path d="M12.6691 13.2533L12.1257 14.1938C11.9846 14.4383 11.672 14.522 11.4275 14.3809C11.183 14.2397 11.0993 13.9271 11.2404 13.6827L11.6994 12.8878L10.6976 12.8878C10.4153 12.8878 10.1865 12.659 10.1865 12.3767C10.1865 12.0944 10.4153 11.8656 10.6976 11.8656L11.8681 11.8656L11.2404 10.7789C11.0993 10.5344 11.183 10.2218 11.4275 10.0807C11.672 9.93953 11.9846 10.0233 12.1257 10.2678L12.6691 11.2083L13.2119 10.2678C13.353 10.0233 13.6656 9.93953 13.9101 10.0807C14.1546 10.2218 14.2383 10.5344 14.0972 10.7789L13.47 11.8656L14.6405 11.8656C14.9228 11.8656 15.1517 12.0944 15.1517 12.3767C15.1517 12.659 14.9228 12.8878 14.6405 12.8878L13.6387 12.8878L14.0972 13.6827C14.2384 13.9271 14.1546 14.2397 13.9101 14.3809C13.6656 14.522 13.353 14.4383 13.2119 14.1938L12.6691 13.2533ZM0.511139 1.52588e-05L15.8453 1.52588e-05C16.1276 1.52588e-05 16.3564 0.228851 16.3564 0.511139L16.3564 7.15594C16.3564 8.00282 15.6699 8.68936 14.823 8.68936L1.53341 8.68936C0.686531 8.68936 0 8.00282 0 7.15594L0 0.511139C0 0.228851 0.228844 0 0.511131 0L0.511139 1.52588e-05ZM2.04456 6.13367C1.76225 6.13367 1.53341 6.36252 1.53341 6.64481C1.53341 6.92709 1.76225 7.15594 2.04456 7.15594L14.3119 7.15594C14.5942 7.15594 14.823 6.92709 14.823 6.64481C14.823 6.36252 14.5942 6.13367 14.3119 6.13367L2.04456 6.13367ZM4.65442 10.0761C4.73544 9.80563 5.02035 9.65208 5.29079 9.73311C5.56123 9.81412 5.71478 10.099 5.63376 10.3695L5.43952 11.0171C5.35449 11.301 5.39153 11.6075 5.54175 11.863C5.83617 12.3634 5.90977 12.963 5.7457 13.5196L5.55044 14.1805C5.4706 14.4513 5.18634 14.606 4.91559 14.5261C4.64484 14.4462 4.49013 14.1619 4.57002 13.8912L4.76482 13.2303C4.84916 12.9451 4.81133 12.6374 4.66055 12.3818C4.36599 11.8811 4.29338 11.2802 4.46018 10.7237L4.65442 10.0761ZM7.72125 10.0761C7.80227 9.80563 8.08718 9.65208 8.35762 9.73311C8.62806 9.81412 8.7816 10.099 8.7006 10.3695L8.50636 11.0171C8.42132 11.301 8.45836 11.6075 8.60859 11.863C8.903 12.3634 8.9766 12.963 8.81253 13.5196L8.61728 14.1805C8.53743 14.4513 8.25317 14.606 7.98243 14.5261C7.71167 14.4462 7.55696 14.1619 7.63685 13.8912L7.83165 13.2303C7.916 12.9451 7.87817 12.6374 7.72738 12.3818C7.43282 11.8811 7.36021 11.2802 7.52702 10.7237L7.72125 10.0761ZM1.5876 10.0761C1.66862 9.80563 1.95353 9.65208 2.22397 9.73311C2.49441 9.81412 2.64796 10.099 2.56694 10.3695L2.3727 11.0171C2.28767 11.301 2.32471 11.6075 2.47494 11.863C2.76935 12.3634 2.84296 12.963 2.67888 13.5196L2.48363 14.1805C2.40379 14.4513 2.11952 14.606 1.84877 14.5261C1.57803 14.4462 1.42331 14.1619 1.50321 13.8912L1.69801 13.2303C1.78234 12.9451 1.74452 12.6374 1.59373 12.3818C1.29917 11.8811 1.22656 11.2802 1.39336 10.7237L1.5876 10.0761Z" fill="url(#linear_fill_160_5944)" >
|
||||
</path>
|
||||
<defs>
|
||||
<linearGradient id="linear_fill_160_5944" x1="8.178192138671875" y1="0" x2="8.178192138671875" y2="14.547119140625" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stop-color="#FFBB00" />
|
||||
<stop offset="0.9121009707450867" stop-color="#FFA303" />
|
||||
<stop offset="1" stop-color="#FFA903" />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.2 KiB |
@@ -1,152 +0,0 @@
|
||||
import { planToAddApi } from '/@/api/planToAdd';
|
||||
import { ref } from 'vue';
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { getEnum } from '/@/api';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
|
||||
const enumData: any = await getEnum({ params: { enumType: 'CtrlDeviceType' } });
|
||||
export const tableConfig = (
|
||||
orgId: any,
|
||||
projectId: any,
|
||||
mainRef: any,
|
||||
nsModalFormConfig: any,
|
||||
modalFormRef: any,
|
||||
) => {
|
||||
return ref({
|
||||
title: '计划库',
|
||||
api: planToAddApi.getActivatedPlanListByTree,
|
||||
params: { orgId, projectId, deviceType: enumData.data[0].value },
|
||||
treeConfig: {
|
||||
defaultExpandAll: true,
|
||||
header: {
|
||||
icon: 'name',
|
||||
title: '执行计划',
|
||||
},
|
||||
params: { projectId, deviceType: enumData.data[0].value },
|
||||
dynamicParams: {
|
||||
id: 'id',
|
||||
pid: 'pid',
|
||||
level: 'level',
|
||||
projectId: 'projectId',
|
||||
deviceType: 'deviceType',
|
||||
},
|
||||
api: planToAddApi.getActivatedPlanTree,
|
||||
fieldNames: {
|
||||
title: 'name',
|
||||
key: 'id',
|
||||
pid: 'pid',
|
||||
level: 'level',
|
||||
projectId: 'projectId',
|
||||
deviceType: 'deviceType',
|
||||
children: 'childList',
|
||||
},
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'deviceType',
|
||||
label: '告警优先级',
|
||||
component: 'nsSelectApi',
|
||||
autoSubmit: true,
|
||||
componentProps: {
|
||||
api: () => getEnum({ params: { enumType: 'CtrlDeviceType' } }),
|
||||
immediate: true,
|
||||
resultField: 'data',
|
||||
labelField: 'label',
|
||||
valueField: 'value',
|
||||
placeholder: '请选择告警优先级',
|
||||
showSearch: true,
|
||||
autoSelectFirst: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
rowSelection: null,
|
||||
columns: [
|
||||
{
|
||||
title: '执行顺序',
|
||||
dataIndex: 'address',
|
||||
width: 100,
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '计划类型',
|
||||
dataIndex: 'planGroupName',
|
||||
},
|
||||
{
|
||||
title: '计划名称',
|
||||
dataIndex: 'planName',
|
||||
},
|
||||
{
|
||||
title: '执行时间',
|
||||
dataIndex: 'executionTime',
|
||||
},
|
||||
],
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
width: 200,
|
||||
fixed: 'right',
|
||||
dataIndex: 'tableAction',
|
||||
actions: [
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'energyAlarmEdit',
|
||||
dynamicParams: ['uuid', 'appealType'],
|
||||
handle: (data: any) => {
|
||||
const obj = { ...data };
|
||||
nsModalFormConfig.value.title = '编辑';
|
||||
setTimeout(() => {
|
||||
nsModalFormConfig.value.data = {
|
||||
id: obj.id,
|
||||
};
|
||||
if (obj.startTime) {
|
||||
nsModalFormConfig.value.data.createTime = obj.startTime
|
||||
? [obj.startTime, obj.endTime]
|
||||
: [];
|
||||
}
|
||||
}, 1);
|
||||
modalFormRef.value?.toggle();
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
name: 'energyAlarmDel',
|
||||
dynamicParams: ['uuid', 'appealType'],
|
||||
confirm: true,
|
||||
handle: (data: any) => {
|
||||
http.post(planToAddApi.updPlan, { id: data.id, isDeleted: 1 }).then((res) => {
|
||||
if (res.msg === 'success') {
|
||||
NsMessage.success('操作成功');
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
} else {
|
||||
NsMessage.error(res.msg);
|
||||
}
|
||||
});
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'planName',
|
||||
label: '计划标题',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请输入计划名称关键字',
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'uuid',
|
||||
});
|
||||
};
|
||||
@@ -9,11 +9,11 @@
|
||||
<NsModalFrom ref="modalFormRef" v-bind="nsModalFormConfig" />
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { tableConfig } from './config';
|
||||
import { ref, onMounted } from 'vue';
|
||||
import NsModalFrom from '/@/components/ns-modal-form.vue';
|
||||
import { planToAddApi } from '/@/api/planToAdd';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
import { getEnum } from '/@/api';
|
||||
|
||||
//页面 创建
|
||||
const orgId = ref('');
|
||||
@@ -65,15 +65,159 @@
|
||||
}
|
||||
},
|
||||
});
|
||||
const config = ref(null);
|
||||
const enumDataList: any = () => {
|
||||
return getEnum({ params: { enumType: 'CtrlDeviceType' } });
|
||||
};
|
||||
const getConfigData = async () => {
|
||||
const enumData = await enumDataList();
|
||||
config.value = {
|
||||
title: '计划库',
|
||||
api: planToAddApi.getActivatedPlanListByTree,
|
||||
params: { orgId, projectId, deviceType: enumData.data[0].value },
|
||||
treeConfig: {
|
||||
defaultExpandAll: true,
|
||||
header: {
|
||||
icon: 'name',
|
||||
title: '执行计划',
|
||||
},
|
||||
params: { projectId, deviceType: enumData.data[0].value },
|
||||
dynamicParams: {
|
||||
id: 'id',
|
||||
pid: 'pid',
|
||||
level: 'level',
|
||||
projectId: 'projectId',
|
||||
deviceType: 'deviceType',
|
||||
},
|
||||
api: planToAddApi.getActivatedPlanTree,
|
||||
fieldNames: {
|
||||
title: 'name',
|
||||
key: 'id',
|
||||
pid: 'pid',
|
||||
level: 'level',
|
||||
projectId: 'projectId',
|
||||
deviceType: 'deviceType',
|
||||
children: 'childList',
|
||||
},
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'deviceType',
|
||||
label: '告警优先级',
|
||||
component: 'nsSelectApi',
|
||||
autoSubmit: true,
|
||||
componentProps: {
|
||||
api: () => getEnum({ params: { enumType: 'CtrlDeviceType' } }),
|
||||
immediate: true,
|
||||
resultField: 'data',
|
||||
labelField: 'label',
|
||||
valueField: 'value',
|
||||
placeholder: '请选择告警优先级',
|
||||
showSearch: true,
|
||||
autoSelectFirst: true,
|
||||
filterOption: (input: string, option: any) => {
|
||||
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
rowSelection: null,
|
||||
columns: [
|
||||
{
|
||||
title: '执行顺序',
|
||||
dataIndex: 'address',
|
||||
width: 100,
|
||||
customRender: (text: any) => {
|
||||
return text.index + 1;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '计划类型',
|
||||
dataIndex: 'planGroupName',
|
||||
},
|
||||
{
|
||||
title: '计划名称',
|
||||
dataIndex: 'planName',
|
||||
},
|
||||
{
|
||||
title: '执行时间',
|
||||
dataIndex: 'executionTime',
|
||||
},
|
||||
],
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
width: 200,
|
||||
fixed: 'right',
|
||||
dataIndex: 'tableAction',
|
||||
actions: [
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'energyAlarmEdit',
|
||||
dynamicParams: ['uuid', 'appealType'],
|
||||
handle: (data: any) => {
|
||||
const obj = { ...data };
|
||||
nsModalFormConfig.value.title = '编辑';
|
||||
setTimeout(() => {
|
||||
nsModalFormConfig.value.data = {
|
||||
id: obj.id,
|
||||
};
|
||||
if (obj.startTime) {
|
||||
nsModalFormConfig.value.data.createTime = obj.startTime
|
||||
? [obj.startTime, obj.endTime]
|
||||
: [];
|
||||
}
|
||||
}, 1);
|
||||
modalFormRef.value?.toggle();
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
name: 'energyAlarmDel',
|
||||
dynamicParams: ['uuid', 'appealType'],
|
||||
confirm: true,
|
||||
handle: (data: any) => {
|
||||
http.post(planToAddApi.updPlan, { id: data.id, isDeleted: 1 }).then((res) => {
|
||||
if (res.msg === 'success') {
|
||||
NsMessage.success('操作成功');
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
} else {
|
||||
NsMessage.error(res.msg);
|
||||
}
|
||||
});
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'planName',
|
||||
label: '计划标题',
|
||||
component: 'NsInput',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请输入计划名称关键字',
|
||||
},
|
||||
},
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
// pagination: { pageSizeOptions: false },
|
||||
rowKey: 'uuid',
|
||||
};
|
||||
//刷新列表
|
||||
setTimeout(() => {
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
}, 1);
|
||||
};
|
||||
|
||||
//创建页面调用方法
|
||||
onMounted(() => {});
|
||||
const config = tableConfig(
|
||||
orgId.value,
|
||||
projectId.value,
|
||||
mainRef,
|
||||
nsModalFormConfig,
|
||||
modalFormRef,
|
||||
);
|
||||
onMounted(() => {
|
||||
getConfigData();
|
||||
});
|
||||
defineOptions({
|
||||
name: 'LedgerIndex', // 与页面路由name一致缓存才可生效
|
||||
});
|
||||
|
||||
37
hx-ai-intelligent/src/view/equipmentControl/style/color.less
Normal file
37
hx-ai-intelligent/src/view/equipmentControl/style/color.less
Normal file
@@ -0,0 +1,37 @@
|
||||
:root {
|
||||
// 电梯
|
||||
// 正常
|
||||
--on: #0dffa4;
|
||||
// 开启
|
||||
--open: #0dffa4;
|
||||
// 上行
|
||||
--up:#0dffa4;
|
||||
// 下行
|
||||
--down: #0dffa4;
|
||||
// 关闭
|
||||
--off: #bfcde2;
|
||||
// 暂停 - 维修
|
||||
--pause: #ffbc46;
|
||||
// 告警 - 急停
|
||||
--stop: #f36163;
|
||||
// 故障
|
||||
--fault: #ff7636;
|
||||
// 未知
|
||||
--unknown: #a742ff;
|
||||
|
||||
// 风机
|
||||
// 关
|
||||
--shut: #bfcde2;
|
||||
// 低速
|
||||
--low: #55d1ff;
|
||||
// 中速
|
||||
--middle: #0090FF;
|
||||
// 高速
|
||||
--high: #5757FF;
|
||||
|
||||
// 冷热风
|
||||
// 热风
|
||||
--hot: #fcf770;
|
||||
// 冷风
|
||||
--cold: #55D1FF;
|
||||
}
|
||||
@@ -1,86 +1,106 @@
|
||||
<template>
|
||||
<div class="box-model">
|
||||
<div class="box-model-title title">
|
||||
{{ dataSource.title }}
|
||||
</div>
|
||||
<div class="box-model-bottom">
|
||||
{{ dataSource.deviceGroupName ? dataSource.deviceGroupName : '--' }} </div
|
||||
><div class="box-model-bottom">
|
||||
<div class="box-model-item">
|
||||
<div style="width: 100%; height: 50%">
|
||||
<img width="40" src="../../image/ventilationSystem/state-success.png" />
|
||||
<!-- 正常=0 故障=1 维修=2 告警=3 -->
|
||||
<div>
|
||||
<div class="box-item">
|
||||
<img v-if="runStatus.value == 0" src="../../image/liftState/state-normal.svg" alt="" />
|
||||
<img v-if="runStatus.value == 1" src="../../image/liftState/state-fault.svg" alt="" />
|
||||
<img v-if="runStatus.value == 2" src="../../image/liftState/state-repair.svg" alt="" />
|
||||
<img v-if="runStatus.value == 3" src="../../image/liftState/state-alarm.svg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<!--正常 故障 维修 告警 -->
|
||||
<span
|
||||
:style="{
|
||||
color: {
|
||||
'1': '#0dffff',
|
||||
'2': 'rgba(255, 118, 54, 1)',
|
||||
'3': 'rgba(255, 188, 70, 1)',
|
||||
'4': 'rgba(243, 97, 99, 1)',
|
||||
}[1],
|
||||
}">
|
||||
正常
|
||||
</span>
|
||||
<span v-if="runStatus.value == 0" style="color: var(--on)">{{ runStatus.label }}</span>
|
||||
<span v-if="runStatus.value == 1" style="color: var(--fault)">{{ runStatus.label }}</span>
|
||||
<span v-if="runStatus.value == 2" style="color: var(--pause)">{{ runStatus.label }}</span>
|
||||
<span v-if="runStatus.value == 3" style="color: var(--stop)">{{ runStatus.label }}</span>
|
||||
</div>
|
||||
<div v-if="dataSource.type === 'fan'" class="box-model-item">
|
||||
<div style="width: 100%; height: 50%">
|
||||
<img width="40" src="../../image/ventilationSystem/highSpeed.png" />
|
||||
<!-- 关闭=0 低速=1 中速=2 高速=3 -->
|
||||
<div>
|
||||
<div class="box-item">
|
||||
<img v-if="runMode.value == 0" src="../../image/liftState/speed-shut.svg" alt="" />
|
||||
<img v-if="runMode.value == 1" src="../../image/liftState/speed-low.svg" alt="" />
|
||||
<img v-if="runMode.value == 2" src="../../image/liftState/speed-middle.svg" alt="" />
|
||||
<img v-if="runMode.value == 3" src="../../image/liftState/speed-high.svg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- 低速 中速 高速 关闭 -->
|
||||
<span
|
||||
:style="{
|
||||
color: [
|
||||
'rgba(85, 209, 255, 1)',
|
||||
'rgba(0, 144, 255, 1)',
|
||||
'rgba(87, 87, 255, 1)',
|
||||
'rgba(191, 205, 226, 1)',
|
||||
][2],
|
||||
fontSize: '12px',
|
||||
}">
|
||||
高速启动</span
|
||||
>
|
||||
<span v-if="runMode.value == 0" style="color: var(--shut)">{{ runMode.label }}</span>
|
||||
<span v-if="runMode.value == 1" style="color: var(--low)">{{ runMode.label }}</span>
|
||||
<span v-if="runMode.value == 2" style="color: var(--middle)">{{ runMode.label }}</span>
|
||||
<span v-if="runMode.value == 3" style="color: var(--high)">{{ runMode.label }}</span>
|
||||
</div>
|
||||
<div v-if="dataSource.type !== 'fan'" class="box-model-item">
|
||||
<div style="width: 100%; height: 50%">
|
||||
<img width="40" src="../../image/ventilationSystem/state-open.png" />
|
||||
<!-- 开启=1 关闭=0 -->
|
||||
<div>
|
||||
<div class="box-item">
|
||||
<img v-if="switchStatus.value == 0" src="../../image/liftState/switch-off.svg" alt="" />
|
||||
<img v-if="switchStatus.value == 1" src="../../image/liftState/switch-on.svg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- 开启 关闭 -->
|
||||
<span
|
||||
:style="{
|
||||
color: ['rgba(0, 255, 210, 1)', 'rgba(191, 205, 226, 1)'][0],
|
||||
fontSize: '12px',
|
||||
}">
|
||||
开启</span
|
||||
>
|
||||
<span v-if="switchStatus.value == 0" style="color: var(--shut)">{{
|
||||
switchStatus.label
|
||||
}}</span>
|
||||
<span v-if="switchStatus.value == 1" style="color: var(--low)">{{
|
||||
switchStatus.label
|
||||
}}</span>
|
||||
</div>
|
||||
<div v-if="dataSource.type === 'airCurtain'" class="box-model-item">
|
||||
<div style="width: 100%; height: 50%">
|
||||
<img width="40" src="../../image/ventilationSystem/hotAir.png" />
|
||||
<div>
|
||||
<!-- 关闭=0 冷风性能=1 热风性能=2 冷风节能=3 热风节能=4 -->
|
||||
<div class="box-item">
|
||||
<img
|
||||
v-if="runMode.value == 1 || runMode.value == 3"
|
||||
src="../../image/liftState/wind-cold.svg"
|
||||
alt="" />
|
||||
<img
|
||||
v-if="runMode.value == 2 || runMode.value == 4"
|
||||
src="../../image/liftState/wind-hot.svg"
|
||||
alt="" />
|
||||
<img v-if="runMode.value == 0" src="../../image/liftState/switch-on.svg" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- 冷风 热风 -->
|
||||
<span
|
||||
:style="{
|
||||
color: ['rgba(85, 209, 255, 1)', 'rgba(252, 247, 112, 1)'][1],
|
||||
fontSize: '12px',
|
||||
}">
|
||||
热风
|
||||
</span>
|
||||
<span v-if="runMode.value == 1 || runMode.value == 3" style="color: var(--cold)">{{
|
||||
runMode.label
|
||||
}}</span>
|
||||
<span v-if="runMode.value == 2 || runMode.value == 4" style="color: var(--hot)">{{
|
||||
runMode.label
|
||||
}}</span>
|
||||
<span v-if="runMode.value == 0" style="color: var(--shut)">{{ runMode.label }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, computed } from 'vue';
|
||||
const props = defineProps({
|
||||
dataSource: {
|
||||
type: Object,
|
||||
default: () => ({ title: '', number: 0 }), // 假设默认值还包括number属性
|
||||
default: () => ({}), // 假设默认值还包括number属性
|
||||
},
|
||||
});
|
||||
//
|
||||
const runStatus = computed(() => {
|
||||
return props.dataSource.record.runStatus;
|
||||
});
|
||||
const runMode = computed(() => {
|
||||
return props.dataSource.record.runMode;
|
||||
});
|
||||
const switchStatus = computed(() => {
|
||||
return props.dataSource.record.switchStatus;
|
||||
});
|
||||
onMounted(() => {
|
||||
console.log(props.dataSource, 'pppppppppppp');
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.box-model {
|
||||
position: relative;
|
||||
min-width: 162px;
|
||||
height: 110px;
|
||||
// height: 100px;
|
||||
background: inherit;
|
||||
background-color: rgba(2, 29, 71, 0.9);
|
||||
box-sizing: border-box;
|
||||
@@ -89,16 +109,18 @@
|
||||
border-color: rgba(13, 255, 255, 1);
|
||||
border-radius: 8px;
|
||||
z-index: 99;
|
||||
box-sizing: border-box;
|
||||
padding: 5px;
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
flex-direction: column;
|
||||
.title {
|
||||
position: relative;
|
||||
padding-left: 9px;
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: 90%;
|
||||
transform: translateY(-50%);
|
||||
height: 10px;
|
||||
left: 5px;
|
||||
top: 10px;
|
||||
height: 12px;
|
||||
width: 2.5px;
|
||||
border-radius: 1px;
|
||||
background-color: #0dffff;
|
||||
@@ -106,28 +128,43 @@
|
||||
}
|
||||
.box-model-title {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
padding-left: 12px;
|
||||
font-size: 12px;
|
||||
color: #0dffff;
|
||||
padding: 12px 20px;
|
||||
}
|
||||
.box-model-bottom {
|
||||
width: auto;
|
||||
height: 70px;
|
||||
margin-top: 12px;
|
||||
display: flex;
|
||||
color: white;
|
||||
font-size: 12px;
|
||||
display: flex;
|
||||
}
|
||||
.box-model-item {
|
||||
width: 80px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center; /* 垂直居中 */
|
||||
justify-content: center; /* 水平居中 */
|
||||
text-align: center; /* 文字水平居中 */
|
||||
flex-wrap: wrap;
|
||||
.box-model-item {
|
||||
width: 70px;
|
||||
display: flex;
|
||||
text-align: center;
|
||||
flex-direction: column;
|
||||
.box-item {
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
display: inline-block;
|
||||
background-image: url(../../image/box.svg);
|
||||
background-size: 125% 125%;
|
||||
background-position: -5px -5px;
|
||||
position: relative;
|
||||
img {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
margin: auto;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
span {
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,201 +1,767 @@
|
||||
<template>
|
||||
<a-spin :spinning="isLoading">
|
||||
<!-- 排风扇 -->
|
||||
<div>
|
||||
<div class="circuit-area">
|
||||
<div class="circuit-tab"></div>
|
||||
<span class="circuit-text">排风扇</span>
|
||||
<div class="btn2">
|
||||
<!-- 设备部分 -->
|
||||
<div>
|
||||
<div class="circuit-area">
|
||||
<div class="circuit-tab"></div>
|
||||
<span class="circuit-text">{{ props.type }}</span>
|
||||
<div class="btn2">
|
||||
<a-badge :offset="[-10, 2]" :count="lockList.length">
|
||||
<button
|
||||
class="openPlan"
|
||||
:class="{ enabled2: isPlanEnabled2, disabled2: !isPlanEnabled2 }"
|
||||
@click="togglePlan2">
|
||||
{{ isPlanEnabled2 ? '启用开关' : '禁用开关' }}
|
||||
</button>
|
||||
<a-switch
|
||||
v-model:checked="selectAllCheckbox"
|
||||
:disabled="singleSelection"
|
||||
:class="{
|
||||
'blue-background': selectAllCheckbox,
|
||||
'grey-background': !selectAllCheckbox,
|
||||
}"
|
||||
@change="toggleAllSelection" />
|
||||
<button class="allBtn">全选</button>
|
||||
<button class="both" @click="selectAll">
|
||||
{{ singleSelection ? '多选' : '单选' }}
|
||||
</button>
|
||||
</a-badge>
|
||||
<a-switch
|
||||
v-model:checked="selectAllCheckbox"
|
||||
:disabled="singleSelection"
|
||||
:class="{
|
||||
'blue-background': selectAllCheckbox,
|
||||
'grey-background': !selectAllCheckbox,
|
||||
}"
|
||||
@change="toggleAllSelection" />
|
||||
<button class="allBtn">全选</button>
|
||||
<button class="both" @click="selectAll">
|
||||
{{ singleSelection ? '多选' : '单选' }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btnArea">
|
||||
<template v-if="!showAllButtons">
|
||||
<button
|
||||
v-for="(button, index) in limitedButtons2"
|
||||
:key="index"
|
||||
:class="{ btn: true, selected: button.selected }"
|
||||
class="zmhlbtn"
|
||||
@click="changeLine(button)">
|
||||
<div v-if="button.lockStatus" class="btn-back">
|
||||
<stop-outlined />
|
||||
</div>
|
||||
{{ button.name }}
|
||||
</button>
|
||||
<div style="margin-top: 10px">
|
||||
<span @click="showAllButtons = true" class="openzm"><down-outlined /> 展开</span>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<button
|
||||
v-for="(button, index) in buttons2"
|
||||
:key="index"
|
||||
:class="{ btn: true, selected: button.selected }"
|
||||
class="zmhlbtn"
|
||||
@click="changeLine(button)">
|
||||
<div v-if="button.lockStatus" class="btn-back">
|
||||
<stop-outlined />
|
||||
</div>
|
||||
{{ button.name }}
|
||||
</button>
|
||||
<div style="margin-top: 10px">
|
||||
<span @click="showAllButtons = false" class="openzm"><up-outlined /> 回缩</span>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 控制模式部分 -->
|
||||
<div v-show="thisButton2.dataCode">
|
||||
<div class="control-area">
|
||||
<div class="control-tab"></div>
|
||||
<span class="control-text"> 控制模式 </span>
|
||||
</div>
|
||||
<!-- 控制模式按钮部分 -->
|
||||
<div class="control-mode-btn-area">
|
||||
<button
|
||||
v-for="(button3, index) in thisButton2.childList"
|
||||
:key="index"
|
||||
class="btn"
|
||||
:class="{ selected: button3.selectAble }"
|
||||
@click="selectButton3(button3)">
|
||||
{{ button3.name }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 控制场景部分 -->
|
||||
<div v-show="thisButton2.dataCode">
|
||||
<div class="control-scene-area">
|
||||
<div class="control-scene-tab"></div>
|
||||
<span class="control-scene-text"> 控制场景 </span>
|
||||
<div v-if="!singleSelection" style="flex: 1; color: red; text-align: right"
|
||||
>多选模式下会修改当前选中的所有回路</div
|
||||
>
|
||||
</div>
|
||||
<!-- 控制场景按钮部分 -->
|
||||
<div class="control-scene-btn-area">
|
||||
<button
|
||||
v-for="(button4, index) in thisButton3.childList"
|
||||
:key="index"
|
||||
:class="{ btn: true, selected: button4.executeStatus.value != 0 }"
|
||||
@click="selectButton4(button4)"
|
||||
>{{ button4.name }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 底部按钮区 -->
|
||||
<div class="bottom">
|
||||
<a-badge :offset="[-10, 2]" :count="changeList.length">
|
||||
<a-popconfirm
|
||||
title="刷新将会取消已作出的修改"
|
||||
ok-text="确定"
|
||||
cancel-text="取消"
|
||||
@confirm="refresh(false)"
|
||||
@cancel="changeCancel">
|
||||
<button class="flushed">刷新</button>
|
||||
</a-popconfirm>
|
||||
</a-badge>
|
||||
<button class="execute" @click="showModal">执行</button>
|
||||
</div>
|
||||
|
||||
<!-- 点击执行时的弹出框 -->
|
||||
<div class="out-dialog" v-if="executeVisible">
|
||||
<div class="content">
|
||||
<div>
|
||||
<div class="div-operation"></div>
|
||||
<span class="text-operation">变更内容 </span>
|
||||
</div>
|
||||
<div class="j-box" v-for="item in diffList" :key="item.id">
|
||||
<div class="journal" style="margin-top: 20px">
|
||||
<div class="imgText">
|
||||
<div class="zjzm">
|
||||
<img class="title-img" src="/asset/image//bulbLogo/21961.png" alt="" />
|
||||
<span
|
||||
class="title-text"
|
||||
style="font-size: 18px; font-weight: 500; color: rgba(255, 255, 255, 1)"
|
||||
>{{ item.regionName + ' > ' + item.deviceGroupName }}</span
|
||||
>
|
||||
</div>
|
||||
<a-popconfirm
|
||||
title="此操作将会撤销修改"
|
||||
ok-text="确定"
|
||||
cancel-text="取消"
|
||||
@confirm="delBtn(item)"
|
||||
@cancel="changeCancel">
|
||||
<button class="cxbtn">撤销</button>
|
||||
</a-popconfirm>
|
||||
</div>
|
||||
<div class="btn-box">
|
||||
<div class="btn-item">
|
||||
<div class="left">控制模式</div>
|
||||
<div class="right">
|
||||
<span>手动</span>
|
||||
<img src="/asset/image/bulbLogo/22406.png" alt="" />
|
||||
<span>自动</span></div
|
||||
>
|
||||
</div>
|
||||
<div class="btn-item">
|
||||
<div class="left"> 亮度 </div>
|
||||
<div class="right">
|
||||
<!-- 由于数字0也会被判为false，故只判断undefined 和 null -->
|
||||
<span>{{
|
||||
item?.stateBefore?.brightness != undefined ? item.stateBefore.brightness : '--'
|
||||
}}</span>
|
||||
<img src="/asset/image/bulbLogo/22406.png" alt="" />
|
||||
<span>{{
|
||||
item?.stateAfter?.brightness != undefined ? item.stateAfter.brightness : '--'
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-item">
|
||||
<div class="left"> 控制场景 </div>
|
||||
<div class="right">
|
||||
<span>{{
|
||||
item?.stateBefore?.scene?.label ? item.stateBefore.scene.label : '--'
|
||||
}}</span>
|
||||
<img src="/asset/image/bulbLogo/22406.png" alt="" />
|
||||
<span>{{
|
||||
item?.stateAfter?.scene?.label ? item.stateAfter.scene.label : '--'
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-item">
|
||||
<div class="left"> 色温 </div>
|
||||
<div class="right">
|
||||
<span>{{
|
||||
item?.stateBefore?.color != undefined ? item.stateBefore.color : '--'
|
||||
}}</span>
|
||||
<img src="/asset/image/bulbLogo/22406.png" alt="" />
|
||||
<span>
|
||||
{{ item?.stateAfter?.color != undefined ? item.stateAfter.color : '--' }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-item">
|
||||
<div class="left"> 启用状态 </div>
|
||||
<div class="right">
|
||||
<span>{{
|
||||
item?.stateBefore?.lockStatus != undefined
|
||||
? item.stateBefore.lockStatus
|
||||
? '禁用'
|
||||
: '启用'
|
||||
: '--'
|
||||
}}</span>
|
||||
<img src="/asset/image/bulbLogo/22406.png" alt="" />
|
||||
<span>
|
||||
{{
|
||||
item?.stateAfter?.lockStatus != undefined
|
||||
? item.stateAfter.lockStatus
|
||||
? '禁用'
|
||||
: '启用'
|
||||
: '--'
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btnArea">
|
||||
<template v-if="!showAllButtons">
|
||||
<button
|
||||
v-for="(button, index) in limitedButtons2"
|
||||
:key="index"
|
||||
:class="{ btn: true, selected: button.selected }"
|
||||
class="zmhlbtn"
|
||||
@click="changeLine(button)">
|
||||
<stop-outlined v-if="button.ctrlStatus" />
|
||||
{{ button.name }}
|
||||
</button>
|
||||
<div style="margin-top: 10px" v-if="limitedButtons2.length > 0">
|
||||
<span @click="showAllButtons = true" class="openzm"><down-outlined /> 展开</span>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<button
|
||||
v-for="(button, index) in buttons2"
|
||||
:key="index"
|
||||
:class="{ btn: true, selected: button.selected }"
|
||||
class="zmhlbtn"
|
||||
@click="changeLine(button)">
|
||||
<stop-outlined v-if="button.ctrlStatus" />
|
||||
{{ button.name }}
|
||||
</button>
|
||||
<div style="margin-top: 10px" v-if="buttons2.length > 0">
|
||||
<span @click="showAllButtons = false" class="openzm"><up-outlined /> 回缩</span>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 控制模式部分 -->
|
||||
<div>
|
||||
<div class="control-area">
|
||||
<div class="control-tab"></div>
|
||||
<span class="control-text"> 控制模式 </span>
|
||||
</div>
|
||||
<!-- 控制模式按钮部分 -->
|
||||
<div class="control-mode-btn-area" v-show="thisButton2.code">
|
||||
<button
|
||||
v-for="(button3, index) in controlMode"
|
||||
:key="index"
|
||||
class="btn"
|
||||
:disabled="button3.value != 3"
|
||||
:class="{ selected: thisButton2.mode.value == button3.value }"
|
||||
@click="selectButton3(button3)">
|
||||
{{ button3.label }}
|
||||
</button>
|
||||
</div>
|
||||
<div style="width: 100%; height: 60px"></div>
|
||||
<div class="button-box">
|
||||
<button class="cancel" @click="executeVisible = false">取消</button>
|
||||
<a-popconfirm
|
||||
title="此操作将提交以上修改内容"
|
||||
ok-text="确定"
|
||||
cancel-text="取消"
|
||||
@confirm="submitChangeList"
|
||||
@cancel="changeCancel">
|
||||
<button class="execute">执行</button>
|
||||
</a-popconfirm>
|
||||
</div>
|
||||
<!-- 控制场景 -->
|
||||
<div>
|
||||
<div class="control-area">
|
||||
<div class="control-tab"></div>
|
||||
<span class="control-text"> 控制场景 </span>
|
||||
</div>
|
||||
<!-- 控制模式按钮部分 -->
|
||||
<div class="control-mode-btn-area" v-show="thisButton2.code">
|
||||
<button
|
||||
v-for="(button3, index) in controlMode"
|
||||
:key="index"
|
||||
class="btn"
|
||||
:disabled="button3.value != 3"
|
||||
:class="{ selected: thisButton2.mode.value == button3.value }"
|
||||
@click="selectButton3(button3)">
|
||||
{{ button3.label }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="div-add">
|
||||
<button class="cancel" @click="addModal">刷新</button>
|
||||
<button class="add" @click="addModal">执行</button>
|
||||
</div>
|
||||
</a-spin>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { DownOutlined, UpOutlined, StopOutlined } from '@ant-design/icons-vue';
|
||||
import { ref, computed, onMounted } from 'vue';
|
||||
|
||||
const isLoading = ref(false);
|
||||
<script setup lang="ts">
|
||||
import { ref, computed, onMounted } from 'vue';
|
||||
import { DownOutlined, UpOutlined, StopOutlined } from '@ant-design/icons-vue';
|
||||
import { message } from 'ant-design-vue';
|
||||
// 请求
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { ventilating } from '/@/api/ventilatingSystem';
|
||||
// 全局变量
|
||||
import { items } from '/@/store/item';
|
||||
|
||||
// 初始化 =========================================================================
|
||||
|
||||
onMounted(() => {
|
||||
// 分区初始化
|
||||
setArea();
|
||||
if (props.type == '排风扇') {
|
||||
url.getList = ventilating.getChangeList1;
|
||||
url.sendList = ventilating.sendChangeList1;
|
||||
} else if (props.type == '风幕机') {
|
||||
url.getList = ventilating.getChangeList2;
|
||||
url.sendList = ventilating.sendChangeList2;
|
||||
} else {
|
||||
url.getList = ventilating.getChangeList3;
|
||||
url.sendList = ventilating.sendChangeList3;
|
||||
}
|
||||
});
|
||||
// 分区初始化，以 1-1 作为默认回路
|
||||
const setArea = () => {
|
||||
const data = props.treeData[0];
|
||||
buttons2.value = data.childList;
|
||||
};
|
||||
// 全局变量
|
||||
const state = items();
|
||||
// 网络请求路径
|
||||
const url = {
|
||||
getList: '',
|
||||
sendList: '',
|
||||
};
|
||||
|
||||
// 与父组件的交互 ===================================================================
|
||||
|
||||
const props = defineProps({
|
||||
// 分区结构（照明区域 > 照明回路）
|
||||
treeData: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
[];
|
||||
},
|
||||
},
|
||||
type: {
|
||||
type: String,
|
||||
},
|
||||
});
|
||||
/** 向上传递方法
|
||||
* @method changeArea 用于控制俯视图的选中状态
|
||||
* @method reset 用于重置按钮区
|
||||
* @method reload 用于刷新一次页面
|
||||
*/
|
||||
const emit = defineEmits(['reset', 'reload']);
|
||||
|
||||
// 照明回路业务 ======================================================================
|
||||
|
||||
// 开关启用/禁用状态
|
||||
const isPlanEnabled2 = ref(true);
|
||||
// 按钮区展开与收起状态
|
||||
const showAllButtons = ref(false);
|
||||
// 全选状态
|
||||
const selectAllCheckbox = ref(false);
|
||||
// 控制模式枚举
|
||||
const controlMode = ref([]);
|
||||
const isPlanEnabled2 = ref(false);
|
||||
// 开关修改保存数组
|
||||
const lockList = ref<any>([]);
|
||||
// 开关启用/禁用切换事件
|
||||
const togglePlan2 = () => {
|
||||
// 获取选中线路
|
||||
let valid = buttons2.value.filter((item: any) => {
|
||||
return item.selected;
|
||||
});
|
||||
// 未选中线路
|
||||
if (valid.length == 0) {
|
||||
return message.info('请先选择线路');
|
||||
// 选中线路
|
||||
} else {
|
||||
// 按钮切换
|
||||
isPlanEnabled2.value = !isPlanEnabled2.value;
|
||||
// 禁用状态原值
|
||||
let after = +isPlanEnabled2.value;
|
||||
// 当前修改线路
|
||||
valid.forEach((item: any) => {
|
||||
// 按钮与需修改的值一致，无效
|
||||
if (item.lockStatus == after) {
|
||||
return;
|
||||
}
|
||||
// 查看是否已经产生过修改
|
||||
const same = lockList.value.find((v: any) => {
|
||||
return v.deviceGroup == item.dataCode;
|
||||
});
|
||||
// 如果发生过修改
|
||||
if (same) {
|
||||
// 改回原值，则移除
|
||||
if (same.before == after) {
|
||||
lockList.value.forEach((v1: any, index: number) => {
|
||||
if (same.deviceGroup == v1.deviceGroup) {
|
||||
lockList.value.splice(index, 1);
|
||||
}
|
||||
});
|
||||
// 只有true 和 false 的切换，无需继续判断
|
||||
}
|
||||
// 初次修改
|
||||
} else {
|
||||
lockList.value.push({
|
||||
deviceGroup: item.dataCode,
|
||||
deviceGroupName: item.name,
|
||||
region: item.treePid,
|
||||
regionName: '',
|
||||
before: item.lockStatus,
|
||||
lockStatus: after,
|
||||
});
|
||||
}
|
||||
// 修改
|
||||
item.lockStatus = after;
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
// 是否单选，状态
|
||||
let singleSelection = ref(true);
|
||||
// 照明回路所有按钮
|
||||
const buttons2 = ref([]);
|
||||
// 默认最多展示8个按钮
|
||||
const limitedButtons2 = computed(() => buttons2.value.slice(0, 8));
|
||||
// 开关启用/禁用切换事件
|
||||
const togglePlan2 = () => {};
|
||||
// 内侧弹窗显隐
|
||||
const executeVisible = ref<boolean>(false);
|
||||
|
||||
const submitChangeList = () => {};
|
||||
// 多选与单选切换事件
|
||||
const selectAll = () => {
|
||||
selectAllCheckbox.value = false;
|
||||
// 切换时清空当前所有选项
|
||||
buttons2.value.forEach((button: any) => {
|
||||
button.selected = false;
|
||||
});
|
||||
singleSelection.value = !singleSelection.value;
|
||||
// 当前选中回路 - 置空
|
||||
resetMode();
|
||||
};
|
||||
|
||||
// 全选状态
|
||||
const selectAllCheckbox = ref(false);
|
||||
// 全选切换事件（switch）
|
||||
const toggleAllSelection = () => {
|
||||
let arr = [];
|
||||
// 全选
|
||||
if (selectAllCheckbox.value) {
|
||||
buttons2.value.forEach((item: any, index: number) => {
|
||||
// 全选时，默认展示第一条回路的模式-场景按钮
|
||||
if (index == 0) {
|
||||
thisButton2.value = item;
|
||||
}
|
||||
item.selected = true;
|
||||
arr.push(item.id);
|
||||
});
|
||||
// 全不选
|
||||
} else {
|
||||
buttons2.value.forEach((item: any) => {
|
||||
item.selected = false;
|
||||
});
|
||||
// 全不选时，隐藏 模式 与 场景 按钮
|
||||
resetMode();
|
||||
}
|
||||
};
|
||||
|
||||
// 储存当前选中的回路
|
||||
const thisButton2 = ref({
|
||||
code: '',
|
||||
dataCode: '',
|
||||
name: '',
|
||||
pcode: '',
|
||||
mode: {
|
||||
value: -1,
|
||||
},
|
||||
scene: {
|
||||
value: -1,
|
||||
},
|
||||
treePid: '',
|
||||
childList: [],
|
||||
});
|
||||
// 照明回路的按钮切换
|
||||
const changeLine = (button: any) => {
|
||||
// 根据按钮状态，展示禁用/启用按钮文本
|
||||
if (button.ctrlStatus) {
|
||||
isPlanEnabled2.value = true;
|
||||
} else {
|
||||
isPlanEnabled2.value = false;
|
||||
}
|
||||
// 单选模式，需将所有其他回路设为false
|
||||
if (singleSelection.value) {
|
||||
buttons2.value.forEach((item: any) => {
|
||||
item.selected = false;
|
||||
});
|
||||
button.selected = !button.selected;
|
||||
} else {
|
||||
// 多选模式传值
|
||||
button.selected = !button.selected;
|
||||
const arr = [];
|
||||
buttons2.value.forEach((item: any) => {
|
||||
if (item.selected) {
|
||||
arr.push(item.id);
|
||||
}
|
||||
});
|
||||
}
|
||||
// 用于展示控制模式
|
||||
if (button.selected) {
|
||||
// 发生了选中事件
|
||||
thisButton2.value = button;
|
||||
// 获得启动模式
|
||||
if (button.childList) {
|
||||
thisButton3.value = button.childList.find((item: any) => {
|
||||
if (item.selectAble) {
|
||||
return item.childList ? item.childList : [];
|
||||
}
|
||||
});
|
||||
} else {
|
||||
thisButton3.value = { childList: [] };
|
||||
}
|
||||
} else {
|
||||
// 未发生选中 或 多选的其中一个按钮被取消
|
||||
resetMode();
|
||||
}
|
||||
console.log(thisButton2, 'button');
|
||||
};
|
||||
|
||||
// 照明回路所有按钮
|
||||
const buttons2 = ref([]);
|
||||
// 按钮区展开与收起状态
|
||||
const showAllButtons = ref(false);
|
||||
// 默认最多展示8个按钮
|
||||
const limitedButtons2 = computed(() => buttons2.value.slice(0, 8));
|
||||
|
||||
// 控制模式业务 ====================================================================
|
||||
|
||||
const thisButton3 = ref({
|
||||
childList: [],
|
||||
});
|
||||
// 控制模式 - 按钮切换
|
||||
const selectButton3 = (button3: any) => {
|
||||
let checked = thisButton2.value.mode;
|
||||
console.log(button3.value, '---', checked.value);
|
||||
// 如果点击了相同的按钮，则未作出修改
|
||||
if (checked.value === button3.value) {
|
||||
return;
|
||||
console.log(button3);
|
||||
if (!button3.selectAble) {
|
||||
return message.warning(`${button3.name} 暂不支持`);
|
||||
}
|
||||
checked.value = button3.value;
|
||||
thisButton3.value = button3;
|
||||
};
|
||||
|
||||
// 全选切换事件（switch）
|
||||
const toggleAllSelection = () => {};
|
||||
onMounted(() => {});
|
||||
// 控制场景业务 =====================================================================
|
||||
|
||||
// 控制场景 - 按钮切换
|
||||
const selectButton4 = (button4: any) => {
|
||||
const after = button4.dataCode;
|
||||
let before = '';
|
||||
// 如果是多选模式
|
||||
if (!singleSelection.value) {
|
||||
// 操作线路总数
|
||||
let sum = 0;
|
||||
// 没有这个选项的线路
|
||||
// let nofind = 0;
|
||||
// 修改无效的数量
|
||||
let checked = 0;
|
||||
// 可修改的数量
|
||||
let changed = 0;
|
||||
buttons2.value.forEach((item: any) => {
|
||||
// 取出当前选中的值 before
|
||||
if (item.childList) {
|
||||
let mode = item.childList.find((lv3: any) => {
|
||||
return lv3.selectAble;
|
||||
});
|
||||
if (mode.childList) {
|
||||
mode.childList.forEach((mode: any) => {
|
||||
// 取出当前选中的模式
|
||||
if (mode.executeStatus.value == 1) {
|
||||
before = mode.dataCode;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
// 查看当前回路，哪些被选中
|
||||
if (item.selected) {
|
||||
item.childList.forEach((v: any) => {
|
||||
if (v.childList) {
|
||||
v.childList.forEach((v1: any) => {
|
||||
// 查看是否包含当前要修改的值
|
||||
if (v1.dataCode == after) {
|
||||
sum += 1;
|
||||
// 已经被选中，无需修改的内容
|
||||
if (before == after) {
|
||||
return (checked += 1);
|
||||
// 修改
|
||||
} else {
|
||||
changed += 1;
|
||||
changeScene(v1, before, after, item);
|
||||
v1.executeStatus.value = 1;
|
||||
}
|
||||
// 不符合条件的全部重置
|
||||
} else {
|
||||
v1.executeStatus.value = 0;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
message.info(`共修改${sum}条数据，其中${checked}条无需修改，${changed}条修改有效`);
|
||||
// 如果是单选模式
|
||||
} else {
|
||||
// 如果按钮已经被选择
|
||||
if (button4.executeStatus.value == 1) {
|
||||
return message.info('未产生实际修改');
|
||||
} else {
|
||||
// 获得线路当前的场景
|
||||
let before;
|
||||
thisButton2.value.childList.find((item: any) => {
|
||||
if (item.childList) {
|
||||
item.childList.forEach((i: any) => {
|
||||
if (i.executeStatus.value == 1) {
|
||||
return (before = i.dataCode);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
// 移除选中场景
|
||||
resetScene(thisButton2.value.childList);
|
||||
changeScene(button4, before, after);
|
||||
}
|
||||
}
|
||||
};
|
||||
// 切换场景前，需要把其他场景移除
|
||||
const resetScene = (list: any) => {
|
||||
list.forEach((item: any) => {
|
||||
if (item.childList) {
|
||||
item.childList.forEach((i: any) => {
|
||||
i.executeStatus.value = 0;
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
/** 控制场景 - 按钮切换通用方法（单选 & 多选）
|
||||
* @param button 当前被选中的回路（单选 & 多选）
|
||||
* @param before 回路场景的初始值（撤回时需使用）
|
||||
* @param after 回路场景被修改后的值
|
||||
* @param anyButton 多选时使用
|
||||
*/
|
||||
const changeScene = (button: any, before: string | undefined, after: string, line = null) => {
|
||||
// 通过分组ID，查询之前是否修改过
|
||||
const result = changeList.value.find((item: any, index: number) => {
|
||||
item.index = index;
|
||||
return item.deviceGroup == button.treePid.split('_')[0];
|
||||
});
|
||||
// 如果已产生过修改
|
||||
if (result) {
|
||||
// 改回了原有的值，则从数组中移除
|
||||
if (after == result.before) {
|
||||
changeList.value.splice(result.index, 1);
|
||||
// 修改为新值，则只修改场景
|
||||
} else {
|
||||
result.scene = after;
|
||||
// 临时flag，用后移除
|
||||
delete result.index;
|
||||
}
|
||||
// 如果未产生过修改
|
||||
} else {
|
||||
let nowButton;
|
||||
// 多选，则使用第四个参数
|
||||
if (line) {
|
||||
nowButton = line;
|
||||
// 如果是单选，则使用thisbotton2
|
||||
} else {
|
||||
nowButton = thisButton2.value;
|
||||
}
|
||||
changeList.value.push({
|
||||
// 回路
|
||||
deviceGroup: nowButton.dataCode,
|
||||
deviceGroupName: nowButton.name,
|
||||
// 分区
|
||||
region: nowButton.treePid,
|
||||
regionName: '',
|
||||
// 修改前
|
||||
before,
|
||||
scene: after,
|
||||
});
|
||||
}
|
||||
button.executeStatus.value = 1;
|
||||
};
|
||||
|
||||
// 底部按钮区 ======================================================================
|
||||
|
||||
// 刷新
|
||||
const refresh = (reload = false) => {
|
||||
// 关闭执行弹窗
|
||||
executeVisible.value = false;
|
||||
// 重置选中样式 和 按钮选中状态
|
||||
emit('reset');
|
||||
// 如果是中途刷新，需要将所有修改改回
|
||||
if (!reload) {
|
||||
changeList.value.forEach((item: any) => {
|
||||
resetChangeList(item);
|
||||
});
|
||||
}
|
||||
changeList.value = [];
|
||||
if (!reload) {
|
||||
lockList.value.forEach((item: any) => {
|
||||
resetLockList(item);
|
||||
});
|
||||
}
|
||||
lockList.value = [];
|
||||
// 默认选择第一个楼层
|
||||
let data = props.treeData[0];
|
||||
// 默认选中
|
||||
data.selected = true;
|
||||
// 默认选中 1-1 分区 回路
|
||||
buttons2.value = data.childList;
|
||||
resetMode();
|
||||
};
|
||||
// 将已修改的禁用/启用状态改回
|
||||
const resetLockList = (item: any) => {
|
||||
props.treeData.find((v: any) => {
|
||||
if (item.region == v.dataCode) {
|
||||
v.childList.find((v1: any) => {
|
||||
if (item.deviceGroup == v1.dataCode) {
|
||||
v1.lockStatus = item.before;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
// 将已修改的线路场景改回
|
||||
const resetChangeList = (item: any) => {
|
||||
props.treeData.find((v: any) => {
|
||||
if (item.region == v.dataCode) {
|
||||
v.childList.find((v1: any) => {
|
||||
// 找到被修改过的线路
|
||||
if (item.deviceGroup == v1.dataCode) {
|
||||
v1.childList.forEach((v2: any) => {
|
||||
if (v2.childList) {
|
||||
v2.childList.forEach((v3: any) => {
|
||||
// 将新值移除
|
||||
if (item.scene == v3.dataCode) {
|
||||
v3.executeStatus.value = 0;
|
||||
}
|
||||
if (!item.before) {
|
||||
console.log(item, '没有这个选项---');
|
||||
v3.executeStatus.value = 0;
|
||||
}
|
||||
// 旧值选中
|
||||
if (item.before == v3.dataCode) {
|
||||
v3.executeStatus.value = 1;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
// 右下角的执行事件
|
||||
const showModal = () => {
|
||||
if (!changeList.value.length && !lockList.value.length) {
|
||||
return message.info('未产生任何修改');
|
||||
}
|
||||
http
|
||||
.post(url.getList, {
|
||||
sceneList: changeList.value,
|
||||
lockList: lockList.value,
|
||||
projectId: state.projectId,
|
||||
siteId: state.siteId,
|
||||
})
|
||||
.then((res) => {
|
||||
if (res.msg === 'success') {
|
||||
diffList.value = res.data;
|
||||
executeVisible.value = true;
|
||||
} else {
|
||||
message.warning('获取修改内容失败');
|
||||
}
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
// 通用取消
|
||||
const changeCancel = () => {};
|
||||
|
||||
// 内侧弹窗 ========================================================================
|
||||
|
||||
// 内侧弹窗显隐
|
||||
const executeVisible = ref<boolean>(false);
|
||||
// 修改模式 需要向后端提交的内容
|
||||
const changeList: any = ref([]);
|
||||
// 展示修改前后差异的内容
|
||||
const diffList = ref([]);
|
||||
// 撤销
|
||||
const delBtn = (obj: any) => {
|
||||
console.log(obj, '当前选择的修改内容');
|
||||
// 将treeData对应回路的数据改回，数据以后端为准
|
||||
obj.scene = obj?.stateAfter?.scene?.value;
|
||||
obj.before = obj?.stateBefore?.scene?.value;
|
||||
resetChangeList(obj);
|
||||
resetLockList(obj);
|
||||
// 将 changeList lockList 与 diffList 中记录的修改移除 (排除极端情况)
|
||||
changeList.value = changeList.value.filter((item: any) => {
|
||||
return item.deviceGroup !== obj.deviceGroup;
|
||||
});
|
||||
lockList.value = lockList.value.filter((item: any) => {
|
||||
return item.deviceGroup !== obj.deviceGroup;
|
||||
});
|
||||
diffList.value = diffList.value.filter((item: any) => {
|
||||
return item.deviceGroup !== obj.deviceGroup;
|
||||
});
|
||||
// 如果移除后不再有修改内容，则隐藏弹出框
|
||||
if (changeList.value.length == 0 && lockList.value.length == 0) {
|
||||
executeVisible.value = false;
|
||||
}
|
||||
};
|
||||
// 提交本次修改
|
||||
const submitChangeList = () => {
|
||||
http
|
||||
.post(url.sendList, {
|
||||
sceneList: changeList.value,
|
||||
lockList: lockList.value,
|
||||
projectId: state.projectId,
|
||||
siteId: state.siteId,
|
||||
})
|
||||
.then(() => {
|
||||
emit('reload');
|
||||
refresh(true);
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
// 其他业务 ========================================================================
|
||||
|
||||
// 将当前选择的回路置空
|
||||
const resetMode = () => {
|
||||
thisButton2.value = {
|
||||
dataCode: '',
|
||||
name: '',
|
||||
treePid: '',
|
||||
childList: [],
|
||||
};
|
||||
};
|
||||
|
||||
// 向外暴露方法
|
||||
defineExpose({
|
||||
// 回路切换
|
||||
changeLine,
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import './dialogStyle.less';
|
||||
@import './tabs1.less';
|
||||
.div-add {
|
||||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
border-top: 1px solid #606879;
|
||||
width: 496px;
|
||||
.add {
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
background: #2778ff;
|
||||
border: #2778ff;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
cursor: pointer;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.cancel {
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
opacity: 1;
|
||||
border-radius: 4px;
|
||||
background: #ffffff;
|
||||
border: #ffffff;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
cursor: pointer;
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,23 @@
|
||||
<template>
|
||||
<div class="div-add">
|
||||
<button class="add" @click="addModal">添加</button>
|
||||
<a-popconfirm
|
||||
title="是否提交以上修改？"
|
||||
placement="bottomLeft"
|
||||
ok-text="确定"
|
||||
cancel-text="取消"
|
||||
@confirm="sendTable">
|
||||
<button class="add" style="margin-left: 20px">执行</button>
|
||||
</a-popconfirm>
|
||||
</div>
|
||||
<div class="buttons">
|
||||
<span style="color: red; padding-top: 20px">*以下修改需执行后生效</span>
|
||||
<div class="plans">
|
||||
<button class="plan enabled" style="margin-right: 10px" @click="togglePlan(1)">
|
||||
计划启用
|
||||
</button>
|
||||
<button class="plan disabled" @click="togglePlan(3)"> 计划禁用 </button>
|
||||
</div>
|
||||
</div>
|
||||
<table class="custom-table table1">
|
||||
<thead>
|
||||
@@ -17,35 +34,25 @@
|
||||
<td>{{ index + 1 }}</td>
|
||||
<td>{{ row.startTime }}</td>
|
||||
<td>{{ row.planName }}</td>
|
||||
<td v-if="row.planStatus == '2'">
|
||||
<td>
|
||||
<button
|
||||
style="
|
||||
font-size: 12px;
|
||||
background: rgba(57, 215, 187, 0.1);
|
||||
color: rgb(57, 215, 187);
|
||||
border: 1px solid rgb(57, 215, 187);
|
||||
">
|
||||
已执行
|
||||
</button>
|
||||
</td>
|
||||
<td v-if="row.planStatus == '1'">
|
||||
<button
|
||||
style="
|
||||
font-size: 12px;
|
||||
background: rgba(243, 97, 99, 0.1);
|
||||
border: 1px solid rgba(243, 97, 99);
|
||||
color: rgba(243, 97, 99);
|
||||
">
|
||||
待执行
|
||||
:style="{
|
||||
'font-size': '12px',
|
||||
width: '5em',
|
||||
background: 'rgb(47, 47, 47)',
|
||||
color: setStateColor(row.executeStatus.value),
|
||||
border: '1px solid',
|
||||
}">
|
||||
{{ setStateText(row.executeStatus.value) }}
|
||||
</button>
|
||||
</td>
|
||||
<td>
|
||||
<div class="tabReboot" @click="restartPlan(row.id)">重启</div>
|
||||
<div class="tabReboot" @click="startPlan(row)">启用</div>
|
||||
<a-popconfirm
|
||||
title="此操作将永久删除该条数据"
|
||||
title="此操作将移除该数据"
|
||||
ok-text="确定"
|
||||
cancel-text="取消"
|
||||
@confirm="deletePlan(row.id)">
|
||||
@confirm="deletePlan(row)">
|
||||
<div class="tabDelete">删除</div>
|
||||
</a-popconfirm>
|
||||
</td>
|
||||
@@ -81,40 +88,105 @@
|
||||
import { ref, onMounted } from 'vue';
|
||||
// 请求
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { lightingManage } from '/@/api/IlluminationInfo';
|
||||
import { ventilating } from '/@/api/ventilatingSystem';
|
||||
import { planManage } from '/@/api/planManage';
|
||||
import { message } from 'ant-design-vue';
|
||||
// 全局变量
|
||||
import { items } from '/@/store/item';
|
||||
|
||||
// 初始化 ===========================================================
|
||||
|
||||
const props = defineProps({
|
||||
// 分区结构（照明区域 > 照明回路）
|
||||
status: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
[];
|
||||
},
|
||||
},
|
||||
type: {
|
||||
type: Number,
|
||||
},
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
// 计划表格
|
||||
getTable();
|
||||
// 穿梭框原始数据
|
||||
getLeftPlan();
|
||||
let type = props.type;
|
||||
if (type == 3) {
|
||||
url = ventilating.submitTableData1;
|
||||
} else if (type == 4) {
|
||||
url = ventilating.submitTableData2;
|
||||
} else if (type == 5) {
|
||||
url = ventilating.submitTableData3;
|
||||
}
|
||||
});
|
||||
// 全局变量
|
||||
const state = items();
|
||||
let url = '';
|
||||
|
||||
// tab页部分 ========================================================
|
||||
|
||||
// 设置枚举的颜色 与 文本
|
||||
const setStateColor = (state: number) => {
|
||||
if (state == 0) {
|
||||
return '#ccc';
|
||||
} else if (state == 1) {
|
||||
return 'orange';
|
||||
} else if (state == 2) {
|
||||
return 'rgb(57, 215, 187)';
|
||||
} else if (state == 3) {
|
||||
return 'rgb(255, 0, 0)';
|
||||
}
|
||||
};
|
||||
// 设置枚举的文本
|
||||
const setStateText = (state: number) => {
|
||||
const res = props.status.find((item: any) => {
|
||||
return item.value == state;
|
||||
});
|
||||
return res.label;
|
||||
};
|
||||
// 计划启用/禁用事件
|
||||
const togglePlan = (state: number) => {
|
||||
dataSource.value.forEach((item: any) => {
|
||||
item.executeStatus.value = state;
|
||||
});
|
||||
};
|
||||
|
||||
// 表格数据
|
||||
const dataSource = ref([]);
|
||||
// 获得表格数据
|
||||
const getTable = () => {
|
||||
http.get(lightingManage.getPlanTable, {}).then((res) => {
|
||||
dataSource.value = res.data;
|
||||
});
|
||||
http
|
||||
.get(planManage.getTableData, {
|
||||
projectId: state.projectId,
|
||||
siteId: state.siteId,
|
||||
// 设备类型(1照明,2空调,3排风扇,4风幕机,5电动窗,6进水阀,7排水泵)
|
||||
deviceType: props.type,
|
||||
})
|
||||
.then((res) => {
|
||||
dataSource.value = res.data;
|
||||
});
|
||||
};
|
||||
// 删除表格中的计划
|
||||
const deletePlan = (id: String) => {
|
||||
http.delete(lightingManage.deletePlan, [id]).then(() => {
|
||||
message.success('操作成功');
|
||||
getTable();
|
||||
});
|
||||
};
|
||||
// 重启表格中的计划
|
||||
const restartPlan = (id: String) => {
|
||||
http.post(lightingManage.restartPlan, { planId: id }).then(() => {
|
||||
// 删除表格中的计划（将当前任意状态，修改为未启用 =0）
|
||||
const deletePlan = (row: any) => {
|
||||
row.executeStatus.value = 0;
|
||||
};
|
||||
// 重启表格中的计划（将当前任意状态，修改为待执行 = 1）
|
||||
const startPlan = (row: any) => {
|
||||
if (row.executeStatus.value == 1) {
|
||||
return message.info('该数据已是待执行状态，无需再次修改');
|
||||
}
|
||||
row.executeStatus.value = 1;
|
||||
};
|
||||
// 将对表格的修改统一发送
|
||||
const sendTable = () => {
|
||||
http.post(url, dataSource.value).then(() => {
|
||||
message.success('操作成功');
|
||||
getTable();
|
||||
getLeftPlan();
|
||||
});
|
||||
};
|
||||
|
||||
@@ -133,16 +205,23 @@
|
||||
const transferData = ref([]) as any;
|
||||
// 获得穿梭框原始数据
|
||||
const getLeftPlan = () => {
|
||||
http.get(lightingManage.getLeftPlan, {}).then((res) => {
|
||||
let arr = [];
|
||||
res.data.forEach((item: any) => {
|
||||
arr.push({
|
||||
key: item.id,
|
||||
title: item.planName,
|
||||
http
|
||||
.get(planManage.getTransData, {
|
||||
projectId: state.projectId,
|
||||
siteId: state.siteId,
|
||||
// 设备类型(1照明,2空调,3排风扇,4风幕机,5电动窗,6进水阀,7排水泵)
|
||||
deviceType: props.type,
|
||||
})
|
||||
.then((res) => {
|
||||
let arr: Array<Object> = [];
|
||||
res.data.forEach((item: any) => {
|
||||
arr.push({
|
||||
key: item.id,
|
||||
title: item.planName,
|
||||
});
|
||||
});
|
||||
transferData.value = arr;
|
||||
});
|
||||
transferData.value = arr;
|
||||
});
|
||||
};
|
||||
|
||||
const handleChange = (keys: string[], direction: string, moveKeys: string[]) => {
|
||||
@@ -158,7 +237,7 @@
|
||||
if (targetKeys.value.length < 1) {
|
||||
return message.info('没有选择任何计划');
|
||||
}
|
||||
http.post(lightingManage.submitLeftPlan, targetKeys.value).then(() => {
|
||||
http.post(planManage.submitTransData, targetKeys.value).then(() => {
|
||||
message.success('添加成功');
|
||||
// 如果发送成功，则刷新表格
|
||||
getTable();
|
||||
@@ -172,7 +251,31 @@
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import './dialogStyle.less';
|
||||
|
||||
.buttons {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.plan {
|
||||
border: none;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
border-radius: 5px;
|
||||
width: 88px;
|
||||
height: 32px;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
margin: 15px 0;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.plan.enabled {
|
||||
background: linear-gradient(180deg, rgba(103, 222, 0, 1) 0%, rgba(0, 181, 6, 1) 100%);
|
||||
}
|
||||
.plan.disabled {
|
||||
background-color: red;
|
||||
}
|
||||
.plan:disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
// 右下角添加按钮
|
||||
.div-add {
|
||||
height: 64px;
|
||||
@@ -182,7 +285,7 @@
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin-right: 20px;
|
||||
margin-right: 10px;
|
||||
.add {
|
||||
width: 74px;
|
||||
height: 40px;
|
||||
@@ -200,7 +303,7 @@
|
||||
.custom-table {
|
||||
border-collapse: collapse;
|
||||
width: 416px;
|
||||
height: 60px;
|
||||
height: 40px;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
.custom-table th,
|
||||
@@ -211,7 +314,6 @@
|
||||
text-align: center;
|
||||
}
|
||||
.table1 {
|
||||
margin-top: 20px;
|
||||
width: 100%;
|
||||
border: 1px solid rgba(255, 255, 255);
|
||||
border-radius: 5px;
|
||||
|
||||
@@ -0,0 +1,69 @@
|
||||
// 排风扇
|
||||
export const devicePosition1 = [
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '43.2%', bottom: '77.8%' },
|
||||
},
|
||||
{
|
||||
lineType: '2',
|
||||
textObject: { left: '50%', bottom: '77.8%' },
|
||||
},
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '41.2%', bottom: '27.8%' },
|
||||
},
|
||||
{
|
||||
lineType: '2',
|
||||
textObject: { left: '51.2%', bottom: '27.8%' },
|
||||
},
|
||||
];
|
||||
// 风幕机
|
||||
export const devicePosition2 = [
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '38%', bottom: '57.8%' },
|
||||
},
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '58.5%', bottom: '57.3%' },
|
||||
},
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '64.2%', bottom: '22.8%' },
|
||||
},
|
||||
];
|
||||
// 电动窗
|
||||
export const devicePosition3 = [
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '32%', bottom: '28%' },
|
||||
},
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '33.5%', bottom: '42.8%' },
|
||||
},
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '35%', bottom: '57.8%' },
|
||||
},
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '36.5%', bottom: '72.8%' },
|
||||
},
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '66%', bottom: '28%' },
|
||||
},
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '64%', bottom: '42.8%' },
|
||||
},
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '62%', bottom: '57.8%' },
|
||||
},
|
||||
{
|
||||
lineType: '1',
|
||||
textObject: { left: '60%', bottom: '72.8%' },
|
||||
},
|
||||
];
|
||||
@@ -80,16 +80,16 @@
|
||||
<div
|
||||
style="position: absolute"
|
||||
:style="{
|
||||
left: 'calc(' + item.styleText.left + ' - 10.6%)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 8%)',
|
||||
left: 'calc(' + item.styleText.left + ' - 12.6%)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 4%)',
|
||||
}">
|
||||
<boxModel :dataSource="item" />
|
||||
</div>
|
||||
<img
|
||||
style="width: 50px; height: 75px; position: absolute; z-index: 1"
|
||||
:style="{
|
||||
left: 'calc(' + item.styleText.left + ' - 1.5%)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 4%)',
|
||||
left: 'calc(' + item.styleText.left + ' - 2%)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 3%)',
|
||||
transform: 'rotateY(180deg)',
|
||||
}"
|
||||
src="../image/liftState/lift/line.png" />
|
||||
@@ -100,7 +100,7 @@
|
||||
style="position: absolute"
|
||||
:style="{
|
||||
left: 'calc(' + item.styleText.left + ' + 4.3%)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 8%)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 4%)',
|
||||
}">
|
||||
<boxModel :dataSource="item" />
|
||||
</div>
|
||||
@@ -108,23 +108,22 @@
|
||||
style="width: 50px; height: 75px; position: absolute; z-index: 1"
|
||||
:style="{
|
||||
left: 'calc(' + item.styleText.left + ' + 1.5%)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 4%)',
|
||||
transform: 'rotate(90deg,180deg)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 3%)',
|
||||
}"
|
||||
src="../image/liftState/lift/line.png" />
|
||||
</template>
|
||||
<img
|
||||
style="width: 42px; height: 42px; position: absolute"
|
||||
style="width: 38px; height: 38px; position: absolute; cursor: pointer; z-index: 9"
|
||||
:style="{ left: item.styleText.left, bottom: item.styleText.bottom }"
|
||||
src="../image/ventilationSystem/fan.png" />
|
||||
</template>
|
||||
</div>
|
||||
</transition>
|
||||
<!-- 弹窗操控 -->
|
||||
<!-- 排风扇 - 弹窗 -->
|
||||
<a-drawer
|
||||
v-if="selectIndex === 4 && visible"
|
||||
:visible="selectIndex === 4"
|
||||
class="drawer-fan"
|
||||
class="drawer-fan drawer-item"
|
||||
:width="496"
|
||||
:forceRender="preload"
|
||||
placement="right"
|
||||
@@ -133,16 +132,15 @@
|
||||
id="drawer"
|
||||
:maskStyle="{ 'background-color': 'rgba(0, 0, 0, 0)' }">
|
||||
<!-- 左侧抽屉的关闭按钮 -->
|
||||
<div
|
||||
class="drawer-box-out"
|
||||
v-if="visible && (selectIndex === 4 || selectIndex === 5 || selectIndex === 6)"
|
||||
@click="toggleDrawer">
|
||||
<div class="drawer-box-out" @click="toggleDrawer">
|
||||
<double-right-outlined class="drawer-icon" style="color: white" />
|
||||
</div>
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="控制面板"> <fanControl /> </a-tab-pane>
|
||||
<a-tab-pane key="1" tab="控制面板">
|
||||
<fanControl :treeData="treeData" :type="`排风扇`" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="计划列表" force-render>
|
||||
<fanPlant />
|
||||
<fanPlant :status="stateList" :type="3" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="日志"> 日志 </a-tab-pane>
|
||||
</a-tabs>
|
||||
@@ -154,7 +152,7 @@
|
||||
<div
|
||||
style="position: absolute"
|
||||
:style="{
|
||||
left: 'calc(' + item.styleText.left + ' - 15.1%)',
|
||||
left: 'calc(' + item.styleText.left + ' - 16.1%)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 8%)',
|
||||
}">
|
||||
<boxModel :dataSource="item" />
|
||||
@@ -162,24 +160,24 @@
|
||||
<img
|
||||
style="width: 50px; height: 75px; position: absolute; z-index: 1"
|
||||
:style="{
|
||||
left: 'calc(' + item.styleText.left + ' - 1.5%)',
|
||||
left: 'calc(' + item.styleText.left + ' - 2%)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 4%)',
|
||||
transform: 'rotateY(180deg)',
|
||||
}"
|
||||
src="../image/liftState/lift/line.png" />
|
||||
|
||||
<img
|
||||
style="width: 42px; height: 42px; position: absolute"
|
||||
style="width: 38px; height: 38px; position: absolute; z-index: 9"
|
||||
:style="{ left: item.styleText.left, bottom: item.styleText.bottom }"
|
||||
src="../image/ventilationSystem/airCurtain.png" />
|
||||
</template>
|
||||
</div>
|
||||
</transition>
|
||||
<!-- 弹窗操控 -->
|
||||
<!-- 风幕机 - 弹窗 -->
|
||||
<a-drawer
|
||||
v-if="selectIndex === 5 && visible"
|
||||
:visible="selectIndex === 5"
|
||||
class="drawer-fan"
|
||||
class="drawer-fan drawer-item"
|
||||
:width="496"
|
||||
:forceRender="preload"
|
||||
placement="right"
|
||||
@@ -189,15 +187,16 @@
|
||||
:maskStyle="{ 'background-color': 'rgba(0, 0, 0, 0)' }"
|
||||
:mask="false">
|
||||
<!-- 左侧抽屉的关闭按钮 -->
|
||||
<div
|
||||
class="drawer-box-out"
|
||||
v-if="visible && (selectIndex === 4 || selectIndex === 5 || selectIndex === 6)"
|
||||
@click="toggleDrawer">
|
||||
<div class="drawer-box-out" @click="toggleDrawer">
|
||||
<double-right-outlined class="drawer-icon" style="color: white" />
|
||||
</div>
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="控制面板"> 风幕机 </a-tab-pane>
|
||||
<a-tab-pane key="2" tab="计划列表" force-render> 计划列表 </a-tab-pane>
|
||||
<a-tab-pane key="1" tab="控制面板">
|
||||
<fanControl :treeData="treeData" :type="`风幕机`" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="计划列表" force-render>
|
||||
<fanPlant :status="stateList" :type="4" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="日志"> 日志 </a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-drawer>
|
||||
@@ -207,7 +206,7 @@
|
||||
<div
|
||||
style="position: absolute"
|
||||
:style="{
|
||||
left: 'calc(' + item.styleText.left + ' - 10.6%)',
|
||||
left: 'calc(' + item.styleText.left + ' - 11%)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 8%)',
|
||||
}">
|
||||
<boxModel :dataSource="item" />
|
||||
@@ -215,24 +214,24 @@
|
||||
<img
|
||||
style="width: 50px; height: 75px; position: absolute; z-index: 1"
|
||||
:style="{
|
||||
left: 'calc(' + item.styleText.left + ' - 1.5%)',
|
||||
left: 'calc(' + item.styleText.left + ' - 2%)',
|
||||
bottom: 'calc(' + item.styleText.bottom + ' + 4%)',
|
||||
transform: 'rotateY(180deg)',
|
||||
}"
|
||||
src="../image/liftState/lift/line.png" />
|
||||
|
||||
<img
|
||||
style="width: 42px; height: 42px; position: absolute"
|
||||
style="width: 38px; height: 38px; position: absolute; z-index: 9"
|
||||
:style="{ left: item.styleText.left, bottom: item.styleText.bottom }"
|
||||
src="../image/ventilationSystem/windowIcon.png" />
|
||||
</template>
|
||||
</div>
|
||||
</transition>
|
||||
<!-- 弹窗操控 -->
|
||||
<!-- 电动窗 - 弹窗 -->
|
||||
<a-drawer
|
||||
v-if="selectIndex === 6 && visible"
|
||||
:visible="selectIndex === 6"
|
||||
class="drawer-fan"
|
||||
class="drawer-fan drawer-item"
|
||||
:width="496"
|
||||
:forceRender="preload"
|
||||
placement="right"
|
||||
@@ -242,15 +241,16 @@
|
||||
:maskStyle="{ 'background-color': 'rgba(0, 0, 0, 0)' }"
|
||||
:mask="false">
|
||||
<!-- 左侧抽屉的关闭按钮 -->
|
||||
<div
|
||||
class="drawer-box-out"
|
||||
v-if="visible && (selectIndex === 4 || selectIndex === 5 || selectIndex === 6)"
|
||||
@click="toggleDrawer">
|
||||
<div class="drawer-box-out" @click="toggleDrawer">
|
||||
<double-right-outlined class="drawer-icon" style="color: white" />
|
||||
</div>
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="控制面板"> 电动窗 </a-tab-pane>
|
||||
<a-tab-pane key="2" tab="计划列表" force-render> 计划列表 </a-tab-pane>
|
||||
<a-tab-pane key="1" tab="控制面板">
|
||||
<fanControl :treeData="treeData" :type="`电动窗`" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="计划列表" force-render>
|
||||
<fanPlant :status="stateList" :type="5" />
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="3" tab="日志"> 日志 </a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-drawer>
|
||||
@@ -276,8 +276,30 @@
|
||||
import fanControl from './components/fanControl.vue';
|
||||
import fanPlant from './components/fanPlant.vue';
|
||||
import { DoubleLeftOutlined, DoubleRightOutlined } from '@ant-design/icons-vue';
|
||||
// 请求
|
||||
import { http } from '/nerv-lib/util/http';
|
||||
import { getEnum } from '/@/api';
|
||||
import { ventilating } from '/@/api/ventilatingSystem';
|
||||
// 全局变量
|
||||
import { items } from '/@/store/item';
|
||||
// 定位数据
|
||||
import { devicePosition1, devicePosition2, devicePosition3 } from './devicePosition';
|
||||
|
||||
//图例
|
||||
// 父子组件交互 =======================================================================
|
||||
|
||||
// 全局变量
|
||||
const state = items();
|
||||
// 状态枚举
|
||||
const stateList = ref([]);
|
||||
// 获得状态枚举
|
||||
const getStateEnum = async () => {
|
||||
let enumData = await getEnum({ params: { enumType: 'PlanExecuteStatus' } });
|
||||
stateList.value = enumData.data;
|
||||
};
|
||||
|
||||
// 左侧侧边栏及交互 ====================================================================
|
||||
|
||||
// 图例
|
||||
const legend = ref([
|
||||
{ url: temperature, name: '温度' },
|
||||
{ url: humidity, name: '湿度' },
|
||||
@@ -289,24 +311,102 @@
|
||||
]);
|
||||
// 选择的图例
|
||||
const selectIndex = ref(0);
|
||||
//选择table
|
||||
// 图例切换事件
|
||||
const selectLegend = (item: any, index: any) => {
|
||||
const name = item.name;
|
||||
if (selectIndex.value === index) {
|
||||
return;
|
||||
} else if (name == '排风扇') {
|
||||
// 获得树形结构
|
||||
getTree(1, index);
|
||||
// 获得设备图例
|
||||
getDevice(1);
|
||||
} else if (name == '风幕机') {
|
||||
getTree(2, index);
|
||||
getDevice(2);
|
||||
} else if (name == '电动窗') {
|
||||
getTree(3, index);
|
||||
getDevice(3);
|
||||
// 修改
|
||||
} else {
|
||||
selectIndex.value = index;
|
||||
}
|
||||
};
|
||||
|
||||
// 抽屉相关（排风扇 / 风幕机 / 电动窗） ==================================================
|
||||
|
||||
// 选择table
|
||||
const activeKey = ref('1');
|
||||
// 展示
|
||||
// 抽屉的展示状态
|
||||
const visible = ref(true);
|
||||
// 预加载flag，获得分区数据后，预加载抽屉，防止获取ref报错
|
||||
const preload = ref(true);
|
||||
// 抽屉 - 开关事件
|
||||
const toggleDrawer = () => {
|
||||
console.log('xxxx');
|
||||
visible.value = !visible.value;
|
||||
};
|
||||
//选择方法
|
||||
const selectLegend = (item: any, index: any) => {
|
||||
if (selectIndex.value !== index) {
|
||||
selectIndex.value = index;
|
||||
|
||||
// 抽屉中tab1 - 控制面板 =================================================================
|
||||
|
||||
const treeData = ref([]);
|
||||
// 获取tab1的树形结构
|
||||
const getTree = async (type: number, index: number) => {
|
||||
// 切换时默认选择tab1
|
||||
activeKey.value = '1';
|
||||
let url;
|
||||
if (type == 1) {
|
||||
url = ventilating.getTree1;
|
||||
} else if (type == 2) {
|
||||
url = ventilating.getTree2;
|
||||
} else {
|
||||
url = ventilating.getTree3;
|
||||
}
|
||||
http.get(url, { projectId: state.projectId, siteId: state.siteId }).then((res) => {
|
||||
const data = res.data;
|
||||
treeData.value = data[0].childList;
|
||||
selectIndex.value = index;
|
||||
});
|
||||
};
|
||||
//温度数组
|
||||
const getDevice = async (type: number) => {
|
||||
// 切换时默认选择tab1
|
||||
activeKey.value = '1';
|
||||
let arr: Array<Object> = [];
|
||||
let url = '';
|
||||
let deviceType = '';
|
||||
if (type == 1) {
|
||||
// 设备类型
|
||||
deviceType = 'fan';
|
||||
// 位置数据
|
||||
arr = devicePosition1;
|
||||
// 请求地址
|
||||
url = ventilating.getDevice1;
|
||||
} else if (type == 2) {
|
||||
deviceType = 'airCurtain';
|
||||
arr = devicePosition2;
|
||||
url = ventilating.getDevice2;
|
||||
} else if (type == 3) {
|
||||
deviceType = 'window';
|
||||
arr = devicePosition3;
|
||||
url = ventilating.getDevice3;
|
||||
}
|
||||
http.get(url, { projectId: state.projectId, siteId: state.siteId, floor: 1 }).then((res) => {
|
||||
const data = res.data;
|
||||
data.forEach((item: any, index: number) => {
|
||||
let obj = arr[index];
|
||||
item.styleText = obj.textObject;
|
||||
item.lineType = obj.lineType;
|
||||
item.type = deviceType;
|
||||
});
|
||||
if (type == 1) {
|
||||
fanData.value = data;
|
||||
} else if (type == 2) {
|
||||
airCurtainData.value = data;
|
||||
} else if (type == 3) {
|
||||
windowData.value = data;
|
||||
}
|
||||
});
|
||||
};
|
||||
// 温度数组
|
||||
const sensorData = ref([
|
||||
{
|
||||
title: '多功能传感器A',
|
||||
@@ -325,7 +425,7 @@
|
||||
url: sunYellow,
|
||||
},
|
||||
]);
|
||||
//湿度数组
|
||||
// 湿度数组
|
||||
const humidityData = ref([
|
||||
{
|
||||
title: '多功能传感器A',
|
||||
@@ -344,7 +444,7 @@
|
||||
url: humidity,
|
||||
},
|
||||
]);
|
||||
//PM2.5数组
|
||||
// PM2.5数组
|
||||
const pmData = ref([
|
||||
{
|
||||
title: '多功能传感器A',
|
||||
@@ -363,7 +463,7 @@
|
||||
url: PM25,
|
||||
},
|
||||
]);
|
||||
//二氧化碳 浓度
|
||||
// 二氧化碳 浓度
|
||||
const CO2Data = ref([
|
||||
{
|
||||
title: '多功能传感器A',
|
||||
@@ -382,98 +482,102 @@
|
||||
url: CO2,
|
||||
},
|
||||
]);
|
||||
//排风扇
|
||||
// 排风扇
|
||||
const fanData = ref([
|
||||
{
|
||||
title: '排风扇',
|
||||
styleText: { left: '43.2%', bottom: '77.8%' },
|
||||
type: 'fan',
|
||||
lineType: '1',
|
||||
},
|
||||
{
|
||||
title: '排风扇',
|
||||
styleText: { left: '50%', bottom: '77.8%' },
|
||||
type: 'fan',
|
||||
lineType: '2',
|
||||
},
|
||||
{
|
||||
title: '排风扇',
|
||||
styleText: { left: '41.2%', bottom: '27.8%' },
|
||||
type: 'fan',
|
||||
lineType: '1',
|
||||
},
|
||||
{
|
||||
title: '排风扇',
|
||||
styleText: { left: '51.2%', bottom: '27.8%' },
|
||||
type: 'fan',
|
||||
lineType: '2',
|
||||
},
|
||||
// {
|
||||
// title: '排风扇',
|
||||
// styleText: { left: '43.2%', bottom: '77.8%' },
|
||||
// type: 'fan',
|
||||
// lineType: '1',
|
||||
// },
|
||||
// {
|
||||
// title: '排风扇',
|
||||
// styleText: { left: '50%', bottom: '77.8%' },
|
||||
// type: 'fan',
|
||||
// lineType: '2',
|
||||
// },
|
||||
// {
|
||||
// title: '排风扇',
|
||||
// styleText: { left: '41.2%', bottom: '27.8%' },
|
||||
// type: 'fan',
|
||||
// lineType: '1',
|
||||
// },
|
||||
// {
|
||||
// title: '排风扇',
|
||||
// styleText: { left: '51.2%', bottom: '27.8%' },
|
||||
// type: 'fan',
|
||||
// lineType: '2',
|
||||
// },
|
||||
]);
|
||||
// 风幕机
|
||||
const airCurtainData = ref([
|
||||
{
|
||||
title: '风幕机',
|
||||
styleText: { left: '38%', bottom: '57.8%' },
|
||||
type: 'airCurtain',
|
||||
},
|
||||
{
|
||||
title: '风幕机',
|
||||
styleText: { left: '58.5%', bottom: '57.3%' },
|
||||
type: 'airCurtain',
|
||||
},
|
||||
{
|
||||
title: '风幕机',
|
||||
styleText: { left: '64.2%', bottom: '22.8%' },
|
||||
type: 'airCurtain',
|
||||
},
|
||||
// {
|
||||
// title: '风幕机',
|
||||
// styleText: { left: '38%', bottom: '57.8%' },
|
||||
// type: 'airCurtain',
|
||||
// },
|
||||
// {
|
||||
// title: '风幕机',
|
||||
// styleText: { left: '58.5%', bottom: '57.3%' },
|
||||
// type: 'airCurtain',
|
||||
// },
|
||||
// {
|
||||
// title: '风幕机',
|
||||
// styleText: { left: '64.2%', bottom: '22.8%' },
|
||||
// type: 'airCurtain',
|
||||
// },
|
||||
]);
|
||||
// 电动窗
|
||||
const windowData = ref([
|
||||
{
|
||||
title: '电动窗1',
|
||||
styleText: { left: '32%', bottom: '28%' },
|
||||
type: 'window',
|
||||
},
|
||||
{
|
||||
title: '电动窗2',
|
||||
styleText: { left: '33.5%', bottom: '42.8%' },
|
||||
type: 'window',
|
||||
},
|
||||
{
|
||||
title: '电动窗3',
|
||||
styleText: { left: '35%', bottom: '57.8%' },
|
||||
type: 'window',
|
||||
},
|
||||
{
|
||||
title: '电动窗4',
|
||||
styleText: { left: '36.5%', bottom: '72.8%' },
|
||||
type: 'window',
|
||||
},
|
||||
{
|
||||
title: '电动窗5',
|
||||
styleText: { left: '66%', bottom: '28%' },
|
||||
type: 'window',
|
||||
},
|
||||
{
|
||||
title: '电动窗6',
|
||||
styleText: { left: '64%', bottom: '42.8%' },
|
||||
type: 'window',
|
||||
},
|
||||
{
|
||||
title: '电动窗7',
|
||||
styleText: { left: '62%', bottom: '57.8%' },
|
||||
type: 'window',
|
||||
},
|
||||
{
|
||||
title: '电动窗8',
|
||||
styleText: { left: '60%', bottom: '72.8%' },
|
||||
type: 'window',
|
||||
},
|
||||
// {
|
||||
// title: '电动窗1',
|
||||
// styleText: { left: '32%', bottom: '28%' },
|
||||
// type: 'window',
|
||||
// },
|
||||
// {
|
||||
// title: '电动窗2',
|
||||
// styleText: { left: '33.5%', bottom: '42.8%' },
|
||||
// type: 'window',
|
||||
// },
|
||||
// {
|
||||
// title: '电动窗3',
|
||||
// styleText: { left: '35%', bottom: '57.8%' },
|
||||
// type: 'window',
|
||||
// },
|
||||
// {
|
||||
// title: '电动窗4',
|
||||
// styleText: { left: '36.5%', bottom: '72.8%' },
|
||||
// type: 'window',
|
||||
// },
|
||||
// {
|
||||
// title: '电动窗5',
|
||||
// styleText: { left: '66%', bottom: '28%' },
|
||||
// type: 'window',
|
||||
// },
|
||||
// {
|
||||
// title: '电动窗6',
|
||||
// styleText: { left: '64%', bottom: '42.8%' },
|
||||
// type: 'window',
|
||||
// },
|
||||
// {
|
||||
// title: '电动窗7',
|
||||
// styleText: { left: '62%', bottom: '57.8%' },
|
||||
// type: 'window',
|
||||
// },
|
||||
// {
|
||||
// title: '电动窗8',
|
||||
// styleText: { left: '60%', bottom: '72.8%' },
|
||||
// type: 'window',
|
||||
// },
|
||||
]);
|
||||
onMounted(() => {});
|
||||
onMounted(() => {
|
||||
// 获得枚举
|
||||
getStateEnum();
|
||||
});
|
||||
onUnmounted(() => {});
|
||||
</script>
|
||||
<style lang="less">
|
||||
@import url('../style/color.less');
|
||||
.legend-box {
|
||||
width: 80px;
|
||||
height: 100%;
|
||||
@@ -562,7 +666,7 @@
|
||||
height: 40px;
|
||||
border-radius: 2px;
|
||||
position: fixed;
|
||||
right: 466px;
|
||||
right: 495px;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
margin: auto;
|
||||
|
||||
173
hx-ai-intelligent/src/view/systemManage/systemMenu/config.ts
Normal file
173
hx-ai-intelligent/src/view/systemManage/systemMenu/config.ts
Normal file
@@ -0,0 +1,173 @@
|
||||
import { http } from '/nerv-lib/util';
|
||||
import { ref } from 'vue';
|
||||
import { menuS } from '/@/api/menuSystem';
|
||||
// interface DataItem {
|
||||
// key: number;
|
||||
// menuName: string;
|
||||
// menuType: number;
|
||||
// menuIcon: string;
|
||||
// menuRouter:string;
|
||||
// children?: DataItem[];
|
||||
// }
|
||||
// const data: DataItem[] = [
|
||||
// {
|
||||
// key: 1,
|
||||
// menuName: 'John Brown sr.',
|
||||
// menuType: 60,
|
||||
// menuIcon:'icon',
|
||||
// menuRouter: '/dashboard',
|
||||
// children: [
|
||||
// {
|
||||
// key: 11,
|
||||
// menuName: 'John Brown',
|
||||
// menuType: 42,
|
||||
// menuIcon:'icon',
|
||||
// menuRouter: '/dashboard1',
|
||||
// },
|
||||
// {
|
||||
// key: 12,
|
||||
// menuName: 'John Brown',
|
||||
// menuType: 42,
|
||||
// menuIcon:'icon',
|
||||
// menuRouter: '/dashboard3',
|
||||
// children: [
|
||||
// {
|
||||
// key: 121,
|
||||
// menuName: 'John Brown',
|
||||
// menuType: 42,
|
||||
// menuIcon:'icon',
|
||||
// menuRouter: '/dashboard4',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// {
|
||||
// key: 13,
|
||||
// menuName: 'John Brown sr.',
|
||||
// menuType: 60,
|
||||
// menuIcon:'icon',
|
||||
// menuRouter: '/dashboard',
|
||||
// children: [
|
||||
// ],
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
// {
|
||||
// key: 2,
|
||||
// menuName: 'John Brown sr.',
|
||||
// menuType: 60,
|
||||
// menuIcon:'icon',
|
||||
// menuRouter: '/dashboard',
|
||||
// },
|
||||
// ];
|
||||
export const tableConfig = (orgId:any,SystemAddEdit:any) => {
|
||||
return ref({
|
||||
title: '系统菜单',
|
||||
api: menuS.queryMenuPage,
|
||||
params: { orgId },
|
||||
pagination: false,
|
||||
headerActions: [
|
||||
{
|
||||
label: '新增',
|
||||
name: 'systemMenuAdd',
|
||||
type: 'primary',
|
||||
handle: () => {
|
||||
console.log("12345")
|
||||
SystemAddEdit.value.toggle(1);
|
||||
// editConfigureDeviceAlarms.value.toggle(null, configureDeviceAlarmsData.value);
|
||||
},
|
||||
},
|
||||
],
|
||||
// rowSelection: {
|
||||
// checkStrictly: false,
|
||||
// onChange: (selectedRowKeys: (string | number)[], selectedRows: DataItem[]) => {
|
||||
// console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
|
||||
// },
|
||||
// onSelect: (record: DataItem, selected: boolean, selectedRows: DataItem[]) => {
|
||||
// console.log(record, selected, selectedRows);
|
||||
// },
|
||||
// onSelectAll: (selected: boolean, selectedRows: DataItem[], changeRows: DataItem[]) => {
|
||||
// console.log(selected, selectedRows, changeRows);
|
||||
// },
|
||||
// },
|
||||
columns:[
|
||||
{
|
||||
title: '菜单名称',
|
||||
dataIndex: 'menuName',
|
||||
key: 'menuName',
|
||||
},
|
||||
{
|
||||
title: '菜单类型',
|
||||
dataIndex: 'menuType',
|
||||
key: 'menuType',
|
||||
},
|
||||
{
|
||||
title: '图标',
|
||||
dataIndex: 'menuIcon',
|
||||
key: 'menuIcon',
|
||||
},
|
||||
{
|
||||
title: '路由',
|
||||
dataIndex: 'menuRouter',
|
||||
key: 'menuRouter',
|
||||
},
|
||||
{
|
||||
title: '排序',
|
||||
dataIndex: 'sort',
|
||||
key: 'sort',
|
||||
}
|
||||
],
|
||||
formConfig: {
|
||||
schemas: [
|
||||
{
|
||||
field: 'menuName',
|
||||
label: '菜单名称',
|
||||
component: 'NsInput',
|
||||
defaultValue: '',
|
||||
componentProps: {
|
||||
allowClear: true,
|
||||
placeholder: '请输入菜单名称',
|
||||
},
|
||||
}
|
||||
],
|
||||
params: {},
|
||||
},
|
||||
columnActions: {
|
||||
title: '操作',
|
||||
actions: [
|
||||
{
|
||||
label: '新增',
|
||||
name: 'userAdd',
|
||||
handle: (record: any) => {
|
||||
console.log("我是编辑区域11111")
|
||||
console.log(record)
|
||||
SystemAddEdit.value.getMenuList();//请求列表的菜单数据
|
||||
SystemAddEdit.value.toggle(1,record);
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '编辑',
|
||||
name: 'userEdit',
|
||||
handle: (record: any) => {
|
||||
SystemAddEdit.value.toggle(2,record);
|
||||
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '删除',
|
||||
name: 'userDelete',
|
||||
dynamicParams: { id: 'id' },
|
||||
confirm: true,
|
||||
isReload: true,
|
||||
handle: (data: any) => {
|
||||
// http.post(energyAlarms.del, { id: data.id, orgId: data.orgId }).then(() => {
|
||||
// NsMessage.success('操作成功');
|
||||
// mainEnergyAlarmConfig.value?.nsTableRef.reload();
|
||||
// mainRef.value?.nsTableRef.reload();
|
||||
// });
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
rowKey: 'key',
|
||||
})
|
||||
}
|
||||
@@ -0,0 +1,312 @@
|
||||
<!-- 系统菜单的新增、编辑 duyf-->
|
||||
<template>
|
||||
<a-drawer
|
||||
:width="500"
|
||||
:visible="visible"
|
||||
:body-style="{ paddingBottom: '80px' }"
|
||||
:footer-style="{ textAlign: 'right' }"
|
||||
destroyOnClose
|
||||
:title="drawerTitele"
|
||||
@close="onClose">
|
||||
<a-form
|
||||
ref="formRef"
|
||||
:model="formState"
|
||||
:rules="rules"
|
||||
:label-col="labelCol"
|
||||
:wrapper-col="wrapperCol"
|
||||
>
|
||||
<a-form-item label="菜单类型：" name="menuType">
|
||||
<a-radio-group v-model:value="menuRadioType">
|
||||
<a-radio-button :value="1" @click="chanageMenuType">一级菜单</a-radio-button>
|
||||
<a-radio-button :value="2" @click="chanageMenuType">子菜单</a-radio-button>
|
||||
<a-radio-button :value="3" @click="chanageMenuType">按钮/权限</a-radio-button>
|
||||
</a-radio-group>
|
||||
</a-form-item>
|
||||
<a-form-item label="菜单名称：" name="menuName" v-if="menuNameIsshow">
|
||||
<a-input allowClear v-model:value="formState.menuName" maxlength="255" placeholder="请输入菜单名称" />
|
||||
</a-form-item>
|
||||
<a-form-item label="菜单编码：" name="menuCode" v-if="menuCodeIsshow">
|
||||
<a-input allowClear v-model:value="formState.menuCode" maxlength="64" placeholder="请输入菜单编码" />
|
||||
</a-form-item>
|
||||
<a-form-item label="按钮/权限：" name="perissionBtn" v-if="btnPermissIsshow">
|
||||
<a-input v-model:value="formState.perissionBtn" maxlength="255" placeholder="请输入按钮/权限" />
|
||||
</a-form-item>
|
||||
<a-form-item label="上级菜单：" name="previousMenu" v-if="preMenuIsshow">
|
||||
<a-tree-select
|
||||
v-model:value="formState.previousMenu"
|
||||
:tree-line="true"
|
||||
:tree-data="treeData"
|
||||
>
|
||||
</a-tree-select>
|
||||
</a-form-item>
|
||||
<a-form-item label="菜单路由：" name="routePath">
|
||||
<a-input v-model:value="formState.routePath" placeholder="请输入路由地址"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="菜单图标：" name="menuIcon" class="iconMenu">
|
||||
<a-input v-model:value="formState.menuIcon" placeholder="点击选择菜单图标" />
|
||||
<SlackOutlined @click="showIconMenu"/>
|
||||
</a-form-item>
|
||||
<a-form-item label="授权标识：" name="authorizationMark" v-if="authorMarkIsshow">
|
||||
<a-input v-model:value="formState.authorizationMark" placeholder="请输入授权标识" />
|
||||
</a-form-item>
|
||||
<a-form-item label="排序：" name="menuSort" v-if="sortIsshow">
|
||||
<a-input type="number" v-model:value="formState.menuSort" min="0" maxlength="7" placeholder="请输入排序号" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<template #footer>
|
||||
<a-button style="margin-right: 8px" @click="onClose">取消</a-button>
|
||||
<a-button type="primary" @click="onSubmit">确定</a-button>
|
||||
</template>
|
||||
</a-drawer>
|
||||
|
||||
<icon-picker :iconHandleOk="getSonData" ref="refIconPicker"></icon-picker>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref,toRaw,defineExpose,reactive} from 'vue';
|
||||
import type { Rule } from 'ant-design-vue/es/form';
|
||||
import type { TreeSelectProps } from 'ant-design-vue';
|
||||
import { SlackOutlined } from '@ant-design/icons-vue';
|
||||
import iconPicker from '../../../components/icon/IconPicker.vue';
|
||||
import { NsMessage } from '/nerv-lib/component';
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const menuRadioType = ref(1);//菜单类型默认值
|
||||
const treeData = ref<TreeSelectProps['treeData']>([]);//存储菜单数据
|
||||
|
||||
const drawerTitele = ref('');
|
||||
const formRef = ref();
|
||||
const visible = ref(false);
|
||||
const btnPermissIsshow = ref(false);//按钮权限是否显示
|
||||
const menuCodeIsshow = ref(true);//菜单编码是否显示
|
||||
const preMenuIsshow = ref(false);//上级菜单是否显示
|
||||
const authorMarkIsshow = ref(false);//授权标识是否显示
|
||||
const menuNameIsshow = ref(true);//菜单名称是否显示
|
||||
const sortIsshow = ref(true);//排序是否显示
|
||||
const menuRouteIsshow = ref(true);//菜单路由是否显示
|
||||
const refIconPicker = ref();
|
||||
interface FormState {
|
||||
orgId:any,
|
||||
menuName: string;
|
||||
previousMenu:string;
|
||||
routePath:string;
|
||||
menuSort:string;
|
||||
perissionBtn:string;
|
||||
authorizationMark:string;
|
||||
menuIcon:string;
|
||||
menuCode:string;
|
||||
type:string;//菜单类型
|
||||
}
|
||||
const formState = ref<FormState>({
|
||||
orgId:'',
|
||||
menuName:'',
|
||||
previousMenu:'',
|
||||
routePath:'',
|
||||
menuSort:'',
|
||||
perissionBtn:'',
|
||||
authorizationMark:'',
|
||||
menuIcon:'',
|
||||
menuCode:'',
|
||||
type:''
|
||||
})
|
||||
const labelCol = { span: 5 };
|
||||
const wrapperCol = { span: 19 };
|
||||
|
||||
// 定义form表单的必填
|
||||
var rules: Record<string, Rule[]> = reactive({
|
||||
menuName: [{ required: true, message: '请输入菜单名称', trigger: 'change' }],
|
||||
menuCode: [{ required: true, message: '请输入菜单编码', trigger: 'change' }],
|
||||
perissionBtn: [{ required: true, message: '请输入按钮/权限', trigger: 'change' }],
|
||||
previousMenu: [{ required: true, message: '请选择上级菜单', trigger: 'change' }],
|
||||
routePath:[{ required: true, message: '请输入菜单路由', trigger: 'change' }],
|
||||
});
|
||||
const emit = defineEmits(['editObject']);
|
||||
// 关闭新增抽屉
|
||||
const onClose = () => {
|
||||
visible.value = false;
|
||||
// formState.value = {
|
||||
// orgId: orgId.value,
|
||||
// }
|
||||
formRef.value.resetFields();
|
||||
};
|
||||
//菜单类型按钮切换
|
||||
const chanageMenuType = (e:any)=>{
|
||||
let currentType = e.target.value;
|
||||
if(currentType==1){//一级菜单
|
||||
menuNameIsshow.value = true;
|
||||
btnPermissIsshow.value = false;
|
||||
preMenuIsshow.value = false;
|
||||
authorMarkIsshow.value = false;
|
||||
sortIsshow.value = true;
|
||||
menuCodeIsshow.value = true;
|
||||
menuRouteIsshow.value = true;
|
||||
}else if(currentType==2){//二级菜单
|
||||
menuNameIsshow.value = true;
|
||||
preMenuIsshow.value = true;
|
||||
btnPermissIsshow.value = false;
|
||||
authorMarkIsshow.value = false;
|
||||
sortIsshow.value = true;
|
||||
menuCodeIsshow.value = true;
|
||||
menuRouteIsshow.value = true;
|
||||
}else{//按钮
|
||||
menuNameIsshow.value = false;
|
||||
preMenuIsshow.value = true;
|
||||
btnPermissIsshow.value = true;
|
||||
authorMarkIsshow.value = true;
|
||||
sortIsshow.value = false;
|
||||
menuCodeIsshow.value = false;
|
||||
menuRouteIsshow.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
// 点击确定提交
|
||||
const onSubmit = () => {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(() => {
|
||||
console.log('values', formState, toRaw(formState));
|
||||
console.log(formState)
|
||||
console.log(toRaw(formState))
|
||||
// emit("editObject",formState)
|
||||
})
|
||||
}
|
||||
//获取菜单列表
|
||||
const getMenuList= ()=>{
|
||||
let temporaryData = [
|
||||
{
|
||||
key: 0,
|
||||
menuName: '首页',
|
||||
menuType: 60,
|
||||
menuIcon:'icon',
|
||||
menuRouter: '/dashboard',
|
||||
sort:0,
|
||||
},
|
||||
{
|
||||
key: 1,
|
||||
menuName: '碳排管理',
|
||||
menuType: 60,
|
||||
menuIcon:'icon',
|
||||
menuRouter: '/dashboard',
|
||||
sort:1,
|
||||
children: [
|
||||
{
|
||||
key: 11,
|
||||
menuName: '碳排统计',
|
||||
menuType: 42,
|
||||
menuIcon:'icon',
|
||||
menuRouter: '/dashboard1',
|
||||
sort:2,
|
||||
},
|
||||
{
|
||||
key: 12,
|
||||
menuName: '碳排因子库',
|
||||
menuType: 42,
|
||||
menuIcon:'icon',
|
||||
menuRouter: '/dashboard3',
|
||||
sort:3,
|
||||
children: [
|
||||
{
|
||||
key: 121,
|
||||
menuName: '新增按钮',
|
||||
menuType: 42,
|
||||
menuIcon:'icon',
|
||||
menuRouter: '/dashboard4',
|
||||
sort:4,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 13,
|
||||
menuName: '碳盘查',
|
||||
menuType: 60,
|
||||
menuIcon:'icon',
|
||||
menuRouter: '/dashboard',
|
||||
sort:5,
|
||||
children: [
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
menuName: '系统管理',
|
||||
menuType: 60,
|
||||
menuIcon:'icon',
|
||||
menuRouter: '/dashboard',
|
||||
sort:6,
|
||||
},
|
||||
]
|
||||
treeData.value = temporaryData.map(item=>({
|
||||
value: item.key,
|
||||
label: item.menuName,
|
||||
children: item.children ? item.children.map(child => ({
|
||||
value: child.key,
|
||||
label: child.menuName,
|
||||
children: child.children ? child.children.map(childchild => ({
|
||||
value: childchild.key,
|
||||
label: childchild.menuName,
|
||||
})):[]
|
||||
})):[]
|
||||
}))
|
||||
// fetch(group.queryDeviceGroupTree, { energyType: 'ELECTRICITY_USAGE',orgId: orgId.value }).then((res) => {
|
||||
// treeData.value = res.data
|
||||
// treeData.value = treeData.value.map(item => ({
|
||||
// value: item.id,
|
||||
// label: item.pointName,
|
||||
// children: item.children ? item.children.map(child => ({
|
||||
// value: child.id,
|
||||
// label: child.pointName
|
||||
// })) : []
|
||||
// }));
|
||||
// });
|
||||
}
|
||||
//展示icon图标集
|
||||
const showIconMenu = (data:any)=>{
|
||||
console.log("展示icon图标集合")
|
||||
refIconPicker.value.isIconOpenToggle(formState.value.menuIcon);
|
||||
|
||||
}
|
||||
const getSonData = (data:any) => {
|
||||
// formState.icon = data;
|
||||
console.log("子组件中的数据：",data)
|
||||
if(data){
|
||||
formState.value.menuIcon = data;
|
||||
}else{
|
||||
refIconPicker.value.isIconData();
|
||||
}
|
||||
}
|
||||
const toggle = (type:any,record:any)=>{
|
||||
visible.value = true;
|
||||
if(type==1){//新增
|
||||
drawerTitele.value = '新增菜单';
|
||||
}else if(type==2){//编辑
|
||||
drawerTitele.value = '编辑菜单';
|
||||
console.log(record)
|
||||
}
|
||||
}
|
||||
defineExpose({
|
||||
toggle,
|
||||
getMenuList
|
||||
});
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.iconMenu :deep(.ant-form-item-control-input-content){
|
||||
display: flex;
|
||||
.ant-input{
|
||||
border-top-right-radius:0;
|
||||
border-bottom-right-radius:0;
|
||||
}
|
||||
.anticon{
|
||||
padding:7px 10px 0;
|
||||
border: 1px solid #d9d9d9;
|
||||
border-radius:4px;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius:0;
|
||||
cursor: pointer;
|
||||
border-left:0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
43
hx-ai-intelligent/src/view/systemManage/systemMenu/index.vue
Normal file
43
hx-ai-intelligent/src/view/systemManage/systemMenu/index.vue
Normal file
@@ -0,0 +1,43 @@
|
||||
<template>
|
||||
<!-- <a-table :columns="columns" :data-source="data" :row-selection="rowSelection" /> -->
|
||||
<div style="padding:10px auto;">
|
||||
<ns-view-list-table v-bind="config" :model="data" ref="mainRef">
|
||||
</ns-view-list-table>
|
||||
</div>
|
||||
<!-- 新增or编辑界面 -->
|
||||
<editSystemMenu ref="SystemAddEdit" @editObject="editObject" />
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { tableConfig } from './config';
|
||||
import { computed, nextTick, onMounted, ref ,unref} from 'vue';
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
import editSystemMenu from './editSystemMenu.vue';
|
||||
const orgId = ref('');
|
||||
const result = JSON.parse(sessionStorage.getItem('ORGID')!);
|
||||
orgId.value = result;
|
||||
const SystemAddEdit = ref({});
|
||||
const config = tableConfig(orgId.value,SystemAddEdit);
|
||||
|
||||
// 表格相关数据
|
||||
const data = ref([]);//子组件数据修改时，父组件也跟着改变。
|
||||
const mainRef = ref();//可以定义一个函数使用mainRef.value来调用子组件的方法。
|
||||
defineOptions({
|
||||
name: 'systemMenuIndex', // 与页面路由name一致缓存才可生效
|
||||
});
|
||||
onMounted(() => {
|
||||
});
|
||||
//编辑新增成功时刷新表格
|
||||
const editObject = (val:any)=>{
|
||||
mainRef.value?.nsTableRef.reload();
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
:deep(.ns-table-search),
|
||||
:deep(.ns-part-tree),
|
||||
:deep(.ns-table-main) {
|
||||
box-shadow: @ns-content-box-shadow;
|
||||
}
|
||||
:deep(.ns-basic-table){
|
||||
padding-bottom:15px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user