Add missing tag UI to lists

This commit is contained in:
Kailash Nadh 2020-08-01 12:58:46 +05:30
parent f9e4a50795
commit 0145aba30f
4 changed files with 24 additions and 5 deletions

View File

@ -258,6 +258,14 @@ section {
.tag { .tag {
min-width: 75px; min-width: 75px;
&.is-small {
font-size: 0.65rem;
background: $white-ter;
border: 1px solid $white-ter;
padding: 3px 5px;
min-width: auto !important;
}
&:not(body) { &:not(body) {
$color: $grey-lighter; $color: $grey-lighter;
border: 1px solid $color; border: 1px solid $color;

View File

@ -50,7 +50,7 @@
</p> </p>
<p class="is-size-7 has-text-grey">{{ props.row.subject }}</p> <p class="is-size-7 has-text-grey">{{ props.row.subject }}</p>
<b-taglist> <b-taglist>
<b-tag v-for="t in props.row.tags" :key="t">{{ t }}</b-tag> <b-tag class="is-small" v-for="t in props.row.tags" :key="t">{{ t }}</b-tag>
</b-taglist> </b-taglist>
</div> </div>
</b-table-column> </b-table-column>

View File

@ -35,6 +35,11 @@
<option value="double">Double</option> <option value="double">Double</option>
</b-select> </b-select>
</b-field> </b-field>
<b-field label="Tags" label-position="on-border">
<b-taginput v-model="form.tags" ellipsis
icon="tag-outline" placeholder="Tags"></b-taginput>
</b-field>
</section> </section>
<footer class="modal-card-foot has-text-right"> <footer class="modal-card-foot has-text-right">
<b-button @click="$parent.close()">Close</b-button> <b-button @click="$parent.close()">Close</b-button>
@ -64,6 +69,7 @@ export default Vue.extend({
name: '', name: '',
type: '', type: '',
optin: '', optin: '',
tags: '',
}, },
}; };
}, },

View File

@ -15,10 +15,15 @@
hoverable hoverable
default-sort="createdAt"> default-sort="createdAt">
<template slot-scope="props"> <template slot-scope="props">
<b-table-column field="name" label="Name" sortable> <b-table-column field="name" label="Name" sortable width="25%">
<router-link :to="{name: 'subscribers_list', params: { listID: props.row.id }}"> <div>
{{ props.row.name }} <router-link :to="{name: 'subscribers_list', params: { listID: props.row.id }}">
</router-link> {{ props.row.name }}
</router-link>
<b-taglist>
<b-tag class="is-small" v-for="t in props.row.tags" :key="t">{{ t }}</b-tag>
</b-taglist>
</div>
</b-table-column> </b-table-column>
<b-table-column field="type" label="Type" sortable> <b-table-column field="type" label="Type" sortable>