Browse Source

新增厂级配置

pull/39/head
Dreamglade 2 months ago
parent
commit
ecdf3a4f4a
  1. 39
      src/api/system/config/Factory.ts
  2. 56
      src/views/system/config/Factory/Factory.ts
  3. 79
      src/views/system/config/Factory/FactoryModal.vue
  4. 95
      src/views/system/config/Factory/index.vue

39
src/api/system/config/Factory.ts

@ -0,0 +1,39 @@
import { defHttp } from '@/utils/http/axios'
// 定义新增或修改时,需要发送给后端的数据结构
export interface FactoryVO {
id?: number
name: string // 电厂名称
shortName?: string // 电厂简称
areaId: number // 所属集团编号
}
// 定义分页查询时的参数
export interface FactoryPageReqVO {
name?: string
}
// 查询厂级列表
export function getFactoryPage(params: FactoryPageReqVO) {
return defHttp.get({ url: '/system/Factory/page', params })
}
// 查询厂级详情
export function getFactory(id: number) {
return defHttp.get({ url: `/system/Factory/get?id=${id}` })
}
// 新增厂级
export function createFactory(data: FactoryVO) {
return defHttp.post({ url: '/system/Factory/create', data })
}
// 修改厂级
export function updateFactory(data: FactoryVO) {
return defHttp.put({ url: '/system/Factory/update', data })
}
// 删除厂级
export function deleteFactory(id: number) {
return defHttp.delete({ url: `/system/Factory/delete?id=${id}` })
}

56
src/views/system/config/Factory/Factory.ts

@ -0,0 +1,56 @@
import type { BasicColumn, FormSchema } from '@/components/Table'
// 表格列定义 (已按您要求移除“集团编号”)
export const columns: BasicColumn[] = [
{
title: '电厂编号',
dataIndex: 'id',
width: 80,
},
{
title: '集团名称',
dataIndex: 'areaName',
width: 180,
},
{
title: '电厂名称',
dataIndex: 'name',
width: 180,
},
{
title: '电厂简称',
dataIndex: 'shortName',
width: 150,
},
]
// 表单定义
export const formSchema: FormSchema[] = [
{
label: '电厂编号',
field: 'id',
show: false,
component: 'Input',
},
{
label: '所属集团',
field: 'areaId',
required: true,
component: 'Select',
componentProps: {
options: [],
},
},
{
label: '电厂名称',
field: 'name',
required: true,
component: 'Input',
},
{
label: '电厂简称',
field: 'shortName',
required: true,
component: 'Input',
},
]

79
src/views/system/config/Factory/FactoryModal.vue

@ -0,0 +1,79 @@
<script lang="ts" setup>
import { ref, unref } from 'vue'
import { formSchema } from './Factory'
import { useI18n } from '@/hooks/web/useI18n'
import { useMessage } from '@/hooks/web/useMessage'
import { BasicForm, useForm } from '@/components/Form'
import { BasicModal, useModalInner } from '@/components/Modal'
import { getCompanyPage } from '@/api/system/config/Company'
import { createFactory, getFactory, updateFactory } from '@/api/system/config/Factory'
import type { FactoryVO } from '@/api/system/config/Factory'
defineOptions({ name: 'FactoryModal' })
const emit = defineEmits(['success', 'register'])
const { t } = useI18n()
const { createMessage } = useMessage()
const isUpdate = ref(true)
const [registerForm, { setFieldsValue, resetFields, validate, updateSchema }] = useForm({
labelWidth: 120,
baseColProps: { span: 24 },
schemas: formSchema,
showActionButtonGroup: false,
actionColOptions: { span: 23 },
})
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
resetFields()
setModalProps({ confirmLoading: false })
isUpdate.value = !!data?.isUpdate
const companyRes = await getCompanyPage({ pageNo: 1, pageSize: 100 })
const companyOptions = companyRes.list.map(item => ({
label: item.name,
value: item.id,
}))
updateSchema({
field: 'areaId',
componentProps: {
options: companyOptions,
},
})
if (unref(isUpdate)) {
const res = await getFactory(data.record.id)
setFieldsValue({ ...res })
}
})
async function handleSubmit() {
try {
const values = await validate()
setModalProps({ confirmLoading: true })
if (unref(isUpdate))
await updateFactory(values as FactoryVO)
else
await createFactory(values as FactoryVO)
closeModal()
emit('success')
createMessage.success(t('common.saveSuccessText'))
}
finally {
setModalProps({ confirmLoading: false })
}
}
</script>
<template>
<BasicModal
v-bind="$attrs"
:title="isUpdate ? t('action.edit') : t('action.create')"
:width="600"
@register="registerModal"
@ok="handleSubmit"
>
<BasicForm @register="registerForm" />
</BasicModal>
</template>

95
src/views/system/config/Factory/index.vue

@ -0,0 +1,95 @@
<script lang="ts" setup>
import FactoryModal from './FactoryModal.vue'
import { columns } from './Factory'
import { useI18n } from '@/hooks/web/useI18n'
import { useMessage } from '@/hooks/web/useMessage'
import { useModal } from '@/components/Modal'
import { IconEnum } from '@/enums/appEnum'
import { BasicTable, TableAction, useTable } from '@/components/Table'
import { deleteFactory, getFactoryPage } from '@/api/system/config/Factory'
defineOptions({ name: 'UnitFactory' })
const { t } = useI18n()
const { createMessage } = useMessage()
const [registerModal, { openModal }] = useModal()
const [register, { getForm, reload }] = useTable({
title: '厂级列表',
api: getList,
columns,
rowKey: 'id',
formConfig: { labelWidth: 120 },
pagination: true,
useSearchForm: false,
showTableSetting: true,
showIndexColumn: false,
actionColumn: {
width: 140,
title: t('common.action'),
dataIndex: 'action',
fixed: 'right',
},
})
async function getList() {
const res = await getFactoryPage(getForm().getFieldsValue() as any)
return res
}
function handleCreate() {
openModal(true, { isUpdate: false })
}
function handleEdit(record: Recordable) {
openModal(true, { record, isUpdate: true })
}
async function handleDelete(record: Recordable) {
await deleteFactory(record.id)
createMessage.success(t('common.delSuccessText'))
reload()
}
</script>
<template>
<div>
<BasicTable @register="register">
<template #toolbar>
<a-button v-auth="['system:Factory:create']" type="primary" :pre-icon="IconEnum.ADD" @click="handleCreate">
{{ t('action.create') }}
</a-button>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'action'">
<TableAction
:actions="[
{ icon: IconEnum.EDIT, label: t('action.edit'), auth: 'system:Factory:update', onClick: handleEdit.bind(null, record) },
{
icon: IconEnum.DELETE,
danger: true,
label: t('action.delete'),
auth: 'system:Factory:delete',
popConfirm: {
title: t('common.delMessage'),
placement: 'left',
confirm: handleDelete.bind(null, record),
},
},
]"
/>
</template>
</template>
</BasicTable>
<FactoryModal @register="registerModal" @success="reload()" />
</div>
</template>
<style scoped>
/* 深度选择器覆盖 Ant Design 内部样式 */
:deep(.ant-table-body) {
height: auto !important;
min-height: 200px;
max-height: 300 !important;
}
</style>
Loading…
Cancel
Save