You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
124 lines
3.5 KiB
124 lines
3.5 KiB
<template>
|
|
<div id="app">
|
|
<!-- Add a navigation bar with Bootstrap -->
|
|
<nav class="navbar navbar-expand-md navbar-light bg-light">
|
|
<div class="container">
|
|
<a class="navbar-brand" href="#">LEAF Portfolio Link</a>
|
|
<div class="collapse navbar-collapse" id="navbarNav">
|
|
<ul class="navbar-nav">
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="#">Template Download</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="#">Contact</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="#">About</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<div v-if="true === true">
|
|
<UserLogin></UserLogin>
|
|
</div>
|
|
<div id="main" v-else>
|
|
<div v-if="invalidDataHeaders.length > 1000">
|
|
<InvalidData :invalidDataHeaders="invalidDataHeaders"/>
|
|
</div>
|
|
<div v-else>
|
|
<FileUpload @parsedUpload="processUpload"></FileUpload>
|
|
<MissingHeaderBox v-if="!this.isCorrectHeaders" @correctionsSubmitted="headersFixed"></MissingHeaderBox>
|
|
</div>
|
|
</div>
|
|
<!-- Add a footer with Bootstrap -->
|
|
<footer class="bg-light text-center text-lg-start">
|
|
<div class="container p-4">
|
|
<div class="row">
|
|
<div class="col-lg-6 col-md-12 mb-4 mb-md-0">
|
|
<h5 class="text-uppercase">LEAF Portfolio Link</h5>
|
|
<p>
|
|
Simplifed and secure portfolio gateway.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-center p-3" style="background-color: #e9ecef;">
|
|
© 2023 LEAF Commercial Capital. All rights reserved.
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
</template>
|
|
//TODO: Add template file download
|
|
//TODO: Add template file download reminder on document failure
|
|
//TODO: Add error notifications
|
|
//FIXME: Invalid data set to >1000
|
|
|
|
<script>
|
|
import FileUpload from './components/FileUpload.vue';
|
|
import MissingHeaderBox from './components/MissingHeaderBox.vue';
|
|
import InvalidData from './components/InvalidData.vue';
|
|
import UserLogin from './components/UserLogin.vue';
|
|
import { store } from './store';
|
|
|
|
export default {
|
|
name: 'App',
|
|
components: {
|
|
FileUpload,
|
|
MissingHeaderBox,
|
|
InvalidData,
|
|
UserLogin
|
|
},
|
|
data() {
|
|
return {
|
|
store,
|
|
// The user uploaded excel doc
|
|
userFile: null,
|
|
// If the headers are correct we can upload the file
|
|
isCorrectHeaders: false,
|
|
// True when headers with invalid data are present
|
|
invalidDataHeaders: [],
|
|
};
|
|
},
|
|
methods: {
|
|
processUpload(userFile, invalidHeaders) {
|
|
// handle null
|
|
if (userFile === null) {
|
|
this.invalidDataHeaders = [];
|
|
this.isCorrectHeaders = false;
|
|
return;
|
|
}
|
|
|
|
// set the userFile property
|
|
this.userFile = userFile;
|
|
|
|
// filter the documentHeaders to get the invalid headers
|
|
// Will always return an array
|
|
this.invalidDataHeaders = invalidHeaders;
|
|
console.info("Invalid headers: ", this.invalidDataHeaders);
|
|
|
|
// set isUploaded to true
|
|
this.isUploaded = true;
|
|
},
|
|
headersFixed() {
|
|
this.isCorrectHeaders = true;
|
|
}
|
|
// uploadFile() {
|
|
// // We know the document is correct
|
|
// //TODO: send the file to the server
|
|
// },
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
#app {
|
|
font-family: Avenir, Helvetica, Arial, sans-serif;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
text-align: center;
|
|
color: #2c3e50;
|
|
margin-top: 60px;
|
|
}
|
|
</style>
|
|
|