|
|
@ -1,29 +1,33 @@ |
|
|
|
<template> |
|
|
|
<template> |
|
|
|
<div> |
|
|
|
<div> |
|
|
|
<BasicTable @register="registerTable"> |
|
|
|
<BasicTable @register="register"> |
|
|
|
<template #toolbar> |
|
|
|
<template #toolbar> |
|
|
|
<a-button type="primary" :preIcon="IconEnum.ADD" @click="handleCreate"> IP 查询 </a-button> |
|
|
|
<a-button type="primary" :preIcon="IconEnum.ADD" @click="handleCreate"> IP 查询 </a-button> |
|
|
|
|
|
|
|
<a-button type="info" @click="expandAll">{{ t('component.tree.expandAll') }}</a-button> |
|
|
|
|
|
|
|
<a-button type="info" @click="collapseAll">{{ t('component.tree.unExpandAll') }}</a-button> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</BasicTable> |
|
|
|
</BasicTable> |
|
|
|
<AreaModal @register="registerModal" @success="reload()" /> |
|
|
|
<AreaModal @register="registerModal" @success="reload()" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
<script lang="ts" setup> |
|
|
|
<script lang="ts" setup> |
|
|
|
|
|
|
|
import { useI18n } from '@/hooks/web/useI18n' |
|
|
|
import { useModal } from '@/components/Modal' |
|
|
|
import { useModal } from '@/components/Modal' |
|
|
|
import AreaModal from './AreaModal.vue' |
|
|
|
import AreaModal from './AreaModal.vue' |
|
|
|
import { IconEnum } from '@/enums/appEnum' |
|
|
|
import { IconEnum } from '@/enums/appEnum' |
|
|
|
import { BasicTable, useTable } from '@/components/Table' |
|
|
|
import { BasicTable, useTable } from '@/components/Table' |
|
|
|
import { getAreaTree } from '@/api/system/area' |
|
|
|
import { getAreaTree } from '@/api/system/area' |
|
|
|
import { columns } from './area.data' |
|
|
|
import { columns } from './area.data' |
|
|
|
import { handleTree } from '@/utils/tree' |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
defineOptions({ name: 'SystemArea' }) |
|
|
|
defineOptions({ name: 'SystemArea' }) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const { t } = useI18n() |
|
|
|
|
|
|
|
|
|
|
|
const [registerModal, { openModal }] = useModal() |
|
|
|
const [registerModal, { openModal }] = useModal() |
|
|
|
|
|
|
|
|
|
|
|
const [registerTable, { reload }] = useTable({ |
|
|
|
const [register, { expandAll, collapseAll, reload }] = useTable({ |
|
|
|
title: '岗位列表', |
|
|
|
title: 'IP 地区列表', |
|
|
|
api: getList, |
|
|
|
api: getAreaTree, |
|
|
|
columns, |
|
|
|
columns, |
|
|
|
rowKey: 'id', |
|
|
|
rowKey: 'id', |
|
|
|
isTreeTable: true, |
|
|
|
isTreeTable: true, |
|
|
@ -36,11 +40,6 @@ const [registerTable, { reload }] = useTable({ |
|
|
|
canResize: false |
|
|
|
canResize: false |
|
|
|
}) |
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
async function getList() { |
|
|
|
|
|
|
|
const res = await getAreaTree() |
|
|
|
|
|
|
|
return handleTree(res, 'id') |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function handleCreate() { |
|
|
|
function handleCreate() { |
|
|
|
openModal(true, { isUpdate: false }) |
|
|
|
openModal(true, { isUpdate: false }) |
|
|
|
} |
|
|
|
} |
|
|
|