pack && packages && items && cycle

This commit is contained in:
Saeid
2019-09-08 19:15:12 +04:30
parent e278b4e957
commit a665911d15
13 changed files with 617 additions and 468 deletions
+64 -26
View File
@@ -3,7 +3,7 @@
<v-container grid-list-xs fluid>
<material-card color="black" title="Add Cycle">
<v-layout align-center justify-center wrap class="px-5 my-3">
<v-flex xs12 sm4 md4>
<v-flex xs12 sm6 md4>
<v-text-field
name="name"
label="Name"
@@ -13,30 +13,58 @@
class="pa-2"
></v-text-field>
</v-flex>
<v-flex xs12 sm4 md4>
<v-select
:items="result"
label="Result"
name="result"
v-model="formData.result"
single-line
:rules="[rules.required]"
class="pa-2"
<v-flex xs12 sm6 md4>
<v-text-field
name="sterilizer_id"
label="Sterilizer ID"
color="black"
></v-select>
v-model="formData.sterilizer_id"
class="pa-2"
></v-text-field>
</v-flex>
</v-layout>
<v-layout align-center justify-center wrap class="px-5 mb-3">
<v-flex xs12 sm12 md12>
<v-flex xs12 sm6 md4>
<v-text-field
name="cycle_number"
label="Cycle Number"
color="black"
v-model="formData.cycle_number"
class="pa-2"
></v-text-field>
</v-flex>
<v-flex xs12 sm6 md4>
<v-menu
lazy
:close-on-content-click="true"
transition="v-scale-transition"
offset-y
v-model="fromMenuDate"
>
<v-text-field required slot="activator" label="Date" v-model="formData.date"></v-text-field>
<v-date-picker
color="pink"
no-title
v-model="formData.date"
:date-format="date => new Date(date).toDateString()"
></v-date-picker>
</v-menu>
</v-flex>
<v-flex xs12 sm6 md8>
<v-autocomplete
multiple
:items="packages"
:items="packs"
item-text="name"
item-value="id"
v-model="formData.packages"
label="Select Packages For Cycle"
v-model="formData.packs"
label="Select Packs For Cycle"
></v-autocomplete>
</v-flex>
<v-flex xs12 sm12 md12>
<v-textarea color="black" v-model="formData.description" class="pa-2" name="address">
<template v-slot:label>
<div>Description</div>
</template>
</v-textarea>
</v-flex>
</v-layout>
<v-layout row wrap justify-center align-center>
<v-flex xs12 md2 sm2 class="text-md-center text-xs-center">
@@ -70,14 +98,13 @@ import { mapMutations } from "vuex";
export default {
data() {
return {
fromMenuDate: false,
formData: {
name: "",
result: "",
description: "",
packages: []
packs: []
},
packages: [],
result: ["Pass", "Fail"],
packs: [],
rules: {
required: value => !!value || "Required.",
counter: value =>
@@ -92,7 +119,7 @@ export default {
if (this.$route.params.cycle) {
this.load(this.$route.params.cycle);
}
this.loadPackages();
this.loadPacks();
},
methods: {
async load(id) {
@@ -101,10 +128,10 @@ export default {
this.formData = result.data.data;
}
},
async loadPackages() {
const result = await ApiService.get(urls.listAllPackage());
async loadPacks() {
const result = await ApiService.get(urls.listAllPack());
if (result.status == 200) {
this.packages = result.data.data;
this.packs = result.data.data;
}
},
async submitForm() {
@@ -127,4 +154,15 @@ export default {
}
}
};
</script>
</script>
<style>
.v-btn--floating {
padding: 0!important;
}
.theme--light.v-btn.v-btn--flat {
color: rgba(0,0,0,.87)!important;
}
.v-btn--floating, .v-btn--icon:before {
border-radius: 50%!important;
}
</style>
+35 -46
View File
@@ -12,22 +12,38 @@
></v-text-field>
</v-flex>
<v-flex xs12 md3 sm3>
<v-autocomplete
<v-text-field
class="pa-2"
v-model="filter.result"
label="Result"
v-model="filter.sterilizer_id"
label="Sterilizer ID"
color="black"
:items="result"
></v-autocomplete>
></v-text-field>
</v-flex>
<v-flex xs12 md3 sm3>
<v-text-field
class="pa-2"
v-model="filter.unique_id"
label="uniqueID"
v-model="filter.cycle_number"
label="Cycle Number"
color="black"
></v-text-field>
</v-flex>
<v-flex xs12 sm6 md3>
<v-menu
lazy
:close-on-content-click="true"
transition="v-scale-transition"
offset-y
v-model="Menu"
>
<v-text-field required slot="activator" label="Date" v-model="filter.date"></v-text-field>
<v-date-picker
color="pink"
no-title
v-model="filter.date"
:date-format="date => new Date(date).toDateString()"
></v-date-picker>
</v-menu>
</v-flex>
<v-flex class xs12 md2 sm3>
<v-btn class="WM-CyanBlueGradient-BG" style="padding:10px 60px" @click="load()">
<v-icon class="white--text mr-2 caption">fas fa-search</v-icon>
@@ -55,10 +71,10 @@
/>
</template>
<template slot="items" slot-scope="{ item }">
<td class="headline font-weight-light">{{ item.unique_id }}</td>
<td class="title font-weight-light">{{ item.name }}</td>
<td class="title font-weight-light">{{ item.result }}</td>
<td class="title font-weight-light">{{ item.created_at }}</td>
<td class="headline font-weight-light">{{ item.name }}</td>
<td class="title font-weight-light">{{ item.sterilizer_id }}</td>
<td class="title font-weight-light">{{ item.cycle_number }}</td>
<td class="title font-weight-light">{{ item.date }}</td>
<td class="text-xs-right">
<v-btn color="cyan" class="mr-2" @click="show(item.id)">
<v-icon class="white--text mr-1 caption">fas fa-eye</v-icon>
@@ -82,10 +98,6 @@
<v-icon class="white--text mr-2 caption">fas fa-times</v-icon>
<span>Remove</span>
</v-btn>
<v-btn color="orange darken-1" @click="generateBarcode(item.unique_id)">
<v-icon class="white--text mr-1 caption">fas fa-barcode</v-icon>
<span>Generate Barcode</span>
</v-btn>
</td>
</template>
</v-data-table>
@@ -117,18 +129,18 @@ export default {
headers: [
{
sortable: true,
text: "Unique ID",
value: "Unique ID"
text: "Name",
value: "Name"
},
{
sortable: true,
text: "Name",
value: "name"
text: "Sterilizer ID",
value: "Sterilizer ID"
},
{
sortable: false,
text: "Result",
value: "result"
text: "Cycle Number",
value: "Cycle Number"
},
{
sortable: false,
@@ -142,12 +154,8 @@ export default {
align: "right"
}
],
filter: {
unique_id: '',
name: '',
result: '',
},
result: ['Pass', 'Fail'],
filter: {},
Menu: false,
packages: [],
currentPage: 1,
lastPage: 1,
@@ -200,15 +208,6 @@ export default {
}
}
},
async generateBarcode(code) {
const result = await ApiService.post(urls.Barcode(code));
if (result && result.status == 200) {
this.changeCurrentModal({
modal: "modal-barcode-barcode",
properties: { result }
});
}
}
},
computed: {
...mapGetters("modal", ["getModalResult"])
@@ -216,16 +215,6 @@ export default {
watch: {
currentPage(page) {
this.load(page);
},
getModalResult(testResult) {
for (const key in this.packages) {
if (
this.packages.hasOwnProperty(key) &&
this.packages[key].id == testResult.id
) {
this.packages[key] = testResult;
}
}
}
}
};