hotfix(dataset): improve dataset classification UI and data handling
- Updated the Dataset and Submitter Category Vue components to enhance the UI for library classification. The collection names and numbers are now displayed with distinct styling using `span` elements with specific classes for better readability. - Modified the DatasetController and Editor/DatasetController to filter collection roles by 'ddc' and 'ccs' names when preloading collections, improving data retrieval efficiency. - Added `left_id` and `right_id` columns to the `collections` table in the `dataset_7_collections.ts` migration file. - Added a migration to reorder the collection_roles table.
This commit is contained in:
parent
be6b38d0a3
commit
0bf442be96
9 changed files with 3058 additions and 467 deletions
|
@ -36,7 +36,8 @@
|
|||
'cursor-pointer p-2 border border-gray-200 rounded hover:bg-sky-50 text-sky-700 text-sm': true,
|
||||
'bg-sky-100 border-sky-500': selectedToplevelCollection && selectedToplevelCollection.id === col.id
|
||||
}" @click="onToplevelCollectionSelected(col)">
|
||||
{{ `${col.name} (${col.number})` }}
|
||||
<span class="text-sky-700">{{ col.name }}</span>
|
||||
<span class="ml-2 px-2 py-0.5 bg-gray-200 text-gray-700 text-xs rounded-full">{{ col.number }}</span>
|
||||
</li>
|
||||
<li v-if="collections.length === 0" class="text-gray-800 dark:text-slate-400">
|
||||
No collections available.
|
||||
|
@ -55,7 +56,8 @@
|
|||
<template #item="{ element: parent }">
|
||||
<li :key="parent.id" :draggable="!parent.inUse" :class="getChildClasses(parent)"
|
||||
@click="onCollectionSelected(parent)">
|
||||
{{ `${parent.name} (${parent.number})` }}
|
||||
<span class="text-sky-700">{{ parent.name }}</span>
|
||||
<span class="ml-2 px-2 py-0.5 bg-gray-200 text-gray-700 text-xs rounded-full">{{ parent.number }}</span>
|
||||
</li>
|
||||
</template>
|
||||
</draggable>
|
||||
|
@ -79,11 +81,13 @@
|
|||
'p-2 border border-gray-200 rounded text-sm',
|
||||
element.inUse ? 'bg-gray-200 text-gray-500 drag-none' : 'bg-green-50 text-green-700 hover:bg-green-100 hover:underline cursor-move'
|
||||
]">
|
||||
{{ `${element.name} (${element.number})` }}
|
||||
<span class="text-sky-700">{{ element.name }}</span>
|
||||
<span class="ml-2 px-2 py-0.5 bg-gray-200 text-gray-700 text-xs rounded-full">{{ element.number }}</span>
|
||||
</li>
|
||||
</template>
|
||||
</draggable>
|
||||
</CardBox>
|
||||
|
||||
<!-- Narrower Collections (Children) -->
|
||||
<CardBox v-if="selectedCollection" class="rounded-lg p-4" has-form-data>
|
||||
<h2 class="text-lg font-bold text-gray-800 dark:text-slate-400 mb-2">Narrower Collections</h2>
|
||||
|
@ -92,7 +96,8 @@
|
|||
<template #item="{ element: child }">
|
||||
<li :key="child.id" :draggable="!child.inUse" :class="getChildClasses(child)"
|
||||
@click="onCollectionSelected(child)">
|
||||
{{ `${child.name} (${child.number})` }}
|
||||
<span class="text-sky-700">{{ child.name }}</span>
|
||||
<span class="ml-2 px-2 py-0.5 bg-gray-200 text-gray-700 text-xs rounded-full">{{ child.number }}</span>
|
||||
</li>
|
||||
</template>
|
||||
</draggable>
|
||||
|
@ -118,7 +123,8 @@
|
|||
<template #item="{ element }">
|
||||
<div :key="element.id"
|
||||
class="p-2 m-1 bg-sky-200 text-sky-800 rounded flex items-center gap-2 h-7">
|
||||
<span>{{ element.name }} ({{ element.number }})</span>
|
||||
<span class="text-sky-700">{{ element.name }}</span>
|
||||
<span class="ml-2 px-2 py-0.5 bg-gray-200 text-gray-700 text-xs rounded-full">{{ element.number }}</span>
|
||||
<button
|
||||
@click="selectedCollectionList = selectedCollectionList.filter(item => item.id !== element.id)"
|
||||
class="hover:text-sky-600 flex items-center">
|
||||
|
|
Loading…
Add table
editor.link_modal.header
Reference in a new issue