btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

Feat/tailwind (#1179)

Browse Source
This commit is contained in:
Liyas Thomas
2020-09-22 22:36:37 +05:30
committed by GitHub
parent 45fb612793
commit b747d0273c
59 changed files with 2020 additions and 1431 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/collections/add-collection.vue
View File

@@ -3,7 +3,7 @@
<div slot="header">
<ul>
<li>
<div class="flex-wrap">
<div class="row-wrapper">
<h3 class="title">{{ $t("new_collection") }}</h3>
<div>
<button class="icon" @click="hideModal">
@@ -27,7 +27,7 @@
</ul>
</div>
<div slot="footer">
<div class="flex-wrap">
<div class="row-wrapper">
<span></span>
<span>
<button class="icon" @click="hideModal">

4
components/collections/add-folder.vue
View File

@@ -3,7 +3,7 @@
<div slot="header">
<ul>
<li>
<div class="flex-wrap">
<div class="row-wrapper">
<h3 class="title">{{ $t("new_folder") }}</h3>
<div>
<button class="icon" @click="hideModal">
@@ -27,7 +27,7 @@
</ul>
</div>
<div slot="footer">
<div class="flex-wrap">
<div class="row-wrapper">
<span></span>
<span>
<button class="icon" @click="hideModal">

36
components/collections/collection.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<div class="flex-wrap">
<div class="row-wrapper">
<button class="icon" @click="toggleShowChildren">
<i class="material-icons" v-show="!showChildren">arrow_right</i>
<i class="material-icons" v-show="showChildren">arrow_drop_down</i>
@@ -45,8 +45,12 @@
</div>
<div v-show="showChildren">
<ul>
<li v-for="(folder, index) in collection.folders" :key="folder.name">
<ul class="flex-col">
<li
v-for="(folder, index) in collection.folders"
:key="folder.name"
class="ml-8 border-l border-brdColor"
>
<folder
:folder="folder"
:folderIndex="index"
@@ -56,12 +60,19 @@
@edit-request="$emit('edit-request', $event)"
/>
</li>
<li v-if="collection.folders.length === 0 && collection.requests.length === 0">
<li
v-if="collection.folders.length === 0 && collection.requests.length === 0"
class="ml-8 border-l border-brdColor"
>
<label>{{ $t("collection_empty") }}</label>
</li>
</ul>
<ul>
<li v-for="(request, index) in collection.requests" :key="index">
<ul class="flex-col">
<li
v-for="(request, index) in collection.requests"
:key="index"
class="ml-8 border-l border-brdColor"
>
<request
:request="request"
:collection-index="collectionIndex"
@@ -83,19 +94,6 @@
</div>
</template>
<style scoped lang="scss">
ul {
display: flex;
flex-direction: column;
}
ul li {
display: flex;
margin-left: 32px;
border-left: 1px solid var(--brd-color);
}
</style>
<script>
import { fb } from "~/helpers/fb"
import folderIcon from "~/static/icons/folder-24px.svg?inline"

4
components/collections/edit-collection.vue
View File

@@ -3,7 +3,7 @@
<div slot="header">
<ul>
<li>
<div class="flex-wrap">
<div class="row-wrapper">
<h3 class="title">{{ $t("edit_collection") }}</h3>
<div>
<button class="icon" @click="hideModal">
@@ -27,7 +27,7 @@
</ul>
</div>
<div slot="footer">
<div class="flex-wrap">
<div class="row-wrapper">
<span></span>
<span>
<button class="icon" @click="hideModal">

4
components/collections/edit-folder.vue
View File

@@ -3,7 +3,7 @@
<div slot="header">
<ul>
<li>
<div class="flex-wrap">
<div class="row-wrapper">
<h3 class="title">{{ $t("edit_folder") }}</h3>
<div>
<button class="icon" @click="hideModal">
@@ -22,7 +22,7 @@
</ul>
</div>
<div slot="footer">
<div class="flex-wrap">
<div class="row-wrapper">
<span></span>
<span>
<button class="icon" @click="hideModal">

10
components/collections/edit-request.vue
View File

@@ -3,7 +3,7 @@
<div slot="header">
<ul>
<li>
<div class="flex-wrap">
<div class="row-wrapper">
<h3 class="title">{{ $t("edit_request") }}</h3>
<div>
<button class="icon" @click="hideModal">
@@ -28,9 +28,9 @@
<label for="selectCollection">{{ $t("collection") }}</label>
<span class="select-wrapper">
<select type="text" id="selectCollection" v-model="requestUpdateData.collectionIndex">
<option :key="undefined" :value="undefined" hidden disabled selected>{{
$t("current_collection")
}}</option>
<option :key="undefined" :value="undefined" hidden disabled selected>
{{ $t("current_collection") }}
</option>
<option
v-for="(collection, index) in $store.state.postwoman.collections"
:key="index"
@@ -53,7 +53,7 @@
</ul>
</div>
<div slot="footer">
<div class="flex-wrap">
<div class="row-wrapper">
<span></span>
<span>
<button class="icon" @click="hideModal">

25
components/collections/folder.vue
View File

@@ -1,6 +1,6 @@
<template>
<div>
<div class="flex-wrap">
<div class="row-wrapper">
<div>
<button class="icon" @click="toggleShowChildren">
<i class="material-icons" v-show="!showChildren">arrow_right</i>
@@ -31,8 +31,12 @@
</div>
<div v-show="showChildren">
<ul>
<li v-for="(request, index) in folder.requests" :key="index">
<ul class="flex-col">
<li
v-for="(request, index) in folder.requests"
:key="index"
class="flex ml-8 border-l border-brdColor"
>
<request
:request="request"
:collection-index="collectionIndex"
@@ -49,7 +53,7 @@
"
/>
</li>
<li v-if="folder.requests.length === 0">
<li v-if="folder.requests.length === 0" class="flex ml-8 border-l border-brdColor">
<label>{{ $t("folder_empty") }}</label>
</li>
</ul>
@@ -57,19 +61,6 @@
</div>
</template>
<style scoped lang="scss">
ul {
display: flex;
flex-direction: column;
}
ul li {
display: flex;
margin-left: 32px;
border-left: 1px solid var(--brd-color);
}
</style>
<script>
import { fb } from "~/helpers/fb"
import deleteIcon from "~/static/icons/delete-24px.svg?inline"

16
components/collections/import-export-collections.vue
View File

@@ -3,7 +3,7 @@
<div slot="header">
<ul>
<li>
<div class="flex-wrap">
<div class="row-wrapper">
<h3 class="title">{{ $t("import_export") }} {{ $t("collections") }}</h3>
<div>
<button class="icon" @click="hideModal">
@@ -11,7 +11,7 @@
</button>
</div>
</div>
<div class="flex-wrap">
<div class="row-wrapper">
<span
v-tooltip="{
content: !fb.currentUser ? $t('login_first') : $t('replace_current'),
@@ -60,7 +60,7 @@
<textarea v-model="collectionJson" rows="8"></textarea>
</div>
<div slot="footer">
<div class="flex-wrap">
<div class="row-wrapper">
<span></span>
<span>
<button class="icon" @click="hideModal">
@@ -140,7 +140,7 @@ export default {
}
} else if (collections.info && collections.info.schema.includes("v2.1.0")) {
//replace the variables, postman uses {{var}}, Hoppscotch uses <<var>>
collections = JSON.parse(content.replaceAll(/{{([a-z]+)}}/gi, '<<$1>>'))
collections = JSON.parse(content.replaceAll(/{{([a-z]+)}}/gi, "<<$1>>"))
collections.item = this.flattenPostmanFolders(collections)
collections = this.parsePostmanCollection(collections)
} else {
@@ -317,15 +317,15 @@ export default {
}
items.push(collectionItem)
}
return items;
return items
},
hasFolder(item) {
return item.hasOwnProperty('item')
return item.hasOwnProperty("item")
},
isSubFolder(item) {
return item.hasOwnProperty('_postman_isSubFolder') && item._postman_isSubFolder
return item.hasOwnProperty("_postman_isSubFolder") && item._postman_isSubFolder
},
flattenPostmanItem(subFolder, subFolderGlue = ' -- ') {
flattenPostmanItem(subFolder, subFolderGlue = " -- ") {
delete subFolder._postman_isSubFolder
let flattenedItems = []
for (let subFolderItem of subFolder.item) {

9
components/collections/index.vue
View File

@@ -39,7 +39,7 @@ TODO:
@hide-modal="displayModalImportExport(false)"
/>
<div class="flex-wrap">
<div class="row-wrapper">
<div>
<button class="icon" @click="displayModalAdd(true)">
<i class="material-icons">add</i>
@@ -65,7 +65,7 @@ TODO:
<i class="material-icons">help_outline</i> {{ $t("create_new_collection") }}
</p>
<div class="virtual-list">
<ul>
<ul class="flex-col">
<li v-for="(collection, index) in collections" :key="collection.name">
<collection
:collection-index="index"
@@ -87,11 +87,6 @@ TODO:
.virtual-list {
max-height: calc(100vh - 245px);
}
ul {
display: flex;
flex-direction: column;
}
</style>
<script>

15
components/collections/request.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="flex-wrap">
<div class="row-wrapper">
<div>
<button
class="icon"
@@ -32,19 +32,6 @@
</div>
</template>
<style scoped lang="scss">
ul {
display: flex;
flex-direction: column;
}
ul li {
display: flex;
padding-left: 16px;
border-left: 1px solid var(--brd-color);
}
</style>
<script>
import { fb } from "~/helpers/fb"
import deleteIcon from "~/static/icons/delete-24px.svg?inline"

10
components/collections/save-request-as.vue
View File

@@ -3,7 +3,7 @@
<div slot="header">
<ul>
<li>
<div class="flex-wrap">
<div class="row-wrapper">
<h3 class="title">{{ $t("save_request_as") }}</h3>
<div>
<button class="icon" @click="hideModal">
@@ -28,9 +28,9 @@
<label for="selectCollection">{{ $t("collection") }}</label>
<span class="select-wrapper">
<select type="text" id="selectCollection" v-model="requestData.collectionIndex">
<option :key="undefined" :value="undefined" hidden disabled selected>{{
$t("select_collection")
}}</option>
<option :key="undefined" :value="undefined" hidden disabled selected>
{{ $t("select_collection") }}
</option>
<option
v-for="(collection, index) in $store.state.postwoman.collections"
:key="index"
@@ -62,7 +62,7 @@
</ul>
</div>
<div slot="footer">
<div class="flex-wrap">
<div class="row-wrapper">
<span></span>
<span>
<button class="icon" @click="hideModal">