Skip to content

K
kiaisoft_tuananh_nuxt
Commit fdd32d6c authored by TTS Kieu Tuan Anh's avatar TTS Kieu Tuan Anh
Browse files
Options

add validation

parent 6afa5824
Show whitespace changes
Inline Side-by-side
Showing with 79 additions and 27 deletions
components/Navbar.vue
View file @ fdd32d6c
......@@ -57,7 +57,6 @@
</template>
<v-list>
<v-list-item-group
v-model="selectedItem"
color="primary"
>
<v-list-item
......
pages/categories/index.vue
View file @ fdd32d6c
......@@ -82,6 +82,7 @@
<v-text-field
v-model="eName"
label="Name"
:rules="nameRules"
required
/>
</v-col>
......@@ -90,6 +91,7 @@
v-model="eOrdering"
label="Ordering"
type="number"
:rules="requiredRules"
required
/>
</v-col>
......@@ -146,7 +148,7 @@
v-model="dialog1"
persistent
max-width="600px"
@submit.prevent="createUser"
lazy-validation
>
<template #activator="{ on, attrs }">
<v-btn
......@@ -173,6 +175,8 @@
<v-text-field
v-model="name"
label="Name"
:rules="nameRules"
lazy-validation
required
/>
</v-col>
......@@ -181,6 +185,7 @@
v-model="ordering"
label="Ordering"
type="number"
:rules="numberRules"
required
/>
</v-col>
......@@ -191,17 +196,16 @@
item-text="name"
item-value="id"
label="Parent*"
:rules="requiredRules"
/>
</v-col>
<v-col cols="12">
<v-file-input
v-model="image"
accept="image/*"
label="Image"
prepend-icon="mdi-camera"
/>
</v-col>
<v-img v-if="typeof image === 'string'" :src="image" />
</v-row>
</v-container>
<small>*indicates required field</small>
......@@ -379,6 +383,17 @@ export default {
disabled: false,
href: '/categories'
}
],
nameRules: [
v => !!v || 'Name is required',
v => (v && v.length <= 255) || 'Name must be less than 255 characters'
],
requiredRules: [
v => !!v || 'This field is required',
],
numberRules: [
v => !!v || 'This field is required',
v => v > 0 || 'value must be a positive integer'
]
}
},
......@@ -452,7 +467,6 @@ export default {
})
.then((response) => {
this.categories = response.data.data
console.log(this.categories)
})
.catch(function (error) {
console.log(error)
......@@ -464,7 +478,9 @@ export default {
fd.append('name', this.name)
fd.append('ordering', this.ordering)
fd.append('parent_id', this.parent_id)
if (this.image != null) {
fd.append('image', this.image)
}
this.$axios
.post('/categories/',
fd,
......@@ -489,6 +505,7 @@ export default {
})
})
this.getCategories()
this.clearData()
},
deleteCategory () {
const self = this
......@@ -543,7 +560,7 @@ export default {
}
fd.append('name', this.eName)
fd.append('ordering', this.eOrdering)
if (typeof this.eImage !== 'string') {
if (typeof this.eImage !== 'string' && this.eImage != null) {
fd.append('image', this.eImage)
}
try {
......@@ -566,6 +583,13 @@ export default {
} catch (error) {
console.log(error)
}
},
clearData () {
// eslint-disable-next-line no-unused-expressions
this.parent_id = '',
this.name = '',
this.ordering = '',
this.image = null
}
}
}
......
pages/products/index.vue
View file @ fdd32d6c
......@@ -28,7 +28,7 @@
<v-text-field
v-model="sName"
label="Name"
disabled
readonly
/>
</v-col>
<v-col
......@@ -40,21 +40,21 @@
item-text="name"
item-value="id"
label="Category"
disabled
readonly
/>
</v-col>
<v-col cols="12">
<v-text-field
v-model="sPrice"
label="Price"
disabled
readonly
/>
</v-col>
<v-col cols="12">
<v-text-field
v-model="sDescription"
label="Description"
disabled
readonly
/>
</v-col>
<v-col v-for="(image, index) in sImages" :key="index" cols="12">
......@@ -70,7 +70,7 @@
<v-text-field
v-model="variant.color"
label="Color"
disabled
readonly
/>
</v-col>
<v-col
......@@ -81,7 +81,7 @@
<v-text-field
v-model="variant.size"
label="Size"
disabled
readonly
/>
</v-col>
<v-col
......@@ -92,7 +92,7 @@
<v-text-field
v-model="variant.quantity"
label="Quantity"
disabled
readonly
/>
</v-col>
<v-col />
......@@ -134,6 +134,7 @@
<v-text-field
v-model="eName"
label="Name*"
:rules="requiredRules"
required
/>
</v-col>
......@@ -146,12 +147,14 @@
item-text="name"
item-value="id"
label="Category"
:rules="requiredRules"
/>
</v-col>
<v-col cols="12">
<v-text-field
v-model="ePrice"
label="Price*"
:rules="requiredRules"
required
/>
</v-col>
......@@ -159,6 +162,7 @@
<v-text-field
v-model="eDescription"
label="Description"
:rules="requiredRules"
/>
</v-col>
<v-col cols="12">
......@@ -170,7 +174,7 @@
multiple
/>
</v-col>
<v-img v-if="typeof eImage === 'string'" :src="eImages" />
<v-img v-if="typeof eImages === 'string'" :src="eImages" />
<v-col cols="12">
<v-btn
class="mx-2"
......@@ -194,6 +198,7 @@
<v-text-field
v-model="variant.color"
label="Color*"
:rules="requiredRules"
required
/>
</v-col>
......@@ -205,6 +210,7 @@
<v-text-field
v-model="variant.size"
label="Size*"
:rules="requiredRules"
required
/>
</v-col>
......@@ -216,6 +222,7 @@
<v-text-field
v-model="variant.quantity"
label="Quantity*"
:rules="numberRules"
required
/>
</v-col>
......@@ -312,6 +319,7 @@
v-model="dialog1"
persistent
max-width="600px"
lazy-validation
>
<template #activator="{ on, attrs }">
<v-btn
......@@ -338,7 +346,9 @@
<v-text-field
v-model="name"
label="Name*"
:rules="requiredRules"
required
lazy-validation
/>
</v-col>
<v-col
......@@ -350,12 +360,14 @@
item-text="name"
item-value="id"
label="Category"
:rules="requiredRules"
/>
</v-col>
<v-col cols="12">
<v-text-field
v-model="price"
label="Price*"
:rules="requiredRules"
required
/>
</v-col>
......@@ -363,6 +375,7 @@
<v-text-field
v-model="description"
label="Description"
:rules="requiredRules"
/>
</v-col>
<v-col cols="12">
......@@ -372,6 +385,9 @@
small-chips
dense
multiple
:rules="imageRules"
lazy-validation
prepend-icon="mdi-camera"
/>
</v-col>
<v-col cols="12">
......@@ -397,6 +413,7 @@
<v-text-field
v-model="variant.color"
label="Color*"
:rules="requiredRules"
required
/>
</v-col>
......@@ -408,6 +425,7 @@
<v-text-field
v-model="variant.size"
label="Size*"
:rules="requiredRules"
required
/>
</v-col>
......@@ -419,6 +437,7 @@
<v-text-field
v-model="variant.quantity"
label="Quantity*"
:rules="numberRules"
required
/>
</v-col>
......@@ -528,7 +547,7 @@ export default {
},
{ text: 'Name', value: 'name' },
{ text: 'Category', value: 'category.name' },
{ text: 'Price', value: 'price', sortable: false },
{ text: 'Price', value: 'price' },
{ text: 'Stock', value: 'stock' },
{ text: 'Actions', value: 'actions', sortable: false }
],
......@@ -594,7 +613,18 @@ export default {
status: '',
created_at: '',
updated_at: ''
}
},
requiredRules: [
v => !!v || 'This field is required'
],
numberRules: [
v => !!v || 'This field is required',
v => v > 0 || 'value must be a positive integer'
],
imageRules: [
v => !!v || 'Images is required',
v => (v && v.length > 0) || 'Images is required'
]
}
},
computed: {
......@@ -857,7 +887,6 @@ export default {
getVariant (index, item) {
this.editedVariantIndex = index
this.idVariant = item.id
console.log(this.idVariant)
},
removeVariant () {
const self = this
......@@ -881,9 +910,6 @@ export default {
}
this.eVariants.splice(currentVariantIndex, 1)
}
},
seeVariant () {
console.log(this.variants)
}
}
}
......
pages/users/index.vue
View file @ fdd32d6c
......@@ -164,6 +164,9 @@
</v-toolbar-title>
</v-toolbar>
</template>
<template #[`item.index`]="{ index }">
{{ index + 1 }}
</template>
<template #item.created_at="{ item }">
<span>{{ formatDate(item.created_at) }}</span>
</template>
......@@ -217,12 +220,11 @@ export default {
dialogDelete: false,
headers: [
{
text: 'Name',
text: '#',
align: 'start',
sortable: false,
value: 'name'
value: 'index'
},
{ text: 'id', value: 'id' },
{ text: 'Name', value: 'name' },
{ text: 'email', value: 'email' },
{ text: 'status', value: 'id', sortable: false },
{ text: 'created', value: 'created_at' },
......@@ -267,7 +269,7 @@ export default {
},
nameRules: [
v => !!v || 'Name is required',
v => (v && v.length <= 10) || 'Name must be less than 10 characters'
v => (v && v.length <= 255) || 'Name must be less than 255 characters'
],
emailRules: [
v => !!v || 'E-mail is required',
......@@ -275,7 +277,8 @@ export default {
],
passwordRules: [
v => !!v || 'Password is required',
v => (v && v.length >= 6) || 'Password must be more than 6 characters'
v => (v && v.length >= 6) || 'Password must be more than 6 characters',
v => (v && v.length <= 255) || 'Password must be less than 255 characters'
]
}
},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment