123 lines
3.5 KiB
Vue
123 lines
3.5 KiB
Vue
<template>
|
|
<AdminHeader />
|
|
<div>
|
|
<div class="container m-3">
|
|
|
|
<div class="rounded-card row">
|
|
<H1>Направления</H1>
|
|
<input
|
|
type="text"
|
|
class="form-control"
|
|
id="name"
|
|
placeholder="Название направления"
|
|
name="name"
|
|
v-model="search_value"
|
|
/>
|
|
<button class="btn-secondary border border-transparent rounded shadow-sm " @click="search">Поиск</button>
|
|
<div style="min-width:max-content;" class="m-2">
|
|
<div class="row">
|
|
<button class="btn-success border border-transparent rounded shadow-sm " @click="showModal">Добавить</button>
|
|
</div>
|
|
<table class="table table-hover table-bordered">
|
|
<tbody>
|
|
<tr>
|
|
<td>Номер</td>
|
|
<td>Зазвание</td>
|
|
<td>Места обычные</td>
|
|
<td>Места льготные</td>
|
|
<td></td>
|
|
</tr>
|
|
<tr v-for="row in trainings" :key="row.id" style="min-width:max-content;" >
|
|
<td @click="clickOnTraining(row.id)">{{ row.num }}</td>
|
|
<td @click="clickOnTraining(row.id)">{{ row.title }}</td>
|
|
<td @click="clickOnTraining(row.id)">{{ row.basic_places }}</td>
|
|
<td @click="clickOnTraining(row.id)">{{ row.benefit_places }}</td>
|
|
<td><button class="btn btn-outline-danger" @click="deleteTrain(row.id)">Удалить</button></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<ModalCreateTraining ref="modal"></ModalCreateTraining>
|
|
</template>
|
|
<script scoped>
|
|
import TrainingSevice from '@/services/TrainingSevice';
|
|
import AdminHeader from '@/elemets/adminHeader.vue';
|
|
import ModalCreateTraining from './ModalCreateTraining.vue';
|
|
export default{
|
|
name:"trainings",
|
|
data(){
|
|
return{
|
|
trainings: [],
|
|
myOrder: null,
|
|
search_value: ""
|
|
}
|
|
},
|
|
components: {
|
|
AdminHeader,
|
|
ModalCreateTraining
|
|
},
|
|
beforeCreate(){
|
|
TrainingSevice.getAll().then(response =>{
|
|
this.trainings = response.data
|
|
})
|
|
|
|
},
|
|
methods:{
|
|
search(){
|
|
if(this.search_value.length > 0){
|
|
TrainingSevice.search(this.search_value).then(response =>{
|
|
this.trainings = response.data
|
|
})
|
|
}else{
|
|
TrainingSevice.getAll().then(response =>{
|
|
this.trainings = response.data
|
|
})
|
|
}
|
|
|
|
},
|
|
clickOnTraining(id){
|
|
this.$router.push({ name: 'training', params: { id: id} })
|
|
},
|
|
showModal() {
|
|
this.$refs.modal.show = true;
|
|
|
|
},
|
|
deleteTrain(id){
|
|
TrainingSevice.delete(id).then(response =>{
|
|
console.log(response.data)
|
|
TrainingSevice.getAll().then(response =>{
|
|
this.trainings = response.data
|
|
})
|
|
}).catch(e => {
|
|
console.log(e.data)
|
|
})
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped>
|
|
.container
|
|
{
|
|
position:absolute ;
|
|
min-width:calc(205vh);
|
|
background-color: #6ec0d9e9 ;
|
|
border: 5px solid #3f8ba2;
|
|
padding:12px;
|
|
align-items: center;
|
|
border-radius:8px;
|
|
}
|
|
|
|
.rounded-card{
|
|
border: 5px solid #3f8ba2;
|
|
padding:6px;
|
|
margin:6px;
|
|
border-radius:8px;
|
|
align-items: center;
|
|
}
|
|
</style> |