目前是Java后端+mySQL
swagger可以查看接口如圖
1呈础、獲取列表
get() {
this.Api.get('/operation', {
}).then((res) => {
//可以打印數(shù)據(jù)看看需要什么信息
}).catch((err) => {
});
},
2、刪除
deleteRoad(id) {
//彈出刪除確認
this.Api.delete('/operation/' + id).then((res) => {
this.modalDelete = false;
this.$Modal.success({content: '刪除模型成功'});
this.updateStatus();//更新表格數(shù)據(jù)
}).catch((err) => {
});
},
3梆造、新增加彈窗
//新增初始化
addRoadInit() {
this.roadModal=true
},
//增加
addRoad() {
this.Api.post('/operation', this.road).then((res) => {
}).catch((err) => {
if (err.code == 18200) {
this.$Modal.warning({content: err.message});
return;
}
});
this.roadModal=false
this.updateStatus()
},
//新增初始化
addRoadInit() {
this.roadModal=true
},
//增加
addRoad() {
this.Api.post('/operation', this.road).then((res) => {
}).catch((err) => {
if (err.code == 18200) {
this.$Modal.warning({content: err.message});
return;
}
});
this.roadModal=false
this.updateStatus()
}
//vue
<!-- 新增 start -->
<Modal v-model="roadModal" :mask-closable="false" :closable="false">
<Form ref="roadModal" :model="road" :label-width="120" @on-cancel="roadModal = false;">
<Form-item label="部門" prop="name">
<Input type="text" v-model="road.name" placeholder="名稱"/>
</Form-item>
<Form-item label="完整地址" prop="name">
<Input type="text" v-model="road.url" placeholder="名稱"/>
</Form-item>
</Form>
<div slot="footer" class="modalFooter">
<HdButton type="ghost" hover="defalut"class="card_button" style="border-right-color:#C4C4C4;" border="none" @click="roadModal = false;" >關(guān)閉</HdButton>
<HdButton type="ghost" hover="defalut" class="card_button" border="none" @click="addRoad()">提交</HdButton>
</div>
</Modal>
<!-- 新增 end -->