143 lines
3.3 KiB
Vue
143 lines
3.3 KiB
Vue
<template>
|
|
<div v-resize="onResize">
|
|
<span class="v-label v-label--active theme--light">
|
|
{{ $ay.t("Attachments") }}
|
|
</span>
|
|
<v-row>
|
|
<v-col cols="12" sm="8">
|
|
<v-card class="mx-auto">
|
|
<v-card-text>
|
|
<div :style="cardTextStyle()">
|
|
<v-list two-line>
|
|
<v-list-item
|
|
v-for="item in items"
|
|
:key="item.title"
|
|
@click="aClick"
|
|
>
|
|
<v-list-item-avatar>
|
|
<v-icon v-text="item.icon"></v-icon>
|
|
</v-list-item-avatar>
|
|
|
|
<v-list-item-content>
|
|
<v-list-item-title v-text="item.title"></v-list-item-title>
|
|
<v-list-item-subtitle
|
|
v-text="item.subtitle"
|
|
></v-list-item-subtitle>
|
|
</v-list-item-content>
|
|
|
|
<v-list-item-action>
|
|
<v-btn icon>
|
|
<v-icon>fa-trash</v-icon>
|
|
</v-btn>
|
|
</v-list-item-action>
|
|
</v-list-item>
|
|
</v-list>
|
|
</div>
|
|
</v-card-text>
|
|
|
|
<v-card-actions>
|
|
<v-file-input
|
|
:label="$ay.t('AttachFile')"
|
|
prepend-icon="fa-paperclip"
|
|
></v-file-input>
|
|
<v-text-field
|
|
v-model="notes"
|
|
:label="$ay.t('ImageDescription')"
|
|
></v-text-field>
|
|
</v-card-actions>
|
|
</v-card>
|
|
</v-col>
|
|
</v-row>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
created() {},
|
|
data() {
|
|
return {
|
|
height: 300,
|
|
items: [
|
|
{
|
|
icon: "fa-file",
|
|
title: "drawings.pdf",
|
|
subtitle: "2020-01-09"
|
|
},
|
|
{
|
|
icon: "fa-image",
|
|
title: "Recipes",
|
|
subtitle: "Jan 17, 2014"
|
|
},
|
|
{
|
|
icon: "fa-pen",
|
|
title: "Work",
|
|
subtitle: "Jan 28, 2014"
|
|
},
|
|
{
|
|
icon: "fa-file",
|
|
title: "2drawings.pdf",
|
|
subtitle: "2020-01-09"
|
|
},
|
|
{
|
|
icon: "fa-image",
|
|
title: "2Recipes",
|
|
subtitle: "Jan 17, 2014"
|
|
},
|
|
{
|
|
icon: "fa-pen",
|
|
title: "2Work",
|
|
subtitle: "Jan 28, 2014"
|
|
},
|
|
{
|
|
icon: "fa-file",
|
|
title: "3drawings.pdf",
|
|
subtitle: "2020-01-09"
|
|
},
|
|
{
|
|
icon: "fa-image",
|
|
title: "3Recipes",
|
|
subtitle: "Jan 17, 2014"
|
|
},
|
|
{
|
|
icon: "fa-pen",
|
|
title: "3Work",
|
|
subtitle: "Jan 28, 2014"
|
|
},
|
|
{
|
|
icon: "fa-file",
|
|
title: "4drawings.pdf",
|
|
subtitle: "2020-01-09"
|
|
},
|
|
{
|
|
icon: "fa-image",
|
|
title: "4Recipes",
|
|
subtitle: "Jan 17, 2014"
|
|
},
|
|
{
|
|
icon: "fa-pen",
|
|
title: "4Work",
|
|
subtitle: "Jan 28, 2014"
|
|
}
|
|
],
|
|
notes: null
|
|
};
|
|
},
|
|
props: {
|
|
ayaType: Number,
|
|
ayaId: Number,
|
|
readonly: Boolean
|
|
},
|
|
|
|
methods: {
|
|
onResize() {
|
|
this.height = window.innerHeight * 0.25;
|
|
},
|
|
cardTextStyle() {
|
|
return "height: " + this.height + "px;overflow-y:auto;";
|
|
},
|
|
aClick() {
|
|
console.log("CLICK");
|
|
}
|
|
}
|
|
};
|
|
</script>
|