kopia lustrzana https://github.com/nextcloud/social
Fix posting attachments
Signed-off-by: Louis Chemineau <louis@chmn.me>pull/1588/head
rodzic
e7714a0efe
commit
ba96d644e0
|
@ -402,11 +402,12 @@ export default {
|
|||
this.$refs.fileUploadInput.click()
|
||||
},
|
||||
handleFileChange(event) {
|
||||
const previewUrl = URL.createObjectURL(event.target.files[0])
|
||||
this.previewUrls.push({
|
||||
description: '',
|
||||
url: previewUrl,
|
||||
result: event.target.files[0],
|
||||
event.target.files.forEach((file) => {
|
||||
this.previewUrls.push({
|
||||
description: '',
|
||||
url: URL.createObjectURL(file),
|
||||
result: file,
|
||||
})
|
||||
})
|
||||
},
|
||||
removeAttachment(idx) {
|
||||
|
@ -481,8 +482,8 @@ export default {
|
|||
formData.append('type', this.type)
|
||||
for (const preview of this.previewUrls) {
|
||||
// TODO send the summary and other props too
|
||||
formData.append('attachments', preview.result)
|
||||
formData.append('attachmentDescriptions', preview.description)
|
||||
formData.append('attachments[]', preview.result)
|
||||
formData.append('attachmentDescriptions[]', preview.description)
|
||||
}
|
||||
if (this.replyTo) {
|
||||
formData.append('replyTo', this.replyTo.id)
|
||||
|
|
|
@ -1,9 +1,15 @@
|
|||
<template>
|
||||
<masonry>
|
||||
<div v-for="(item, index) in attachments" :key="index">
|
||||
<img :src="imageUrl(item)" @click="showModal(index)">
|
||||
<div class="post-attachments">
|
||||
<div v-for="(item, index) in attachments"
|
||||
:key="index"
|
||||
class="post-attachment"
|
||||
@click="showModal(index)">
|
||||
<img v-if="item.mimeType.startsWith('image/')" :src="imageUrl(item)">
|
||||
<div v-else>
|
||||
{{ item }}
|
||||
</div>
|
||||
</div>
|
||||
<NcModal v-show="modal"
|
||||
<NcModal v-if="modal"
|
||||
:has-previous="current > 0"
|
||||
:has-next="current < (attachments.length - 1)"
|
||||
size="full"
|
||||
|
@ -14,11 +20,10 @@
|
|||
<canvas ref="modalCanvas" />
|
||||
</div>
|
||||
</NcModal>
|
||||
</masonry>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import serverData from '../mixins/serverData.js'
|
||||
import NcModal from '@nextcloud/vue/dist/Components/NcModal.js'
|
||||
import { generateUrl } from '@nextcloud/router'
|
||||
|
@ -101,3 +106,28 @@ export default {
|
|||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.post-attachments {
|
||||
margin-top: 12px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
overflow-x: scroll;
|
||||
|
||||
.post-attachment {
|
||||
height: 100px;
|
||||
object-fit: cover;
|
||||
border-radius: var(--border-radius-large);
|
||||
overflow: hidden;
|
||||
|
||||
> * {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -27,8 +27,8 @@
|
|||
<UserEntry v-if="item.type === 'SocialAppNotification' && item.details.actor" :key="item.details.actor.id" :item="item.details.actor" />
|
||||
<template v-else>
|
||||
<div class="wrapper">
|
||||
<TimelineAvatar :item="entryContent" />
|
||||
<TimelinePost class="message"
|
||||
<TimelineAvatar class="entry__avatar" :item="entryContent" />
|
||||
<TimelinePost class="entry__content"
|
||||
:item="entryContent"
|
||||
:parent-announce="isBoost" />
|
||||
</div>
|
||||
|
@ -130,9 +130,19 @@ export default {
|
|||
display: flex;
|
||||
margin: auto;
|
||||
padding: 0;
|
||||
|
||||
&:focus {
|
||||
background-color: rgba(47, 47, 47, 0.068);
|
||||
}
|
||||
|
||||
.entry__avatar {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.entry__content {
|
||||
flex-grow: 1;
|
||||
width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.notification-header {
|
||||
|
|
|
@ -220,7 +220,6 @@ export default {
|
|||
font-size: 15px;
|
||||
line-height: 1.6em;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
::v-deep a.widget-default {
|
||||
text-decoration: none !important;
|
||||
|
@ -276,13 +275,6 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
span {
|
||||
/* opacity: 0.5; */
|
||||
}
|
||||
.entry-content {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.post-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
|
Ładowanie…
Reference in New Issue