Add progress bar to upload , add new blog post

backend/build.gradle.kts

@@ -25,15 +25,6 @@ ktor {
  )
  )
  }
- jib {
- from {
- image = "openjdk:17-jdk-alpine"
- }
- to {
- image = "vovochkastelmashchuk/nest2d"
- tags = setOf("${project.version}")
- }
- }
 }
 
 repositories {

nest2dvue/src/views/AddProjectPage.vue

@@ -26,7 +26,6 @@
 import {ref} from 'vue';
 import {API_URL} from "@/constants.js";
 
-const route = useRoute();
 const projectName = ref('');
 const mediaPreview = ref(null);
 const dxfFiles = ref([]);
@@ -42,52 +41,8 @@ const handleDXFFilesChange = (event) => {
 };
 
 import axios from 'axios';
-import {useRoute} from "vue-router";
 import router from "@/router/index.js";
 
-const createProject = async (projectName) => {
- try {
- const response = await axios.post(`${API_URL}/project`, {
- name: projectName
- });
- return response.data;
- } catch (error) {
- console.error('Error creating project:', error);
- }
-};
-
-const uploadPreviewImage = async (projectSlug, imageFile) => {
- try {
- const formData = new FormData();
- formData.append('file', imageFile);
-
- const response = await axios.post(`${API_URL}/project/${projectSlug}/preview`, formData, {
- headers: {
- 'Content-Type': 'multipart/form-data'
- }
- });
- return response.data; // Handle or display the response appropriately
- } catch (error) {
- console.error('Error uploading preview image:', error);
- }
-};
-
-const uploadDXFFile = async (projectSlug, dxfFile) => {
- try {
- const formData = new FormData();
- formData.append('file', dxfFile);
-
- const response = await axios.post(`${API_URL}/files/${projectSlug}/dxf`, formData, {
- headers: {
- 'Content-Type': 'multipart/form-data'
- }
- });
- return response.data;
- } catch (error) {
- console.error('Error uploading DXF file:', error);
- }
-};
-
 const updateProgress = (completed, total) => {
  progress.value = Math.round((completed / total) * 100);
 };
@@ -156,4 +111,19 @@ button {
  border: none;
  border-radius: 5px;
 }
+.progress-bar {
+ background-color: #f3f3f3;
+ border-radius: 5px;
+ position: relative;
+ margin-top: 20px;
+ height: 20px;
+ width: 100%;
+}
+
+.progress-bar-fill {
+ background-color: #4caf50;
+ height: 100%;
+ border-radius: 5px;
+ transition: width 0.4s ease-in-out;
+}
 </style>

nest2dvue/src/views/BlogView.vue

@@ -1,4 +1,31 @@
 <template>
+ <div class="article-container">
+ <div class="article-title">
+ <p>Project updates, #6, Uploads from the web</p>
+ </div>
+ <div class="article-meta">
+ <p>Published on
+ <time datetime="2024-17-03">Mar 17, 2024</time>
+ by nest2d
+ </p>
+ </div>
+ <div class="article-body">
+ <h2>New feature</h2>
+ <ul>
+ <li>Implement creating project from webpage, user friendly</li>
+ </ul>
+ <h2>Tech task</h2>
+ <ul>
+ <li>Try to make CI for the backend app. (in progress)</li>
+ </ul>
+ <h2>Next stages</h2>
+ <ul>
+ <li>Implement the nested history page</li>
+ <li>Finish CI for backend app</li>
+ <li>Add support for more DXF tags</li>
+ </ul>
+ </div>
+ </div>
  <div class="article-container">
  <div class="article-title">
  <p>Project updates, #5, I learn how to do the database, also CI</p>
@@ -265,4 +292,5 @@
 }
 </style>
 <script setup>
+import ProgressBar from "@/views/ProgressBar.vue";
 </script>