mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-01-20 22:42:53 -05:00
Refined member subscription detail box design
refs https://github.com/TryGhost/Team/issues/1904
This commit is contained in:
parent
50100a7c8d
commit
ec5f09edeb
2 changed files with 13 additions and 4 deletions
|
@ -184,10 +184,10 @@
|
|||
<span class="gh-cp-membertier-renewal">Renews {{sub.validUntil}}</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
<div class="flex flex-row gh-cp-membertier-details">
|
||||
<div class="flex flex-row gh-cp-membertier-details" {{on "click" (fn this.toggleSubscriptionExpanded sub.id)}}>
|
||||
Details {{svg-jar "arrow-right-stroke"}}
|
||||
</div>
|
||||
<div class="gh-membertier-advanced" data-test-subscription={{index}}>
|
||||
<div class="gh-membertier-advanced {{if (not sub.showDetails) "hide"}}" data-test-subscription={{index}}>
|
||||
<div class="gh-membertier-details-container">
|
||||
{{#if sub.cancellationReason}}
|
||||
<div class="mb4">
|
||||
|
@ -395,7 +395,7 @@
|
|||
{{/if}}
|
||||
{{/if}}
|
||||
<div class="gh-membertier-details">
|
||||
<span class="gh-membertier-created">Created on {{sub.startDate}}</span>
|
||||
<span class="gh-membertier-created">Created on {{sub.startDate}}</span>
|
||||
{{#if (and sub.attribution sub.attribution.url sub.attribution.title) }}
|
||||
<span class="gh-membertier-separator">·</span>
|
||||
<span class="gh-membertier-started">Subscribed on <a href="{{sub.attribution.url}}" target="_blank" rel="noopener noreferrer">{{ sub.attribution.title }}</a></span>
|
||||
|
|
|
@ -23,6 +23,7 @@ export default class extends Component {
|
|||
@tracked showMemberTierModal = false;
|
||||
@tracked tiersList;
|
||||
@tracked newslettersList;
|
||||
@tracked isSubscriptionExpanded = {};
|
||||
|
||||
get isAddComplimentaryAllowed() {
|
||||
if (!this.membersUtils.paidMembersEnabled) {
|
||||
|
@ -98,7 +99,7 @@ export default class extends Component {
|
|||
if (!sub.id && this.feature.get('compExpiring') && sub.tier?.expiry_at) {
|
||||
data.compExpiry = moment(sub.tier.expiry_at).format('D MMM YYYY');
|
||||
}
|
||||
|
||||
data.showDetails = !!this.isSubscriptionExpanded[sub.id];
|
||||
return data;
|
||||
});
|
||||
return tiers.map((tier) => {
|
||||
|
@ -135,6 +136,14 @@ export default class extends Component {
|
|||
}
|
||||
}
|
||||
|
||||
@action
|
||||
toggleSubscriptionExpanded(subId) {
|
||||
this.isSubscriptionExpanded = {
|
||||
...this.isSubscriptionExpanded,
|
||||
[subId]: !this.isSubscriptionExpanded[subId]
|
||||
};
|
||||
}
|
||||
|
||||
@action
|
||||
setup() {
|
||||
this.fetchTiers.perform();
|
||||
|
|
Loading…
Add table
Reference in a new issue