Skip to content

Commit 884db0c

Browse files
refact: More playing around
1 parent 07fd85a commit 884db0c

File tree

3 files changed

+126
-28
lines changed

3 files changed

+126
-28
lines changed

panel/src/components/Dialogs/ChangesDialog.vue

Lines changed: 98 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,29 @@
11
<template>
22
<k-dialog v-bind="$props" class="k-changes-dialog">
3-
<k-section
4-
v-if="pages.length"
5-
:buttons="buttons('pages')"
6-
:label="$t('lock.unsaved.pages')"
7-
>
3+
<header slot="header" class="k-changes-dialog-header">
4+
<nav class="k-tabs">
5+
<k-button class="k-tabs-button" :current="true">
6+
Your changes
7+
</k-button>
8+
<k-button class="k-tabs-button"> Team changes </k-button>
9+
</nav>
10+
11+
<k-button-group :buttons="buttons()" size="xs" />
12+
</header>
13+
14+
<k-table :index="false" :columns="columns" :rows="rows" />
15+
16+
<!-- <k-section v-if="pages.length" :label="$t('lock.unsaved.pages')">
817
<k-items :items="items(pages)" layout="list" />
918
</k-section>
1019
11-
<k-section
12-
v-if="files.length"
13-
:buttons="buttons('files')"
14-
:label="$t('lock.unsaved.files')"
15-
>
20+
<k-section v-if="files.length" :label="$t('lock.unsaved.files')">
1621
<k-items :items="items(files)" layout="list" />
1722
</k-section>
1823
19-
<k-section
20-
v-if="users.length"
21-
:buttons="buttons('users')"
22-
:label="$t('lock.unsaved.users')"
23-
>
24+
<k-section v-if="users.length" :label="$t('lock.unsaved.users')">
2425
<k-items :items="items(users)" layout="list" />
25-
</k-section>
26+
</k-section> -->
2627

2728
<k-section
2829
v-if="!pages.length && !files.length && !users.length"
@@ -56,7 +57,7 @@ export default {
5657
},
5758
// eslint-disable-next-line vue/require-prop-types
5859
size: {
59-
default: "large"
60+
default: "huge"
6061
},
6162
// eslint-disable-next-line vue/require-prop-types
6263
submitButton: {
@@ -67,8 +68,41 @@ export default {
6768
default: () => []
6869
}
6970
},
71+
computed: {
72+
columns() {
73+
return {
74+
image: {
75+
label: "",
76+
width: "var(--table-row-height)",
77+
type: "image",
78+
mobile: true
79+
},
80+
text: {
81+
label: "Title",
82+
type: "url",
83+
mobile: true
84+
},
85+
type: {
86+
type: "tags",
87+
width: "6rem",
88+
mobile: true
89+
},
90+
when: {
91+
type: "text",
92+
width: "10rem"
93+
},
94+
user: {
95+
width: "12rem",
96+
type: "text"
97+
}
98+
};
99+
},
100+
rows() {
101+
return this.items([...this.pages, ...this.files, ...this.users]);
102+
}
103+
},
70104
methods: {
71-
buttons(type) {
105+
buttons() {
72106
return [
73107
{
74108
icon: "undo",
@@ -83,10 +117,10 @@ export default {
83117
icon: "undo",
84118
text: this.$t("form.discard")
85119
},
86-
text: `Do you really want to discard all unsaved changes for ${type}?`
120+
text: `Do you really want to discard all unsaved changes?`
87121
},
88122
on: {
89-
submit: () => this.discardAll(type)
123+
submit: () => this.discardAll()
90124
}
91125
});
92126
}
@@ -103,10 +137,10 @@ export default {
103137
theme: "notice",
104138
text: "Save changes"
105139
},
106-
text: `Do you really want to save all unsaved changes for ${type}?`
140+
text: `Do you really want to save all unsaved changes?`
107141
},
108142
on: {
109-
submit: () => this.saveAll(type)
143+
submit: () => this.saveAll()
110144
}
111145
});
112146
}
@@ -121,17 +155,22 @@ export default {
121155
this.$panel.notification.error(e);
122156
}
123157
},
124-
async discardAll(type) {
158+
async discardAll() {
125159
try {
126-
await this.$panel.api.post("/changes/discard/" + type);
160+
await this.$panel.api.post("/changes/discard");
127161
this.$panel.dialog.close();
128162
this.$panel.dialog.refresh();
129163
} catch (e) {
130164
this.$panel.notification.error(e);
131165
}
132166
},
133167
items(items) {
134-
return items.map((item) => {
168+
items = items.map((item) => {
169+
item.text = {
170+
text: item.text,
171+
href: item.link
172+
};
173+
135174
item.options = [
136175
{
137176
icon: "undo",
@@ -154,6 +193,8 @@ export default {
154193
155194
return item;
156195
});
196+
197+
return this.$helper.array.sortBy(items, "modified desc");
157198
},
158199
preview(model) {
159200
this.$panel.view.open(model.link + "/preview/changes");
@@ -166,9 +207,9 @@ export default {
166207
this.$panel.notification.error(e);
167208
}
168209
},
169-
async saveAll(type) {
210+
async saveAll() {
170211
try {
171-
await this.$panel.api.post("/changes/publish/" + type);
212+
await this.$panel.api.post("/changes/publish");
172213
this.$panel.dialog.close();
173214
this.$panel.dialog.refresh();
174215
} catch (e) {
@@ -178,3 +219,33 @@ export default {
178219
}
179220
};
180221
</script>
222+
223+
<style>
224+
.k-changes-dialog {
225+
--dialog-padding: 0;
226+
max-height: 100%;
227+
}
228+
.k-changes-dialog-header {
229+
display: flex;
230+
align-items: center;
231+
justify-content: space-between;
232+
height: var(--height-xl);
233+
flex-shrink: 0;
234+
padding-inline: var(--spacing-3);
235+
border-bottom: 1px solid var(--color-gray-900);
236+
z-index: 1;
237+
}
238+
.k-changes-dialog-header .k-tabs {
239+
margin-bottom: 0px;
240+
}
241+
242+
.k-changes-dialog .k-dialog-body {
243+
--header-sticky-offset: 0;
244+
flex-grow: 1;
245+
overflow-y: scroll;
246+
overflow-x: hidden;
247+
}
248+
.k-changes-dialog .k-dialog-body .k-table th {
249+
border-radius: 0;
250+
}
251+
</style>

src/Content/Changes.php

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44

55
use Kirby\Cache\Cache;
66
use Kirby\Cms\App;
7+
use Kirby\Cms\Collection;
78
use Kirby\Cms\Files;
89
use Kirby\Cms\ModelWithContent;
910
use Kirby\Cms\Pages;

src/Panel/ChangesDialog.php

Lines changed: 27 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22

33
namespace Kirby\Panel;
44

5+
use DateTimeImmutable;
56
use Kirby\Cms\Collection;
67
use Kirby\Cms\File;
78
use Kirby\Cms\Page;
@@ -48,7 +49,32 @@ public function item(File|Page|User $model): array
4849
$model instanceof User => new UserItem(user: $model),
4950
};
5051

51-
return $item->props();
52+
$changes = $model->version('changes');
53+
$lock = $changes->lock();
54+
$modified = $lock->modified('Y-m-d H:i:s');
55+
56+
57+
$origin = new DateTimeImmutable('now');
58+
$target = new DateTimeImmutable($modified);
59+
$interval = $origin->diff($target);
60+
61+
if ($interval->d > 0) {
62+
$when = $interval->format('%a days ago');
63+
} else if ($interval->h > 0) {
64+
$when = $interval->format('%h hours ago');
65+
} else if ($interval->i > 0) {
66+
$when = $interval->format('%i minutes ago');
67+
} else {
68+
$when = $interval->format('%s seconds ago');
69+
}
70+
71+
return [
72+
...$item->props(),
73+
'user' => $lock->user()->email(),
74+
'type' => $model::CLASS_ALIAS,
75+
'modified' => $modified,
76+
'when' => $when
77+
];
5278
}
5379

5480
/**

0 commit comments

Comments
 (0)