diff options
author | HampusM <hampus@hampusmat.com> | 2021-06-05 19:37:52 +0200 |
---|---|---|
committer | HampusM <hampus@hampusmat.com> | 2021-06-05 19:37:52 +0200 |
commit | 4da3272bf7893760f6710c9a1ec7de02358136e6 (patch) | |
tree | 92eb961bf20a7ef9f7c0650ba288baf512986fca /src/frontend/views | |
parent | 4e3074dfd752dd52951d300090c642aee76cfaac (diff) |
Reorganized into a monorepo, refactored the frontend again, goodbye Parcel
Diffstat (limited to 'src/frontend/views')
-rw-r--r-- | src/frontend/views/Home.vue | 62 | ||||
-rw-r--r-- | src/frontend/views/Repository.vue | 29 | ||||
-rw-r--r-- | src/frontend/views/RepositoryCommit.vue | 89 | ||||
-rw-r--r-- | src/frontend/views/RepositoryLog.vue | 91 | ||||
-rw-r--r-- | src/frontend/views/RepositoryTree.vue | 110 |
5 files changed, 0 insertions, 381 deletions
diff --git a/src/frontend/views/Home.vue b/src/frontend/views/Home.vue deleted file mode 100644 index e3746c7..0000000 --- a/src/frontend/views/Home.vue +++ /dev/null @@ -1,62 +0,0 @@ -<template> - <HomeHeader /> - <div class="row mx-0"> - <div id="projects-header" class="col ms-4"> - <p class="fs-1"> - Projects - </p> - </div> - <div id="projects-search" class="col d-flex justify-content-end"> - <form> - <input type="search" name="q"> - <input type="submit" value="Search"> - </form> - </div> - </div> - <div class="row mx-0"> - <div class="col ms-4"> - <ul id="repos"> - <li v-for="(project, project_name, index) in projects" :key="index"> - <div v-if="(search !== null && project_name.includes(search)) || search == null"> - <p class="fs-3"> - <router-link :to="project_name"> - {{ project_name }} - </router-link> - </p> - <span class="repo-last-updated fs-5">Last updated about {{ project["last_updated"] }} ago</span> - <span class="fs-5">{{ project["description"] }}</span> - </div> - </li> - </ul> - </div> - </div> -</template> - -<script> -import HomeHeader from "../components/HomeHeader"; -import { watch, reactive, toRefs } from "vue"; - -export default { - name: "Home", - components: { - HomeHeader - }, - setup() - { - const state = reactive({ projects: {}, search: "" }); - - watch(() => - { - fetch(`${window.location.protocol}//${window.location.host}/api/v1/repos`) - .then((res) => res.json()) - .then((data) => state.projects = data["data"]); - }); - - state.search = (new URLSearchParams(window.location.search)).get("q"); - - return { - ... toRefs(state) - }; - } -} -</script>
\ No newline at end of file diff --git a/src/frontend/views/Repository.vue b/src/frontend/views/Repository.vue deleted file mode 100644 index 8863529..0000000 --- a/src/frontend/views/Repository.vue +++ /dev/null @@ -1,29 +0,0 @@ -<template> - <RepositoryHeader :repository="repository" /> - <router-view :repository="repository" /> -</template> - -<script> -import RepositoryHeader from "../components/RepositoryHeader"; - -export default { - name: "Repository", - components: { - RepositoryHeader - }, - props: { - repository: { - type: String, - required: true - } - }, - created() - { - if(/^\/[a-zA-Z0-9.\-_]+[/]?$/.test(window.location.pathname)) { - this.$router.push({ path: `${window.location.pathname}${( window.location.pathname.endsWith("/") ) ? "log" : "/log"}`, replace: true}); - } - - console.log(this.repository); - } -} -</script>
\ No newline at end of file diff --git a/src/frontend/views/RepositoryCommit.vue b/src/frontend/views/RepositoryCommit.vue deleted file mode 100644 index d3ba174..0000000 --- a/src/frontend/views/RepositoryCommit.vue +++ /dev/null @@ -1,89 +0,0 @@ -<template> - <RepositoryNavbar active-page="log" :repository="repository" /> - <div class="row mx-0"> - <div class="col ms-2 ps-4 ps-sm-5 fs-5 vld-parent"> - <BaseBreadcrumb :items="[{ name: 'Log', path: '/' + repository + '/log' }]" :active-item="commit" /> - <Loading - v-model:active="is_loading" :height="24" - :width="24" color="#ffffff" - :opacity="0" /> - <table id="commit-info" class="table table-dark"> - <tbody> - <tr> - <td class="commit-info-title"> - Author - </td> - <td>{{ commit_data["author"] }}</td> - </tr> - <tr> - <td class="commit-info-title"> - Date - </td> - <td>{{ commit_data["date"] }}</td> - </tr> - <tr> - <td class="commit-info-title"> - Message - </td> - <td>{{ commit_data["message"] }}</td> - </tr> - </tbody> - </table> - - <template - v-for="(patch, index) in commit_data['patches']" :key="index"> - <CommitPatch :patch="patch" /> - </template> - </div> - </div> -</template> - -<script> -import RepositoryNavbar from "../components/RepositoryNavbar"; -import CommitPatch from "../components/CommitPatch"; -import BaseBreadcrumb from "../components/BaseBreadcrumb"; -import Loading from "vue-loading-overlay"; -import 'vue-loading-overlay/dist/vue-loading.css'; -import { watch, reactive, toRefs } from "vue"; -import { format } from "date-fns"; - -export default { - name: "RepositoryCommit", - components: { - RepositoryNavbar, - CommitPatch, - Loading, - BaseBreadcrumb - }, - props: { - repository: { - type: String, - required: true - }, - commit: { - type: String, - required: true - } - }, - setup(props) - { - const state = reactive({ commit_data: {}, is_loading: true }); - - watch(() => - { - fetch(`${window.location.protocol}//${window.location.host}/api/v1/repos/${props.repository}/log/${props.commit}`) - .then((res) => res.json()) - .then((data) => - { - data["data"]["date"] = format(new Date(data["data"]["date"]), "yyyy-MM-dd hh:mm"); - state.commit_data = data["data"]; - state.is_loading = false; - }); - }); - - return { - ... toRefs(state) - }; - } -}; -</script> diff --git a/src/frontend/views/RepositoryLog.vue b/src/frontend/views/RepositoryLog.vue deleted file mode 100644 index 3adb6c2..0000000 --- a/src/frontend/views/RepositoryLog.vue +++ /dev/null @@ -1,91 +0,0 @@ -<template> - <RepositoryNavbar active-page="log" :repository="repository" /> - <div class="row mx-0 vld-parent"> - <Loading - v-model:active="is_loading" :height="24" - :width="24" color="#ffffff" - :opacity="0" /> - <div class="col ms-4 ps-4 ps-sm-5 mt-3"> - <table id="log" class="table table-dark fs-5"> - <thead> - <tr> - <th class="text-secondary"> - Subject - </th> - <th class="text-secondary"> - Author - </th> - <th class="text-secondary"> - Date - </th> - <th class="text-secondary"> - Files - </th> - <th class="text-secondary"> - Del/Add - </th> - </tr> - </thead> - <tbody> - <tr v-for="(commit, index) in commits" :key="index"> - <td> - <router-link :to="'log/' + commit['commit']"> - {{ commit["message"] }} - </router-link> - </td> - <td>{{ commit["author_name"] }}</td> - <td>{{ format(new Date(commit["date"]), "yyyy-MM-dd hh:mm") }}</td> - <td>{{ commit["files_changed"] }}</td> - <td><span class="text-danger">-{{ commit["deletions"] }}</span> / <span class="text-success">+{{ commit["insertions"] }}</span></td> - </tr> - </tbody> - </table> - </div> - </div> -</template> - -<script> -import RepositoryNavbar from "../components/RepositoryNavbar"; -import Loading from "vue-loading-overlay"; -import 'vue-loading-overlay/dist/vue-loading.css'; -import { format } from "date-fns"; -import { watch, reactive, toRefs } from "vue"; - -export default { - name: "RepositoryLog", - components: { - RepositoryNavbar, - Loading - }, - props: { - repository: { - type: String, - required: true - } - }, - data() - { - return { - format: format - }; - }, - setup(props) - { - const state = reactive({ commits: {}, is_loading: true }); - - watch(() => - { - fetch(`${window.location.protocol}//${window.location.host}/api/v1/repos/${props.repository}/log`) - .then((res) => res.json()) - .then((data) => { - state.commits = data["data"]; - state.is_loading = false; - }); - }); - - return { - ... toRefs(state) - }; - } -}; -</script>
\ No newline at end of file diff --git a/src/frontend/views/RepositoryTree.vue b/src/frontend/views/RepositoryTree.vue deleted file mode 100644 index dc2c067..0000000 --- a/src/frontend/views/RepositoryTree.vue +++ /dev/null @@ -1,110 +0,0 @@ -<template> - <RepositoryNavbar active-page="tree" :repository="repository" /> - <div class="row mx-0 vld-parent"> - <Loading - v-model:active="is_loading" :height="24" - :width="24" color="#ffffff" - :opacity="0" /> - <div class="col ms-4 ps-4 ps-sm-5 mt-3 fs-5"> - <BaseBreadcrumb - :items="[{ name: repository, path: '/' + repository + '/tree' }].concat(pathArr.slice(0, -1).map((path_part, index) => - { - return { - name: path_part, - path: '/' + repository + '/tree/' + pathArr.slice(0, index + 1).join('/') - } - }))" :active-item="pathArr[pathArr.length - 1]" /> - <RepositoryTreeTree - :repository="repository" :path="path" - :tree="tree" v-if="type === 'tree'" /> - <RepositoryTreeBlob - :repository="repository" :path="path" - :content="blob_content" v-else /> - </div> - </div> -</template> - -<script> -import RepositoryNavbar from "../components/RepositoryNavbar"; -import RepositoryTreeTree from "../components/RepositoryTreeTree"; -import RepositoryTreeBlob from "../components/RepositoryTreeBlob"; -import BaseBreadcrumb from "../components/BaseBreadcrumb"; -import Loading from "vue-loading-overlay"; -import 'vue-loading-overlay/dist/vue-loading.css'; -import { ref } from "vue"; - -export default { - name: "RepositoryTree", - components: { - RepositoryNavbar, - Loading, - RepositoryTreeTree, - RepositoryTreeBlob, - BaseBreadcrumb - }, - props: { - repository: { - type: String, - required: true - }, - pathArr: { - type: Array, - required: true - } - }, - watch: { - pathArr() - { - this.fetchTree(); - } - }, - setup(props) - { - const type = ref(""); - const tree = ref({}); - const blob_content = ref(""); - const is_loading = ref(true); - const path = ref(""); - - const fetchTree = async () => - { - path.value = props.pathArr ? props.pathArr.join("/") : undefined; - const data = await (await fetch(`${window.location.protocol}//${window.location.host}/api/v1/repos/${props.repository}/tree${path.value ? "?path=" + path.value : ""}`)).json(); - - console.log(path.value); - type.value = data["data"]["type"]; - - if(data["data"]["type"] === "tree") { - const tree_data = data["data"]["tree"]; - - let tree_trees = Object.entries(tree_data).filter((entry) => entry[1].type === "tree"); - tree_trees = tree_trees.sort((a, b) => a[0].localeCompare(b[0])); - - let tree_blobs = Object.entries(tree_data).filter((entry) => entry[1].type === "blob"); - tree_blobs = tree_blobs.sort((a, b) => a[0].localeCompare(b[0])); - - tree.value = Object.fromEntries(tree_trees.concat(tree_blobs)); - } - else { - blob_content.value = data["data"]["content"]; - } - - is_loading.value = false; - }; - - return { - type, - tree, - blob_content, - is_loading, - path, - fetchTree - }; - }, - mounted() - { - console.log("VAFAAAN öaöaöaö"); - this.fetchTree(); - } -}; -</script>
\ No newline at end of file |