Files
E-Vote/resources/assets/js/components/demo/admin/nominee/add.vue
T
2024-02-29 09:57:59 +08:00

117 lines
3.0 KiB
Vue

<template>
<div class="panel panel-default">
<div class="panel-body">
<form
class="row"
method="POST"
id="add_form"
:action="data.API+'nominee'"
enctype="mutlipart/formdata"
@submit.prevent="add()">
<div class="col-md-4">
<uploader file-name="image" />
</div>
<div class="col-md-8">
<div class="form-group">
<label for="name">Nama</label>
<input type="text" name="name" class="form-control" required/>
</div>
<div class="form-group">
<label for="student_id">No. Anggota</label>
<input type="text" name="student_id" class="form-control" required/>
</div>
<div class="form-group">
<label for="course">Course</label>
<input type="text" name="course" class="form-control" required/>
</div>
<div class="form-group">
<label for="motto">Motto</label>
<input type="text" name="motto" class="form-control" placeholder="(Optional)" />
</div>
<div class="form-group">
<label for="description">Description</label>
<textarea name="description" class="form-control" placeholder="(Optional)"></textarea>
</div>
<div class="form-group">
<label for="position_id">Position</label>
<select class="form-control" v-model="position_id" name="position_id" required>
<option value="0" disabled>--- Select Position ---</option>
<option v-for="position in data.positions" :value="position.id">{{ position.name }}</option>
</select>
</div>
<div class="form-group">
<label for="partylist_id">Partylist</label>
<select class="form-control" name="partylist_id">
<option value="">--- Select Partylist (Optional) ---</option>
<option v-for="partylist in data.partylists" :value="partylist.id">{{ partylist.name}}</option>
</select>
</div>
<div class="form-group pull-right">
<input type="submit" value="Submit" class="btn btn-info">
<router-link
:to="{name:'Maklumat Calon', query:{position_id:position_id}}"
class="btn btn-default">
Submit
</router-link>
</div>
</div>
</form>
</div>
</div>
</template>
<script>
export default{
data: function () {
return {
loading: false
}
},
methods: {
add: function () {
if (this.loading) return;
var vm = this;
this.loading = true;
this.util.notify('Adding Nominee', 'progress', 0);
$('#add_form').ajaxSubmit({
success: function (response) {
$.notifyClose();
vm.loading = false;
if (vm.util.showResult(response, 'success', 'ajax'))
vm.$router.push({name: 'Maklumat Calon'});
},
error: function (error) {
$.notifyClose();
vm.loading = false;
vm.util.showResult(error, 'error', 'ajax');
},
uploadProgress: function (a, b, c, progress) {
vm.util.notify('Adding Nominee', 'progress', progress);
}
})
}
},
computed: {
position_id: {
get: function () {
return this.$route.query.position_id;
},
set: function (id) {
this.$router.replace({query: {position_id: id}});
}
}
}
}
</script>