Ensure consistent naming of title fields (#134)

Merge branch 'master' into fix/title-fields

Change task text field to title

Change namespace name field to title

Co-authored-by: kolaente <k@knt.li>
Reviewed-on: vikunja/frontend#134
This commit is contained in:
konrad 2020-05-16 10:31:16 +00:00
parent c4b92a8f52
commit d7b4b2189a
11 changed files with 66 additions and 38 deletions

View File

@ -120,17 +120,17 @@
<icon icon="cog"/> <icon icon="cog"/>
</span> </span>
</router-link> </router-link>
<router-link v-tooltip="'Add a new list in the ' + n.name + ' namespace'" <router-link v-tooltip="'Add a new list in the ' + n.title + ' namespace'"
:to="{ name: 'newList', params: { id: n.id} }" class="nsettings" :to="{ name: 'newList', params: { id: n.id} }" class="nsettings"
:key="n.id + 'newList'" v-if="n.id > 0"> :key="n.id + 'newList'" v-if="n.id > 0">
<span class="icon"> <span class="icon">
<icon icon="plus"/> <icon icon="plus"/>
</span> </span>
</router-link> </router-link>
<label class="menu-label" v-tooltip="n.name + ' (' + n.lists.length + ')'" :for="n.id + 'checker'"> <label class="menu-label" v-tooltip="n.title + ' (' + n.lists.length + ')'" :for="n.id + 'checker'">
<span class="name"> <span class="name">
<span class="color-bubble" v-if="n.hexColor !== ''" :style="{ backgroundColor: n.hexColor }"></span> <span class="color-bubble" v-if="n.hexColor !== ''" :style="{ backgroundColor: n.hexColor }"></span>
{{n.name}} ({{n.lists.length}}) {{n.title}} ({{n.lists.length}})
</span> </span>
<span class="is-archived" v-if="n.isArchived"> <span class="is-archived" v-if="n.isArchived">
Archived Archived

View File

@ -71,7 +71,7 @@
{{ formatDateSince(task.dueDate) }} {{ formatDateSince(task.dueDate) }}
</span> </span>
</span> </span>
<h3>{{ task.text }}</h3> <h3>{{ task.title }}</h3>
<labels :labels="task.labels"/> <labels :labels="task.labels"/>
<div class="footer"> <div class="footer">
<div class="items"> <div class="items">
@ -348,7 +348,7 @@
const bi = bucketIndex() const bi = bucketIndex()
const task = new TaskModel({text: this.newTaskText, bucketId: this.buckets[bi].id, listId: this.$route.params.listId}) const task = new TaskModel({title: this.newTaskText, bucketId: this.buckets[bi].id, listId: this.$route.params.listId})
this.taskService.create(task) this.taskService.create(task)
.then(r => { .then(r => {

View File

@ -151,7 +151,7 @@
} }
this.showError = false this.showError = false
let task = new TaskModel({text: this.newTaskText, listId: this.$route.params.listId}) let task = new TaskModel({title: this.newTaskText, listId: this.$route.params.listId})
this.taskService.create(task) this.taskService.create(task)
.then(r => { .then(r => {
this.tasks.push(r) this.tasks.push(r)

View File

@ -12,7 +12,7 @@
<div class="card-content"> <div class="card-content">
<fancycheckbox @change="saveTaskColumns" v-model="activeColumns.id">#</fancycheckbox> <fancycheckbox @change="saveTaskColumns" v-model="activeColumns.id">#</fancycheckbox>
<fancycheckbox @change="saveTaskColumns" v-model="activeColumns.done">Done</fancycheckbox> <fancycheckbox @change="saveTaskColumns" v-model="activeColumns.done">Done</fancycheckbox>
<fancycheckbox @change="saveTaskColumns" v-model="activeColumns.text">Name</fancycheckbox> <fancycheckbox @change="saveTaskColumns" v-model="activeColumns.title">Title</fancycheckbox>
<fancycheckbox @change="saveTaskColumns" v-model="activeColumns.priority">Priority</fancycheckbox> <fancycheckbox @change="saveTaskColumns" v-model="activeColumns.priority">Priority</fancycheckbox>
<fancycheckbox @change="saveTaskColumns" v-model="activeColumns.labels">Labels</fancycheckbox> <fancycheckbox @change="saveTaskColumns" v-model="activeColumns.labels">Labels</fancycheckbox>
<fancycheckbox @change="saveTaskColumns" v-model="activeColumns.assignees">Assignees</fancycheckbox> <fancycheckbox @change="saveTaskColumns" v-model="activeColumns.assignees">Assignees</fancycheckbox>
@ -39,9 +39,9 @@
Done Done
<sort :order="sortBy.done" @click="sort('done')"/> <sort :order="sortBy.done" @click="sort('done')"/>
</th> </th>
<th v-if="activeColumns.text"> <th v-if="activeColumns.title">
Name Name
<sort :order="sortBy.text" @click="sort('text')"/> <sort :order="sortBy.title" @click="sort('title')"/>
</th> </th>
<th v-if="activeColumns.priority"> <th v-if="activeColumns.priority">
Priority Priority
@ -90,8 +90,8 @@
<td v-if="activeColumns.done"> <td v-if="activeColumns.done">
<div class="is-done" v-if="t.done">Done</div> <div class="is-done" v-if="t.done">Done</div>
</td> </td>
<td v-if="activeColumns.text"> <td v-if="activeColumns.title">
<router-link :to="{name: 'task.detail', params: { id: t.id }}">{{ t.text }}</router-link> <router-link :to="{name: 'task.detail', params: { id: t.id }}">{{ t.title }}</router-link>
</td> </td>
<td v-if="activeColumns.priority"> <td v-if="activeColumns.priority">
<priority-label :priority="t.priority" :show-all="true"/> <priority-label :priority="t.priority" :show-all="true"/>
@ -174,7 +174,7 @@
activeColumns: { activeColumns: {
id: true, id: true,
done: true, done: true,
text: true, title: true,
priority: false, priority: false,
labels: true, labels: true,
assignees: true, assignees: true,

View File

@ -12,23 +12,39 @@
</header> </header>
<div class="card-content"> <div class="card-content">
<div class="content"> <div class="content">
<form @submit.prevent="submit()"> <form @submit.prevent="submit()">
<div class="field"> <div class="field">
<label class="label" for="namespacetext">Namespace Name</label> <label class="label" for="namespacetext">Namespace Name</label>
<div class="control"> <div class="control">
<input v-focus :class="{ 'disabled': namespaceService.loading}" :disabled="namespaceService.loading" class="input" type="text" id="namespacetext" placeholder="The namespace text is here..." v-model="namespace.name"> <input
v-focus
:class="{ 'disabled': namespaceService.loading}"
:disabled="namespaceService.loading"
class="input"
type="text"
id="namespacetext"
placeholder="The namespace text is here..."
v-model="namespace.title"/>
</div> </div>
</div> </div>
<div class="field"> <div class="field">
<label class="label" for="namespacedescription">Description</label> <label class="label" for="namespacedescription">Description</label>
<div class="control"> <div class="control">
<textarea :class="{ 'disabled': namespaceService.loading}" :disabled="namespaceService.loading" class="textarea" placeholder="The namespaces description goes here..." id="namespacedescription" v-model="namespace.description"></textarea> <textarea
:class="{ 'disabled': namespaceService.loading}"
:disabled="namespaceService.loading"
class="textarea"
placeholder="The namespaces description goes here..."
id="namespacedescription"
v-model="namespace.description"></textarea>
</div> </div>
</div> </div>
<div class="field"> <div class="field">
<label class="label" for="isArchivedCheck">Is Archived</label> <label class="label" for="isArchivedCheck">Is Archived</label>
<div class="control"> <div class="control">
<fancycheckbox v-model="namespace.isArchived" v-tooltip="'If a namespace is archived, you cannot create new lists or edit it.'"> <fancycheckbox
v-model="namespace.isArchived"
v-tooltip="'If a namespace is archived, you cannot create new lists or edit it.'">
This namespace is archived This namespace is archived
</fancycheckbox> </fancycheckbox>
</div> </div>
@ -49,12 +65,14 @@
<div class="columns bigbuttons"> <div class="columns bigbuttons">
<div class="column"> <div class="column">
<button @click="submit()" class="button is-primary is-fullwidth" :class="{ 'is-loading': namespaceService.loading}"> <button @click="submit()" class="button is-primary is-fullwidth"
:class="{ 'is-loading': namespaceService.loading}">
Save Save
</button> </button>
</div> </div>
<div class="column is-1"> <div class="column is-1">
<button @click="showDeleteModal = true" class="button is-danger is-fullwidth" :class="{ 'is-loading': namespaceService.loading}"> <button @click="showDeleteModal = true" class="button is-danger is-fullwidth"
:class="{ 'is-loading': namespaceService.loading}">
<span class="icon is-small"> <span class="icon is-small">
<icon icon="trash-alt"/> <icon icon="trash-alt"/>
</span> </span>
@ -65,8 +83,18 @@
</div> </div>
</div> </div>
<component :is="manageUsersComponent" :id="namespace.id" type="namespace" shareType="user" :userIsAdmin="userIsAdmin"></component> <component
<component :is="manageTeamsComponent" :id="namespace.id" type="namespace" shareType="team" :userIsAdmin="userIsAdmin"></component> :is="manageUsersComponent"
:id="namespace.id"
type="namespace"
shareType="user"
:userIsAdmin="userIsAdmin"/>
<component
:is="manageTeamsComponent"
:id="namespace.id"
type="namespace"
shareType="team"
:userIsAdmin="userIsAdmin"/>
<modal <modal
v-if="showDeleteModal" v-if="showDeleteModal"

View File

@ -10,14 +10,14 @@
<input v-focus <input v-focus
class="input" class="input"
v-bind:class="{ 'disabled': namespaceService.loading}" v-bind:class="{ 'disabled': namespaceService.loading}"
v-model="namespace.name" v-model="namespace.title"
type="text" type="text"
@keyup.enter="newNamespace()" @keyup.enter="newNamespace()"
@keyup.esc="back()" @keyup.esc="back()"
placeholder="The namespace's name goes here..."/> placeholder="The namespace's name goes here..."/>
</p> </p>
<p class="control"> <p class="control">
<button class="button is-success noshadow" @click="newNamespace()" :disabled="namespace.name.length <= 5"> <button class="button is-success noshadow" @click="newNamespace()" :disabled="namespace.title.length <= 5">
<span class="icon is-small"> <span class="icon is-small">
<icon icon="plus"/> <icon icon="plus"/>
</span> </span>
@ -25,7 +25,7 @@
</button> </button>
</p> </p>
</div> </div>
<p class="help is-danger" v-if="showError && namespace.name.length <= 5"> <p class="help is-danger" v-if="showError && namespace.title.length <= 5">
Please specify at least five characters. Please specify at least five characters.
</p> </p>
<p class="small" v-tooltip.bottom="'A namespace is a collection of lists you can share and use to organize your lists with.<br/>In fact, every list belongs to a namepace.'"> <p class="small" v-tooltip.bottom="'A namespace is a collection of lists you can share and use to organize your lists with.<br/>In fact, every list belongs to a namepace.'">
@ -55,7 +55,7 @@
}, },
methods: { methods: {
newNamespace() { newNamespace() {
if (this.namespace.name.length <= 4) { if (this.namespace.title.length <= 4) {
this.showError = true this.showError = true
return return
} }

View File

@ -7,10 +7,10 @@
</h1> </h1>
<div class="is-done" v-if="task.done">Done</div> <div class="is-done" v-if="task.done">Done</div>
<h1 class="title input" contenteditable="true" @focusout="saveTaskOnChange()" ref="taskTitle" <h1 class="title input" contenteditable="true" @focusout="saveTaskOnChange()" ref="taskTitle"
@keyup.ctrl.enter="saveTaskOnChange()">{{ task.text }}</h1> @keyup.ctrl.enter="saveTaskOnChange()">{{ task.title }}</h1>
</div> </div>
<h6 class="subtitle" v-if="parent && parent.namespace && parent.list"> <h6 class="subtitle" v-if="parent && parent.namespace && parent.list">
{{ parent.namespace.name }} > {{ parent.namespace.title }} >
<router-link :to="{ name: 'list.list', params: { listId: parent.list.id } }"> <router-link :to="{ name: 'list.list', params: { listId: parent.list.id } }">
{{ parent.list.title }} {{ parent.list.title }}
</router-link> </router-link>
@ -410,7 +410,7 @@
this.taskService.get({id: this.taskId}) this.taskService.get({id: this.taskId})
.then(r => { .then(r => {
this.$set(this, 'task', r) this.$set(this, 'task', r)
this.taskTitle = this.task.text this.taskTitle = this.task.title
this.setActiveFields() this.setActiveFields()
}) })
.catch(e => { .catch(e => {
@ -444,13 +444,13 @@
// Pull the task title from the contenteditable // Pull the task title from the contenteditable
let taskTitle = this.$refs.taskTitle.textContent let taskTitle = this.$refs.taskTitle.textContent
this.task.text = taskTitle this.task.title = taskTitle
// We only want to save if the title was actually change. // We only want to save if the title was actually change.
// Because the contenteditable does not have a change event, // Because the contenteditable does not have a change event,
// we're building it ourselves and only calling saveTask() // we're building it ourselves and only calling saveTask()
// if the task title changed. // if the task title changed.
if (this.task.text !== this.taskTitle) { if (this.task.title !== this.taskTitle) {
this.saveTask() this.saveTask()
this.taskTitle = taskTitle this.taskTitle = taskTitle
} }

View File

@ -50,7 +50,7 @@
'has-high-priority': t.priority >= priorities.HIGH, 'has-high-priority': t.priority >= priorities.HIGH,
'has-not-so-high-priority': t.priority === priorities.HIGH, 'has-not-so-high-priority': t.priority === priorities.HIGH,
'has-super-high-priority': t.priority === priorities.DO_NOW 'has-super-high-priority': t.priority === priorities.DO_NOW
}">{{t.text}}</span> }">{{t.title}}</span>
<priority-label :priority="t.priority"/> <priority-label :priority="t.priority"/>
<!-- using the key here forces vue to use the updated version model and not the response returned by the api --> <!-- using the key here forces vue to use the updated version model and not the response returned by the api -->
<a @click="editTask(theTasks[k])" class="edit-toggle"> <a @click="editTask(theTasks[k])" class="edit-toggle">
@ -78,7 +78,7 @@
@clicked="setTaskDragged(t)" @clicked="setTaskDragged(t)"
v-tooltip="'This task has no dates set.'" v-tooltip="'This task has no dates set.'"
> >
<span>{{t.text}}</span> <span>{{t.title}}</span>
</VueDragResize> </VueDragResize>
</div> </div>
</template> </template>
@ -366,7 +366,7 @@
if (!this.newTaskFieldActive) { if (!this.newTaskFieldActive) {
return return
} }
let task = new TaskModel({text: this.newTaskTitle, listId: this.listId}) let task = new TaskModel({title: this.newTaskTitle, listId: this.listId})
this.taskService.create(task) this.taskService.create(task)
.then(r => { .then(r => {
this.tasksWithoutDates.push(this.addGantAttributes(r)) this.tasksWithoutDates.push(this.addGantAttributes(r))

View File

@ -53,7 +53,7 @@
<span v-if="t.listId !== listId" class="different-list" v-tooltip="'This task belongs to a different list.'"> <span v-if="t.listId !== listId" class="different-list" v-tooltip="'This task belongs to a different list.'">
{{ $store.getters['lists/getListById'](t.listId) === null ? '' : $store.getters['lists/getListById'](t.listId).title }} > {{ $store.getters['lists/getListById'](t.listId) === null ? '' : $store.getters['lists/getListById'](t.listId).title }} >
</span> </span>
{{t.text}} {{t.title}}
</span> </span>
</router-link> </router-link>
<a <a
@ -202,8 +202,8 @@
this.showDeleteModal = false this.showDeleteModal = false
}) })
}, },
createAndRelateTask(text) { createAndRelateTask(title) {
const newTask = new TaskModel({text: text, listId: this.listId}) const newTask = new TaskModel({title: title, listId: this.listId})
this.taskService.create(newTask) this.taskService.create(newTask)
.then(r => { .then(r => {
this.newTaskRelationTask = r this.newTaskRelationTask = r

View File

@ -14,11 +14,11 @@
<!-- Show any parent tasks to make it clear this task is a sub task of something --> <!-- Show any parent tasks to make it clear this task is a sub task of something -->
<span class="parent-tasks" v-if="typeof task.relatedTasks.parenttask !== 'undefined'"> <span class="parent-tasks" v-if="typeof task.relatedTasks.parenttask !== 'undefined'">
<template v-for="(pt, i) in task.relatedTasks.parenttask"> <template v-for="(pt, i) in task.relatedTasks.parenttask">
{{ pt.text }}<template v-if="(i + 1) < task.relatedTasks.parenttask.length">,&nbsp;</template> {{ pt.title }}<template v-if="(i + 1) < task.relatedTasks.parenttask.length">,&nbsp;</template>
</template> </template>
> >
</span> </span>
{{ task.text }} {{ task.title }}
<labels :labels="task.labels"/> <labels :labels="task.labels"/>
<user <user
:user="a" :user="a"

View File

@ -23,7 +23,7 @@ export default class NamespaceModel extends AbstractModel {
defaults() { defaults() {
return { return {
id: 0, id: 0,
name: '', title: '',
description: '', description: '',
owner: UserModel, owner: UserModel,
lists: [], lists: [],