Compare commits
3 commits
e605292bf0
...
b3c2233454
Author | SHA1 | Date | |
---|---|---|---|
b3c2233454 | |||
41d983ccbb | |||
79cfbdbe2f |
4 changed files with 45 additions and 16 deletions
|
@ -47,7 +47,6 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import router from '../router';
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'CollapsableCards',
|
name: 'CollapsableCards',
|
||||||
|
@ -76,7 +75,15 @@ export default {
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
const query = this.$router.currentRoute.query.collapsed;
|
||||||
|
if (query !== null && query !== undefined) {
|
||||||
|
this.collapsed = this.unpackInt(parseInt(query), this.sections.length);
|
||||||
|
} else {
|
||||||
this.collapsed = this.sections.map(() => true);
|
this.collapsed = this.sections.map(() => true);
|
||||||
|
}
|
||||||
|
|
||||||
|
//this.$router.push({...this.$router.currentRoute, query: {...this.$router.currentRoute.query, layout}});
|
||||||
|
//this.collapsed = this.sections.map(() => true);
|
||||||
/*this.columns.map(e => ({
|
/*this.columns.map(e => ({
|
||||||
k: e,
|
k: e,
|
||||||
v: this.$store.getters.getFilters[e]
|
v: this.$store.getters.getFilters[e]
|
||||||
|
@ -85,21 +92,31 @@ export default {
|
||||||
computed: {
|
computed: {
|
||||||
grouped_items() {
|
grouped_items() {
|
||||||
return this.sections.map(section => this.items.filter(item => item[this.keyName] === section.slug));
|
return this.sections.map(section => this.items.filter(item => item[this.keyName] === section.slug));
|
||||||
}
|
},
|
||||||
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
toggle(index) {
|
packInt(arr) {
|
||||||
this.collapsed[index] = !this.collapsed[index];
|
return arr.reduce((a, e, i) => a + (e ? 0 : 2 ** i), 0);
|
||||||
this.$forceUpdate();
|
},
|
||||||
|
unpackInt(n, l) {
|
||||||
|
return [...Array(l)].map((e, i) => (n & 2 ** i) === 0);
|
||||||
|
},
|
||||||
|
toggle(index) {
|
||||||
|
const collapsed = [...this.collapsed]
|
||||||
|
collapsed[index] = !collapsed[index];
|
||||||
|
this.collapsed = collapsed;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
collapsed: {
|
||||||
|
handler() {
|
||||||
|
const encoded = this.packInt(this.collapsed).toString()
|
||||||
|
if (this.$router.currentRoute.query.collapsed !== encoded)
|
||||||
|
this.$router.push({...this.$router.currentRoute, query: {...this.$router.currentRoute.query, collapsed: encoded}});
|
||||||
|
},
|
||||||
|
deep: true,
|
||||||
},
|
},
|
||||||
/*changeFilter(col, val) {
|
|
||||||
this.setFilter(col, val);
|
|
||||||
let newquery = Object.entries({
|
|
||||||
...this.$store.getters.getFilters,
|
|
||||||
[col]: val
|
|
||||||
}).reduce((a, [k, v]) => (v ? {...a, [k]: v} : a), {});
|
|
||||||
router.push({query: newquery});
|
|
||||||
},*/
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -123,6 +123,7 @@ export default {
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
...mapActions(['changeEvent', 'changeView', 'searchEventItems']),
|
...mapActions(['changeEvent', 'changeView', 'searchEventItems']),
|
||||||
|
...mapMutations(['logout']),
|
||||||
navigateTo(link) {
|
navigateTo(link) {
|
||||||
if (this.$router.currentRoute.path !== link)
|
if (this.$router.currentRoute.path !== link)
|
||||||
this.$router.push(link);
|
this.$router.push(link);
|
||||||
|
|
|
@ -87,7 +87,6 @@ export default {
|
||||||
methods: {
|
methods: {
|
||||||
openLightboxModalWith(attachment) {
|
openLightboxModalWith(attachment) {
|
||||||
this.lightboxHash = attachment.hash;
|
this.lightboxHash = attachment.hash;
|
||||||
console.log(this.lightboxHash);
|
|
||||||
},
|
},
|
||||||
closeLightboxModal() { // Closes the editing modal and discards the edited copy of the item.
|
closeLightboxModal() { // Closes the editing modal and discards the edited copy of the item.
|
||||||
this.lightboxHash = null;
|
this.lightboxHash = null;
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<img
|
<img
|
||||||
v-if="!capturing"
|
v-if="!capturing"
|
||||||
class="img-fluid rounded mx-auto d-block mb-3 img-preview"
|
class="img-fluid rounded mx-auto d-block mb-3 img-preview"
|
||||||
:src="dataImage || `https://c3lf.de/api/1/thumbs/${model[field]}`"
|
:src="dataImage"
|
||||||
alt="Image not available."
|
alt="Image not available."
|
||||||
/>
|
/>
|
||||||
<video
|
<video
|
||||||
|
@ -108,11 +108,23 @@ export default {
|
||||||
});
|
});
|
||||||
console.log('Error: ', error);
|
console.log('Error: ', error);
|
||||||
};
|
};
|
||||||
|
},
|
||||||
|
loadImage() {
|
||||||
|
this.fetchImage('/media/2/' + this.model[this.field] + '/').then((response) => {
|
||||||
|
const mime_type = response.headers.get("content-type");
|
||||||
|
response.arrayBuffer().then((buf) => {
|
||||||
|
const base64 = btoa(new Uint8Array(buf)
|
||||||
|
.reduce((data, byte) => data + String.fromCharCode(byte), ""));
|
||||||
|
this.dataImage = "data:" + mime_type + ";base64," + base64;
|
||||||
|
});
|
||||||
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
if (!this.model[this.field])
|
if (!this.model[this.field])
|
||||||
this.openStream();
|
this.openStream();
|
||||||
|
else
|
||||||
|
this.loadImage();
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
this.closeStream();
|
this.closeStream();
|
||||||
|
|
Loading…
Reference in a new issue