You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
83 lines
2.0 KiB
Vue
83 lines
2.0 KiB
Vue
<script setup>
|
|
import { ref } from 'vue'
|
|
import { venuesInquire, slotDel } from '@/api/slot'
|
|
// import { View, Delete, Plus } from '@element-plus/icons-vue'
|
|
|
|
const loading = ref(false)
|
|
const dialogVisible = ref(false)
|
|
const formData = new FormData()
|
|
|
|
// 加载场地列表
|
|
const venueList = ref([])
|
|
const getVenueList = async (id) => {
|
|
loading.value = true
|
|
const {
|
|
data: { data }
|
|
} = await venuesInquire(id)
|
|
venueList.value = data
|
|
loading.value = false
|
|
console.log(data)
|
|
}
|
|
|
|
// 组件对外暴露一个方法 open ，基于 open 传来的参数，区分添加还是编辑
|
|
const timeStr = ref('')
|
|
const open = (str, id) => {
|
|
getVenueList(id)
|
|
formData.append('slotId', id)
|
|
timeStr.value = str
|
|
dialogVisible.value = true
|
|
}
|
|
// 向外暴露
|
|
defineExpose({
|
|
open
|
|
})
|
|
|
|
// 关闭弹窗
|
|
const closeDialog = () => {
|
|
formData.delete('slotId')
|
|
formData.delete('venueId')
|
|
dialogVisible.value = false
|
|
}
|
|
|
|
// 移除场地信息
|
|
const onRemove = (venueId) => {
|
|
ElMessageBox.confirm('是否确认移除该条场地信息？', '提示', {
|
|
confirmButtonText: '确认',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
})
|
|
.then(async () => {
|
|
formData.append('venueId', venueId)
|
|
await slotDel(formData)
|
|
ElMessage({
|
|
type: 'success',
|
|
message: '移除成功'
|
|
})
|
|
closeDialog()
|
|
})
|
|
.catch(() => {
|
|
closeDialog()
|
|
})
|
|
}
|
|
</script>
|
|
<template>
|
|
<el-dialog
|
|
v-model="dialogVisible"
|
|
:title="'时间段：' + timeStr"
|
|
width="550"
|
|
draggable
|
|
>
|
|
<el-table :data="venueList" v-loading="loading">
|
|
<el-table-column type="index" label="序号" width="100" />
|
|
<el-table-column prop="venueName" label="场地名称" width="250" />
|
|
<el-table-column fixed="right" label="操作" min-width="120">
|
|
<template #default="{ row }">
|
|
<el-button link type="danger" @click="onRemove(row.id)"
|
|
>移除</el-button
|
|
>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-dialog>
|
|
</template>
|