Files
release11-tools/Frontend/src/views/UrlEncoderView.vue
widlam 50c44fc9a8 Created theme switcher (#270)
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>
2023-12-04 12:11:26 +01:00

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>