mirror of
https://github.com/crater-invoice/crater.git
synced 2025-10-31 13:41:09 -04:00
init crater
This commit is contained in:
Mohit Panjwani
96
resources/assets/js/views/categories/Create.vue
Normal file
96
resources/assets/js/views/categories/Create.vue
Normal file
@ -0,0 +1,96 @@
|
||||
<template>
|
||||
<div class="main-content categoriescreate">
|
||||
<div class="page-header">
|
||||
<h3 class="page-title">{{ $t('categories.new_category') }}</h3>
|
||||
<ol class="breadcrumb">
|
||||
<li class="breadcrumb-item"><router-link slot="item-title" to="/admin/dashboard">{{ $t('general.home') }}</router-link></li>
|
||||
<li class="breadcrumb-item"><router-link slot="item-title" to="/admin/expenses">{{ $tc('categorie.category',2) }}</router-link></li>
|
||||
<li class="breadcrumb-item"><a href="#">{{ $t('categories.new_category') }}</a></li>
|
||||
</ol>
|
||||
<div class="page-actions">
|
||||
<router-link slot="item-title" to="/admin/expenses">
|
||||
<base-button class="btn btn-primary" color="theme">
|
||||
<font-awesome-icon icon="backward" class="mr-2"/> {{ $t('general.go_back') }}
|
||||
</base-button>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
<div class="card">
|
||||
<form action="" @submit.prevent="submitCategoryData">
|
||||
<div class="card-body">
|
||||
<div class="form-group">
|
||||
<label class="control-label">{{ $t('expenses.categories.title') }}</label><span class="text-danger"> *</span>
|
||||
<base-input
|
||||
:invalid="$v.formData.name.$error"
|
||||
v-model.trim="formData.name"
|
||||
type="text"
|
||||
name="name"
|
||||
@input="$v.formData.name.$touch()"
|
||||
/>
|
||||
<div v-if="$v.formData.name.$error">
|
||||
<span v-if="!$v.formData.name.required" class="text-danger">{{ $t('validation.required') }}</span>
|
||||
<span v-if="!$v.formData.name.minLength" class="text-danger"> {{ $tc('validation.name_min_length', $v.formData.name.$params.minLength.min, {count: $v.formData.name.$params.minLength.min}) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="description">{{ $t('expenses.categories.description') }}</label>
|
||||
<base-text-area v-model="formData.description" rows="5" name="description" />
|
||||
</div>
|
||||
<base-button icon="save" type="submit" color="theme">
|
||||
{{ $t('general.save') }}
|
||||
</base-button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { validationMixin } from 'vuelidate'
|
||||
import { mapActions } from 'vuex'
|
||||
const { required, minLength } = require('vuelidate/lib/validators')
|
||||
export default {
|
||||
mixins: [validationMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
name: null,
|
||||
description: null
|
||||
}
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
formData: {
|
||||
name: {
|
||||
required,
|
||||
minLength: minLength(3)
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
},
|
||||
methods: {
|
||||
...mapActions('category', [
|
||||
'loadData',
|
||||
'addCategory'
|
||||
]),
|
||||
async submitCategoryData () {
|
||||
this.$v.formData.$touch()
|
||||
if (this.$v.$invalid) {
|
||||
return true
|
||||
}
|
||||
let response = await this.addCategory({ ...this.formData })
|
||||
if (response.data.success) {
|
||||
window.toastr['success'](response.data.success)
|
||||
this.$router.push('/admin/expenses')
|
||||
return true
|
||||
}
|
||||
window.toastr['error'](response.data.error)
|
||||
return true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
114
resources/assets/js/views/categories/Edit.vue
Normal file
114
resources/assets/js/views/categories/Edit.vue
Normal file
@ -0,0 +1,114 @@
|
||||
<template>
|
||||
<div class="main-content categoriescreate">
|
||||
<div class="page-header">
|
||||
<h3 v-if="!isEdit" class="page-title">{{ $t('categories.add_category') }}</h3>
|
||||
<h3 v-else class="page-title">{{ $t('navigation.edit') }} {{ $tc('navigation.category',1) }}</h3>
|
||||
<ol class="breadcrumb">
|
||||
<li class="breadcrumb-item"><router-link slot="item-title" to="/admin/dashboard">{{ $t('navigation.home') }}</router-link></li>
|
||||
<li class="breadcrumb-item"><router-link slot="item-title" to="/admin/expenses">{{ $tc('navigation.category',2) }}</router-link></li>
|
||||
<li v-if="!isEdit" class="breadcrumb-item"><a href="#">{{ $t('expenses.categories.add_category') }} {{ $tc('navigation.category', 1) }}</a></li>
|
||||
<li v-else class="breadcrumb-item"><a href="#">{{ $t('navigation.edit') }} {{ $tc('navigation.category', 1) }}</a></li>
|
||||
</ol>
|
||||
<div class="page-actions">
|
||||
<router-link slot="item-title" to="/admin/expenses">
|
||||
<base-button icon="backward" color="theme">
|
||||
{{ $t('navigation.go_back') }}
|
||||
</base-button>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
<div class="card">
|
||||
<form action="" @submit.prevent="submitCategoryData">
|
||||
<div class="card-body">
|
||||
<div class="form-group">
|
||||
<label class="control-label">{{ $t('expenses.categories.title') }}</label><span class="text-danger"> *</span>
|
||||
<input
|
||||
:class="{ error: $v.formData.name.$error }"
|
||||
v-model.trim="formData.name"
|
||||
type="text"
|
||||
name="name"
|
||||
class="form-control"
|
||||
@input="$v.formData.name.$touch()"
|
||||
>
|
||||
<div v-if="$v.formData.name.$error">
|
||||
<span v-if="!$v.formData.name.required" class="text-danger">{{ $t('validation.required') }}</span>
|
||||
<span v-if="!$v.formData.name.minLength" class="text-danger"> {{ $tc('validation.name_min_length', $v.formData.name.$params.minLength.min, {count: $v.formData.name.$params.minLength.min}) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="description">{{ $t('expenses.categories.description') }}</label>
|
||||
<textarea v-model="formData.description" class="form-control" rows="5" name="description" />
|
||||
</div>
|
||||
<base-button icon="save" color="theme" type="submit">
|
||||
{{ $t('navigation.save') }}
|
||||
</base-button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { validationMixin } from 'vuelidate'
|
||||
import { mapActions } from 'vuex'
|
||||
const { required, minLength } = require('vuelidate/lib/validators')
|
||||
export default {
|
||||
mixins: [validationMixin],
|
||||
data () {
|
||||
return {
|
||||
formData: {
|
||||
name: null,
|
||||
description: null
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isEdit () {
|
||||
if (this.$route.name === 'categoryedit') {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
formData: {
|
||||
name: {
|
||||
required,
|
||||
minLength: minLength(3)
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.fetchInitialData()
|
||||
},
|
||||
methods: {
|
||||
...mapActions('category', [
|
||||
'loadData',
|
||||
'addCategory',
|
||||
'editCategory'
|
||||
]),
|
||||
async fetchInitialData () {
|
||||
let response = await this.loadData(this.$route.params.id)
|
||||
this.formData.name = response.data.category.name
|
||||
this.formData.description = response.data.category.description
|
||||
},
|
||||
async submitCategoryData () {
|
||||
this.$v.formData.$touch()
|
||||
if (this.$v.$invalid) {
|
||||
return true
|
||||
}
|
||||
let response = await this.editCategory({ id: this.$route.params.id, editData: { ...this.formData } })
|
||||
if (response.data.success) {
|
||||
window.toastr['success'](response.data.success)
|
||||
this.$router.push('/admin/expenses')
|
||||
return true
|
||||
}
|
||||
window.toastr['error'](response.data.error)
|
||||
return true
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user