zhaohy
2 months ago
5 changed files with 389 additions and 0 deletions
@ -0,0 +1,6 @@ |
|||
export enum dict { |
|||
dictionaryUnitManagement = '/carbon-smart/client/dict/dictionaryUnitManagement', |
|||
updateDictionary = '/carbon-smart/client/dict/updateDictionary', |
|||
createDictionary = '/carbon-smart/client/dict/createDictionary', |
|||
delDictionary = '/carbon-smart/client/dict/delDictionary', |
|||
} |
|||
|
After Width: | Height: | Size: 1.8 KiB |
@ -0,0 +1,15 @@ |
|||
const dict = { |
|||
path: '/dict', |
|||
name: 'dict', |
|||
meta: { title: '字典', icon: 'zidian', index: 7, hideChildren: true }, |
|||
redirect: { name: 'dictIndex' }, |
|||
children: [ |
|||
{ |
|||
path: 'index', |
|||
name: 'dictIndex', |
|||
meta: { title: '字典', hideChildren: true, icon: 'zidian' }, |
|||
component: () => import('/@/view/dict/index.vue'), |
|||
}, |
|||
], |
|||
}; |
|||
export default dict; |
|||
@ -0,0 +1,51 @@ |
|||
export const tableColumns = [ |
|||
// {
|
|||
// title: '序号',
|
|||
// customRender: (text: any) => {
|
|||
// return text.index + 1;
|
|||
// },
|
|||
// },
|
|||
{ |
|||
title: 'id', |
|||
dataIndex: 'id', |
|||
}, |
|||
{ |
|||
title: '字典组名', |
|||
dataIndex: 'grp', |
|||
}, |
|||
{ |
|||
title: '字典组名描述', |
|||
dataIndex: 'grpDesc', |
|||
}, |
|||
{ |
|||
title: '字典Key', |
|||
dataIndex: 'dicKey', |
|||
}, |
|||
{ |
|||
title: '字典中文Value', |
|||
dataIndex: 'cnValue', |
|||
}, |
|||
{ |
|||
title: '字典英文Value', |
|||
dataIndex: 'enValue', |
|||
}, |
|||
{ |
|||
title: '字典描述', |
|||
dataIndex: 'description', |
|||
}, |
|||
{ |
|||
title: '父级ID', |
|||
dataIndex: 'parentId', |
|||
}, |
|||
{ |
|||
title: '排序数字', |
|||
dataIndex: 'seq', |
|||
}, |
|||
{ |
|||
title: '是否展示', |
|||
dataIndex: 'showed', |
|||
}, |
|||
{ |
|||
title: '操作', |
|||
}, |
|||
]; |
|||
@ -0,0 +1,316 @@ |
|||
<!-- eslint-disable vue/multi-word-component-names --> |
|||
<template> |
|||
<div> |
|||
<a-table |
|||
:columns="tableColumns" |
|||
:data-source="data" |
|||
bordered |
|||
:pagination="false" |
|||
:scroll="{ y: 530 }"> |
|||
<template #bodyCell="{ text, column, record }"> |
|||
<template v-if="column.dataIndex === 'showed'"> |
|||
<a-switch |
|||
:checked="text" |
|||
:checked-value="0" |
|||
:unCheckedValue="1" |
|||
@change="(checked) => updateShowed(record, true)" /> |
|||
</template> |
|||
<template v-if="column.title === '操作'"> |
|||
<a-button type="link" @click="updateDict(record)">编辑</a-button> |
|||
<a-button type="link" @click="deleteDict(record)">删除</a-button> |
|||
</template> |
|||
</template> |
|||
<template #title> |
|||
<div |
|||
style="display: flex; align-items: center; justify-content: space-between; width: 100%"> |
|||
<div style="display: flex; align-items: center; width: 85%"> |
|||
<div style="width: 10%">数据报表</div> |
|||
<a-input |
|||
v-model:value="queryParams.grp" |
|||
placeholder="请输入字典组名" |
|||
style="width: 15%" /> |
|||
<a-input |
|||
v-model:value="queryParams.grpDesc" |
|||
placeholder="请输入字典组名描述" |
|||
style="width: 15%; margin-left: 10px" /> |
|||
<a-input |
|||
v-model:value="queryParams.dicKey" |
|||
placeholder="请输入字典Key" |
|||
style="width: 15%; margin-left: 10px" /> |
|||
<a-input |
|||
v-model:value="queryParams.cnValue" |
|||
placeholder="请输入字典中文Value" |
|||
style="width: 15%; margin-left: 10px" /> |
|||
<a-button type="primary" style="margin-left: 10px" @click="getTableList"> |
|||
查询 |
|||
</a-button> |
|||
</div> |
|||
<a-button type="primary" style="margin-left: 10px" @click="addDict"> 新增 </a-button> |
|||
</div> |
|||
</template> |
|||
</a-table> |
|||
|
|||
<a-drawer |
|||
:width="600" |
|||
:visible="visible" |
|||
:title="updateInfo && updateInfo.id ? '编辑' : '新增'" |
|||
:body-style="{ paddingBottom: '80px' }" |
|||
:footer-style="{ textAlign: 'right' }" |
|||
destroyOnClose |
|||
@close="onClose"> |
|||
<a-form |
|||
ref="formRef" |
|||
:model="updateInfo" |
|||
:rules="rules" |
|||
:label-col="labelCol" |
|||
:wrapper-col="wrapperCol"> |
|||
<a-form-item ref="grp" label="字典组名" name="grp"> |
|||
<a-input v-model:value="updateInfo.grp" placeholder="请输入字典组名" /> |
|||
</a-form-item> |
|||
<a-form-item ref="grpDesc" label="字典组名描述" name="grpDesc"> |
|||
<a-input v-model:value="updateInfo.grpDesc" placeholder="请输入字典组名描述" /> |
|||
</a-form-item> |
|||
<a-form-item ref="dicKey" label="字典Key" name="dicKey"> |
|||
<a-input v-model:value="updateInfo.dicKey" placeholder="请输入字典Key" /> |
|||
</a-form-item> |
|||
<a-form-item ref="cnValue" label="字典中文Value" name="cnValue"> |
|||
<a-input v-model:value="updateInfo.cnValue" placeholder="请输入字典中文Value" /> |
|||
</a-form-item> |
|||
<a-form-item ref="enValue" label="字典英文Value" name="enValue"> |
|||
<a-input v-model:value="updateInfo.enValue" placeholder="请输入字典英文Value" /> |
|||
</a-form-item> |
|||
<a-form-item ref="description" label="字典描述" name="description"> |
|||
<a-input v-model:value="updateInfo.description" placeholder="请输入字典描述" /> |
|||
</a-form-item> |
|||
<a-form-item ref="parentId" label="父级ID" name="parentId"> |
|||
<a-input v-model:value="updateInfo.parentId" placeholder="请输入父级ID" /> |
|||
</a-form-item> |
|||
<a-form-item ref="seq" label="排序数字" name="seq"> |
|||
<a-input v-model:value="updateInfo.seq" placeholder="请输入排序数字" /> |
|||
</a-form-item> |
|||
<a-form-item ref="showed" label="是否展示" name="showed"> |
|||
<!-- <a-input v-model:value="updateInfo.showed" placeholder="请输入是否展示" /> --> |
|||
<a-switch |
|||
:checked="updateInfo.showed" |
|||
:checked-value="0" |
|||
:unCheckedValue="1" |
|||
@change="updateShowed(updateInfo, false)" /> |
|||
</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="collectionNode"> |
|||
<a-tree-select |
|||
v-model:value="formState.collectionNode" |
|||
:tree-line="true" |
|||
:tree-data="treeData" /> |
|||
</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-form> |
|||
<template #footer> |
|||
<a-button style="margin-right: 8px" @click="onClose">取消</a-button> |
|||
<a-button type="primary" @click="onSubmit">确定</a-button> |
|||
</template> |
|||
</a-drawer> |
|||
</div> |
|||
</template> |
|||
<script lang="ts" setup> |
|||
import { ref, onMounted, defineOptions } from 'vue'; |
|||
import { http } from '/nerv-lib/util/http'; |
|||
import type { FormInstance, Rule } from 'ant-design-vue/es/form'; |
|||
import { tableColumns } from './config'; |
|||
import { dict } from '/@/api/dict'; |
|||
import { NsMessage } from '/nerv-lib/component'; |
|||
import { Modal } from 'ant-design-vue'; |
|||
defineOptions({ |
|||
energyType: 'dictIndex', // 与页面路由name一致缓存才可生效 |
|||
}); |
|||
|
|||
const data = ref([]); |
|||
const updateInfo = ref({}); |
|||
const formRef = ref<FormInstance | null>(null); |
|||
|
|||
const queryParams = ref({ |
|||
grp: '', |
|||
grpDesc: '', |
|||
dicKey: '', |
|||
cnValue: '', |
|||
}); |
|||
const orgId = ref(''); |
|||
const result = JSON.parse(sessionStorage.getItem('ORGID')!); |
|||
orgId.value = result; |
|||
const fetch = (api, params = { orgId }) => { |
|||
return http.post(api, params); |
|||
}; |
|||
|
|||
// 获取表格数据 |
|||
const getTableList = () => { |
|||
fetch(dict.dictionaryUnitManagement, queryParams.value).then((res) => { |
|||
data.value = res.data; |
|||
}); |
|||
}; |
|||
// 修改是否显示状态 |
|||
const updateShowed = (record: any, falg: Boolean) => { |
|||
if (record.showed == 0) { |
|||
record.showed = 1; |
|||
} else { |
|||
record.showed = 0; |
|||
} |
|||
if (falg) { |
|||
fetch(dict.updateDictionary, record).then((res) => { |
|||
getTableList(); |
|||
}); |
|||
} else { |
|||
} |
|||
}; |
|||
|
|||
const visible = ref(false); |
|||
// const formState = ref({ |
|||
// orgId: orgId.value, |
|||
// }); |
|||
const labelCol = { span: 5 }; |
|||
const wrapperCol = { span: 19 }; |
|||
// 定义form表单的必填 |
|||
const rules: Record<string, Rule[]> = { |
|||
grp: [{ required: true, message: '请输入字典组名', trigger: 'change' }], |
|||
grpDesc: [{ required: true, message: '请输入字典组名描述', trigger: 'change' }], |
|||
dicKey: [{ required: true, message: '请输入字典Key', trigger: 'change' }], |
|||
cnValue: [{ required: true, message: '请输入字典中文Value', trigger: 'change' }], |
|||
seq: [{ required: true, message: '请输入排序数字', trigger: 'change' }], |
|||
showed: [{ required: true, message: '请输入是否展示', trigger: 'change' }], |
|||
}; |
|||
// 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 onClose = () => { |
|||
visible.value = false; |
|||
// formState.value = { |
|||
// orgId: orgId.value, |
|||
// }; |
|||
// formRef.value.resetFields(); |
|||
}; |
|||
// 打开编辑页 |
|||
const updateDict = (record: any) => { |
|||
updateInfo.value = record; |
|||
visible.value = true; |
|||
// todo 打开编辑页 |
|||
}; |
|||
// 打开新增页 |
|||
const addDict = () => { |
|||
updateInfo.value = {}; |
|||
updateInfo.value.showed = 1; |
|||
visible.value = true; |
|||
// todo 打开编辑页 |
|||
}; |
|||
|
|||
// 点击确定提交 |
|||
const onSubmit = () => { |
|||
debugger; |
|||
formRef.value |
|||
?.validate() |
|||
.then((valid) => { |
|||
if (valid) { |
|||
if (updateInfo.value.id) { |
|||
fetch(dict.updateDictionary, updateInfo.value).then((res) => { |
|||
if (res.retcode == 0) { |
|||
visible.value = false; |
|||
NsMessage.success('保存成功'); |
|||
getTableList(); |
|||
} |
|||
}); |
|||
} else { |
|||
fetch(dict.createDictionary, updateInfo.value).then((res) => { |
|||
if (res.retcode == 0) { |
|||
visible.value = false; |
|||
NsMessage.success('保存成功'); |
|||
getTableList(); |
|||
} |
|||
}); |
|||
} |
|||
} else { |
|||
console.log('表单验证失败'); |
|||
} |
|||
}) |
|||
.catch((error) => { |
|||
console.log('表单验证失败', error); |
|||
}); |
|||
}; |
|||
|
|||
// 删除字典 |
|||
const deleteDict = (record: any) => { |
|||
Modal.confirm({ |
|||
title: '警告', |
|||
// icon: createVNode(ExclamationCircleOutlined), |
|||
content: '确定要删除么？', |
|||
okText: '确认', |
|||
okType: 'primary', |
|||
cancelText: '取消', |
|||
onOk() { |
|||
// let params = ; |
|||
// // http.post(dict.delDictionary, params).then((res) => { |
|||
// // if (res.retcode == 0) { |
|||
// // visible.value = false; |
|||
// // NsMessage.success('删除成功'); |
|||
// // getTableList(); |
|||
// // } |
|||
// // }); |
|||
fetch(dict.delDictionary, { id: record.id }).then((res) => { |
|||
if (res.retcode == 0) { |
|||
visible.value = false; |
|||
NsMessage.success('删除成功'); |
|||
getTableList(); |
|||
} |
|||
}); |
|||
}, |
|||
onCancel() { |
|||
console.log('Cancel'); |
|||
}, |
|||
}); |
|||
}; |
|||
onMounted(() => { |
|||
getTableList(); |
|||
}); |
|||
</script> |
|||
<style scoped lang="less"> |
|||
::v-deep .ant-table-title { |
|||
display: flex; |
|||
} |
|||
::v-deep .ant-table-container { |
|||
padding: 0px 16px; |
|||
} |
|||
</style> |
|||
<style scoped> |
|||
th.column-money, |
|||
td.column-money { |
|||
text-align: right !important; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue