Skip to content

Commit

Permalink
feat(settings): Migrate admin settings to vue
Browse files Browse the repository at this point in the history
Signed-off-by: Joas Schilling <coding@schilljs.com>
  • Loading branch information
nickvergessen committed Jun 22, 2023
1 parent b51a6c1 commit 3ebe05e
Show file tree
Hide file tree
Showing 4 changed files with 182 additions and 96 deletions.
26 changes: 16 additions & 10 deletions lib/Settings/Admin.php
Original file line number Diff line number Diff line change
Expand Up @@ -26,31 +26,37 @@
namespace OCA\AnnouncementCenter\Settings;

use OCP\AppFramework\Http\TemplateResponse;
use OCP\AppFramework\Services\IInitialState;
use OCP\IConfig;
use OCP\Settings\ISettings;
use OCP\Util;

class Admin implements ISettings {

/** @var IConfig */
protected $config;
/** @var IInitialState */
protected $initialState;

public function __construct(IConfig $config) {
public function __construct(IConfig $config, IInitialState $initialState) {
$this->config = $config;
$this->initialState = $initialState;
}

/**
* @return TemplateResponse
*/
public function getForm(): TemplateResponse {
$adminGroups = $this->config->getAppValue('announcementcenter', 'admin_groups', '["admin"]');
$adminGroups = implode('|', json_decode($adminGroups, true));
return new TemplateResponse('announcementcenter', 'admin', [
'adminGroups' => $adminGroups,
'createActivities' => $this->config->getAppValue('announcementcenter', 'create_activities', 'yes') === 'yes',
'createNotifications' => $this->config->getAppValue('announcementcenter', 'create_notifications', 'yes') === 'yes',
'sendEmails' => $this->config->getAppValue('announcementcenter', 'send_emails', 'yes') === 'yes',
'allowComments' => $this->config->getAppValue('announcementcenter', 'allow_comments', 'yes') === 'yes',
], 'blank');
$adminGroups = json_decode($this->config->getAppValue('announcementcenter', 'admin_groups', '["admin"]'), true);

$this->initialState->provideInitialState('admin_groups', $adminGroups);
$this->initialState->provideInitialState('create_activities', $this->config->getAppValue('announcementcenter', 'create_activities', 'yes') === 'yes');
$this->initialState->provideInitialState('create_notifications', $this->config->getAppValue('announcementcenter', 'create_notifications', 'yes') === 'yes');
$this->initialState->provideInitialState('send_emails', $this->config->getAppValue('announcementcenter', 'send_emails', 'yes') === 'yes');
$this->initialState->provideInitialState('allow_comments', $this->config->getAppValue('announcementcenter', 'allow_comments', 'yes') === 'yes');

Util::addScript('announcementcenter', 'announcementcenter-admin');
return new TemplateResponse('announcementcenter', 'admin', [], TemplateResponse::RENDER_AS_BLANK);
}

/**
Expand Down
137 changes: 137 additions & 0 deletions src/AdminSettings.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,137 @@
<!--
- @copyright Copyright (c) 2020 Joas Schilling <coding@schilljs.com>
-
- @author Joas Schilling <coding@schilljs.com>
-
- @license GNU AGPL version 3 or any later version
-
- This program is free software: you can redistribute it and/or modify
- it under the terms of the GNU Affero General Public License as
- published by the Free Software Foundation, either version 3 of the
- License, or (at your option) any later version.
-
- This program is distributed in the hope that it will be useful,
- but WITHOUT ANY WARRANTY; without even the implied warranty of
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- GNU Affero General Public License for more details.
-
- You should have received a copy of the GNU Affero General Public License
- along with this program. If not, see <http://www.gnu.org/licenses/>.
-->

<template>
<NcSettingsSection :title="t('announcementcenter', 'Announcements')">
<NcSettingsSelectGroup v-model="adminGroups"
:label="t('announcementcenter', 'These groups will be able to post announcements.')"
@input="updateGroups" />

<NcCheckboxRadioSwitch :checked="createActivities"
type="switch"
@update:checked="toggleCreateActivities">
{{ t('announcementcenter', 'Create activities by default') }}
</NcCheckboxRadioSwitch>
<NcCheckboxRadioSwitch :checked="createNotifications"
type="switch"
@update:checked="toggleCreateNotifications">
{{ t('announcementcenter', 'Create notifications by default') }}
</NcCheckboxRadioSwitch>
<NcCheckboxRadioSwitch :checked="sendEmails"
type="switch"
@update:checked="toggleSendEmails">
{{ t('announcementcenter', 'Send emails by default') }}
</NcCheckboxRadioSwitch>
<NcCheckboxRadioSwitch :checked="allowComments"
type="switch"
@update:checked="toggleAllowComments">
{{ t('announcementcenter', 'Allow comments by default') }}
</NcCheckboxRadioSwitch>
</NcSettingsSection>
</template>

<script>
import NcCheckboxRadioSwitch from '@nextcloud/vue/dist/Components/NcCheckboxRadioSwitch.js'
import NcSettingsSection from '@nextcloud/vue/dist/Components/NcSettingsSection.js'
import NcSettingsSelectGroup from '@nextcloud/vue/dist/Components/NcSettingsSelectGroup.js'
import { loadState } from '@nextcloud/initial-state'
import { showError, showSuccess } from '@nextcloud/dialogs'
export default {
name: 'AdminSettings',
components: {
NcCheckboxRadioSwitch,
NcSettingsSection,
NcSettingsSelectGroup,
},
data() {
return {
adminGroups: loadState('announcementcenter', 'admin_groups'),
createActivities: loadState('announcementcenter', 'create_activities'),
createNotifications: loadState('announcementcenter', 'create_notifications'),
sendEmails: loadState('announcementcenter', 'send_emails'),
allowComments: loadState('announcementcenter', 'allow_comments'),
}
},
methods: {
async toggleCreateActivities(config) {
OCP.AppConfig.setValue('announcementcenter', 'create_activities', (config ? 'yes' : 'no'), {
success: function() {
this.createActivities = config
showSuccess(t('announcementcenter', 'Setting changed'))
}.bind(this),
error() {
showError(t('announcementcenter', 'An error occurred while changing the setting'))
},
})
},
async toggleCreateNotifications(config) {
OCP.AppConfig.setValue('announcementcenter', 'create_notifications', (config ? 'yes' : 'no'), {
success: function() {
this.createNotifications = config
showSuccess(t('announcementcenter', 'Setting changed'))
}.bind(this),
error() {
showError(t('announcementcenter', 'An error occurred while changing the setting'))
},
})
},
async toggleSendEmails(config) {
OCP.AppConfig.setValue('announcementcenter', 'send_emails', (config ? 'yes' : 'no'), {
success: function() {
this.sendEmails = config
showSuccess(t('announcementcenter', 'Setting changed'))
}.bind(this),
error() {
showError(t('announcementcenter', 'An error occurred while changing the setting'))
},
})
},
async toggleAllowComments(config) {
OCP.AppConfig.setValue('announcementcenter', 'allow_comments', (config ? 'yes' : 'no'), {
success: function() {
this.allowComments = config
showSuccess(t('announcementcenter', 'Setting changed'))
}.bind(this),
error() {
showError(t('announcementcenter', 'An error occurred while changing the setting'))
},
})
},
async updateGroups(config) {
OCP.AppConfig.setValue('announcementcenter', 'admin_groups', JSON.stringify(config), {
success() {
showSuccess(t('announcementcenter', 'Setting changed'))
},
error() {
showError(t('announcementcenter', 'An error occurred while changing the setting'))
},
})
},
},
}
</script>

<style lang="scss" scoped>
</style>
40 changes: 28 additions & 12 deletions src/admin.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,18 +20,34 @@
*
*/

$(document).ready(function() {
const $announcementCenter = $('#announcementcenter')
const $adminGroup = $announcementCenter.find('.admin_groups')
import Vue from 'vue'
import { generateFilePath } from '@nextcloud/router'
import { getRequestToken } from '@nextcloud/auth'
import { translate, translatePlural } from '@nextcloud/l10n'
import store from './store/index.js'
import AdminSettings from './AdminSettings.vue'
import Vuex from 'vuex'

OC.Settings.setupGroupsSelect($adminGroup)
$adminGroup.change(function(event) {
let groups = event.val || ['admin']
groups = JSON.stringify(groups)
OCP.AppConfig.setValue('announcementcenter', 'admin_groups', groups)
})
// Styles
import '@nextcloud/dialogs/dist/index.css'

$announcementCenter.find('.checkbox').change(function() {
OCP.AppConfig.setValue('announcementcenter', $(this).attr('name'), (this.checked ? 'yes' : 'no'))
})
// eslint-disable-next-line
__webpack_nonce__ = btoa(getRequestToken())

// eslint-disable-next-line
__webpack_public_path__ = generateFilePath('announcementcenter', '', 'js/')

Vue.use(Vuex)

Vue.mixin({
methods: {
t: translate,
n: translatePlural,
},
})

export default new Vue({
el: '#announcementcenter',
store,
render: h => h(AdminSettings),
})
75 changes: 1 addition & 74 deletions templates/admin.php
Original file line number Diff line number Diff line change
@@ -1,74 +1 @@
<?php
/**
* @copyright Copyright (c) 2016, Joas Schilling <coding@schilljs.com>
*
* @author Joas Schilling <coding@schilljs.com>
*
* @license GNU AGPL version 3 or any later version
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*
*/

script('announcementcenter', 'announcementcenter-admin');

/** @var array $_ */
/** @var \OCP\IL10N $l */
?>
<div id="announcementcenter" class="section">
<h2 class="inlineblock"><?php p($l->t('Announcements')); ?></h2>

<p>
<input type="hidden" name="admin_groups" class="admin_groups" value="<?php p($_['adminGroups']) ?>" style="width: 320px;" />
<br />
<em><?php p($l->t('These groups will be able to post announcements.')); ?></em>
</p>
<br />

<p>
<input id="announcementcenter_create_activities" name="create_activities"
type="checkbox" class="checkbox" value="1"
<?php if ($_['createActivities']) {
print_unescaped('checked="checked"');
} ?> />
<label for="announcementcenter_create_activities"><?php p($l->t('Create activities by default'));?></label><br/>
</p>

<p>
<input id="announcementcenter_create_notifications" name="create_notifications"
type="checkbox" class="checkbox" value="1"
<?php if ($_['createNotifications']) {
print_unescaped('checked="checked"');
} ?> />
<label for="announcementcenter_create_notifications"><?php p($l->t('Create notifications by default'));?></label><br/>
</p>

<p>
<input id="announcementcenter_send_emails" name="send_emails"
type="checkbox" class="checkbox" value="1"
<?php if ($_['sendEmails']) {
print_unescaped('checked="checked"');
} ?> />
<label for="announcementcenter_send_emails"><?php p($l->t('Send emails by default'));?></label><br/>
</p>

<p>
<input id="announcementcenter_allow_comments" name="allow_comments"
type="checkbox" class="checkbox" value="1"
<?php if ($_['allowComments']) {
print_unescaped('checked="checked"');
} ?> />
<label for="announcementcenter_allow_comments"><?php p($l->t('Allow comments by default'));?></label><br/>
</p>
</div>
<div id="announcementcenter" class="section"></div>

0 comments on commit 3ebe05e

Please sign in to comment.