一 定义 api 模块
import request from '@/utils/request'
export default {
// 分页查询
getHospitalList(current, limit, searchObj) {
return request({
url: `/admin/hospital/findPageHospital/${current}/${limit}`,
method: 'post',
data: searchObj // 使用 json 进行参数传递
})
},
// 单条删除医院
deleteHospital(id) {
return request({
url: `/admin/hospital/${id}`,
method: 'delete'
})
},
// 批量删除医院
removeHospitals(idList) {
return request({
url: `/admin/hospital/batchRemove`,
method: 'delete',
data: idList
})
},
// 锁定和取消锁定
lockHospital(id, status) {
return request({
url: `/admin/hospital/lockHospital/${id}/${status}`,
method: 'put'
})
},
// 添加医院
saveHospital(hospital) {
return request({
url: `/admin/hospital/saveHospital`,
method: 'post',
data: hospital
})
}
}
二 页面部分
<template>
<div class="app-container">
<el-form label-width="120px">
<el-form-item label="名称">
<el-input v-model="hospital.name" />
</el-form-item>
<el-form-item label="省">
<el-input v-model="hospital.province" />
</el-form-item>
<el-form-item label="市">
<el-input v-model="hospital.city" />
</el-form-item>
<el-form-item label="区">
<el-input v-model="hospital.district" />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="saveOrUpdate">保存</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
// 引入接口定义的 js 文件
import hospital from "@/api/hospital"
export default {
data() {
return {
hospital: {}
}
},
created() {},
methods: {
// 添加
saveOrUpdate() {
hospital.saveHospital(this.hospital).then(response => {
// 提示
this.$message({
type: "success",
message: "添加成功!"
})
// 跳转列表页面,使用路由跳转方式实现
this.$router.push({ path: "/hospital/list" })
})
}
}
}
</script>
三 测试效果