85 lines
1.8 KiB
Vue
85 lines
1.8 KiB
Vue
<template>
|
|
<div>
|
|
<button
|
|
@click="openFile(row)"
|
|
class="button is-small is-ghost"
|
|
>
|
|
<span class="icon">
|
|
<Icon
|
|
name="material-symbols:open-in-new-rounded"
|
|
:size="18"
|
|
/>
|
|
</span>
|
|
</button>
|
|
<button
|
|
@click="download(row)"
|
|
class="button is-small is-ghost"
|
|
>
|
|
<span class="icon">
|
|
<Icon
|
|
name="material-symbols:download-rounded"
|
|
:size="18"
|
|
/>
|
|
</span>
|
|
</button>
|
|
<button
|
|
@click="remove"
|
|
class="button is-small is-ghost"
|
|
>
|
|
<span class="icon">
|
|
<Icon
|
|
name="material-symbols:delete-outline-rounded"
|
|
:size="18"
|
|
class="has-text-danger"
|
|
/>
|
|
</span>
|
|
</button>
|
|
<Modal
|
|
v-if="showModal"
|
|
v-bind="showModal"
|
|
@close="showModal = undefined"
|
|
/>
|
|
</div>
|
|
</template>
|
|
<script setup>
|
|
import Modal from "~/components/Modal.vue";
|
|
|
|
const { $getpath } = useNuxtApp();
|
|
|
|
const showModal = ref();
|
|
const props = defineProps(["api", "pagename", "row", "disable"]);
|
|
const emit = defineEmits(["open"]);
|
|
|
|
async function openFile(row) {
|
|
const url = `${$getpath()}static/files/${row.file__file || row.file}`;
|
|
window.open(url, "_blank");
|
|
}
|
|
|
|
async function download(row) {
|
|
const url = `${$getpath()}static/files/${row.file__file || row.file}`;
|
|
const link = document.createElement("a");
|
|
link.href = url;
|
|
link.target = "_blank";
|
|
link.setAttribute("download", row.file);
|
|
link.click();
|
|
}
|
|
|
|
function remove() {
|
|
showModal.value = {
|
|
component: "dialog/Delete",
|
|
title: "Xóa file",
|
|
width: "500px",
|
|
height: "auto",
|
|
vbind: {
|
|
content: `Bạn có muốn xóa file <b>${props.row.name}</b> không?`,
|
|
duration: 10,
|
|
vbind: {
|
|
row: props.row,
|
|
api: props.api,
|
|
pagename: props.pagename,
|
|
},
|
|
},
|
|
};
|
|
}
|
|
</script>
|