add dropzone to test result form

This commit is contained in:
Fateme
2020-06-09 18:05:16 +04:30
parent 7496f1213f
commit a74e49af6f
14 changed files with 269 additions and 125 deletions
+23 -20
View File
@@ -85,23 +85,15 @@
<v-switch color="light-green accent-3" v-model="result" :label="'Result: ' + formData.result"></v-switch>
</v-flex>
<v-spacer></v-spacer>
<v-flex xs12 sm2 md2>
<div class="WM-Align-R" style="position:relative">
<input type="file" class="inputfile" @change="onFileChange" multiple style="position:absolute;left:0;height:100px"/>
<label for="file">
<v-icon class="v-icon greylighten-3--text mr-2 caption IconHover">fas fa-chevron-right</v-icon>Choose a file
</label>
</div>
<v-flex xs12 sm12 md12>
<template v-if="galleryDataLoaded">
<wm-Dropzone :Images="galleries" :BatchID="file_batch_id" :ModelID="$route.params.testResult" ModelType="TestResult"></wm-Dropzone>
</template>
</v-flex>
</v-layout>
<v-layout wrap class="mt-4 px-5">
<v-flex v-for="(img, key) in images" :key="key" xs12 sm6 md1 class="WM-Border WM-Border-LightGray WM-Padding-10 WM-Align-C WM-Relative" style="margin:15px">
<img :src="img" width="120px" height="auto"/>
<v-btn class="mx-2" absolute right top fab dark small color="pink" style="top:-28px;right:-28px" @click.native.stop="removeImage(key)">
<v-icon>close</v-icon>
</v-btn>
</v-flex>
</v-layout>
<!--______________________ DynamicComponent :: Began _______________________-->
@@ -422,10 +414,17 @@
</v-form>
</template>
<script>
import Dropzone from '@/components/core/Dropzone'
import { ApiService } from "@/services";
import { urls } from "@/config/urls";
export default {
components : {
'wm-Dropzone' : Dropzone,
},
data: () => ({
galleryDataLoaded: false,
galleries: [],
file_batch_id: Math.floor(Math.random() * 9000000000) + 1000000000,
testTypeNames: [],
testTypeNameSelected: "",
searchInput: "",
@@ -466,6 +465,9 @@ export default {
this.filter.test_result_id = this.$route.params.testResult;
this.selectTestType();
}
else{
this.galleryDataLoaded= true;
}
this.load();
},
methods: {
@@ -543,20 +545,21 @@ export default {
if (result && result.status == 200) {
this.formData = result.data.data;
for (const key in result.data.data.imagesPath) {
if (
result.data.data.imagesPath.hasOwnProperty(key)
) {
if (result.data.data.imagesPath.hasOwnProperty(key)) {
result.data.data.imagesPath[key] =
"/" + result.data.data.imagesPath[key];
result.data.data.imagesPath[key];
}
}
this.images = result.data.data.imagesPath;
// this.images = result.data.data.imagesPath;
this.galleries = result.data.data.imagesPath;
this.galleryDataLoaded = true;
}
}
}
},
async submitForm() {
let result;
this.formData['file_batch_id'] = this.file_batch_id;
if (this.$route.params.testResult) {
result = await ApiService.put(
urls.updateTestResult(this.$route.params.testResult),