Differential D2966 Diff 8483 src/resources/vue/User/List.vue

Changeset View

Standalone View

src/resources/vue/User/List.vue

	<template>			<template>
	<div class="container">			<div class="container">
	<div class="card" id="user-list">			<div class="card" id="user-list">
	<div class="card-body">			<div class="card-body">
	<div class="card-title">			<div class="card-title">
	{{ $t('user.list-title') }}			{{ $t('user.list-title') }}
	<router-link class="btn btn-success float-end create-user" :to="{ path: 'user/new' }" tag="button">			</div>
				<div class="card-text">
				<div class="mb-2 d-flex">
				<list-search :placeholder="$t('user.search')" :on-search="searchUsers"></list-search>
				<div>
				<router-link class="btn btn-success ms-1 create-user" :to="{ path: 'user/new' }" tag="button">
	<svg-icon icon="user"></svg-icon> {{ $t('user.create') }}			<svg-icon icon="user"></svg-icon> {{ $t('user.create') }}
	</router-link>			</router-link>
	</div>			</div>
	<div class="card-text">			</div>
	<table class="table table-sm table-hover">			<table id="users-list" class="table table-sm table-hover">
	<thead>			<thead>
	<tr>			<tr>
	<th scope="col">{{ $t('form.primary-email') }}</th>			<th scope="col">{{ $t('form.primary-email') }}</th>
	</tr>			</tr>
	</thead>			</thead>
	<tbody>			<tbody>
	<tr v-for="user in users" :id="'user' + user.id" :key="user.id" @click="$root.clickRecord">			<tr v-for="user in users" :id="'user' + user.id" :key="user.id" @click="$root.clickRecord">
	<td>			<td>
	<svg-icon icon="user" :class="$root.userStatusClass(user)" :title="$root.userStatusText(user)"></svg-icon>			<svg-icon icon="user" :class="$root.userStatusClass(user)" :title="$root.userStatusText(user)"></svg-icon>
	<router-link :to="{ path: 'user/' + user.id }">{{ user.email }}</router-link>			<router-link :to="{ path: 'user/' + user.id }">{{ user.email }}</router-link>
	</td>			</td>
	</tr>			</tr>
	</tbody>			</tbody>
	<tfoot class="table-fake-body">			<list-foot :text="$t('user.users-none')"></list-foot>
	<tr>
	<td>{{ $t('user.users-none') }}</td>
	</tr>
	</tfoot>
	</table>			</table>
				<list-more v-if="hasMore" :on-click="loadUsers"></list-more>
	</div>			</div>
	</div>			</div>
	</div>			</div>
	</div>			</div>
	</template>			</template>

	<script>			<script>
				import ListTools from '../Widgets/ListTools'

	export default {			export default {
				mixins: [ ListTools ],
	data() {			data() {
	return {			return {
	users: [],			users: []
	current_user: null
	}			}
	},			},
	created() {			mounted() {
	this.$root.startLoading()			this.loadUsers({ init: true })
				},
	axios.get('/api/v4/users')			methods: {
	.then(response => {			loadUsers(params) {
	this.$root.stopLoading()			this.listSearch('users', '/api/v4/users', params)
	this.users = response.data			},
	})			searchUsers(search) {
	.catch(this.$root.errorHandler)			this.loadUsers({ reset: true, search })
				}
	}			}
	}			}
	</script>			</script>