hrms-mgt/src/modules/12_evaluatePersonal/components/Detail/step/step9.vue

50 lines
1.3 KiB
Vue

<script setup lang="ts">
import { ref } from "vue";
import { useRoute } from "vue-router";
import { useQuasar } from "quasar";
import env from "@/api";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
/** use*/
const $q = useQuasar();
const route = useRoute();
const mixin = useCounterMixin();
const { success } = mixin;
const id = ref<string>(route.params.id as string);
const link = ref<string>(env.LINK_EVALUATE_PUBLISH);
/** function คัดลอกลิงก์*/
function copyLink() {
const linkById = `${link.value}/${id.value}`;
navigator.clipboard.writeText(linkById);
success($q, "คัดลอกสำเร็จ");
}
</script>
<template>
<div class="row q-pa-md">
<div class="col-12 row items-center justify-center">
<div class="row"><strong>Public URL : </strong>
<a :href="`${link}/${id}`" class="q-pl-sm"> {{link}}/{{ id }}
</a>
</div>
<q-space/>
<div class="q-pt-sm">
<q-btn
outline
icon="mdi-content-copy"
label="คัดลอกลิงก์"
color="primary"
@click="copyLink"
>
<q-tooltip> ดลอกลงก </q-tooltip></q-btn
>
</div>
</div>
</div>
</template>
<style scoped></style>