增加小区编辑功能。
This commit is contained in:
parent
45bd035a0d
commit
f0426f1f5a
@ -44,3 +44,12 @@ export function updateCommunityStatus(id, status) {
|
|||||||
data: { status }
|
data: { status }
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 添加更新小区的接口
|
||||||
|
export function updateCommunity(id, data) {
|
||||||
|
return request({
|
||||||
|
url: `/api/community/${id}`,
|
||||||
|
method: 'put',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
@ -44,6 +44,11 @@
|
|||||||
/>
|
/>
|
||||||
<span v-else>-</span>
|
<span v-else>-</span>
|
||||||
</template>
|
</template>
|
||||||
|
<template v-if="column.key === 'action'">
|
||||||
|
<a-space>
|
||||||
|
<a @click="handleEdit(record)">编辑</a>
|
||||||
|
</a-space>
|
||||||
|
</template>
|
||||||
</template>
|
</template>
|
||||||
</a-table>
|
</a-table>
|
||||||
|
|
||||||
@ -58,9 +63,9 @@
|
|||||||
</a-modal>
|
</a-modal>
|
||||||
|
|
||||||
<a-modal
|
<a-modal
|
||||||
v-model:visible="addModalVisible"
|
v-model:visible="modalVisible"
|
||||||
title="添加小区"
|
:title="isEdit ? '编辑小区' : '添加小区'"
|
||||||
@ok="handleAdd"
|
@ok="handleSubmit"
|
||||||
@cancel="handleCancel"
|
@cancel="handleCancel"
|
||||||
:confirmLoading="confirmLoading"
|
:confirmLoading="confirmLoading"
|
||||||
width="680px"
|
width="680px"
|
||||||
@ -68,7 +73,7 @@
|
|||||||
<template #footer>
|
<template #footer>
|
||||||
<a-space>
|
<a-space>
|
||||||
<a-button @click="handleCancel">取消</a-button>
|
<a-button @click="handleCancel">取消</a-button>
|
||||||
<a-button type="primary" :loading="confirmLoading" @click="handleAdd">
|
<a-button type="primary" :loading="confirmLoading" @click="handleSubmit">
|
||||||
保存
|
保存
|
||||||
</a-button>
|
</a-button>
|
||||||
</a-space>
|
</a-space>
|
||||||
@ -115,7 +120,7 @@
|
|||||||
<script>
|
<script>
|
||||||
import { defineComponent, ref, onMounted, nextTick } from 'vue'
|
import { defineComponent, ref, onMounted, nextTick } from 'vue'
|
||||||
import { message, Tag, Menu, Dropdown, Image, Upload } from 'ant-design-vue'
|
import { message, Tag, Menu, Dropdown, Image, Upload } from 'ant-design-vue'
|
||||||
import { getCommunityList, createCommunity, updateCommunityStatus } from '@/api/community'
|
import { getCommunityList, createCommunity, updateCommunityStatus, updateCommunity } from '@/api/community'
|
||||||
import { loadAMap, createMap } from '@/utils/amap.js'
|
import { loadAMap, createMap } from '@/utils/amap.js'
|
||||||
import dayjs from 'dayjs'
|
import dayjs from 'dayjs'
|
||||||
import PageContainer from '@/components/PageContainer.vue'
|
import PageContainer from '@/components/PageContainer.vue'
|
||||||
@ -213,6 +218,13 @@ export default defineComponent({
|
|||||||
width: 100,
|
width: 100,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
key: 'action',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
fixed: 'right'
|
||||||
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
// 获取小区列表数据
|
// 获取小区列表数据
|
||||||
@ -287,14 +299,11 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 添加小区相关的响应式变量
|
// 添加小区相关的响应式变量
|
||||||
const addModalVisible = ref(false)
|
const modalVisible = ref(false)
|
||||||
const confirmLoading = ref(false)
|
const confirmLoading = ref(false)
|
||||||
const searchLoading = ref(false)
|
const isEdit = ref(false)
|
||||||
const searchAddress = ref('')
|
|
||||||
const searchOptions = ref([])
|
|
||||||
const addMap = ref(null)
|
|
||||||
const addMarker = ref(null)
|
|
||||||
const formRef = ref(null)
|
const formRef = ref(null)
|
||||||
|
const currentId = ref(null)
|
||||||
|
|
||||||
const formState = ref({
|
const formState = ref({
|
||||||
name: '',
|
name: '',
|
||||||
@ -303,7 +312,8 @@ export default defineComponent({
|
|||||||
longitude: null,
|
longitude: null,
|
||||||
latitude: null
|
latitude: null
|
||||||
},
|
},
|
||||||
qy_group_qrcode: ''
|
qy_group_qrcode: '',
|
||||||
|
status: 'UNOPEN'
|
||||||
})
|
})
|
||||||
|
|
||||||
const rules = {
|
const rules = {
|
||||||
@ -317,13 +327,57 @@ export default defineComponent({
|
|||||||
const fileList = ref([])
|
const fileList = ref([])
|
||||||
const uploadUrl = '/api/upload/image'
|
const uploadUrl = '/api/upload/image'
|
||||||
|
|
||||||
// 显示添加模态框
|
// 显示编辑模态框
|
||||||
const showAddModal = () => {
|
const handleEdit = (record) => {
|
||||||
addModalVisible.value = true
|
isEdit.value = true
|
||||||
|
currentId.value = record.id
|
||||||
|
modalVisible.value = true
|
||||||
|
|
||||||
|
// 填充表单数据
|
||||||
|
formState.value = {
|
||||||
|
name: record.name,
|
||||||
|
location: {
|
||||||
|
address: record.address,
|
||||||
|
longitude: record.longitude,
|
||||||
|
latitude: record.latitude
|
||||||
|
},
|
||||||
|
qy_group_qrcode: record.qy_group_qrcode,
|
||||||
|
status: record.status
|
||||||
|
}
|
||||||
|
|
||||||
|
// 如果有二维码,设置文件列表
|
||||||
|
if (record.qy_group_qrcode) {
|
||||||
|
fileList.value = [{
|
||||||
|
uid: '-1',
|
||||||
|
name: '群二维码',
|
||||||
|
status: 'done',
|
||||||
|
url: record.qy_group_qrcode
|
||||||
|
}]
|
||||||
|
} else {
|
||||||
|
fileList.value = []
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 提交表单
|
// 显示添加模态框
|
||||||
const handleAdd = () => {
|
const showAddModal = () => {
|
||||||
|
isEdit.value = false
|
||||||
|
currentId.value = null
|
||||||
|
modalVisible.value = true
|
||||||
|
formState.value = {
|
||||||
|
name: '',
|
||||||
|
location: {
|
||||||
|
address: '',
|
||||||
|
longitude: null,
|
||||||
|
latitude: null
|
||||||
|
},
|
||||||
|
qy_group_qrcode: '',
|
||||||
|
status: 'UNOPEN'
|
||||||
|
}
|
||||||
|
fileList.value = []
|
||||||
|
}
|
||||||
|
|
||||||
|
// 统一提交处理
|
||||||
|
const handleSubmit = () => {
|
||||||
formRef.value.validate().then(async () => {
|
formRef.value.validate().then(async () => {
|
||||||
try {
|
try {
|
||||||
confirmLoading.value = true
|
confirmLoading.value = true
|
||||||
@ -332,31 +386,38 @@ export default defineComponent({
|
|||||||
address: formState.value.location.address,
|
address: formState.value.location.address,
|
||||||
longitude: formState.value.location.longitude,
|
longitude: formState.value.location.longitude,
|
||||||
latitude: formState.value.location.latitude,
|
latitude: formState.value.location.latitude,
|
||||||
qy_group_qrcode: formState.value.qy_group_qrcode
|
qy_group_qrcode: formState.value.qy_group_qrcode,
|
||||||
|
status: formState.value.status
|
||||||
|
}
|
||||||
|
|
||||||
|
let res
|
||||||
|
if (isEdit.value) {
|
||||||
|
res = await updateCommunity(currentId.value, params)
|
||||||
|
} else {
|
||||||
|
res = await createCommunity(params)
|
||||||
}
|
}
|
||||||
|
|
||||||
const res = await createCommunity(params)
|
|
||||||
if (res.code === 200) {
|
if (res.code === 200) {
|
||||||
message.success('添加成功')
|
message.success(isEdit.value ? '更新成功' : '添加成功')
|
||||||
addModalVisible.value = false
|
modalVisible.value = false
|
||||||
fetchData() // 刷新列表
|
fetchData() // 刷新列表
|
||||||
} else {
|
} else {
|
||||||
message.error(res.message || '添加失败')
|
message.error(res.message || (isEdit.value ? '更新失败' : '添加失败'))
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('添加小区失败:', error)
|
console.error(isEdit.value ? '更新小区失败:' : '添加小区失败:', error)
|
||||||
message.error('添加失败')
|
message.error(isEdit.value ? '更新失败' : '添加失败')
|
||||||
} finally {
|
} finally {
|
||||||
confirmLoading.value = false
|
confirmLoading.value = false
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
// 取消添加
|
// 取消处理
|
||||||
const handleCancel = () => {
|
const handleCancel = () => {
|
||||||
formRef.value?.resetFields()
|
formRef.value?.resetFields()
|
||||||
fileList.value = []
|
fileList.value = []
|
||||||
addModalVisible.value = false
|
modalVisible.value = false
|
||||||
}
|
}
|
||||||
|
|
||||||
// 处理状态变更
|
// 处理状态变更
|
||||||
@ -409,18 +470,20 @@ export default defineComponent({
|
|||||||
getStatusText,
|
getStatusText,
|
||||||
getStatusColor,
|
getStatusColor,
|
||||||
formatDateTime,
|
formatDateTime,
|
||||||
addModalVisible,
|
modalVisible,
|
||||||
confirmLoading,
|
confirmLoading,
|
||||||
|
isEdit,
|
||||||
formState,
|
formState,
|
||||||
formRef,
|
formRef,
|
||||||
rules,
|
rules,
|
||||||
showAddModal,
|
showAddModal,
|
||||||
handleAdd,
|
handleSubmit,
|
||||||
handleCancel,
|
handleCancel,
|
||||||
handleStatusChange,
|
handleStatusChange,
|
||||||
fileList,
|
fileList,
|
||||||
uploadUrl,
|
uploadUrl,
|
||||||
handleQrcodeChange
|
handleQrcodeChange,
|
||||||
|
handleEdit
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user