basic ui development, WIP

MalwareMultiScan.Api/Controllers/DownloadController.cs

@@ -6,7 +6,7 @@ using Microsoft.AspNetCore.Mvc;
 namespace MalwareMultiScan.Api.Controllers
 {
     [ApiController]
-    [Route("download")]
+    [Route("api/download")]
     [Produces("application/octet-stream")]
     public class DownloadController : Controller
     {

MalwareMultiScan.Api/Controllers/QueueController.cs

@@ -9,7 +9,7 @@ using Microsoft.AspNetCore.Mvc;
 namespace MalwareMultiScan.Api.Controllers
 {
     [ApiController]
-    [Route("queue")]
+    [Route("api/queue")]
     [Produces("application/json")]
     public class QueueController : Controller
     {

MalwareMultiScan.Api/Controllers/ScanResultsController.cs

@@ -7,7 +7,7 @@ using Microsoft.AspNetCore.Mvc;
 namespace MalwareMultiScan.Api.Controllers
 {
     [ApiController]
-    [Route("results")]
+    [Route("api/results")]
     [Produces("application/json")]
     public class ScanResultsController : Controller
     {

MalwareMultiScan.Ui/assets/README.md

@@ -1,7 +0,0 @@
-# ASSETS
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#webpacked).

MalwareMultiScan.Ui/components/Logo.vue

@@ -1,29 +0,0 @@
-<template>
-  <svg class="NuxtLogo" width="245" height="180" viewBox="0 0 452 342" xmlns="http://www.w3.org/2000/svg">
-    <path
-      d="M139 330l-1-2c-2-4-2-8-1-13H29L189 31l67 121 22-16-67-121c-1-2-9-14-22-14-6 0-15 2-22 15L5 303c-1 3-8 16-2 27 4 6 10 12 24 12h136c-14 0-21-6-24-12z"
-      fill="#00C58E"
-    />
-    <path
-      d="M447 304L317 70c-2-2-9-15-22-15-6 0-15 3-22 15l-17 28v54l39-67 129 230h-49a23 23 0 0 1-2 14l-1 1c-6 11-21 12-23 12h76c3 0 17-1 24-12 3-5 5-14-2-26z"
-      fill="#108775"
-    />
-    <path
-      d="M376 330v-1l1-2c1-4 2-8 1-12l-4-12-102-178-15-27h-1l-15 27-102 178-4 12a24 24 0 0 0 2 15c4 6 10 12 24 12h190c3 0 18-1 25-12zM256 152l93 163H163l93-163z"
-      fill="#2F495E"
-    />
-  </svg>
-</template>
-
-<style>
-.NuxtLogo {
-  animation: 1s appear;
-  margin: auto;
-}
-
-@keyframes appear {
-  0% {
-    opacity: 0;
-  }
-}
-</style>

MalwareMultiScan.Ui/components/README.md

@@ -1,7 +0,0 @@
-# COMPONENTS
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-The components directory contains your Vue.js Components.
-
-_Nuxt.js doesn't supercharge these components._

MalwareMultiScan.Ui/layouts/README.md

@@ -1,7 +0,0 @@
-# LAYOUTS
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-This directory contains your Application Layouts.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/views#layouts).

MalwareMultiScan.Ui/layouts/default.vue

@@ -1,62 +1,15 @@
 <template>
+  <div class="container">
+    <div class="d-flex align-items-center p-3 my-3 text-white-50 bg-dark ">
+      <b-icon-bug class="mr-3" width="48" height="48" />
       <div>
-    <Nuxt />
+        <h6 class="mb-0 text-white">MalwareMultiScan UI</h6>
+        <small>
+          A demo of a <a target="_blank" href="https://github.com/mindcollapse/MalwareMultiScan">microservice</a>
+          to scan your files against multiple AV solutions
+        </small>
+      </div>
+    </div>
+    <nuxt />
   </div>
 </template>
-
-<style>
-html {
-  font-family:
-    'Source Sans Pro',
-    -apple-system,
-    BlinkMacSystemFont,
-    'Segoe UI',
-    Roboto,
-    'Helvetica Neue',
-    Arial,
-    sans-serif;
-  font-size: 16px;
-  word-spacing: 1px;
-  -ms-text-size-adjust: 100%;
-  -webkit-text-size-adjust: 100%;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  box-sizing: border-box;
-}
-
-*,
-*::before,
-*::after {
-  box-sizing: border-box;
-  margin: 0;
-}
-
-.button--green {
-  display: inline-block;
-  border-radius: 4px;
-  border: 1px solid #3b8070;
-  color: #3b8070;
-  text-decoration: none;
-  padding: 10px 30px;
-}
-
-.button--green:hover {
-  color: #fff;
-  background-color: #3b8070;
-}
-
-.button--grey {
-  display: inline-block;
-  border-radius: 4px;
-  border: 1px solid #35495e;
-  color: #35495e;
-  text-decoration: none;
-  padding: 10px 30px;
-  margin-left: 15px;
-}
-
-.button--grey:hover {
-  color: #fff;
-  background-color: #35495e;
-}
-</style>

MalwareMultiScan.Ui/middleware/README.md

@@ -1,8 +0,0 @@
-# MIDDLEWARE
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-This directory contains your application middleware.
-Middleware let you define custom functions that can be run before rendering either a page or a group of pages.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing#middleware).

MalwareMultiScan.Ui/nuxt.config.js

@@ -1,46 +1,40 @@
 export default {
-  // Global page headers (https://go.nuxtjs.dev/config-head)
   head: {
-    title: 'malware-multi-scan-ui',
+    title: 'MalwareMultiScan UI',
     meta: [
       { charset: 'utf-8' },
-      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
+      { name: 'viewport', content: 'width=device-width, initial-scale=1, shrink-to-fit=no' },
-      { hid: 'description', name: 'description', content: '' }
     ],
-    link: [
+    bodyAttrs: {
-      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
+      class: "bg-light"
-    ]
+    }
   },
 
-  // Global CSS (https://go.nuxtjs.dev/config-css)
-  css: [
-  ],
-
-  // Plugins to run before rendering page (https://go.nuxtjs.dev/config-plugins)
-  plugins: [
-  ],
-
-  // Auto import components (https://go.nuxtjs.dev/config-components)
   components: true,
 
-  // Modules for dev and build (recommended) (https://go.nuxtjs.dev/config-modules)
   buildModules: [
-    // https://go.nuxtjs.dev/typescript
     '@nuxt/typescript-build',
   ],
 
-  // Modules (https://go.nuxtjs.dev/config-modules)
   modules: [
-    // https://go.nuxtjs.dev/bootstrap
     'bootstrap-vue/nuxt',
-    // https://go.nuxtjs.dev/axios
     '@nuxtjs/axios',
+    '@nuxtjs/proxy'
   ],
 
-  // Axios module configuration (https://go.nuxtjs.dev/config-axios)
+  axios: {
-  axios: {},
+    proxy: true,
+    prefix: '/api/'
+  },
 
-  // Build Configuration (https://go.nuxtjs.dev/config-build)
+  proxy: {
-  build: {
+    '/api': {
+      target: process.env.API_URL || 'http://localhost:5000',
+      changeOrigin: true
+    }
+  },
+
+  bootstrapVue: {
+    icons: true
   }
 }

MalwareMultiScan.Ui/package.json

@@ -11,6 +11,7 @@
   "dependencies": {
     "@nuxt/typescript-runtime": "^2.0.0",
     "@nuxtjs/axios": "^5.12.2",
+    "@nuxtjs/proxy": "^2.0.1",
     "bootstrap": "^4.5.2",
     "bootstrap-vue": "^2.17.3",
     "core-js": "^3.6.5",

MalwareMultiScan.Ui/pages/README.md

@@ -1,6 +0,0 @@
-# PAGES
-
-This directory contains your Application Views and Routes.
-The framework reads all the `*.vue` files inside this directory and creates the router of your application.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/routing).

MalwareMultiScan.Ui/pages/index.vue

@@ -1,75 +1,4 @@
 <template>
-  <div class="container">
+  <scan-form />
-    <div>
-      <Logo />
-      <h1 class="title">
-        malware-multi-scan-ui
-      </h1>
-      <div class="links">
-        <a
-          href="https://nuxtjs.org/"
-          target="_blank"
-          rel="noopener noreferrer"
-          class="button--green"
-        >
-          Documentation
-        </a>
-        <a
-          href="https://github.com/nuxt/nuxt.js"
-          target="_blank"
-          rel="noopener noreferrer"
-          class="button--grey"
-        >
-          GitHub
-        </a>
-      </div>
-    </div>
-  </div>
 </template>
 
-<script lang="ts">
-import Vue from 'vue'
-
-export default Vue.extend({})
-</script>
-
-<style>
-.container {
-  margin: 0 auto;
-  min-height: 100vh;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  text-align: center;
-}
-
-.title {
-  font-family:
-    'Quicksand',
-    'Source Sans Pro',
-    -apple-system,
-    BlinkMacSystemFont,
-    'Segoe UI',
-    Roboto,
-    'Helvetica Neue',
-    Arial,
-    sans-serif;
-  display: block;
-  font-weight: 300;
-  font-size: 100px;
-  color: #35495e;
-  letter-spacing: 1px;
-}
-
-.subtitle {
-  font-weight: 300;
-  font-size: 42px;
-  color: #526488;
-  word-spacing: 5px;
-  padding-bottom: 15px;
-}
-
-.links {
-  padding-top: 15px;
-}
-</style>

MalwareMultiScan.Ui/plugins/README.md

@@ -1,7 +0,0 @@
-# PLUGINS
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-This directory contains Javascript plugins that you want to run before mounting the root Vue.js application.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/plugins).

MalwareMultiScan.Ui/static/README.md

@@ -1,11 +0,0 @@
-# STATIC
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-This directory contains your static files.
-Each file inside this directory is mapped to `/`.
-Thus you'd want to delete this README.md before deploying to production.
-
-Example: `/static/robots.txt` is mapped as `/robots.txt`.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#static).