75 lines
2.0 KiB
Vue
75 lines
2.0 KiB
Vue
<template>
|
|
<button
|
|
class="flex w-full flex-row items-center justify-between rounded-lg border border-gray-100 px-4 py-2 shadow focus:outline-none"
|
|
:class="[
|
|
selected || uninstall ? 'ring-2 ring-inset ring-gray-600' : '',
|
|
selectable ? 'hover:border-gray-300' : 'cursor-default'
|
|
]"
|
|
ref="card"
|
|
>
|
|
<div class="flex flex-row items-center gap-2">
|
|
<input
|
|
v-if="selectable"
|
|
@click.self="$refs['card'].click()"
|
|
:checked="selected"
|
|
type="checkbox"
|
|
class="h-4 w-4 cursor-pointer rounded border-gray-300 text-gray-600 focus:ring-transparent"
|
|
/>
|
|
<h3 class="text-left text-lg font-medium text-gray-900">
|
|
{{ app.title }}
|
|
</h3>
|
|
</div>
|
|
<Badge v-if="uninstall" theme="red" label="Will Be Uninstalled " />
|
|
<div v-else class="ml-2 flex flex-row space-x-2">
|
|
<CommitTag
|
|
v-if="deployFrom(app)"
|
|
:tag="deployFrom(app)"
|
|
:link="`${app.repository_url}/commit/${app.current_hash}`"
|
|
/>
|
|
<a
|
|
v-if="deployFrom(app)"
|
|
class="flex cursor-pointer flex-col justify-center"
|
|
:href="`${app.repository_url}/compare/${app.current_hash}...${app.next_hash}`"
|
|
target="_blank"
|
|
>
|
|
<FeatherIcon name="arrow-right" class="w-4" />
|
|
</a>
|
|
<Badge
|
|
v-else
|
|
label="First Deploy"
|
|
theme="green"
|
|
class="whitespace-nowrap"
|
|
/>
|
|
<CommitTag
|
|
:tag="deployTo(app)"
|
|
:link="`${app.repository_url}/commit/${app.next_hash}`"
|
|
/>
|
|
</div>
|
|
</button>
|
|
</template>
|
|
|
|
<script>
|
|
import CommitTag from './utils/CommitTag.vue';
|
|
export default {
|
|
name: 'SiteAppUpdateCard',
|
|
props: ['app', 'selectable', 'selected', 'uninstall'],
|
|
methods: {
|
|
deployFrom(app) {
|
|
if (app.will_branch_change) {
|
|
return app.current_branch;
|
|
}
|
|
return app.current_hash
|
|
? app.current_tag || app.current_hash.slice(0, 7)
|
|
: null;
|
|
},
|
|
deployTo(app) {
|
|
if (app.will_branch_change) {
|
|
return app.branch;
|
|
}
|
|
return app.next_tag || app.next_hash.slice(0, 7);
|
|
}
|
|
},
|
|
components: { CommitTag }
|
|
};
|
|
</script>
|