div
amazon-payments-modal(:amazon-payments='amazonPayments')
div
.header
h1.text-center Need more for your Group?
.row
.col-6.offset-3.text-center {{ $t('groupBenefitsDescription') }}
.container.benefits
.row
.col-4
.box
img.box1(src='~client/assets/images/group-plans/group-14@3x.png')
hr
h2 {{ $t('teamBasedTasks') }}
p Set up an easily-viewed shared task list for the group. Assign tasks to your fellow group members, or let them claim their own tasks to make it clear what everyone is working on!
.col-4
.box
img.box2(src='~client/assets/images/group-plans/group-12@3x.png')
hr
h2 Group Management Controls
p Use task approvals to verify that a task that was really completed, add Group Managers to share responsibilities, and enjoy a private group chat for all team members.
.col-4
.box
img.box3(src='~client/assets/images/group-plans/group-13@3x.png')
hr
h2 In-Game Benefits
p Group members get an exclusive Jackalope Mount, as well as full subscription benefits, including special monthly equipment sets and the ability to buy gems with gold.
#upgrading-group.container.payment-options(v-if='upgradingGroup._id')
h1.text-center.purple-header Are you ready to upgrade?
.row
.col-12.text-center
.purple-box
.amount-section
.dollar $
.number 9
.name Group Owner Subscription
.plus
.svg-icon(v-html="icons.positiveIcon")
.amount-section
.dollar $
.number 3
.name Each Individual Group Member
.box.payment-providers
h3 Choose your payment method
.box.payment-button(@click='pay(PAYMENTS.STRIPE)')
div
.svg-icon.credit-card-icon(v-html="icons.group")
p.credit-card Credit Card
p Powered by Stripe
.box.payment-button(@click='pay(PAYMENTS.AMAZON)')
.svg-icon.amazon-pay-icon(v-html="icons.amazonpay")
.container.col-6.offset-3.create-option(v-if='!upgradingGroup._id')
.row
h1.col-12.text-center.purple-header Create your Group today!
.row
.col-12.text-center
button.btn.btn-primary.create-group(@click='launchModal("create")') Create Your New Group
.row.pricing
.col-5
.dollar $
.number 9
.name
div Group Owner
div Subscription
.col-1
.plus +
.col-6
.dollar $
.number 3
.name
div Each Additional
div Member
b-modal#group-plan-modal(title="Empty", size='md', hide-footer=true)
.col-12(v-if='activePage === PAGES.CREATE_GROUP')
.form-group
label.control-label(for='new-group-name') Name
input.form-control#new-group-name.input-medium.option-content(required, type='text', placeholder="Name", v-model='newGroup.name')
.form-group
label(for='new-group-description') {{ $t('description') }}
textarea.form-control#new-group-description.option-content(cols='3', :placeholder="$t('description')", v-model='newGroup.description')
.form-group(v-if='type === "guild"')
.radio
label
input(type='radio', name='new-group-privacy', value='public', v-model='newGroup.privacy')
| {{ $t('public') }}
.radio
label
input(type='radio', name='new-group-privacy', value='private', v-model='newGroup.privacy')
| {{ $t('inviteOnly') }}
// @TODO Does it cost gems for a group plan?
.form-group
input.btn.btn-default(type='submit', :disabled='!newGroup.privacy && !newGroup.name', :value="$t('create')")
span.gem-cost {{ '4 ' + $t('gems') }}
p
small {{ $t('gemCost') }}
.form-group
.checkbox
label
input(type='checkbox', v-model='newGroup.leaderOnly.challenges')
| {{ $t('leaderOnlyChallenges') }}
.form-group(v-if='type === "party"')
button.btn.btn-default.form-control(@click='createGroup()', :value="$t('create')")
.form-group
button.btn.btn-primary.btn-lg.btn-block(@click="createGroup()", :disabled="!newGroupIsReady") {{ $t('create') }}
.col-12(v-if='activePage === PAGES.PAY')
.payment-providers
h3 Choose your payment method
.box.payment-button(@click='pay(PAYMENTS.STRIPE)')
p Credit Card
p Powered by Stripe
.box.payment-button(@click='pay(PAYMENTS.AMAZON)')
| Amazon Pay