Add support for Azure Storage

DROP-TABLE-Participants · Mar 31, 2024 · 82a7930 · 82a7930
1 parent 016fb24
commit 82a7930
Show file tree

Hide file tree

Showing 6 changed files with 40 additions and 7 deletions.
diff --git a/client/src/components/ProductItem.vue b/client/src/components/ProductItem.vue
@@ -1,8 +1,9 @@
 <template>
     <div class="product-item">
-      <img :src="BASE_PATH + props.item.image_url" :alt="props.item.name" class="product-image" />
+
+      <img :src="props.item.image_url" :alt="props.item.name" class="product-image" v-if="props.item.image_url != null"/>
       <div class="product-details">
-        <h3 class="product-name">{{ props.item.name }}</h3>
+        <h3 class="product-name">{{ props.item.serialized_name }}</h3>
       </div>
     </div>
   </template>

diff --git a/client/src/services/product-service.ts b/client/src/services/product-service.ts
@@ -23,7 +23,7 @@ export class ProductService extends WebApiService {
   }
 
   public async createProduct(name: string, image?: Blob): AxiosPromise<any> {
-    return await axios.postForm(BASE_PATH + '/api/product/', {name, image_url: image}, this.generateHeader());
+    return await axios.postForm(BASE_PATH + '/api/products/', {name, image_url: image}, this.generateHeader());
   }
 
   public async getProductById(id: number): AxiosPromise<any> {

diff --git a/client/src/views/AddItemView.vue b/client/src/views/AddItemView.vue
@@ -43,6 +43,7 @@ import BackArrowIcon from "../components/icons/BackArrowIcon.vue";
 import { useRouter } from 'vue-router';
 import {ref} from 'vue';
 import Navbar from "../components/Navbar.vue";
+import productService from "../services/product-service.ts";
 
 const router = useRouter();
 
@@ -55,8 +56,9 @@ const form = ref({
 
 }) 
 
-function submitForm() {
-
+async function submitForm() {
+  await productService.createProduct(form.value.itemName);
+  navigateToItems();
 }
 
 </script>

diff --git a/server/products/models.py b/server/products/models.py
@@ -1,11 +1,13 @@
+from uuid import uuid4
+
 from django.db import models
 
 
 from authentication.models import User
 
 
 def upload_to(instance, filename):
-    return 'images/{filename}'.format(filename=filename)
+    return '{filename}'.format(filename=str(uuid4()) + filename)
 
 
 class Product(models.Model):

diff --git a/server/requirements.txt b/server/requirements.txt
diff --git a/server/server/settings.py b/server/server/settings.py
@@ -12,14 +12,42 @@
 # URL used to access the media
 MEDIA_URL = '/media/'
 
+#STATIC_LOCATION = "static"
+MEDIA_LOCATION = "media"
+
+AZURE_ACCOUNT_NAME = "catchupstorage"
+AZURE_CUSTOM_DOMAIN = f'{AZURE_ACCOUNT_NAME}.blob.core.windows.net'
+#STATIC_URL = f'https://{AZURE_CUSTOM_DOMAIN}/{STATIC_LOCATION}/'
+AZURE_MEDIA_URL = f'https://{AZURE_CUSTOM_DOMAIN}/{MEDIA_LOCATION}/'
+
+STORAGES = {
+    "default": {
+        "BACKEND": "storages.backends.azure_storage.AzureStorage",
+        "OPTIONS": {
+            "azure_container": "media",
+            "connection_string": os.environ.get("AZURE_STORAGE_CONNECTION_STRING")
+        },
+    },
+    "staticfiles": {
+        "BACKEND": "django.contrib.staticfiles.storage.StaticFilesStorage",
+    },
+    "media": {
+        "BACKEND": "storages.backends.azure_storage.AzureStorage",
+        "OPTIONS": {
+            "azure_container": "media",
+            "connection_string": os.environ.get("AZURE_STORAGE_CONNECTION_STRING")
+        },
+    },
+}
+
 # Quick-start development settings - unsuitable for production
 # See https://docs.djangoproject.com/en/5.0/howto/deployment/checklist/
 
 # SECURITY WARNING: keep the secret key used in production secret!
 SECRET_KEY = 'django-insecure-vx=h&@d!(im!!-r)^$e!&%kzferzcn2!x3a!5*i-%lb*%izhfh'
 
 # SECURITY WARNING: don't run with debug turned on in production!
-DEBUG = False
+DEBUG = True
 
 ALLOWED_HOSTS = [
     "catchupserver.azurewebsites.net",