he intentado muchas maneras de subir un archivo, pero siempre me dice lo mismo:
tengo un Form en el cual ingreso datos y también debo ingresar una fotografía, por lo q he investigado se ve sencillo, pero todo lo q he intentado me da el mismo error, utilizo vue-resource, sin subir la imagen todo me funciona perfecto, agrego registros, edito y elimino y no me da ningun error.
<script src="https://cdn.jsdelivr.net/npm/vue-resource@1.5.1"></script>
Este es mi html:
<b-form-file v-model="elmovimiento.imagen" type="file" id="file" ref="file" v-on:change="onFileChange(event)"></b-form-file>
Y este mi función:
onFileChange(e) {
var files = event.target.files[0];
if (!files.length)
return;
this.createImage(files[0]);
},
createImage(file) {
var image = new Image();
var reader = new FileReader();
var vm = this;
reader.onload = (file) => {
vm.image = e.target.result;
};
reader.readAsDataURL(file);
},
Dentro de mi modelo defino hacia donde lo va a guardar, y creo que en el back no hay problema por que desde Django Rest Framework, puedo hacer PUT y agregando una imagen y si me lo hace muy bien.
"imagen": "http://127.0.0.1:8000/media/ovinos/dart_IJwfgst.jpg",
Así lo guarda, por lo cual creo no hay ningún problema, lo que pienso es q no sube el archivo. En mi v-model="elmovimiento.imagen"
es lo q me muestra que tiene en la base de datos o el array para llenar datos del Form.
Al final hago PUT para guardar mis datos:
updateMovimiento: function() {
id = this.elmovimiento.id;
varurl = "/control/movimiento/api/mov/"+id+'/';
this.$http.put(varurl, this.elmovimiento).then(response => {
this.loading = false;
this.elmovimiento = response.data;
this.$root.$emit('bv::hide::modal', this.infoModal.id);
})
.catch((error) => {
this.loading = false;
//alert("Error: "+error);
console.log(error);
})
},
Espero y alguien pueda ayudarme, llevo 2 días con esto y no avanzo. Gracias.
Código Completo: Model apps.control.models
class Movimiento(models.Model):
tipo = models.CharField(max_length=1, blank=True, null=True, choices=TIPO)
descripcion = models.CharField(max_length=1, blank=True, null=True, choices=DESCRIP)
fecha = models.DateField(blank=True, null=True)
arete = models.CharField(max_length=10, blank=True, null=True)
sexo = models.CharField(max_length=1, blank=True, null=True)
madre = models.ForeignKey('self', blank=True, null=True, on_delete=models.CASCADE, related_name='arete_madre')
razamadre = models.ForeignKey(Raza, blank=True, null=True, on_delete=models.CASCADE, related_name='madreraza')
razaanimal = models.ForeignKey(Raza, blank=True, null=True, on_delete=models.CASCADE, related_name='movimiento_raza')
imagen = models.ImageField(verbose_name="Imagen", blank=True, null=True, upload_to="ovinos")
peso = models.IntegerField(default=0)
observaciones = models.CharField(max_length=255, blank=True, null=True)
def __str__(self):
return self.arete
Model apps.catalogos.models
class Raza(models.Model):
codigo = models.CharField(max_length=4,blank=True,null=True)
nombre = models.CharField(max_length=100,blank=True,null=True)
color = ColorField(default='#FF0000')
def __str__(self):
return self.nombre
Choices apps.control.choice
TIPO = (('C', 'Compra'),
('N', 'Nacimiento'),
)
DESCRIP = (('S', 'Semental'),
('E', 'Engorda'),
('V', 'Vientre'),
('R', 'Reemplazo'),
('P', 'Producto'),
)
form apps.control.form
class MovimientoForm(forms.ModelForm):
tipo = forms.ChoiceField(label="Tipo:", widget=forms.Select(), choices = TIPO, required=True)
descripcion = forms.ChoiceField(label='Descripcion:', widget=forms.Select(), choices = DESCRIP, required=True)
fecha = forms.DateField(label='Fecha:', widget=forms.SelectDateWidget(years=range(2018,2025)))
arete = forms.CharField(label='Arete:', widget=forms.TextInput(attrs={'class': 'form-control',}))
madre = forms.Select(attrs={'class': 'form-control',})
razamadre = forms.Select(attrs={'class': 'form-control',})
peso = forms.CharField(label='Peso:', widget=forms.TextInput(attrs={'class': 'form-control',}))
razaanimal = forms.Select(attrs={'class': 'form-control',})
observaciones = forms.CharField(label='Observaciones:', widget=forms.Textarea(attrs={'class': 'form-control','placeholder':'Observaciones',}))
class Meta:
model = Movimiento
fields = '__all__'
Vista apps.control.views
from django.views.generic import TemplateView, CreateView, ListView, UpdateView, DeleteView
from django.urls import reverse_lazy
from django.shortcuts import render,redirect
from django.core.exceptions import ObjectDoesNotExist
from .models import Movimiento
from .forms import MovimientoForm
from rest_framework.response import Response
from rest_framework.views import APIView
from rest_framework.generics import ListAPIView, CreateAPIView, ListCreateAPIView, RetrieveUpdateDestroyAPIView
from .serializer import MovimientoSerializer
import json
from django.http import HttpResponse, HttpResponseRedirect, JsonResponse
class MovimientoList(ListView):
model = Movimiento
template_name = 'control/movimiento/listarmovimiento.html'
Serializer apps.control.serializer
from rest_framework.serializers import ModelSerializer
from rest_framework import serializers
from apps.control.models import Movimiento
class MovimientoSerializer(ModelSerializer):
#descripcion = serializers.SerializerMethodField()
#tipo = serializers.SerializerMethodField()
#razaanimal = serializers.SlugRelatedField(slug_field="nombre", queryset=Raza.objects.all())
class Meta:
model = Movimiento
fields = '__all__'
Viewsets apps.control.viewsets
from rest_framework import viewsets
from apps.control.models import Movimiento
from apps.control.serializer import MovimientoSerializer
class Movimiento_viewsets(viewsets.ModelViewSet):
queryset = Movimiento.objects.all()
serializer_class = MovimientoSerializer
Router apps.control.router
from rest_framework import routers
from rest_framework.routers import DefaultRouter
from . import viewsets as viewSet
router = routers.DefaultRouter()
router.register(r'mov', viewSet.Movimiento_viewsets,base_name='mov')
Urls apps.control.urls
from django.contrib import admin
from django.urls import path, re_path, include
from .views import MovimientoList
from .routers import router
urlpatterns = [
path('cerrar/', logout_then_login, name='logout'),
path('movimiento/listar', MovimientoList.as_view(), name='listar-movimiento'),
path('movimiento/api/', include(router.urls)),
]
Y lo demas que he puesto arriba