Phillip Thelen
379afa9554
* log armoire, quoest response and cron events to history * show user history in admin panel * allow stats to be edited from admin panel * Improve admin panel stats input * improve setting client in history * fix tests * fix lint * fix armoire buying issue * Improve hero saving * Formatting fix * Improve user history logging * allow class to be changed from admin panel * make terminating subscriptions easier * support decimal extraMonths * Fix editing some achievements in admin panel * log if a user invites party to quest * Log more quest events into user history * make userhistory length configurable * fix some numbered achievements * fix extraMonths field * Automatically set up group plan subs with admin panel * show party info nicer in admin panel * improve admin panel sub handling * add missing brace * display when there are unsaved changes * fix setting group plan * fix showing group id * Display group plan info in admin panel * fix setting hourglass promo date * Improve termination handling in admin panel * reload data after certain save events in admin panel * remove console * fix plan.extraMonths not being reset if terminating a sub * add more options when cancelling subs * reload data after group plan change * Add a way to remove users from a party * fix issue with removing user from party * pass party id correctly * correctly call async function * Improve sub display in admin panel * fix line length * fix line * shorter * plaid * fix(lint): vue code style --------- Co-authored-by: Kalista Payne <sabrecat@gmail.com>
536 lines
17 KiB
Vue
536 lines
17 KiB
Vue
<template>
|
|
<form
|
|
@submit.prevent="saveHero({ hero: {
|
|
_id: hero._id,
|
|
purchased: hero.purchased
|
|
}, msg: 'Subscription Perks' })"
|
|
>
|
|
<div class="card mt-2">
|
|
<div class="card-header"
|
|
@click="expand = !expand">
|
|
<h3
|
|
class="mb-0 mt-0"
|
|
:class="{ 'open': expand }"
|
|
>
|
|
Subscription, Monthly Perks
|
|
<b v-if="hasUnsavedChanges && !expand" class="text-warning float-right">
|
|
Unsaved changes
|
|
</b>
|
|
</h3>
|
|
</div>
|
|
<div
|
|
v-if="expand"
|
|
class="card-body"
|
|
>
|
|
<div
|
|
class="form-group row"
|
|
>
|
|
<label class="col-sm-3 col-form-label">
|
|
Payment method:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<input v-model="hero.purchased.plan.paymentMethod"
|
|
class="form-control"
|
|
type="text"
|
|
v-if="!isRegularPaymentMethod"
|
|
>
|
|
<select
|
|
v-else
|
|
v-model="hero.purchased.plan.paymentMethod"
|
|
class="form-control"
|
|
type="text"
|
|
>
|
|
<option value="groupPlan">Group Plan</option>
|
|
<option value="Stripe">Stripe</option>
|
|
<option value="Apple">Apple</option>
|
|
<option value="Google">Google</option>
|
|
<option value="Amazon Payments">Amazon</option>
|
|
<option value="PayPal">PayPal</option>
|
|
<option value="Gift">Gift</option>
|
|
<option value="">Clear out</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="form-group row"
|
|
>
|
|
<label class="col-sm-3 col-form-label">
|
|
Payment schedule:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<input v-model="hero.purchased.plan.planId"
|
|
class="form-control"
|
|
type="text"
|
|
v-if="!isRegularPlanId"
|
|
>
|
|
<select
|
|
v-else
|
|
v-model="hero.purchased.plan.planId"
|
|
class="form-control"
|
|
type="text"
|
|
>
|
|
<option value="basic_earned">Monthly recurring</option>
|
|
<option value="basic_3mo">3 Months recurring</option>
|
|
<option value="basic_6mo">6 Months recurring</option>
|
|
<option value="basic_12mo">12 Months recurring</option>
|
|
<option value="group_monthly">Group Plan (legacy)</option>
|
|
<option value="group_plan_auto">Group Plan (auto)</option>
|
|
<option value="">Clear out</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div
|
|
class="form-group row"
|
|
>
|
|
<label class="col-sm-3 col-form-label">
|
|
Customer ID:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<input
|
|
v-model="hero.purchased.plan.customerId"
|
|
class="form-control"
|
|
type="text"
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row"
|
|
v-if="hero.purchased.plan.planId === 'group_plan_auto'">
|
|
<label class="col-sm-3 col-form-label">
|
|
Group Plan Memberships:
|
|
</label>
|
|
<div class="col-sm-9 col-form-label">
|
|
<loading-spinner
|
|
v-if="!groupPlans"
|
|
dark-color=true
|
|
/>
|
|
<b
|
|
v-else-if="groupPlans.length === 0"
|
|
class="text-danger col-form-label"
|
|
>User is not part of an active group plan!</b>
|
|
<div
|
|
v-else
|
|
v-for="group in groupPlans"
|
|
:key="group._id"
|
|
class="card mb-2">
|
|
<div class="card-body">
|
|
<h6 class="card-title">{{ group.name }}
|
|
<small class="float-right">{{ group._id }}</small>
|
|
</h6>
|
|
<p class="card-text">
|
|
<strong>Leader: </strong>
|
|
<a
|
|
v-if="group.leader !== hero._id"
|
|
@click="switchUser(group.leader)"
|
|
>{{ group.leader }}</a>
|
|
<strong v-else class="text-success">This user</strong>
|
|
</p>
|
|
<p class="card-text">
|
|
<strong>Members: </strong> {{ group.memberCount }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div
|
|
v-if="hero.purchased.plan.dateCreated"
|
|
class="form-group row"
|
|
>
|
|
<label class="col-sm-3 col-form-label">
|
|
Creation date:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<div class="input-group">
|
|
<input
|
|
v-model="hero.purchased.plan.dateCreated"
|
|
class="form-control"
|
|
type="text"
|
|
>
|
|
<div class="input-group-append">
|
|
<strong class="input-group-text">
|
|
{{ dateFormat(hero.purchased.plan.dateCreated) }}
|
|
</strong>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div
|
|
v-if="hero.purchased.plan.dateCurrentTypeCreated"
|
|
class="form-group row"
|
|
>
|
|
<label class="col-sm-3 col-form-label">
|
|
Current sub start date:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<div class="input-group">
|
|
<input
|
|
v-model="hero.purchased.plan.dateCurrentTypeCreated"
|
|
class="form-control"
|
|
type="text"
|
|
>
|
|
<div class="input-group-append">
|
|
<strong class="input-group-text">
|
|
{{ dateFormat(hero.purchased.plan.dateCurrentTypeCreated) }}
|
|
</strong>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 col-form-label">
|
|
Termination date:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<div class="input-group">
|
|
<input
|
|
v-model="hero.purchased.plan.dateTerminated"
|
|
class="form-control"
|
|
type="text"
|
|
>
|
|
<div class="input-group-append">
|
|
<strong class="input-group-text">
|
|
{{ dateFormat(hero.purchased.plan.dateTerminated) }}
|
|
</strong>
|
|
<a class="btn btn-danger"
|
|
href="#"
|
|
v-b-modal.sub_termination_modal
|
|
v-if="!hero.purchased.plan.dateTerminated && hero.purchased.plan.planId">
|
|
Terminate
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<small v-if="!hero.purchased.plan.dateTerminated
|
|
&& hero.purchased.plan.planId" class="text-success">
|
|
The subscription does not have a termination date and is active.
|
|
</small>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 col-form-label">
|
|
Cumulative months:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<input
|
|
v-model="hero.purchased.plan.cumulativeCount"
|
|
class="form-control"
|
|
type="number"
|
|
min="0"
|
|
step="1"
|
|
>
|
|
<small class="text-secondary">
|
|
Cumulative subscribed months across subscription periods.
|
|
</small>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 col-form-label">
|
|
Extra months:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<div class="input-group">
|
|
<input
|
|
v-model="hero.purchased.plan.extraMonths"
|
|
class="form-control"
|
|
type="number"
|
|
min="0"
|
|
step="any"
|
|
>
|
|
<div class="input-group-append">
|
|
<a class="btn btn-warning"
|
|
@click="applyExtraMonths"
|
|
v-if="hero.purchased.plan.dateTerminated && hero.purchased.plan.extraMonths > 0">
|
|
Apply Credit
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<small class="text-secondary">
|
|
Additional credit that is applied if a subscription is cancelled.
|
|
</small>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 col-form-label">
|
|
Received hourglass bonus:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<div class="input-group">
|
|
<input
|
|
v-model="hero.purchased.plan.hourglassPromoReceived"
|
|
class="form-control"
|
|
type="text"
|
|
>
|
|
<div class="input-group-append">
|
|
<strong class="input-group-text">
|
|
{{ dateFormat(hero.purchased.plan.hourglassPromoReceived) }}
|
|
</strong>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 col-form-label">
|
|
Mystic Hourglasses:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<input
|
|
v-model="hero.purchased.plan.consecutive.trinkets"
|
|
class="form-control"
|
|
type="number"
|
|
min="0"
|
|
step="1"
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 col-form-label">
|
|
Gem cap increase:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<input
|
|
v-model="hero.purchased.plan.consecutive.gemCapExtra"
|
|
class="form-control"
|
|
type="number"
|
|
min="0"
|
|
max="26"
|
|
step="2"
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 col-form-label">
|
|
Total Gem cap:
|
|
</label>
|
|
<strong class="col-sm-9 col-form-label">
|
|
{{ Number(hero.purchased.plan.consecutive.gemCapExtra) + 24 }}
|
|
</strong>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 col-form-label">
|
|
Gems bought this month:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<input
|
|
v-model="hero.purchased.plan.gemsBought"
|
|
class="form-control"
|
|
type="number"
|
|
min="0"
|
|
:max="hero.purchased.plan.consecutive.gemCapExtra + 24"
|
|
step="1"
|
|
>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row">
|
|
<label class="col-sm-3 col-form-label">
|
|
Mystery Items:
|
|
</label>
|
|
<div class="col-sm-9 col-form-label">
|
|
<span v-if="hero.purchased.plan.mysteryItems.length > 0">
|
|
<span
|
|
v-for="(item, index) in hero.purchased.plan.mysteryItems"
|
|
:key="index"
|
|
>
|
|
<strong v-if="index < hero.purchased.plan.mysteryItems.length - 1">
|
|
{{ item }},
|
|
</strong>
|
|
<strong v-else> {{ item }} </strong>
|
|
</span>
|
|
</span>
|
|
<span v-else>
|
|
<strong>None</strong>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row"
|
|
v-if="!isConvertingToGroupPlan && hero.purchased.plan.planId !== 'group_plan_auto'">
|
|
<div class="offset-sm-3 col-sm-9">
|
|
<button
|
|
type="button"
|
|
class="btn btn-secondary btn-sm"
|
|
@click="beginGroupPlanConvert">
|
|
Begin converting to group plan subscription
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="form-group row"
|
|
v-if="isConvertingToGroupPlan">
|
|
<label class="col-sm-3 col-form-label">
|
|
Group Plan group ID:
|
|
</label>
|
|
<div class="col-sm-9">
|
|
<input
|
|
v-model="groupPlanID"
|
|
class="form-control"
|
|
type="text"
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div
|
|
v-if="expand"
|
|
class="card-footer d-flex align-items-center justify-content-between"
|
|
>
|
|
<input
|
|
type="submit"
|
|
value="Save"
|
|
class="btn btn-primary mt-1"
|
|
@click="saveClicked"
|
|
>
|
|
<b v-if="hasUnsavedChanges" class="text-warning float-right">
|
|
Unsaved changes
|
|
</b>
|
|
</div>
|
|
</div>
|
|
<b-modal id="sub_termination_modal" title="Set Termination Date">
|
|
<p>
|
|
You can set the sub benefit termination date to today or to the last
|
|
day of the current billing cycle. Any extra subscription credit will
|
|
then be processed and automatically added onto the selected date.
|
|
</p>
|
|
<template #modal-footer>
|
|
<div class="mt-3 btn btn-secondary" @click="$bvModal.hide('sub_termination_modal')">
|
|
Close
|
|
</div>
|
|
<div class="mt-3 btn btn-danger" @click="terminateSubscription()">
|
|
Set to Today
|
|
</div>
|
|
<div class="mt-3 btn btn-danger" @click="terminateSubscription(todayWithRemainingCycle)">
|
|
Set to {{ todayWithRemainingCycle.utc().format('MM/DD/YYYY') }}
|
|
</div>
|
|
</template>
|
|
</b-modal>
|
|
</form>
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
@import '~@/assets/scss/colors.scss';
|
|
|
|
.input-group-append {
|
|
width: auto;
|
|
|
|
.input-group-text {
|
|
border-bottom-right-radius: 2px;
|
|
border-top-right-radius: 2px;
|
|
font-weight: 600;
|
|
font-size: 0.8rem;
|
|
color: $gray-200;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
import isUUID from 'validator/es/lib/isUUID';
|
|
import moment from 'moment';
|
|
import { getPlanContext } from '@/../../common/script/cron';
|
|
import saveHero from '../mixins/saveHero';
|
|
import subscriptionBlocks from '../../../../../common/script/content/subscriptionBlocks';
|
|
import LoadingSpinner from '@/components/ui/loadingSpinner';
|
|
|
|
export default {
|
|
mixins: [saveHero],
|
|
components: {
|
|
LoadingSpinner,
|
|
},
|
|
props: {
|
|
hero: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
hasUnsavedChanges: {
|
|
type: Boolean,
|
|
required: true,
|
|
},
|
|
groupPlans: {
|
|
type: Array,
|
|
default: null,
|
|
},
|
|
},
|
|
data () {
|
|
return {
|
|
expand: false,
|
|
isConvertingToGroupPlan: false,
|
|
groupPlanID: '',
|
|
subscriptionBlocks,
|
|
};
|
|
},
|
|
computed: {
|
|
nextHourglassDate () {
|
|
const currentPlanContext = getPlanContext(this.hero, new Date());
|
|
|
|
if (!currentPlanContext.nextHourglassDate) return 'N/A';
|
|
return currentPlanContext.nextHourglassDate.format('MMMM YYYY');
|
|
},
|
|
isRegularPlanId () {
|
|
return this.subscriptionBlocks[this.hero.purchased.plan.planId] !== undefined;
|
|
},
|
|
isRegularPaymentMethod () {
|
|
return [
|
|
'groupPlan',
|
|
'Group Plan',
|
|
'Stripe',
|
|
'Apple',
|
|
'Google',
|
|
'Amazon Payments',
|
|
'PayPal',
|
|
'Gift',
|
|
].includes(this.hero.purchased.plan.paymentMethod);
|
|
},
|
|
todayWithRemainingCycle () {
|
|
const now = moment();
|
|
const monthCount = subscriptionBlocks[this.hero.purchased.plan.planId].months;
|
|
const terminationDate = moment(this.hero.purchased.plan.dateCurrentTypeCreated || new Date());
|
|
while (terminationDate.isBefore(now)) {
|
|
terminationDate.add(monthCount, 'months');
|
|
}
|
|
return terminationDate;
|
|
},
|
|
},
|
|
methods: {
|
|
dateFormat (date) {
|
|
if (!date) {
|
|
return '--';
|
|
}
|
|
return moment(date).format('YYYY/MM/DD');
|
|
},
|
|
terminateSubscription (terminationDate) {
|
|
if (terminationDate) {
|
|
this.hero.purchased.plan.dateTerminated = terminationDate.utc().format();
|
|
} else {
|
|
this.hero.purchased.plan.dateTerminated = moment(new Date()).utc().format();
|
|
}
|
|
this.applyExtraMonths();
|
|
this.saveHero({ hero: this.hero, msg: 'Subscription Termination', reloadData: true });
|
|
},
|
|
applyExtraMonths () {
|
|
if (this.hero.purchased.plan.extraMonths > 0 || this.hero.purchased.plan.extraMonths !== '0') {
|
|
const date = moment(this.hero.purchased.plan.dateTerminated || new Date());
|
|
const extraMonths = Math.max(this.hero.purchased.plan.extraMonths, 0);
|
|
const extraDays = Math.ceil(30.5 * extraMonths);
|
|
this.hero.purchased.plan.dateTerminated = date.add(extraDays, 'days').utc().format();
|
|
this.hero.purchased.plan.extraMonths = 0;
|
|
}
|
|
},
|
|
beginGroupPlanConvert () {
|
|
this.isConvertingToGroupPlan = true;
|
|
this.hero.purchased.plan.owner = '';
|
|
},
|
|
saveClicked (e) {
|
|
e.preventDefault();
|
|
if (this.isConvertingToGroupPlan) {
|
|
if (!isUUID(this.groupPlanID)) {
|
|
alert('Invalid group ID');
|
|
return;
|
|
}
|
|
this.hero.purchased.plan.convertToGroupPlan = this.groupPlanID;
|
|
this.saveHero({ hero: this.hero, msg: 'Group Plan Subscription', reloadData: true });
|
|
} else {
|
|
this.saveHero({ hero: this.hero, msg: 'Subscription Perks', reloadData: true });
|
|
}
|
|
},
|
|
switchUser (id) {
|
|
if (window.confirm('Switch to this user?')) {
|
|
this.$emit('changeUserIdentifier', id);
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|