70 lines
1.6 KiB
Vue
70 lines
1.6 KiB
Vue
<template>
|
|
<p
|
|
class="py-1 border-bottom"
|
|
v-for="(v, i) in vfiles"
|
|
>
|
|
<a
|
|
class="mr-4"
|
|
@click="open(v)"
|
|
>{{ v.name }}</a
|
|
>
|
|
<a
|
|
class="mr-4"
|
|
@click="download(v, i)"
|
|
>
|
|
<SvgIcon v-bind="{ name: 'download1.svg', type: 'dark', size: 16 }"></SvgIcon>
|
|
</a>
|
|
<a
|
|
@click="remove(v, i)"
|
|
v-if="show ? show.delete : false"
|
|
>
|
|
<SvgIcon v-bind="{ name: 'bin1.svg', type: 'dark', size: 16 }"></SvgIcon>
|
|
</a>
|
|
</p>
|
|
<Modal
|
|
@close="showmodal = undefined"
|
|
v-bind="showmodal"
|
|
v-if="showmodal"
|
|
></Modal>
|
|
</template>
|
|
<script setup>
|
|
const { $copy, $getpath, $download } = useNuxtApp();
|
|
const emit = defineEmits(["remove", "close"]);
|
|
var props = defineProps({
|
|
files: Object,
|
|
show: Object,
|
|
});
|
|
var showmodal = ref();
|
|
var vfiles = ref($copy(props.files));
|
|
function remove(v, i) {
|
|
vfiles.value.splice(i, 1);
|
|
emit("remove", { v: v, i: i });
|
|
emit("modalevent", { name: "removefile", data: { v: v, i: i } });
|
|
if (vfiles.value.length === 0) emit("close");
|
|
}
|
|
function open(v) {
|
|
if (v.name.indexOf(".png") >= 0 || v.name.indexOf(".jpg") >= 0 || v.name.indexOf(".jpeg") >= 0) {
|
|
showmodal.value = {
|
|
title: v.file__file || v.file,
|
|
component: "media/ChipImage",
|
|
vbind: {
|
|
extend: false,
|
|
file: v,
|
|
image: `${$getpath()}static/files/${v.file__file || v.file}`,
|
|
},
|
|
};
|
|
return;
|
|
}
|
|
window.open(`${$getpath()}static/files/${v.file__file || v.file}`);
|
|
}
|
|
function download(v) {
|
|
window.open(`${$getpath()}static/files/${v.file}`, v.name);
|
|
}
|
|
watch(
|
|
() => props.files,
|
|
(newVal, oldVal) => {
|
|
vfiles.value = props.files;
|
|
},
|
|
);
|
|
</script>
|