Skip to content

Commit 2ca7581

Browse files
taoermantaoerman
committed
fix some bugs
1 parent 1afeeea commit 2ca7581

2 files changed

Lines changed: 82 additions & 83 deletions

File tree

contentcuration/contentcuration/frontend/channelEdit/sidePanels/PublishModal.vue renamed to contentcuration/contentcuration/frontend/channelEdit/components/sidePanels/PublishSidePanel.vue

Lines changed: 72 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -1,90 +1,92 @@
11
<template>
22
<div>
3-
<!-- Publish Modal -->
4-
<VDialog
5-
v-model="showModal"
6-
max-width="600"
7-
persistent
3+
<SidePanelModal
4+
alignment="right"
5+
:ariaLabel="$tr('publishPanelAria')"
6+
@keyup.esc="onClose"
7+
@closePanel="onClose"
88
>
9-
<VCard>
10-
<VCardTitle class="headline">
11-
{{ getPanelTitle() }}
12-
</VCardTitle>
13-
14-
<VCardText>
15-
<div class="form-section">
16-
<VRadioGroup v-model="mode">
17-
<VRadio
18-
:label="$tr('modeLive')"
19-
value="live"
20-
/>
21-
<div class="radio-description">{{ getLiveModeDescription() }}</div>
9+
<template #header>
10+
<h2 style="margin: 0">{{ getPanelTitle() }}</h2>
11+
</template>
12+
13+
<template #default>
14+
<div class="form-section">
15+
<VRadioGroup v-model="mode">
16+
<VRadio
17+
:label="$tr('modeLive')"
18+
value="live"
19+
/>
20+
<div class="radio-description">{{ getLiveModeDescription() }}</div>
21+
22+
<!-- Live mode content nested under the radio button -->
23+
<div v-if="mode === 'live'" class="live-mode-content" style="margin-left: 24px; margin-top: 16px;">
24+
<div class="info-section">
25+
<VIconWrapper class="info-icon">info</VIconWrapper>
26+
<span>{{ $tr('publishingInfo', { version: currentChannel.version, time: formattedPublishTime }) }}</span>
27+
</div>
2228

23-
<!-- Live mode content nested under the radio button -->
24-
<div v-if="mode === 'live'" class="live-mode-content" style="margin-left: 24px; margin-top: 16px;">
25-
<div class="info-section">
26-
<VIconWrapper class="info-icon">info</VIconWrapper>
27-
<span>{{ $tr('publishingInfo', { version: currentChannel.version, time: formattedPublishTime }) }}</span>
28-
</div>
29-
30-
<div class="form-section">
31-
<label class="label">{{ $tr('versionNotesLabel') }}</label>
32-
<VTextarea
33-
:label="$tr('versionNotesLabel')"
34-
:rows="4"
35-
v-model="version_notes"
36-
:counter="30"
37-
:rules="[v => v.length <= 30 || $tr('maxLengthError')]"
38-
box
39-
/>
40-
</div>
41-
42-
<div v-if="incompleteResourcesCount > 0" class="form-section warning-section">
43-
<div class="warning-content">
44-
<VIconWrapper class="warning-icon">warning</VIconWrapper>
45-
<div class="warning-text">
46-
<div class="warning-title">{{ $tr('incompleteResourcesWarning', { count: incompleteResourcesCount }) }}</div>
47-
<div class="warning-description">{{ $tr('incompleteResourcesDescription') }}</div>
48-
</div>
29+
<div class="form-section">
30+
<label class="label">{{ $tr('versionNotesLabel') }}</label>
31+
<VTextarea
32+
:label="$tr('versionNotesLabel')"
33+
:rows="4"
34+
v-model="version_notes"
35+
:counter="30"
36+
:rules="[v => v.length <= 30 || $tr('maxLengthError')]"
37+
box
38+
/>
39+
</div>
40+
41+
<div v-if="incompleteResourcesCount > 0" class="form-section warning-section">
42+
<div class="warning-content">
43+
<VIconWrapper class="warning-icon">warning</VIconWrapper>
44+
<div class="warning-text">
45+
<div class="warning-title">{{ $tr('incompleteResourcesWarning', { count: incompleteResourcesCount }) }}</div>
46+
<div class="warning-description">{{ $tr('incompleteResourcesDescription') }}</div>
4947
</div>
5048
</div>
5149
</div>
52-
53-
<VRadio
54-
:label="$tr('modeDraft')"
55-
value="draft"
56-
/>
57-
<div class="radio-description">{{ $tr('modeDraftDescription') }}</div>
58-
</VRadioGroup>
59-
</div>
60-
</VCardText>
61-
62-
<VCardActions>
63-
<VSpacer />
64-
<VBtn flat @click="closeModal">{{ $tr('cancel') }}</VBtn>
50+
</div>
51+
52+
<VRadio
53+
:label="$tr('modeDraft')"
54+
value="draft"
55+
/>
56+
<div class="radio-description">{{ $tr('modeDraftDescription') }}</div>
57+
</VRadioGroup>
58+
</div>
59+
</template>
60+
61+
<template #bottomNavigation>
62+
<div class="footer">
63+
<VBtn flat @click="onClose">{{ $tr('cancel') }}</VBtn>
6564
<VBtn
6665
color="primary"
6766
:disabled="submitting"
6867
@click="submit"
6968
>
7069
{{ getButtonText() }}
7170
</VBtn>
72-
</VCardActions>
73-
</VCard>
74-
</VDialog>
71+
</div>
72+
</template>
73+
</SidePanelModal>
7574
</div>
7675
</template>
7776

7877
<script>
78+
import SidePanelModal from 'shared/views/SidePanelModal';
7979
import VIconWrapper from 'shared/views/VIconWrapper';
8080
import { Channel } from 'shared/data/resources';
8181
import { forceServerSync } from 'shared/data/serverSync';
82+
import { communityChannelsStrings } from 'shared/strings/communityChannelsStrings';
8283
8384
import { mapGetters } from 'vuex';
8485
8586
export default {
86-
name: 'PublishModal',
87+
name: 'PublishSidePanel',
8788
components: {
89+
SidePanelModal,
8890
VIconWrapper,
8991
},
9092
props: {
@@ -102,16 +104,6 @@ export default {
102104
computed: {
103105
...mapGetters('currentChannel', ['currentChannel']),
104106
...mapGetters('contentNode', ['getContentNode']),
105-
showModal: {
106-
get() {
107-
return this.open;
108-
},
109-
set(value) {
110-
if (!value) {
111-
this.$emit('close');
112-
}
113-
}
114-
},
115107
formattedPublishTime() {
116108
if (!this.currentChannel) return '';
117109
const now = new Date();
@@ -134,7 +126,7 @@ export default {
134126
},
135127
},
136128
methods: {
137-
closeModal() {
129+
onClose() {
138130
if (!this.submitting) this.$emit('close');
139131
},
140132
async submit() {
@@ -171,6 +163,7 @@ export default {
171163
$trs: {
172164
publishToLibrary: 'Publish to library',
173165
publishChannel: 'Publish channel',
166+
publishPanelAria: 'Publish channel side panel',
174167
publishLive: 'PUBLISH',
175168
saveDraft: 'SAVE DRAFT',
176169
modeLive: 'Live',
@@ -196,6 +189,12 @@ export default {
196189
font-weight: 600;
197190
margin-bottom: 6px;
198191
}
192+
.footer {
193+
display: flex;
194+
justify-content: flex-end;
195+
gap: 8px;
196+
padding: 12px 0;
197+
}
199198
.radio-description {
200199
margin-left: 24px;
201200
margin-bottom: 16px;
@@ -242,4 +241,4 @@ export default {
242241
color: #6c757d;
243242
line-height: 1.4;
244243
}
245-
</style>
244+
</style>

‎contentcuration/contentcuration/frontend/channelEdit/views/TreeView/TreeViewBase.vue‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -207,12 +207,12 @@
207207
/>
208208
<slot></slot>
209209

210-
<PublishModal
211-
v-if="showPublishModal && currentChannel && currentChannel.id"
212-
:open="showPublishModal"
210+
<PublishSidePanel
211+
v-if="showPublishSidePanel && currentChannel && currentChannel.id"
212+
:open="showPublishSidePanel"
213213
:channelId="currentChannel.id"
214-
@close="showPublishModal = false"
215-
@submitted="showPublishModal = false"
214+
@close="showPublishSidePanel = false"
215+
@submitted="showPublishSidePanel = false"
216216
/>
217217
<template v-if="isPublished">
218218
<ChannelTokenModal
@@ -331,15 +331,15 @@
331331
import DraggableRegion from 'shared/views/draggable/DraggableRegion';
332332
import { DropEffect } from 'shared/mixins/draggable/constants';
333333
import DraggablePlaceholder from 'shared/views/draggable/DraggablePlaceholder';
334-
import PublishModal from '../../sidePanels/PublishModal';
334+
import PublishSidePanel from '../../components/sidePanels/PublishSidePanel';
335335
336336
export default {
337337
name: 'TreeViewBase',
338338
components: {
339339
DraggableRegion,
340340
MainNavigationDrawer,
341341
ToolBar,
342-
PublishModal,
342+
PublishSidePanel,
343343
ProgressModal,
344344
ChannelTokenModal,
345345
SyncResourcesModal,
@@ -361,7 +361,7 @@
361361
data() {
362362
return {
363363
drawer: false,
364-
showPublishModal: false,
364+
showPublishSidePanel: false,
365365
showTokenModal: false,
366366
showSyncModal: false,
367367
showClipboard: false,
@@ -510,8 +510,8 @@
510510
},
511511
publishChannel() {
512512
console.log('publishChannel called, currentChannel:', this.currentChannel);
513-
console.log('Setting showPublishModal to true');
514-
this.showPublishModal = true;
513+
console.log('Setting showPublishSidePanel to true');
514+
this.showPublishSidePanel = true;
515515
this.trackClickEvent('Publish');
516516
},
517517
trackClickEvent(eventLabel) {

0 commit comments

Comments
 (0)