Skip to content

Commit 5bf9529

Browse files
refact: More playing around
1 parent 07fd85a commit 5bf9529

File tree

3 files changed

+122
-28
lines changed

3 files changed

+122
-28
lines changed

panel/src/components/Dialogs/ChangesDialog.vue

Lines changed: 94 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,37 @@ 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+
},
79+
text: {
80+
type: "url"
81+
},
82+
type: {
83+
type: "tags",
84+
width: "6rem"
85+
},
86+
when: {
87+
type: "text",
88+
width: "10rem"
89+
},
90+
user: {
91+
width: "12rem",
92+
type: "text"
93+
}
94+
};
95+
},
96+
rows() {
97+
return this.items([...this.pages, ...this.files, ...this.users]);
98+
}
99+
},
70100
methods: {
71-
buttons(type) {
101+
buttons() {
72102
return [
73103
{
74104
icon: "undo",
@@ -83,10 +113,10 @@ export default {
83113
icon: "undo",
84114
text: this.$t("form.discard")
85115
},
86-
text: `Do you really want to discard all unsaved changes for ${type}?`
116+
text: `Do you really want to discard all unsaved changes?`
87117
},
88118
on: {
89-
submit: () => this.discardAll(type)
119+
submit: () => this.discardAll()
90120
}
91121
});
92122
}
@@ -103,10 +133,10 @@ export default {
103133
theme: "notice",
104134
text: "Save changes"
105135
},
106-
text: `Do you really want to save all unsaved changes for ${type}?`
136+
text: `Do you really want to save all unsaved changes?`
107137
},
108138
on: {
109-
submit: () => this.saveAll(type)
139+
submit: () => this.saveAll()
110140
}
111141
});
112142
}
@@ -121,17 +151,22 @@ export default {
121151
this.$panel.notification.error(e);
122152
}
123153
},
124-
async discardAll(type) {
154+
async discardAll() {
125155
try {
126-
await this.$panel.api.post("/changes/discard/" + type);
156+
await this.$panel.api.post("/changes/discard");
127157
this.$panel.dialog.close();
128158
this.$panel.dialog.refresh();
129159
} catch (e) {
130160
this.$panel.notification.error(e);
131161
}
132162
},
133163
items(items) {
134-
return items.map((item) => {
164+
items = items.map((item) => {
165+
item.text = {
166+
text: item.text,
167+
href: item.link
168+
};
169+
135170
item.options = [
136171
{
137172
icon: "undo",
@@ -154,6 +189,8 @@ export default {
154189
155190
return item;
156191
});
192+
193+
return this.$helper.array.sortBy(items, "modified desc");
157194
},
158195
preview(model) {
159196
this.$panel.view.open(model.link + "/preview/changes");
@@ -166,9 +203,9 @@ export default {
166203
this.$panel.notification.error(e);
167204
}
168205
},
169-
async saveAll(type) {
206+
async saveAll() {
170207
try {
171-
await this.$panel.api.post("/changes/publish/" + type);
208+
await this.$panel.api.post("/changes/publish");
172209
this.$panel.dialog.close();
173210
this.$panel.dialog.refresh();
174211
} catch (e) {
@@ -178,3 +215,33 @@ export default {
178215
}
179216
};
180217
</script>
218+
219+
<style>
220+
.k-changes-dialog {
221+
--dialog-padding: 0;
222+
max-height: 100%;
223+
}
224+
.k-changes-dialog-header {
225+
display: flex;
226+
align-items: center;
227+
justify-content: space-between;
228+
height: var(--height-xl);
229+
flex-shrink: 0;
230+
padding-inline: var(--spacing-3);
231+
border-bottom: 1px solid var(--color-gray-900);
232+
z-index: 1;
233+
}
234+
.k-changes-dialog-header .k-tabs {
235+
margin-bottom: 0px;
236+
}
237+
238+
.k-changes-dialog .k-dialog-body {
239+
--header-sticky-offset: 0;
240+
flex-grow: 1;
241+
overflow-y: scroll;
242+
overflow-x: hidden;
243+
}
244+
.k-changes-dialog .k-dialog-body .k-table th {
245+
border-radius: 0;
246+
}
247+
</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)