mirror of
https://github.com/galaxyproject/galaxy.git
synced 2026-10-30 18:13:23 +08:00
Separate content item buttons into separate component
This commit is contained in:
guerler
@@ -38,57 +38,18 @@
|
||||
<Nametag v-for="tag in item.tags" :key="tag" :tag="tag" />
|
||||
</div>
|
||||
</span>
|
||||
<span class="align-self-start btn-group">
|
||||
<b-button
|
||||
v-if="isDataset"
|
||||
:disabled="displayDisabled"
|
||||
:title="displayButtonTitle"
|
||||
class="px-1"
|
||||
size="sm"
|
||||
variant="link"
|
||||
@click.stop="onDisplay">
|
||||
<icon icon="eye" />
|
||||
</b-button>
|
||||
<b-button
|
||||
v-if="isHistoryItem"
|
||||
:disabled="editDisabled"
|
||||
class="px-1"
|
||||
title="Edit attributes"
|
||||
size="sm"
|
||||
variant="link"
|
||||
@click.stop="onEdit">
|
||||
<icon icon="pen" />
|
||||
</b-button>
|
||||
<b-button
|
||||
v-if="isHistoryItem && !item.deleted"
|
||||
class="px-1"
|
||||
title="Delete"
|
||||
size="sm"
|
||||
variant="link"
|
||||
:disabled="item.purged"
|
||||
@click.stop="$emit('delete', item)">
|
||||
<icon icon="trash" />
|
||||
</b-button>
|
||||
<b-button
|
||||
v-if="isHistoryItem && item.deleted"
|
||||
class="px-1"
|
||||
title="Undelete"
|
||||
size="sm"
|
||||
variant="link"
|
||||
:disabled="item.purged"
|
||||
@click.stop="$emit('undelete', item)">
|
||||
<icon icon="trash-restore" />
|
||||
</b-button>
|
||||
<b-button
|
||||
v-if="isHistoryItem && !item.visible"
|
||||
class="px-1"
|
||||
title="Unhide"
|
||||
size="sm"
|
||||
variant="link"
|
||||
@click.stop="$emit('unhide', item)">
|
||||
<icon icon="unlock" />
|
||||
</b-button>
|
||||
</span>
|
||||
<ContentOptions
|
||||
:is-dataset="isDataset"
|
||||
:is-deleted="item.deleted"
|
||||
:is-history-item="isHistoryItem"
|
||||
:is-purged="item.purged"
|
||||
:is-visible="item.visible"
|
||||
:state="state"
|
||||
@delete="$emit('delete')"
|
||||
@display="onDisplay"
|
||||
@edit="onEdit"
|
||||
@undelete="$emit('undelete')"
|
||||
@unhide="$emit('delete')" />
|
||||
</div>
|
||||
</div>
|
||||
<!-- collections are not expandable, so we only need the DatasetDetails component here -->
|
||||
@@ -102,12 +63,14 @@
|
||||
import { backboneRoute, useGalaxy, iframeRedirect } from "components/plugins/legacyNavigation";
|
||||
import { Nametag } from "components/Nametags";
|
||||
import CollectionDescription from "./Collection/CollectionDescription";
|
||||
import ContentOptions from "./ContentOptions";
|
||||
import DatasetDetails from "./Dataset/DatasetDetails";
|
||||
import STATES from "./contentStates";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
CollectionDescription,
|
||||
ContentOptions,
|
||||
DatasetDetails,
|
||||
Nametag,
|
||||
},
|
||||
@@ -138,32 +101,6 @@ export default {
|
||||
contentState() {
|
||||
return STATES[this.state] && STATES[this.state];
|
||||
},
|
||||
displayButtonTitle() {
|
||||
if (this.item.purged) {
|
||||
return "Cannot display datasets removed from disk.";
|
||||
}
|
||||
if (this.displayDisabled) {
|
||||
return "This dataset is not yet viewable.";
|
||||
}
|
||||
return "Display";
|
||||
},
|
||||
displayDisabled() {
|
||||
return this.item.purged || ["discarded", "new", "upload"].includes(this.state);
|
||||
},
|
||||
editButtonTitle() {
|
||||
if (this.item.purged) {
|
||||
return "Cannot edit attributes of datasets removed from disk.";
|
||||
}
|
||||
if (this.editDisabled) {
|
||||
return "This dataset is not yet editable.";
|
||||
}
|
||||
return "Edit Attributes";
|
||||
},
|
||||
editDisabled() {
|
||||
return (
|
||||
this.item.purged || ["discarded", "new", "upload", "queued", "running", "waiting"].includes(this.state)
|
||||
);
|
||||
},
|
||||
hasStateIcon() {
|
||||
return this.contentState && this.contentState.icon;
|
||||
},
|
||||
@@ -181,10 +118,12 @@ export default {
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
onDragStart(evt) {
|
||||
evt.dataTransfer.dropEffect = "move";
|
||||
evt.dataTransfer.effectAllowed = "move";
|
||||
evt.dataTransfer.setData("text", JSON.stringify([this.item]));
|
||||
onClick() {
|
||||
if (this.isDataset) {
|
||||
this.$emit("update:expand-dataset", !this.expandDataset);
|
||||
} else {
|
||||
this.$emit("view-collection", this.item, this.name);
|
||||
}
|
||||
},
|
||||
onDisplay() {
|
||||
const id = this.item.id;
|
||||
@@ -196,6 +135,11 @@ export default {
|
||||
}
|
||||
});
|
||||
},
|
||||
onDragStart(evt) {
|
||||
evt.dataTransfer.dropEffect = "move";
|
||||
evt.dataTransfer.effectAllowed = "move";
|
||||
evt.dataTransfer.setData("text", JSON.stringify([this.item]));
|
||||
},
|
||||
onEdit() {
|
||||
if (this.item.collection_type) {
|
||||
backboneRoute(`collection/edit/${this.item.id}`);
|
||||
@@ -203,13 +147,6 @@ export default {
|
||||
backboneRoute("datasets/edit", { dataset_id: this.item.id });
|
||||
}
|
||||
},
|
||||
onClick() {
|
||||
if (this.isDataset) {
|
||||
this.$emit("update:expand-dataset", !this.expandDataset);
|
||||
} else {
|
||||
this.$emit("view-collection", this.item, this.name);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -0,0 +1,92 @@
|
||||
<template>
|
||||
<span class="align-self-start btn-group">
|
||||
<b-button
|
||||
v-if="isDataset"
|
||||
:disabled="displayDisabled"
|
||||
:title="displayButtonTitle"
|
||||
class="px-1"
|
||||
size="sm"
|
||||
variant="link"
|
||||
@click.stop="$emit('display')">
|
||||
<icon icon="eye" />
|
||||
</b-button>
|
||||
<b-button
|
||||
v-if="isHistoryItem"
|
||||
:disabled="editDisabled"
|
||||
:title="editButtonTitle"
|
||||
class="px-1"
|
||||
size="sm"
|
||||
variant="link"
|
||||
@click.stop="$emit('edit')">
|
||||
<icon icon="pen" />
|
||||
</b-button>
|
||||
<b-button
|
||||
v-if="isHistoryItem && !isDeleted"
|
||||
class="px-1"
|
||||
title="Delete"
|
||||
size="sm"
|
||||
variant="link"
|
||||
:disabled="isPurged"
|
||||
@click.stop="$emit('delete')">
|
||||
<icon icon="trash" />
|
||||
</b-button>
|
||||
<b-button
|
||||
v-if="isHistoryItem && isDeleted"
|
||||
class="px-1"
|
||||
title="Undelete"
|
||||
size="sm"
|
||||
variant="link"
|
||||
:disabled="isPurged"
|
||||
@click.stop="$emit('undelete')">
|
||||
<icon icon="trash-restore" />
|
||||
</b-button>
|
||||
<b-button
|
||||
v-if="isHistoryItem && !isVisible"
|
||||
class="px-1"
|
||||
title="Unhide"
|
||||
size="sm"
|
||||
variant="link"
|
||||
@click.stop="$emit('unhide')">
|
||||
<icon icon="unlock" />
|
||||
</b-button>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
isDataset: { type: Boolean, required: true },
|
||||
isDeleted: { type: Boolean, required: true },
|
||||
isHistoryItem: { type: Boolean, required: true },
|
||||
isPurged: { type: Boolean, required: true },
|
||||
isVisible: { type: Boolean, required: true },
|
||||
state: { type: String, default: "" },
|
||||
},
|
||||
computed: {
|
||||
displayButtonTitle() {
|
||||
if (this.isPurged) {
|
||||
return "Cannot display datasets removed from disk.";
|
||||
}
|
||||
if (this.displayDisabled) {
|
||||
return "This dataset is not yet viewable.";
|
||||
}
|
||||
return "Display";
|
||||
},
|
||||
displayDisabled() {
|
||||
return this.isPurged || ["discarded", "new", "upload"].includes(this.state);
|
||||
},
|
||||
editButtonTitle() {
|
||||
if (this.isPurged) {
|
||||
return "Cannot edit attributes of datasets removed from disk.";
|
||||
}
|
||||
if (this.editDisabled) {
|
||||
return "This dataset is not yet editable.";
|
||||
}
|
||||
return "Edit Attributes";
|
||||
},
|
||||
editDisabled() {
|
||||
return this.isPurged || ["discarded", "new", "upload", "queued", "running", "waiting"].includes(this.state);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@@ -13,7 +13,7 @@
|
||||
</span>
|
||||
<span v-if="result.genome_build" class="dbkey">
|
||||
<label class="prompt" v-localize>database</label>
|
||||
<b-link class="value" @click.stop="$emit('edit', dataset)" data-label="Database/Build">{{
|
||||
<b-link class="value" @click.stop="$emit('edit')" data-label="Database/Build">{{
|
||||
result.genome_build
|
||||
}}</b-link>
|
||||
</span>
|
||||
|
||||
@@ -88,9 +88,9 @@
|
||||
@update:expand-dataset="setExpanded(item, $event)"
|
||||
@update:selected="setSelected(item, $event)"
|
||||
@view-collection="$emit('view-collection', item)"
|
||||
@delete="onDelete"
|
||||
@undelete="onUndelete"
|
||||
@unhide="onUnhide" />
|
||||
@delete="onDelete(item)"
|
||||
@undelete="onUndelete(item)"
|
||||
@unhide="onUnhide(item)" />
|
||||
</template>
|
||||
</Listing>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user