Adjust to new backend URLs

Signed-off-by: Julius Härtl <jus@bitgrid.net>
This commit is contained in:
Julius Härtl 2019-08-28 18:27:37 +02:00
parent 0f84696d10
commit aa00f401b3
No known key found for this signature in database
GPG Key ID: 4C614C6ED2CDE6DF
6 changed files with 62 additions and 37 deletions

View File

@ -48,7 +48,7 @@
this.currentOption = Checks[this.check.class] this.currentOption = Checks[this.check.class]
this.currentOperator = this.operators.find((operator) => operator.operator === this.check.operator) this.currentOperator = this.operators.find((operator) => operator.operator === this.check.operator)
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.checkSelector.$el.focus() //this.$refs.checkSelector.$el.focus()
}) })
}, },
computed: { computed: {

View File

@ -28,12 +28,15 @@
required: true required: true
} }
}, },
mounted() {
this.updateEvent(this.currentEvent)
},
computed: { computed: {
currentEvent() { currentEvent() {
if (typeof this.rule.event === 'undefined') { if (!this.rule.event) {
return this.allEvents.length > 0 ? this.allEvents[0] : null return this.allEvents.length > 0 ? this.allEvents[0] : null
} }
return this.allEvents.find(event => event.id === this.rule.event) return this.allEvents.find(event => event.entity === this.rule.entity && event.event === this.rule.event)
}, },
allEvents() { allEvents() {
return this.operation.events.map((entityEventName) => { return this.operation.events.map((entityEventName) => {
@ -45,7 +48,7 @@
return { return {
entity: entityId, entity: entityId,
id: entityEventName, id: entityEventName,
event: eventName, events: eventName,
name: Event.displayName, name: Event.displayName,
icon: Entity.icon, icon: Entity.icon,
checks: Entity.checks, checks: Entity.checks,
@ -58,8 +61,11 @@
}, },
methods: { methods: {
updateEvent(event) { updateEvent(event) {
this.$set(this.rule, 'event', event.id) if (this.rule.entity !== event.entity || this.rule.events !== '["' + event.event + '"]') {
this.$emit('update', this.rule) this.$set(this.rule, 'entity', event.entity)
this.$set(this.rule, 'event', event.event)
this.$emit('update', this.rule)
}
} }
} }
} }

View File

@ -71,6 +71,12 @@
} }
} }
.actions__item:not(.colored) {
.icon {
filter: invert(1);
}
}
/* TODO: those should be provided by the backend, remove once ready */ /* TODO: those should be provided by the backend, remove once ready */
.icon-block { .icon-block {
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' height='32' width='32' version='1.1' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' d='m10.203 2-8.203 8.203v11.594l8.203 8.203h11.594l8.203-8.203v-11.594l-8.203-8.203h-11.594zm11.097 5.3092 3.345 3.3448-5.346 5.346 5.346 5.346-3.299 3.299-5.346-5.346-5.346 5.346-3.2992-3.299 5.3462-5.346-5.3462-5.346 3.2992-3.2992 5.346 5.3462 5.3-5.3918z'/%3E%3C/svg%3E"); background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' height='32' width='32' version='1.1' viewBox='0 0 32 32'%3E%3Cpath fill='%23fff' d='m10.203 2-8.203 8.203v11.594l8.203 8.203h11.594l8.203-8.203v-11.594l-8.203-8.203h-11.594zm11.097 5.3092 3.345 3.3448-5.346 5.346 5.346 5.346-3.299 3.299-5.346-5.346-5.346 5.346-3.2992-3.299 5.3462-5.346-5.3462-5.346 3.2992-3.2992 5.346 5.3462 5.3-5.3918z'/%3E%3C/svg%3E");

View File

@ -1,5 +1,5 @@
<template> <template>
<div class="section rule"> <div class="section rule" :style="{ borderLeftColor: operation.color }">
<!-- TODO: icon-confirm --> <!-- TODO: icon-confirm -->
<div class="trigger icon-confirm"> <div class="trigger icon-confirm">
<p> <p>
@ -17,11 +17,11 @@
</div> </div>
<div class="action"> <div class="action">
<div class="buttons"> <div class="buttons">
<button class="status-button icon" :class="ruleStatus.class" v-tooltip="ruleStatus.tooltip" @click="saveRule">{{ ruleStatus.title }}</button>
<Actions> <Actions>
<ActionButton v-if="rule.id === -1" icon="icon-close" @click="$emit('cancel')">Cancel</ActionButton> <ActionButton v-if="rule.id === -1" icon="icon-close" @click="$emit('cancel')">Cancel rule creation</ActionButton>
<ActionButton v-else icon="icon-delete" @click="deleteRule">Delete</ActionButton> <ActionButton v-else icon="icon-close" @click="deleteRule">Remove rule</ActionButton>
</Actions> </Actions>
<button class="status-button icon" :class="ruleStatus.class" v-tooltip="ruleStatus.tooltip" @click="saveRule">{{ ruleStatus.title }}</button>
</div> </div>
<Operation :icon="operation.icon" :title="operation.title" :description="operation.description"> <Operation :icon="operation.icon" :title="operation.title" :description="operation.description">
<component v-if="operation.options" :is="operation.options" v-model="operation.operation" @input="updateOperation" /> <component v-if="operation.options" :is="operation.options" v-model="operation.operation" @input="updateOperation" />
@ -38,6 +38,7 @@
import { operationService } from '../services/Operation' import { operationService } from '../services/Operation'
import axios from 'nextcloud-axios' import axios from 'nextcloud-axios'
import confirmPassword from 'nextcloud-password-confirmation' import confirmPassword from 'nextcloud-password-confirmation'
import {getApiUrl} from '../helpers/api';
export default { export default {
name: 'Rule', name: 'Rule',
@ -69,7 +70,7 @@
}, },
ruleStatus() { ruleStatus() {
if (this.error) { if (this.error) {
return { title: 'Invalid', class: 'icon-close-white invalid', tooltip: { placement: 'bottom', show: true, content: escapeHTML(this.error.data) } } return { title: 'Invalid', class: 'icon-close-white invalid', tooltip: { placement: 'bottom', show: true, content: escapeHTML(this.error) } }
} }
if (!this.dirty || this.checking) { if (!this.dirty || this.checking) {
return { title: 'Active', class: 'icon icon-checkmark' } return { title: 'Active', class: 'icon icon-checkmark' }
@ -93,12 +94,13 @@
this.dirty = true this.dirty = true
} }
try { try {
let result = await axios.post(OC.generateUrl(`/apps/workflowengine/operations/test`), this.rule) // TODO: add new verify endpoint
//let result = await axios.post(OC.generateUrl(`/apps/workflowengine/operations/test`), this.rule)
this.error = null this.error = null
this.checking = false this.checking = false
} catch (e) { } catch (e) {
console.error('Failed to update operation') console.error('Failed to update operation', e)
this.error = e.response this.error = e.response.ocs.meta.message
this.checking = false this.checking = false
} }
}, },
@ -107,23 +109,24 @@
await confirmPassword() await confirmPassword()
let result let result
if (this.rule.id === -1) { if (this.rule.id === -1) {
result = await axios.post(OC.generateUrl(`/apps/workflowengine/operations`), this.rule) result = await axios.post(getApiUrl(''), {...this.rule, events: [this.rule.event]})
this.rule.id = result.id this.rule.id = result.data.ocs.data.id
} else { } else {
result = await axios.put(OC.generateUrl(`/apps/workflowengine/operations/${this.rule.id}`), this.rule) result = await axios.put(getApiUrl(`/${this.rule.id}`), {...this.rule, events: [this.rule.event]})
} }
this.$emit('update', result.data) this.$emit('update', this.rule)
this.dirty = false this.dirty = false
this.error = null this.error = null
} catch (e) { } catch (e) {
console.error('Failed to update operation') console.log(e.response.data.ocs.meta.message)
this.error = e.response console.error('Failed to update operation', e)
this.error = e.response.data.ocs.meta.message
} }
}, },
async deleteRule() { async deleteRule() {
try { try {
await confirmPassword() await confirmPassword()
await axios.delete(OC.generateUrl(`/apps/workflowengine/operations/${this.rule.id}`)) await axios.delete(getApiUrl(`/${this.rule.id}`))
this.$emit('delete') this.$emit('delete')
} catch (e) { } catch (e) {
console.error('Failed to delete operation') console.error('Failed to delete operation')
@ -164,17 +167,20 @@
.rule { .rule {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
border-left: 5px solid #fff;
.trigger, .action { .trigger, .action {
flex-grow: 1; flex-grow: 1;
min-height: 100px; min-height: 100px;
flex-basis: 50%; max-width: 700px;
} }
.action { .action {
position: relative; position: relative;
.buttons { .buttons {
position: absolute; position: absolute;
right: 0; right: 0;
display: flex;
z-index: 1;
} }
} }
.icon-confirm { .icon-confirm {

View File

@ -1,14 +1,15 @@
<template> <template>
<div> <div id="workflowengine">
<div class="section"> <div class="section">
<h2>{{ t('workflowengine', 'Workflows') }}</h2> <h2>{{ t('workflowengine', 'Workflows') }}</h2>
<div class="actions" v-if="!hasUnsavedRule"> <transition-group name="slide" tag="div" class="actions">
<Operation v-for="operation in getMainOperations" :key="operation.class" <Operation v-for="operation in getMainOperations" :key="operation.class"
:icon="operation.icon" :title="operation.title" :description="operation.description" :color="operation.color" :icon="operation.icon" :title="operation.title" :description="operation.description" :color="operation.color"
@click.native="createNewRule(operation)"></Operation> @click.native="createNewRule(operation)"></Operation>
</div> </transition-group>
<div class="actions__more" v-if="!hasUnsavedRule && hasMoreOperations">
<div class="actions__more" v-if="hasMoreOperations">
<button class="icon" :class="showMoreOperations ? 'icon-triangle-n' : 'icon-triangle-s'" <button class="icon" :class="showMoreOperations ? 'icon-triangle-n' : 'icon-triangle-s'"
@click="showMoreOperations=!showMoreOperations"> @click="showMoreOperations=!showMoreOperations">
{{ showMoreOperations ? t('workflowengine', 'Show less') : t('workflowengine', 'Show more') }} {{ showMoreOperations ? t('workflowengine', 'Show less') : t('workflowengine', 'Show more') }}
@ -16,7 +17,7 @@
</div> </div>
</div> </div>
<transition-group name="slide"> <transition-group name="slide" v-if="rules.length > 0">
<Rule v-for="rule in rules" :key="rule.id" :rule="rule" @delete="removeRule(rule)" @cancel="removeRule(rule)" @update="updateRule"></Rule> <Rule v-for="rule in rules" :key="rule.id" :rule="rule" @delete="removeRule(rule)" @cancel="removeRule(rule)" @update="updateRule"></Rule>
</transition-group> </transition-group>
@ -28,6 +29,7 @@
import Operation from './Operation' import Operation from './Operation'
import { operationService } from '../services/Operation' import { operationService } from '../services/Operation'
import axios from 'nextcloud-axios' import axios from 'nextcloud-axios'
import { getApiUrl } from '../helpers/api';
const ACTION_LIMIT = 3 const ACTION_LIMIT = 3
@ -38,11 +40,12 @@
Rule Rule
}, },
async mounted() { async mounted() {
const { data } = await axios.get(OC.generateUrl('/apps/workflowengine/operations')) const { data } = await axios.get(getApiUrl(''))
this.rules = data this.rules = Object.values(data.ocs.data).flat()
}, },
data() { data() {
return { return {
scope: OCP.InitialState.loadState('workflowengine', 'scope'),
operations: operationService, operations: operationService,
showMoreOperations: false, showMoreOperations: false,
rules: [] rules: []
@ -61,9 +64,6 @@
getMoreOperations() { getMoreOperations() {
return Object.values(this.operations.getAll()).slice(ACTION_LIMIT) return Object.values(this.operations.getAll()).slice(ACTION_LIMIT)
},
hasUnsavedRule() {
return !!this.rules.find((rule) => rule.id === -1)
} }
}, },
methods: { methods: {
@ -82,6 +82,8 @@
this.rules.unshift({ this.rules.unshift({
id: -1, id: -1,
class: operation.class, class: operation.class,
entity: undefined,
event: undefined,
name: '', // unused in the new ui, there for legacy reasons name: '', // unused in the new ui, there for legacy reasons
checks: [], checks: [],
operation: operation.operation || '' operation: operation.operation || ''
@ -92,16 +94,19 @@
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
#workflowengine {
border-bottom: 1px solid var(--color-border);
}
.section { .section {
max-width: 100vw; max-width: 100vw;
} }
.actions { .actions {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
max-width: 900px;
.actions__item { .actions__item {
max-width: 300px; max-width: 290px;
min-width: 200px; flex-basis: 250px;
flex-basis: 200px;
} }
} }
@ -145,5 +150,7 @@
.slide-enter, .slide-leave-to { .slide-enter, .slide-leave-to {
overflow: hidden; overflow: hidden;
max-height: 0; max-height: 0;
padding-top: 0;
padding-bottom: 0;
} }
</style> </style>

View File

@ -65,11 +65,11 @@ operationService.registerOperation({
icon: 'icon-block', icon: 'icon-block',
color: 'var(--color-error)', color: 'var(--color-error)',
entites: [ entites: [
'WorkflowEngine_Entity_File' 'OCA\\WorkflowEngine\\Entity\\File'
], ],
events: [ events: [
// TODO: this is probably handled differently since there is no regular event for files access control // TODO: this is probably handled differently since there is no regular event for files access control
'WorkflowEngine_Entity_File::postTouch' 'OCA\\WorkflowEngine\\Entity\\File::postTouch'
], ],
operation: 'deny' operation: 'deny'
}) })