55 lines
1.3 KiB
Vue
55 lines
1.3 KiB
Vue
<template>
|
|
<div class="mx-auto max-w-3xl space-y-4" v-if="$site?.pg?.actions">
|
|
<div
|
|
v-for="group in actions"
|
|
:key="group.group"
|
|
class="divide-y rounded border border-gray-200 p-5"
|
|
>
|
|
<div class="pb-3 text-lg font-semibold">{{ group.group }}</div>
|
|
<div
|
|
class="py-3 first:pt-0 last:pb-0"
|
|
v-for="row in group.actions"
|
|
:key="row.action"
|
|
>
|
|
<SiteActionCell
|
|
:siteName="site"
|
|
:group="group.group"
|
|
:actionLabel="row.action"
|
|
:method="row.pg_method"
|
|
:description="row.description"
|
|
:buttonLabel="row.button_label"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { getCachedDocumentResource } from 'jingrow-ui';
|
|
import SiteActionCell from './SiteActionCell.vue';
|
|
|
|
export default {
|
|
name: 'SiteActions',
|
|
props: ['site'],
|
|
components: { SiteActionCell },
|
|
computed: {
|
|
$site() {
|
|
return getCachedDocumentResource('Site', this.site);
|
|
},
|
|
actions() {
|
|
const groupedActions = this.$site.pg.actions.reduce((acc, action) => {
|
|
const group = action.group || '常规操作';
|
|
if (!acc[group]) {
|
|
acc[group] = [];
|
|
}
|
|
acc[group].push(action);
|
|
return acc;
|
|
}, {});
|
|
|
|
return Object.keys(groupedActions).map(group => ({
|
|
group,
|
|
actions: groupedActions[group]
|
|
}));
|
|
}
|
|
}
|
|
};
|
|
</script> |