Reviewed-on: #270 Reviewed-by: Adam Bem <bema@noreply.example.com> Co-authored-by: widlam <mikolaj.widla@gmail.com> Co-committed-by: widlam <mikolaj.widla@gmail.com>
31 lines
1.1 KiB
Vue
31 lines
1.1 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue';
|
|
import EncodeUriButton from '@components/encoder/EncodeUriButtonComponent.vue'
|
|
import CodeEditorComponent from '@/components/common/CodeEditorComponent.vue';
|
|
|
|
|
|
const uri = ref("")
|
|
|
|
function setTextFieldValue(newVal : string){
|
|
console.log(newVal)
|
|
uri.value = newVal
|
|
}
|
|
|
|
function clear(){
|
|
uri.value = "";
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="flex flex-col w-full h-full gap-4" id="layout">
|
|
<div id="toolbar" class="flex flex-col gap-4 items-center lg:flex-row place-content-between">
|
|
<span class="dark:text-slate-100">URI Encoder</span>
|
|
<div class="flex flex-wrap gap-2 justify-center">
|
|
<button class="tool-button" @click="clear()">Clear</button>
|
|
<EncodeUriButton @update:result="setTextFieldValue" :code="uri" operation="Encode" />
|
|
<EncodeUriButton @update:result="setTextFieldValue" :code="uri" operation="Decode" />
|
|
</div>
|
|
</div>
|
|
<CodeEditorComponent @update:updated-code="setTextFieldValue" :code="uri" :config="{disabled:false,language:'uri'}" />
|
|
</div>
|
|
</template> |