102 lines
3.0 KiB
Vue
102 lines
3.0 KiB
Vue
<template>
|
|
<div>
|
|
<BasicTable @register="registerTable">
|
|
<template #toolbar>
|
|
<PermissionBtn @btnEvent="buttonClick"></PermissionBtn>
|
|
</template>
|
|
<template #bodyCell="{ column, record, index }">
|
|
<template v-if="column.key == 'LngLat'">
|
|
{{ `${record.lng}, ${record.lat}` }}
|
|
</template>
|
|
</template>
|
|
</BasicTable>
|
|
<a-modal v-model:open="addOrUpdateModalOpen" :title="modalType == 'add'? '添加': '编辑'" :footer="null" :destroyOnClose="true" @cancel="modalClose">
|
|
<AddOrUpdateModal :modalType="modalType" :modalData="modalData" @closeAddOrUpdateModal="closeAddOrUpdateModal"/>
|
|
</a-modal>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, onMounted, reactive, watch, createVNode, unref } from 'vue';
|
|
import { Modal, message } from 'ant-design-vue';
|
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
|
import { BasicTable, useTable } from '@/components/Table';
|
|
import { PermissionBtn } from '@/components/PermissionBtn/index';
|
|
import { LoadAllPage, Delete } from '@/api/illegalconstruction/parkinglot'
|
|
import { columns, searchFormSchema } from './util';
|
|
import AddOrUpdateModal from './AddOrUpdateModal/index.vue'
|
|
|
|
const addOrUpdateModalOpen = ref(false)
|
|
const modalType = ref()
|
|
const modalData = ref({})
|
|
|
|
// 表格
|
|
const [registerTable, { reload, getSelectRows, getPaginationRef }] = useTable({
|
|
title: '停车场列表',
|
|
api: LoadAllPage,
|
|
columns: columns,
|
|
formConfig: {
|
|
labelWidth: 120,
|
|
schemas: searchFormSchema,
|
|
},
|
|
showIndexColumn: false,
|
|
rowSelection: {
|
|
type: 'radio',
|
|
},
|
|
useSearchForm: true,
|
|
bordered: true,
|
|
showTableSetting: true,
|
|
handleSearchInfoFn(info) {
|
|
return info;
|
|
},
|
|
});
|
|
|
|
// 按键分类
|
|
const buttonClick = async (type) => {
|
|
switch (type) {
|
|
case 'btnAdd':
|
|
modalType.value = 'add'
|
|
addOrUpdateModalOpen.value = true
|
|
break;
|
|
case 'btnEdit':
|
|
let select = getSelectRows()
|
|
if (select.length !== 1) {
|
|
message.warning('请选择一条数据');
|
|
return;
|
|
}
|
|
console.log('getSelectRows()',getSelectRows())
|
|
modalData.value = {...select[0]}
|
|
modalType.value = 'update'
|
|
addOrUpdateModalOpen.value = true
|
|
break;
|
|
case 'btnDelete':
|
|
if (getSelectRows().length !== 1) {
|
|
message.warning('请选择一条数据');
|
|
return;
|
|
}
|
|
Modal.confirm({
|
|
title: '是否确认删除?',
|
|
icon: createVNode(ExclamationCircleOutlined),
|
|
onCancel() {},
|
|
onOk() {
|
|
return Delete(getSelectRows()).then(res => {
|
|
message.success('停车场删除成功')
|
|
reload()
|
|
})
|
|
},
|
|
});
|
|
break;
|
|
}
|
|
};
|
|
const closeAddOrUpdateModal = (isReload=false) => {
|
|
addOrUpdateModalOpen.value = false
|
|
modalData.value = {}
|
|
if(isReload){
|
|
reload()
|
|
}
|
|
}
|
|
const modalClose = () => {
|
|
modalData.value = {}
|
|
}
|
|
</script>
|