Adding input field

Note: Apparently there is a nasty side-effect when you combine `loading`
and `disabled`. The `disabled` flag gets overridden, if `loading` is
false.
This commit is contained in:
Robert Schäfer 2019-07-12 02:24:03 +02:00
parent 08a5a70fd0
commit ed8605875e

View File

@ -1,39 +1,46 @@
<template> <template>
<ds-card :header="$t('admin.users.name')"> <div>
<ds-table v-if="User && User.length" :data="User" :fields="fields" condensed> <ds-space>
<template slot="index" slot-scope="scope"> <ds-card :header="$t('admin.users.name')">
{{ scope.row.index }}. <ds-input placeholder="..." icon="search" />
</template> </ds-card>
<template slot="name" slot-scope="scope"> </ds-space>
<nuxt-link <ds-card>
:to="{ <ds-table v-if="User && User.length" :data="User" :fields="fields" condensed>
name: 'profile-id-slug', <template slot="index" slot-scope="scope">
params: { id: scope.row.id, slug: scope.row.slug }, {{ scope.row.index }}.
}" </template>
> <template slot="name" slot-scope="scope">
<b>{{ scope.row.name | truncate(20) }}</b> <nuxt-link
</nuxt-link> :to="{
</template> name: 'profile-id-slug',
<template slot="slug" slot-scope="scope"> params: { id: scope.row.id, slug: scope.row.slug },
<nuxt-link }"
:to="{ >
name: 'profile-id-slug', <b>{{ scope.row.name | truncate(20) }}</b>
params: { id: scope.row.id, slug: scope.row.slug }, </nuxt-link>
}" </template>
> <template slot="slug" slot-scope="scope">
<b>{{ scope.row.slug | truncate(20) }}</b> <nuxt-link
</nuxt-link> :to="{
</template> name: 'profile-id-slug',
</ds-table> params: { id: scope.row.id, slug: scope.row.slug },
<ds-flex direction="row-reverse"> }"
<ds-flex-item width="50px"> >
<ds-button @click="next" :loading="$apollo.loading" :disabled="!hasNext" icon="arrow-right" primary /> <b>{{ scope.row.slug | truncate(20) }}</b>
</ds-flex-item> </nuxt-link>
<ds-flex-item width="50px"> </template>
<ds-button @click="back" :loading="$apollo.loading" :disabled="!hasPrevious" icon="arrow-left" primary /> </ds-table>
</ds-flex-item> <ds-flex direction="row-reverse">
</ds-flex> <ds-flex-item width="50px">
</ds-card> <ds-button @click="next" :disabled="!hasNext" icon="arrow-right" primary />
</ds-flex-item>
<ds-flex-item width="50px">
<ds-button @click="back" :disabled="!hasPrevious" icon="arrow-left" primary />
</ds-flex-item>
</ds-flex>
</ds-card>
</div>
</template> </template>
<script> <script>
@ -61,20 +68,20 @@ export default {
slug: this.$t('admin.users.table.columns.slug'), slug: this.$t('admin.users.table.columns.slug'),
contributionsCount: { contributionsCount: {
label: '🖉', label: '🖉',
align: 'right' align: 'right',
}, },
commentedCount: { commentedCount: {
label: '🗨', label: '🗨',
align: 'right' align: 'right',
}, },
shoutedCount: { shoutedCount: {
label: '❤', label: '❤',
align: 'right' align: 'right',
}, },
role: { role: {
label: this.$t('admin.users.table.columns.role'), label: this.$t('admin.users.table.columns.role'),
align: 'right' align: 'right',
} },
} }
}, },
}, },