37 changed files with 45 additions and 432 deletions
@ -1,30 +0,0 @@ |
|||||||
/** |
|
||||||
* 提供api模板规范代码参考,请尽量保证编写代码风格跟模板规范代码一致 |
|
||||||
* Copyright © 2020-2022 <a href="http://www.entfrm.com/">entfrm</a> All rights reserved. |
|
||||||
* author entfrm开发团队-王翔 |
|
||||||
*/ |
|
||||||
import type { AreaParams, Area } from '/@/api/platform/system/entity/area'; |
|
||||||
import { defHttp } from '/@/utils/http/axios'; |
|
||||||
|
|
||||||
enum Api { |
|
||||||
list = '/system_proxy/system/address/queryByParentId', |
|
||||||
add = '/system_proxy/system/address/save', |
|
||||||
get = '/system_proxy/system/address/query', |
|
||||||
edit = '/system_proxy/system/address/update', |
|
||||||
del = '/system_proxy/system/address/remove', |
|
||||||
} |
|
||||||
|
|
||||||
/** 查询区域列表 */ |
|
||||||
export const listArea = (params?: Partial<AreaParams>) => defHttp.get({ url: Api.list, params }); |
|
||||||
|
|
||||||
/** 新增区域 */ |
|
||||||
export const addArea = (params: Partial<Area>) => defHttp.post({ url: Api.add, data: params }); |
|
||||||
|
|
||||||
/** 修改区域 */ |
|
||||||
export const editArea = (params: Partial<Area>) => defHttp.put({ url: Api.edit, data: params }); |
|
||||||
|
|
||||||
/** 查询区域详细 */ |
|
||||||
export const getArea = (id: string) => defHttp.get<Area>({ url: `${Api.get}/${id}` }); |
|
||||||
|
|
||||||
/** 删除区域 */ |
|
||||||
export const delArea = (id: string) => defHttp.delete({ url: `${Api.del}/${id}` }); |
|
@ -1,30 +0,0 @@ |
|||||||
/** |
|
||||||
* @program: kicc-ui |
|
||||||
* @description: 区域实体类 |
|
||||||
* 类型定义 |
|
||||||
* @author: entfrm开发团队-王翔 |
|
||||||
* @create: 2022/4/8 |
|
||||||
*/ |
|
||||||
import type { R } from '/#/axios'; |
|
||||||
import type { CommonEntity, Page } from '/@/api/common/data/entity'; |
|
||||||
|
|
||||||
/** 区域查询参数 */ |
|
||||||
export type AreaParams = Page & Area; |
|
||||||
|
|
||||||
/** 区域对象 */ |
|
||||||
export interface Area extends CommonEntity { |
|
||||||
areaId: string; |
|
||||||
code: string; |
|
||||||
name: string; |
|
||||||
parentId: string; |
|
||||||
sort: number; |
|
||||||
contacts: string; |
|
||||||
phone: string; |
|
||||||
address: string; |
|
||||||
email: string; |
|
||||||
status: string; |
|
||||||
[key: string]: any; |
|
||||||
} |
|
||||||
|
|
||||||
/** 区域响应对象 */ |
|
||||||
export type AreaResult = R<Area[]>; |
|
@ -1,67 +0,0 @@ |
|||||||
<template> |
|
||||||
<BasicModal v-bind="$attrs" |
|
||||||
:title="getTitle" |
|
||||||
@register="registerModal" |
|
||||||
@ok="handleSubmit" |
|
||||||
> |
|
||||||
<BasicForm @register="registerForm"/> |
|
||||||
</BasicModal> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script lang="ts" setup> |
|
||||||
import {ref, computed, unref} from 'vue'; |
|
||||||
import {BasicModal, useModalInner} from '/@/components/Modal'; |
|
||||||
import {cardFormSchema} from './boxcard.data'; |
|
||||||
import {BasicForm, useForm} from '/@/components/Form/index'; |
|
||||||
import {set} from '/@/api/platform/system/controller/boxcard'; |
|
||||||
|
|
||||||
const isUpdate = ref(true); |
|
||||||
|
|
||||||
// 定义emit |
|
||||||
const emit = defineEmits(['success', 'register']); |
|
||||||
|
|
||||||
/** |
|
||||||
* 表单 |
|
||||||
*/ |
|
||||||
const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({ |
|
||||||
labelWidth: 100, |
|
||||||
schemas: cardFormSchema, |
|
||||||
showActionButtonGroup: false, |
|
||||||
actionColOptions: { |
|
||||||
span: 23, |
|
||||||
}, |
|
||||||
}); |
|
||||||
|
|
||||||
/** |
|
||||||
* 表单参数 |
|
||||||
*/ |
|
||||||
const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => { |
|
||||||
resetFields(); |
|
||||||
setModalProps({confirmLoading: false}); |
|
||||||
isUpdate.value = !!data?.isUpdate; |
|
||||||
|
|
||||||
|
|
||||||
if (unref(isUpdate)) { |
|
||||||
setFieldsValue({ |
|
||||||
...data.record, |
|
||||||
}); |
|
||||||
} |
|
||||||
}); |
|
||||||
|
|
||||||
//表单标题 |
|
||||||
const getTitle = computed(() => (!unref(isUpdate) ? '新增网卡' : '编辑网卡')); |
|
||||||
|
|
||||||
async function handleSubmit() { |
|
||||||
try { |
|
||||||
const values = await validate(); |
|
||||||
setModalProps({confirmLoading: true}); |
|
||||||
await set(values);//保存网卡 |
|
||||||
closeModal(); |
|
||||||
emit('success'); |
|
||||||
} finally { |
|
||||||
setModalProps({confirmLoading: false}); |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
|
|
||||||
</script> |
|
@ -1,160 +0,0 @@ |
|||||||
import { BasicColumn } from '/@/components/Table'; |
|
||||||
import { FormSchema } from '/@/components/Table'; |
|
||||||
import {h} from 'vue'; |
|
||||||
import {Tag} from 'ant-design-vue'; |
|
||||||
|
|
||||||
|
|
||||||
export const columns: BasicColumn[] = [ |
|
||||||
{ |
|
||||||
title: 'ID', |
|
||||||
dataIndex: 'id', |
|
||||||
width: 120, |
|
||||||
}, |
|
||||||
{ |
|
||||||
title: 'iccid', |
|
||||||
dataIndex: 'iccid', |
|
||||||
width: 120, |
|
||||||
}, |
|
||||||
{ |
|
||||||
title: '卡号', |
|
||||||
dataIndex: 'card', |
|
||||||
width: 120, |
|
||||||
}, |
|
||||||
{ |
|
||||||
title: '网卡厂商', |
|
||||||
dataIndex: 'company', |
|
||||||
width: 120, |
|
||||||
customRender: ({ record }) => { |
|
||||||
const com = record.company; |
|
||||||
switch (com) { |
|
||||||
case '1': return '中国移动'; |
|
||||||
case '2': return '中国联通'; |
|
||||||
case '3': return '中国电信'; |
|
||||||
default: return '未知厂商'; |
|
||||||
} |
|
||||||
} |
|
||||||
}, |
|
||||||
{ |
|
||||||
title: '卡是否已使用', |
|
||||||
dataIndex: 'isUsed', |
|
||||||
width: 120, |
|
||||||
}, |
|
||||||
{ |
|
||||||
title: '状态', |
|
||||||
dataIndex: 'status', |
|
||||||
width: 100, |
|
||||||
customRender: ({ record }) => { |
|
||||||
const status = record.status; |
|
||||||
const enable = status === '0'; |
|
||||||
const color = enable ? 'green' : 'red'; |
|
||||||
const text = enable ? '启用' : '禁用'; |
|
||||||
return h(Tag, { color: color }, () => text); |
|
||||||
}, |
|
||||||
}, |
|
||||||
{ |
|
||||||
title: '创建人', |
|
||||||
dataIndex: 'createByName', |
|
||||||
width: 180, |
|
||||||
}, |
|
||||||
{ |
|
||||||
title: '创建时间', |
|
||||||
dataIndex: 'createTime', |
|
||||||
width: 180, |
|
||||||
} |
|
||||||
]; |
|
||||||
|
|
||||||
export const searchFormSchema: FormSchema[] = [ |
|
||||||
{ |
|
||||||
field: 'iccid', |
|
||||||
label: 'iccid', |
|
||||||
component: 'Input', |
|
||||||
componentProps: { |
|
||||||
placeholder: '请输入唯一标识iccid', |
|
||||||
}, |
|
||||||
colProps: { span: 5 }, |
|
||||||
}, |
|
||||||
{ |
|
||||||
field: 'card', |
|
||||||
label: '卡号', |
|
||||||
component: 'Input', |
|
||||||
componentProps: { |
|
||||||
placeholder: '请输入卡号', |
|
||||||
}, |
|
||||||
colProps: { span: 5 }, |
|
||||||
}, |
|
||||||
{ |
|
||||||
field: 'company', |
|
||||||
label: '网卡厂商', |
|
||||||
component: 'Input', |
|
||||||
componentProps: { |
|
||||||
placeholder: '请输入网卡厂商', |
|
||||||
}, |
|
||||||
colProps: { span: 4 }, |
|
||||||
}, |
|
||||||
{ |
|
||||||
field: 'beginTime', |
|
||||||
label: '起始时间', |
|
||||||
component: 'DatePicker', |
|
||||||
colProps: { span: 5 }, |
|
||||||
}, |
|
||||||
{ |
|
||||||
field: 'endTime', |
|
||||||
label: '截止时间', |
|
||||||
component: 'DatePicker', |
|
||||||
colProps: { span: 5 }, |
|
||||||
}, |
|
||||||
]; |
|
||||||
|
|
||||||
export const cardFormSchema: FormSchema[] = [ |
|
||||||
{ |
|
||||||
field: 'id', |
|
||||||
label: 'ID', |
|
||||||
component: 'Input', |
|
||||||
show: false, |
|
||||||
}, |
|
||||||
{ |
|
||||||
field: 'iccid', |
|
||||||
label: 'iccid', |
|
||||||
component: 'Input', |
|
||||||
helpMessage: ['唯一识别号'], |
|
||||||
required: true |
|
||||||
}, |
|
||||||
{ |
|
||||||
field: 'card', |
|
||||||
label: '卡号', |
|
||||||
component: 'Input', |
|
||||||
required: false, |
|
||||||
}, |
|
||||||
{ |
|
||||||
field: 'company', |
|
||||||
label: '网卡厂商', |
|
||||||
component: 'Select', |
|
||||||
required: true, |
|
||||||
componentProps: { |
|
||||||
options: [ |
|
||||||
{ label: '中国移动', value: '1' }, |
|
||||||
{ label: '中国联通', value: '2' }, |
|
||||||
{ label: '中国电信', value: '3' }, |
|
||||||
{ label: '未知厂商', value: ''||undefined||null } |
|
||||||
], |
|
||||||
|
|
||||||
} |
|
||||||
}, |
|
||||||
{ |
|
||||||
field: 'status', |
|
||||||
label: '状态', |
|
||||||
component: 'RadioButtonGroup', |
|
||||||
defaultValue: '0', |
|
||||||
componentProps: { |
|
||||||
options: [ |
|
||||||
{ label: '启用', value: '0' }, |
|
||||||
{ label: '禁用', value: '1' }, |
|
||||||
], |
|
||||||
}, |
|
||||||
}, |
|
||||||
{ |
|
||||||
label: '备注', |
|
||||||
field: 'remarks', |
|
||||||
component: 'InputTextArea', |
|
||||||
} |
|
||||||
]; |
|
@ -1,100 +0,0 @@ |
|||||||
<template> |
|
||||||
<div> |
|
||||||
<BasicTable @register="registerTable"> |
|
||||||
<template #toolbar> |
|
||||||
<a-button type="primary" @click="handleCreate">新增网卡</a-button> |
|
||||||
</template> |
|
||||||
<template #action="{ record }"> |
|
||||||
<TableAction |
|
||||||
:actions="[ |
|
||||||
{ |
|
||||||
icon: 'clarity:note-edit-line', |
|
||||||
onClick: handleEdit.bind(null, record), |
|
||||||
}, |
|
||||||
{ |
|
||||||
icon: 'ant-design:delete-outlined', |
|
||||||
color: 'error', |
|
||||||
popConfirm: { |
|
||||||
title: '是否确认删除', |
|
||||||
confirm: handleDelete.bind(null, record), |
|
||||||
}, |
|
||||||
}, |
|
||||||
]" |
|
||||||
/> |
|
||||||
</template> |
|
||||||
</BasicTable> |
|
||||||
|
|
||||||
<BoxCardModal @register="registerModal" @success="handleSuccess"/> |
|
||||||
</div> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script lang="ts" setup> |
|
||||||
import {BasicTable, useTable, TableAction} from '/@/components/Table'; |
|
||||||
import {useModal} from '/@/components/Modal'; |
|
||||||
import BoxCardModal from './BoxCardModal.vue'; |
|
||||||
import {columns, searchFormSchema} from './boxcard.data'; |
|
||||||
import {useMessage} from '/@/hooks/web/useMessage'; |
|
||||||
import {cardList, remove} from '/@/api/platform/system/controller/boxcard'; |
|
||||||
|
|
||||||
const {createMessage} = useMessage(); |
|
||||||
const [registerModal, {openModal}] = useModal(); |
|
||||||
const [registerTable, {reload}] = useTable({ |
|
||||||
title: '网卡列表', |
|
||||||
api: cardList, |
|
||||||
columns, |
|
||||||
formConfig: { |
|
||||||
labelWidth: 120, |
|
||||||
schemas: searchFormSchema, |
|
||||||
}, |
|
||||||
pagination: true, |
|
||||||
striped: true, |
|
||||||
useSearchForm: true, |
|
||||||
showTableSetting: true, |
|
||||||
bordered: true, |
|
||||||
showIndexColumn: true, |
|
||||||
canResize: false, |
|
||||||
actionColumn: { |
|
||||||
width: 80, |
|
||||||
title: '操作', |
|
||||||
dataIndex: 'action', |
|
||||||
slots: {customRender: 'action'}, |
|
||||||
fixed: undefined, |
|
||||||
}, |
|
||||||
}); |
|
||||||
|
|
||||||
/** |
|
||||||
* 创建菜单 |
|
||||||
*/ |
|
||||||
function handleCreate() { |
|
||||||
openModal(true, { |
|
||||||
isUpdate: false, |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
/** |
|
||||||
* 编辑菜单 |
|
||||||
*/ |
|
||||||
function handleEdit(record: Recordable) { |
|
||||||
openModal(true, { |
|
||||||
record, |
|
||||||
isUpdate: true, |
|
||||||
}); |
|
||||||
} |
|
||||||
|
|
||||||
/** |
|
||||||
* 删除菜单 |
|
||||||
*/ |
|
||||||
async function handleDelete(record: Recordable) { |
|
||||||
await remove({ids: record.id}); |
|
||||||
createMessage.success('删除成功!'); |
|
||||||
handleSuccess(); |
|
||||||
} |
|
||||||
|
|
||||||
/** |
|
||||||
* 成功后重载表格 |
|
||||||
*/ |
|
||||||
function handleSuccess() { |
|
||||||
reload(); |
|
||||||
} |
|
||||||
|
|
||||||
</script> |
|
Loading…
Reference in new issue