1
0

Cleanup code & make sure it has a common code style

This commit is contained in:
kolaente
2020-09-05 22:35:52 +02:00
parent 4a8b15e7be
commit a8a7f70a3c
132 changed files with 6821 additions and 6595 deletions

View File

@ -21,7 +21,7 @@
</div>
</div>
<div class="control">
<button type="submit" class="button is-success">
<button class="button is-success" type="submit">
Share
</button>
</div>
@ -36,61 +36,62 @@
<th>Delete</th>
</tr>
<template v-if="linkShares.length > 0">
<tr v-for="s in linkShares" :key="s.id">
<td>
<div class="field has-addons">
<div class="control">
<input class="input" type="text" :value="getShareLink(s.hash)" readonly/>
</div>
<div class="control">
<a class="button is-success noshadow" @click="copy(getShareLink(s.hash))">
<tr :key="s.id" v-for="s in linkShares">
<td>
<div class="field has-addons">
<div class="control">
<input :value="getShareLink(s.hash)" class="input" readonly type="text"/>
</div>
<div class="control">
<a @click="copy(getShareLink(s.hash))" class="button is-success noshadow">
<span class="icon">
<icon icon="paste"/>
</span>
</a>
</a>
</div>
</div>
</div>
</td>
<td>
{{ s.sharedBy.username }}
</td>
<td class="type">
<template v-if="s.right === rights.ADMIN">
</td>
<td>
{{ s.sharedBy.username }}
</td>
<td class="type">
<template v-if="s.right === rights.ADMIN">
<span class="icon is-small">
<icon icon="lock"/>
</span>
Admin
</template>
<template v-else-if="s.right === rights.READ_WRITE">
Admin
</template>
<template v-else-if="s.right === rights.READ_WRITE">
<span class="icon is-small">
<icon icon="pen"/>
</span>
Write
</template>
<template v-else>
Write
</template>
<template v-else>
<span class="icon is-small">
<icon icon="users"/>
</span>
Read-only
</template>
</td>
<td class="actions">
<button @click="() => {linkIdToDelete = s.id; showDeleteModal = true}" class="button is-danger icon-only">
Read-only
</template>
</td>
<td class="actions">
<button @click="() => {linkIdToDelete = s.id; showDeleteModal = true}"
class="button is-danger icon-only">
<span class="icon">
<icon icon="trash-alt"/>
</span>
</button>
</td>
</tr>
</button>
</td>
</tr>
</template>
</tbody>
</table>
</div>
<modal
v-if="showDeleteModal"
@close="showDeleteModal = false"
@submit="remove()">
@close="showDeleteModal = false"
@submit="remove()"
v-if="showDeleteModal">
<span slot="header">Remove a link share</span>
<p slot="text">Are you sure you want to remove this link share?<br/>
It will no longer be possible to access this list with this link share.<br/>
@ -100,95 +101,95 @@
</template>
<script>
import rights from '../../models/rights'
import rights from '../../models/rights'
import LinkShareService from '../../services/linkShare'
import LinkShareModel from '../../models/linkShare'
import LinkShareService from '../../services/linkShare'
import LinkShareModel from '../../models/linkShare'
import copy from 'copy-to-clipboard'
import {mapState} from 'vuex'
import copy from 'copy-to-clipboard'
import {mapState} from 'vuex'
export default {
name: 'linkSharing',
props: {
listId: {
default: 0,
required: true,
},
export default {
name: 'linkSharing',
props: {
listId: {
default: 0,
required: true,
},
data() {
return {
linkShares: [],
linkShareService: LinkShareService,
newLinkShare: LinkShareModel,
rights: rights,
selectedRight: rights.READ,
showDeleteModal: false,
linkIdToDelete: 0,
}
},
beforeMount() {
this.linkShareService = new LinkShareService()
},
created() {
this.linkShareService = new LinkShareService()
},
data() {
return {
linkShares: [],
linkShareService: LinkShareService,
newLinkShare: LinkShareModel,
rights: rights,
selectedRight: rights.READ,
showDeleteModal: false,
linkIdToDelete: 0,
}
},
beforeMount() {
this.linkShareService = new LinkShareService()
},
created() {
this.linkShareService = new LinkShareService()
this.load()
},
watch: {
listId: () => { // watch it
this.load()
},
watch: {
listId: () => { // watch it
this.load()
},
computed: mapState({
frontendUrl: state => state.config.frontendUrl,
}),
methods: {
load() {
// If listId == 0 the list on the calling component wasn't already loaded, so we just bail out here
if (this.listId === 0) {
return
}
},
computed: mapState({
frontendUrl: state => state.config.frontendUrl,
}),
methods: {
load() {
// If listId == 0 the list on the calling component wasn't already loaded, so we just bail out here
if (this.listId === 0) {
return
}
this.linkShareService.getAll({listId: this.listId})
.then(r => {
this.linkShares = r
})
.catch(e => {
this.error(e, this)
})
},
add() {
let newLinkShare = new LinkShareModel({right: this.selectedRight, listId: this.listId})
this.linkShareService.create(newLinkShare)
.then(() => {
this.selectedRight = rights.READ
this.success({message: 'The link share was successfully created'}, this)
this.load()
})
.catch(e => {
this.error(e, this)
})
},
remove() {
let linkshare = new LinkShareModel({id: this.linkIdToDelete, listId: this.listId})
this.linkShareService.delete(linkshare)
.then(() => {
this.success({message: 'The link share was successfully deleted'}, this)
this.load()
})
.catch(e => {
this.error(e, this)
})
.finally(() => {
this.showDeleteModal = false
})
},
copy(text) {
copy(text)
},
getShareLink(hash) {
return this.frontendUrl + 'share/' + hash + '/auth'
},
this.linkShareService.getAll({listId: this.listId})
.then(r => {
this.linkShares = r
})
.catch(e => {
this.error(e, this)
})
},
}
add() {
let newLinkShare = new LinkShareModel({right: this.selectedRight, listId: this.listId})
this.linkShareService.create(newLinkShare)
.then(() => {
this.selectedRight = rights.READ
this.success({message: 'The link share was successfully created'}, this)
this.load()
})
.catch(e => {
this.error(e, this)
})
},
remove() {
let linkshare = new LinkShareModel({id: this.linkIdToDelete, listId: this.listId})
this.linkShareService.delete(linkshare)
.then(() => {
this.success({message: 'The link share was successfully deleted'}, this)
this.load()
})
.catch(e => {
this.error(e, this)
})
.finally(() => {
this.showDeleteModal = false
})
},
copy(text) {
copy(text)
},
getShareLink(hash) {
return this.frontendUrl + 'share/' + hash + '/auth'
},
},
}
</script>

View File

@ -2,7 +2,7 @@
<div class="card is-fullwidth">
<header class="card-header">
<p class="card-header-title">
Shared with these {{shareType}}s
Shared with these {{ shareType }}s
</p>
</header>
<div class="card-content content sharables-list">
@ -10,25 +10,30 @@
<div class="field is-grouped">
<p class="control is-expanded" v-bind:class="{ 'is-loading': searchService.loading}">
<multiselect
v-model="sharable"
:options="found"
:multiple="false"
:searchable="true"
:loading="searchService.loading"
:internal-search="true"
@search-change="find"
placeholder="Type to search..."
:showNoOptions="false"
:label="searchLabel"
track-by="id">
:internal-search="true"
:label="searchLabel"
:loading="searchService.loading"
:multiple="false"
:options="found"
:searchable="true"
:showNoOptions="false"
@search-change="find"
placeholder="Type to search..."
track-by="id"
v-model="sharable">
<template slot="clear" slot-scope="props">
<div class="multiselect__clear" v-if="sharable.id !== 0" @mousedown.prevent.stop="clearAll(props.search)"></div>
<div
@mousedown.prevent.stop="clearAll(props.search)"
class="multiselect__clear"
v-if="sharable.id !== 0"></div>
</template>
<span slot="noResult">Oops! No {{shareType}} found. Consider changing the search query.</span>
<span slot="noResult">
Oops! No {{ shareType }} found. Consider changing the search query.
</span>
</multiselect>
</p>
<p class="control">
<button type="submit" class="button is-success">
<button class="button is-success" type="submit">
<span class="icon is-small">
<icon icon="plus"/>
</span>
@ -39,9 +44,9 @@
</form>
<table class="table is-striped is-hoverable is-fullwidth">
<tbody>
<tr v-for="s in sharables" :key="s.id">
<tr :key="s.id" v-for="s in sharables">
<template v-if="shareType === 'user'">
<td>{{s.username}}</td>
<td>{{ s.username }}</td>
<td>
<template v-if="s.id === userInfo.id">
<b class="is-success">You</b>
@ -51,7 +56,7 @@
<template v-if="shareType === 'team'">
<td>
<router-link :to="{name: 'teams.edit', params: {id: s.id}}">
{{s.name}}
{{ s.name }}
</router-link>
</td>
</template>
@ -77,13 +82,16 @@
</td>
<td class="actions" v-if="userIsAdmin">
<div class="select">
<select @change="toggleType(s)" v-model="selectedRight[s.id]" class="button buttonright">
<option :value="rights.READ" :selected="s.right === rights.READ">Read only</option>
<option :value="rights.READ_WRITE" :selected="s.right === rights.READ_WRITE">Read & write</option>
<option :value="rights.ADMIN" :selected="s.right === rights.ADMIN">Admin</option>
<select @change="toggleType(s)" class="button buttonright" v-model="selectedRight[s.id]">
<option :selected="s.right === rights.READ" :value="rights.READ">Read only</option>
<option :selected="s.right === rights.READ_WRITE" :value="rights.READ_WRITE">Read &
write
</option>
<option :selected="s.right === rights.ADMIN" :value="rights.ADMIN">Admin</option>
</select>
</div>
<button @click="() => {sharable = s; showDeleteModal = true}" class="button is-danger icon-only">
<button @click="() => {sharable = s; showDeleteModal = true}"
class="button is-danger icon-only">
<span class="icon is-small">
<icon icon="trash-alt"/>
</span>
@ -95,234 +103,233 @@
</div>
<modal
v-if="showDeleteModal"
@close="showDeleteModal = false"
@submit="deleteSharable()">
<span slot="header">Remove a {{shareType}} from the {{typeString}}</span>
<p slot="text">Are you sure you want to remove this {{shareType}} from the {{typeString}}?<br/>
@close="showDeleteModal = false"
@submit="deleteSharable()"
v-if="showDeleteModal">
<span slot="header">Remove a {{ shareType }} from the {{ typeString }}</span>
<p slot="text">Are you sure you want to remove this {{ shareType }} from the {{ typeString }}?<br/>
<b>This CANNOT BE UNDONE!</b></p>
</modal>
</div>
</template>
<script>
import {mapState} from 'vuex'
import {mapState} from 'vuex'
import UserNamespaceService from '../../services/userNamespace'
import UserNamespaceModel from '../../models/userNamespace'
import UserListModel from '../../models/userList'
import UserListService from '../../services/userList'
import UserService from '../../services/user'
import UserModel from '../../models/user'
import UserNamespaceService from '../../services/userNamespace'
import UserNamespaceModel from '../../models/userNamespace'
import UserListModel from '../../models/userList'
import UserListService from '../../services/userList'
import UserService from '../../services/user'
import UserModel from '../../models/user'
import TeamNamespaceService from '../../services/teamNamespace'
import TeamNamespaceModel from '../../models/teamNamespace'
import TeamListModel from '../../models/teamList'
import TeamListService from '../../services/teamList'
import TeamService from '../../services/team'
import TeamModel from '../../models/team'
import TeamNamespaceService from '../../services/teamNamespace'
import TeamNamespaceModel from '../../models/teamNamespace'
import TeamListModel from '../../models/teamList'
import TeamListService from '../../services/teamList'
import TeamService from '../../services/team'
import TeamModel from '../../models/team'
import rights from '../../models/rights'
import LoadingComponent from '../misc/loading'
import ErrorComponent from '../misc/error'
import rights from '../../models/rights'
import LoadingComponent from '../misc/loading'
import ErrorComponent from '../misc/error'
export default {
name: 'userTeamShare',
props: {
type: {
type: String,
default: '',
},
shareType: {
type: String,
default: '',
},
id: {
type: Number,
default: 0,
},
userIsAdmin: {
type: Boolean,
default: false,
},
export default {
name: 'userTeamShare',
props: {
type: {
type: String,
default: '',
},
data() {
return {
stuffService: Object, // This user service is either a userNamespaceService or a userListService, depending on the type we are using
stuffModel: Object,
searchService: Object,
sharable: Object,
found: [],
searchLabel: '',
rights: rights,
selectedRight: {},
typeString: '',
sharables: [], // This holds either teams or users who this namepace or list is shared with
showDeleteModal: false,
}
shareType: {
type: String,
default: '',
},
components: {
multiselect: () => ({
component: import(/* webpackPrefetch: true *//* webpackChunkName: "multiselect" */ 'vue-multiselect'),
loading: LoadingComponent,
error: ErrorComponent,
timeout: 60000,
}),
id: {
type: Number,
default: 0,
},
computed: mapState({
userInfo: state => state.auth.info
userIsAdmin: {
type: Boolean,
default: false,
},
},
data() {
return {
stuffService: Object, // This user service is either a userNamespaceService or a userListService, depending on the type we are using
stuffModel: Object,
searchService: Object,
sharable: Object,
found: [],
searchLabel: '',
rights: rights,
selectedRight: {},
typeString: '',
sharables: [], // This holds either teams or users who this namepace or list is shared with
showDeleteModal: false,
}
},
components: {
multiselect: () => ({
component: import(/* webpackPrefetch: true *//* webpackChunkName: "multiselect" */ 'vue-multiselect'),
loading: LoadingComponent,
error: ErrorComponent,
timeout: 60000,
}),
created() {
},
computed: mapState({
userInfo: state => state.auth.info,
}),
created() {
if (this.shareType === 'user') {
this.searchService = new UserService()
this.sharable = new UserModel()
this.searchLabel = 'username'
if (this.type === 'list') {
this.typeString = `list`
this.stuffService = new UserListService()
this.stuffModel = new UserListModel({listId: this.id})
} else if (this.type === 'namespace') {
this.typeString = `namespace`
this.stuffService = new UserNamespaceService()
this.stuffModel = new UserNamespaceModel({namespaceId: this.id})
} else {
throw new Error('Unknown type: ' + this.type)
}
} else if (this.shareType === 'team') {
this.searchService = new TeamService()
this.sharable = new TeamModel()
this.searchLabel = 'name'
if (this.type === 'list') {
this.typeString = `list`
this.stuffService = new TeamListService()
this.stuffModel = new TeamListModel({listId: this.id})
} else if (this.type === 'namespace') {
this.typeString = `namespace`
this.stuffService = new TeamNamespaceService()
this.stuffModel = new TeamNamespaceModel({namespaceId: this.id})
} else {
throw new Error('Unknown type: ' + this.type)
}
} else {
throw new Error('Unkown share type')
}
this.load()
},
methods: {
load() {
this.stuffService.getAll(this.stuffModel)
.then(r => {
this.$set(this, 'sharables', r)
r.forEach(s => this.$set(this.selectedRight, s.id, s.right))
})
.catch(e => {
this.error(e, this)
})
},
deleteSharable() {
if (this.shareType === 'user') {
this.searchService = new UserService()
this.sharable = new UserModel()
this.searchLabel = 'username'
if (this.type === 'list') {
this.typeString = `list`
this.stuffService = new UserListService()
this.stuffModel = new UserListModel({listId: this.id})
} else if (this.type === 'namespace') {
this.typeString = `namespace`
this.stuffService = new UserNamespaceService()
this.stuffModel = new UserNamespaceModel({namespaceId: this.id})
} else {
throw new Error('Unknown type: ' + this.type)
}
this.stuffModel.userId = this.sharable.username
} else if (this.shareType === 'team') {
this.stuffModel.teamId = this.sharable.id
}
else if (this.shareType === 'team') {
this.searchService = new TeamService()
this.sharable = new TeamModel()
this.searchLabel = 'name'
if (this.type === 'list') {
this.typeString = `list`
this.stuffService = new TeamListService()
this.stuffModel = new TeamListModel({listId: this.id})
} else if (this.type === 'namespace') {
this.typeString = `namespace`
this.stuffService = new TeamNamespaceService()
this.stuffModel = new TeamNamespaceModel({namespaceId: this.id})
} else {
throw new Error('Unknown type: ' + this.type)
}
} else {
throw new Error('Unkown share type')
}
this.load()
this.stuffService.delete(this.stuffModel)
.then(() => {
this.showDeleteModal = false
for (const i in this.sharables) {
if (
(this.sharables[i].id === this.stuffModel.userId && this.shareType === 'user') ||
(this.sharables[i].id === this.stuffModel.teamId && this.shareType === 'team')
) {
this.sharables.splice(i, 1)
}
}
this.success({message: 'The ' + this.shareType + ' was successfully deleted from the ' + this.typeString + '.'}, this)
})
.catch(e => {
this.error(e, this)
})
},
methods: {
load() {
this.stuffService.getAll(this.stuffModel)
.then(r => {
this.$set(this, 'sharables', r)
r.forEach(s => this.$set(this.selectedRight, s.id, s.right))
})
.catch(e => {
this.error(e, this)
})
},
deleteSharable() {
add(admin) {
if (admin === null) {
admin = false
}
this.stuffModel.right = rights.READ
if (admin) {
this.stuffModel.right = rights.ADMIN
}
if (this.shareType === 'user') {
this.stuffModel.userId = this.sharable.username
} else if (this.shareType === 'team') {
this.stuffModel.teamId = this.sharable.id
}
this.stuffService.delete(this.stuffModel)
.then(() => {
this.showDeleteModal = false
for (const i in this.sharables) {
if (
(this.sharables[i].id === this.stuffModel.userId && this.shareType === 'user') ||
(this.sharables[i].id === this.stuffModel.teamId && this.shareType === 'team')
) {
this.sharables.splice(i, 1)
}
if (this.shareType === 'user') {
this.stuffModel.userId = this.sharable.username
} else if (this.shareType === 'team') {
this.stuffModel.teamId = this.sharable.id
}
this.stuffService.create(this.stuffModel)
.then(() => {
this.success({message: 'The ' + this.shareType + ' was successfully added.'}, this)
this.load()
})
.catch(e => {
this.error(e, this)
})
},
toggleType(sharable) {
if (this.selectedRight[sharable.id] !== rights.ADMIN &&
this.selectedRight[sharable.id] !== rights.READ &&
this.selectedRight[sharable.id] !== rights.READ_WRITE
) {
this.selectedRight[sharable.id] = rights.READ
}
this.stuffModel.right = this.selectedRight[sharable.id]
if (this.shareType === 'user') {
this.stuffModel.userId = sharable.username
} else if (this.shareType === 'team') {
this.stuffModel.teamId = sharable.id
}
this.stuffService.update(this.stuffModel)
.then(r => {
for (const i in this.sharables) {
if (
(this.sharables[i].username === this.stuffModel.userId && this.shareType === 'user') ||
(this.sharables[i].id === this.stuffModel.teamId && this.shareType === 'team')
) {
this.$set(this.sharables[i], 'right', r.right)
}
this.success({message: 'The ' + this.shareType + ' was successfully deleted from the ' + this.typeString + '.'}, this)
})
.catch(e => {
this.error(e, this)
})
},
add(admin) {
if(admin === null) {
admin = false
}
this.stuffModel.right = rights.READ
if (admin) {
this.stuffModel.right = rights.ADMIN
}
if (this.shareType === 'user') {
this.stuffModel.userId = this.sharable.username
} else if (this.shareType === 'team') {
this.stuffModel.teamId = this.sharable.id
}
this.stuffService.create(this.stuffModel)
.then(() => {
this.success({message: 'The ' + this.shareType + ' was successfully added.'}, this)
this.load()
})
.catch(e => {
this.error(e, this)
})
},
toggleType(sharable) {
if (this.selectedRight[sharable.id] !== rights.ADMIN &&
this.selectedRight[sharable.id] !== rights.READ &&
this.selectedRight[sharable.id] !== rights.READ_WRITE
) {
this.selectedRight[sharable.id] = rights.READ
}
this.stuffModel.right = this.selectedRight[sharable.id]
if (this.shareType === 'user') {
this.stuffModel.userId = sharable.username
} else if (this.shareType === 'team') {
this.stuffModel.teamId = sharable.id
}
this.stuffService.update(this.stuffModel)
.then(r => {
for (const i in this.sharables) {
if (
(this.sharables[i].username === this.stuffModel.userId && this.shareType === 'user') ||
(this.sharables[i].id === this.stuffModel.teamId && this.shareType === 'team')
) {
this.$set(this.sharables[i], 'right', r.right)
}
}
this.success({message: 'The ' + this.shareType + ' right was successfully updated.'}, this)
})
.catch(e => {
this.error(e, this)
})
},
find(query) {
if(query === '') {
this.$set(this, 'found', [])
return
}
this.searchService.getAll({}, {s: query})
.then(response => {
this.$set(this, 'found', response)
})
.catch(e => {
this.error(e, this)
})
},
clearAll () {
}
this.success({message: 'The ' + this.shareType + ' right was successfully updated.'}, this)
})
.catch(e => {
this.error(e, this)
})
},
find(query) {
if (query === '') {
this.$set(this, 'found', [])
},
return
}
this.searchService.getAll({}, {s: query})
.then(response => {
this.$set(this, 'found', response)
})
.catch(e => {
this.error(e, this)
})
},
}
clearAll() {
this.$set(this, 'found', [])
},
},
}
</script>