Now using Tabulator for tables
This commit is contained in:
Florian Sylvain committed
1 parent
a184154ad1
commit
754ce61f2c
9 files changed
+102
-36
No files matched your search
Generated
+24
@@ -10,11 +10,13 @@
|
||||
"dependencies": {
|
||||
"@tinymce/tinymce-vue": "^4.0.7",
|
||||
"pinia": "^2.0.28",
|
||||
"tabulator-tables": "^5.4.3",
|
||||
"vue": "^3.2.38",
|
||||
"vue-router": "^4.1.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^16.11.56",
|
||||
"@types/tabulator-tables": "^5.4.2",
|
||||
"@vitejs/plugin-vue": "^3.0.3",
|
||||
"@vue/tsconfig": "^0.1.3",
|
||||
"npm-run-all": "^4.1.5",
|
||||
@@ -83,6 +85,12 @@
|
||||
"integrity": "sha512-XU1+v7h81p7145ddPfjv7jtWvkSilpcnON3mQ+bDi9Yuf7OI56efOglXRyXWgQ57xH3fEQgh7WOJMncRHVew5w==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@types/tabulator-tables": {
|
||||
"version": "5.4.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/tabulator-tables/-/tabulator-tables-5.4.2.tgz",
|
||||
"integrity": "sha512-Nw6ilGg3SqJWQ6UUwJ8VL9NtIeRhYKrmzy8hjx3dpfHwccK0pSCUj3G+CNTnoHD4QaIfXq8JaAwQ+dzO4FeHqA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@vitejs/plugin-vue": {
|
||||
"version": "3.2.0",
|
||||
"resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-3.2.0.tgz",
|
||||
@@ -1764,6 +1772,11 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/tabulator-tables": {
|
||||
"version": "5.4.3",
|
||||
"resolved": "https://registry.npmjs.org/tabulator-tables/-/tabulator-tables-5.4.3.tgz",
|
||||
"integrity": "sha512-XnQcfwd2LzHWKAo8ZzUVglKaQnzn3wZwH48ouYr1dDbfUcQiU1ESJjVhmVxPMr9tf0oDcV6qPViEHinAi/tqbw=="
|
||||
},
|
||||
"node_modules/tinymce": {
|
||||
"version": "5.10.7",
|
||||
"resolved": "https://registry.npmjs.org/tinymce/-/tinymce-5.10.7.tgz",
|
||||
@@ -1971,6 +1984,12 @@
|
||||
"integrity": "sha512-XU1+v7h81p7145ddPfjv7jtWvkSilpcnON3mQ+bDi9Yuf7OI56efOglXRyXWgQ57xH3fEQgh7WOJMncRHVew5w==",
|
||||
"dev": true
|
||||
},
|
||||
"@types/tabulator-tables": {
|
||||
"version": "5.4.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/tabulator-tables/-/tabulator-tables-5.4.2.tgz",
|
||||
"integrity": "sha512-Nw6ilGg3SqJWQ6UUwJ8VL9NtIeRhYKrmzy8hjx3dpfHwccK0pSCUj3G+CNTnoHD4QaIfXq8JaAwQ+dzO4FeHqA==",
|
||||
"dev": true
|
||||
},
|
||||
"@vitejs/plugin-vue": {
|
||||
"version": "3.2.0",
|
||||
"resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-3.2.0.tgz",
|
||||
@@ -3128,6 +3147,11 @@
|
||||
"integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==",
|
||||
"dev": true
|
||||
},
|
||||
"tabulator-tables": {
|
||||
"version": "5.4.3",
|
||||
"resolved": "https://registry.npmjs.org/tabulator-tables/-/tabulator-tables-5.4.3.tgz",
|
||||
"integrity": "sha512-XnQcfwd2LzHWKAo8ZzUVglKaQnzn3wZwH48ouYr1dDbfUcQiU1ESJjVhmVxPMr9tf0oDcV6qPViEHinAi/tqbw=="
|
||||
},
|
||||
"tinymce": {
|
||||
"version": "5.10.7",
|
||||
"resolved": "https://registry.npmjs.org/tinymce/-/tinymce-5.10.7.tgz",
|
||||
|
||||
@@ -11,11 +11,13 @@
|
||||
"dependencies": {
|
||||
"@tinymce/tinymce-vue": "^4.0.7",
|
||||
"pinia": "^2.0.28",
|
||||
"tabulator-tables": "^5.4.3",
|
||||
"vue": "^3.2.38",
|
||||
"vue-router": "^4.1.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^16.11.56",
|
||||
"@types/tabulator-tables": "^5.4.2",
|
||||
"@vitejs/plugin-vue": "^3.0.3",
|
||||
"@vue/tsconfig": "^0.1.3",
|
||||
"npm-run-all": "^4.1.5",
|
||||
|
||||
@@ -68,7 +68,8 @@ button,
|
||||
span,
|
||||
li,
|
||||
td,
|
||||
th {
|
||||
th,
|
||||
.tabulator {
|
||||
font-family: 'Hind', sans-serif;
|
||||
color: var(--neutral-dark);
|
||||
}
|
||||
@@ -111,7 +112,8 @@ th {
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.tags li {
|
||||
.tags li,
|
||||
.tags .tag {
|
||||
background-color: var(--neutral-verylight);
|
||||
border-radius: var(--radius);
|
||||
|
||||
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
.tabulator{position:relative;border:1px solid #999;background-color:#888;font-size:14px;text-align:left;overflow:hidden;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.tabulator[tabulator-layout=fitDataFill] .tabulator-tableholder .tabulator-table{min-width:100%}.tabulator[tabulator-layout=fitDataTable]{display:inline-block}.tabulator.tabulator-block-select{user-select:none}.tabulator .tabulator-header{position:relative;box-sizing:border-box;width:100%;border-bottom:1px solid #999;background-color:#e6e6e6;color:#555;font-weight:700;white-space:nowrap;overflow:hidden;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none}.tabulator .tabulator-header.tabulator-header-hidden{display:none}.tabulator .tabulator-header .tabulator-header-contents{position:relative;overflow:hidden}.tabulator .tabulator-header .tabulator-header-contents .tabulator-headers{display:inline-block}.tabulator .tabulator-header .tabulator-col{display:inline-flex;position:relative;box-sizing:border-box;flex-direction:column;justify-content:flex-start;border-right:1px solid #aaa;background:#e6e6e6;text-align:left;vertical-align:bottom;overflow:hidden}.tabulator .tabulator-header .tabulator-col.tabulator-moving{position:absolute;border:1px solid #999;background:#cdcdcd;pointer-events:none}.tabulator .tabulator-header .tabulator-col .tabulator-col-content{box-sizing:border-box;position:relative;padding:4px}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-header-popup-button{padding:0 8px}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-header-popup-button:hover{cursor:pointer;opacity:.6}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title-holder{position:relative}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title{box-sizing:border-box;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title.tabulator-col-title-wrap{white-space:normal;text-overflow:clip}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title .tabulator-title-editor{box-sizing:border-box;width:100%;border:1px solid #999;padding:1px;background:#fff}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title .tabulator-header-popup-button+.tabulator-title-editor{width:calc(100% - 22px)}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-sorter{display:flex;align-items:center;position:absolute;top:0;bottom:0;right:4px}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-sorter .tabulator-arrow{width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #bbb}.tabulator .tabulator-header .tabulator-col.tabulator-col-group .tabulator-col-group-cols{position:relative;display:flex;border-top:1px solid #aaa;overflow:hidden;margin-right:-1px}.tabulator .tabulator-header .tabulator-col .tabulator-header-filter{position:relative;box-sizing:border-box;margin-top:2px;width:100%;text-align:center}.tabulator .tabulator-header .tabulator-col .tabulator-header-filter textarea{height:auto!important}.tabulator .tabulator-header .tabulator-col .tabulator-header-filter svg{margin-top:3px}.tabulator .tabulator-header .tabulator-col .tabulator-header-filter input::-ms-clear{width:0;height:0}.tabulator .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-title{padding-right:25px}.tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element:hover{cursor:pointer;background-color:#cdcdcd}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter{color:#bbb}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter.tabulator-col-sorter-element .tabulator-arrow:hover{cursor:pointer;border-bottom:6px solid #555}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow{border-top:none;border-bottom:6px solid #bbb}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter{color:#666}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter.tabulator-col-sorter-element .tabulator-arrow:hover{cursor:pointer;border-bottom:6px solid #555}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow{border-top:none;border-bottom:6px solid #666}.tabulator .tabulator-header .tabulator-col.tabulator-sortabLine truncated
|
||||
/*# sourceMappingURL=tabulator.min.css.map */
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["tabulator.scss"],"names":[],"mappings":"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 truncated
|
||||
@@ -0,0 +1,2 @@
|
||||
.tabulator{position:relative;border:1px solid #dee2e6;font-size:16px;text-align:left;overflow:hidden;-webkit-transform:translateZ(0);-moz-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}.tabulator[tabulator-layout=fitDataFill] .tabulator-tableholder .tabulator-table{min-width:100%}.tabulator[tabulator-layout=fitDataTable]{display:inline-block}.tabulator.tabulator-block-select{user-select:none}.tabulator .tabulator-header{position:relative;box-sizing:border-box;width:100%;border-bottom:1px solid #dee2e6;background-color:#fff;color:#555;font-weight:700;white-space:nowrap;overflow:hidden;-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none}.tabulator .tabulator-header.tabulator-header-hidden{display:none}.tabulator .tabulator-header .tabulator-header-contents{position:relative;overflow:hidden}.tabulator .tabulator-header .tabulator-header-contents .tabulator-headers{display:inline-block}.tabulator .tabulator-header .tabulator-col{display:inline-flex;position:relative;box-sizing:border-box;flex-direction:column;justify-content:flex-start;border-right:1px solid #aaa;background:#fff;text-align:left;vertical-align:bottom;overflow:hidden}.tabulator .tabulator-header .tabulator-col.tabulator-moving{position:absolute;border:1px solid #dee2e6;background:#e6e6e6;pointer-events:none}.tabulator .tabulator-header .tabulator-col .tabulator-col-content{box-sizing:border-box;position:relative;padding:4px}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-header-popup-button{padding:0 8px}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-header-popup-button:hover{cursor:pointer;opacity:.6}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title-holder{position:relative}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title{box-sizing:border-box;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title.tabulator-col-title-wrap{white-space:normal;text-overflow:clip}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title .tabulator-title-editor{box-sizing:border-box;width:100%;border:1px solid #999;padding:1px;background:#fff}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title .tabulator-header-popup-button+.tabulator-title-editor{width:calc(100% - 22px)}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-sorter{display:flex;align-items:center;position:absolute;top:0;bottom:0;right:4px}.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-sorter .tabulator-arrow{width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #bbb}.tabulator .tabulator-header .tabulator-col.tabulator-col-group .tabulator-col-group-cols{position:relative;display:flex;border-top:1px solid #aaa;overflow:hidden;margin-right:-1px}.tabulator .tabulator-header .tabulator-col .tabulator-header-filter{position:relative;box-sizing:border-box;margin-top:2px;width:100%;text-align:center}.tabulator .tabulator-header .tabulator-col .tabulator-header-filter textarea{height:auto!important}.tabulator .tabulator-header .tabulator-col .tabulator-header-filter svg{margin-top:3px}.tabulator .tabulator-header .tabulator-col .tabulator-header-filter input::-ms-clear{width:0;height:0}.tabulator .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-title{padding-right:25px}.tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element:hover{cursor:pointer;background-color:#e6e6e6}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter{color:#bbb}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter.tabulator-col-sorter-element .tabulator-arrow:hover{cursor:pointer;border-bottom:6px solid #555}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=none] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow{border-top:none;border-bottom:6px solid #bbb}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter{color:#666}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter.tabulator-col-sorter-element .tabulator-arrow:hover{cursor:pointer;border-bottom:6px solid #555}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=ascending] .tabulator-col-content .tabulator-col-sorter .tabulator-arrow{border-top:none;border-bottom:6px solid #666}.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort=descenLine truncated
|
||||
/*# sourceMappingURL=tabulator_bootstrap5.min.css.map */
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"sources":["tabulator_bootstrap5.scss"],"names":[],"mappings":"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 truncated
|
||||
@@ -5,6 +5,7 @@ import App from './App.vue'
|
||||
import router from './router'
|
||||
|
||||
import '@/assets/base.css'
|
||||
import '@/assets/tabulator_bootstrap5.min.css'
|
||||
|
||||
const app = createApp(App)
|
||||
|
||||
|
||||
@@ -2,50 +2,85 @@
|
||||
import { getArticles, type Article } from '@/utils/database';
|
||||
import { onMounted, ref, type Ref } from 'vue';
|
||||
import { RouterLink } from 'vue-router'
|
||||
import { TabulatorFull as Tabulator } from 'tabulator-tables'
|
||||
|
||||
const articles: Ref<Array<Article>> = ref([])
|
||||
|
||||
const table = ref<HTMLInputElement | string>('')
|
||||
const tabulator: Ref<Tabulator | undefined> = ref(undefined)
|
||||
|
||||
onMounted(async () => {
|
||||
articles.value = await getArticles('')
|
||||
tabulator.value = new Tabulator(table.value, {
|
||||
data: articles.value,
|
||||
reactiveData: true,
|
||||
layout: 'fitColumns',
|
||||
columns: [
|
||||
{
|
||||
title: 'Titre',
|
||||
field: 'title',
|
||||
},
|
||||
{
|
||||
title: 'Date création',
|
||||
field: 'date',
|
||||
formatter: function (cell) {
|
||||
return new Date(cell.getValue()).toLocaleDateString('fr-FR')
|
||||
}
|
||||
},
|
||||
{
|
||||
title: 'Tags',
|
||||
field: 'tags',
|
||||
formatter: function (cell) {
|
||||
return cell.getValue().join(' ')
|
||||
},
|
||||
sorter: 'alphanum'
|
||||
},
|
||||
{
|
||||
title: 'Statut',
|
||||
field: 'online',
|
||||
formatter: function (cell) {
|
||||
return cell.getValue() as boolean ? '🟢' : '🔴'
|
||||
},
|
||||
headerSort: false
|
||||
},
|
||||
{
|
||||
title: 'Actions',
|
||||
field: 'titleID',
|
||||
formatter: function (cell) {
|
||||
const container = document.createElement('div')
|
||||
|
||||
const editButton = document.createElement('a')
|
||||
const deleteButton = document.createElement('a')
|
||||
editButton.classList.add('button-secondary')
|
||||
deleteButton.classList.add('button-secondary')
|
||||
editButton.textContent = '✏️'
|
||||
deleteButton.textContent = '🗑️'
|
||||
|
||||
editButton.href = `/articles/edit/${cell.getValue()}`
|
||||
|
||||
container.append(editButton, deleteButton)
|
||||
return container
|
||||
},
|
||||
headerSort: false
|
||||
}
|
||||
]
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<main>
|
||||
<RouterLink class="button-primary" to="/articles/new">Créer un article</RouterLink>
|
||||
<table>
|
||||
<thead>
|
||||
<th>Titre</th>
|
||||
<th>Date création</th>
|
||||
<th>Tags</th>
|
||||
<th>Statut</th>
|
||||
<th>Actions</th>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="article in articles">
|
||||
<td>{{ article.title }}</td>
|
||||
<td>{{ new Date(article.date).toLocaleDateString('fr-FR') }}</td>
|
||||
<td>
|
||||
<ul class="tags">
|
||||
<li v-for="tag in article.tags">{{ tag }}</li>
|
||||
</ul>
|
||||
</td>
|
||||
<td class="status">{{`${article.online ? '🟢' : '🔴'}`}}</td>
|
||||
<td>
|
||||
<div class="action-buttons">
|
||||
<RouterLink class="button-secondary" :to="`articles/edit/${article.titleID}`">✏️
|
||||
</RouterLink>
|
||||
<button class="button-secondary">❌</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div id="table" ref="table"></div>
|
||||
</main>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
|
||||
padding: 32px;
|
||||
}
|
||||
|
||||
@@ -53,14 +88,10 @@ main>a {
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
main table {
|
||||
#table {
|
||||
width: 100%;
|
||||
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
main table td {
|
||||
padding: 8px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
|
||||
Reference in new issue
Block a user