Skip to content
代码片段 群组 项目
提交 bdc6fd7f 编辑于 作者: Wu Jeremy's avatar Wu Jeremy
浏览文件

Merge branch 'feat/add-link-for-user-to-compare-plans' into 'main-jh'

Feat: add link for user to compare plans

Closes #4493

See merge request gitlab-cn/gitlab!2727
No related branches found
No related tags found
无相关合并请求
......@@ -2,7 +2,7 @@
<script>
import Tracking from '~/tracking';
import BillingAddress from 'jh/subscriptions/new/components/checkout/billing_address.vue';
import SubscriptionDetails from 'ee/subscriptions/new/components/checkout/subscription_details.vue';
import SubscriptionDetails from './checkout/subscription_details.vue';
import ConfirmOrder from './checkout/confirm_order.vue';
export default {
......
<script>
import {
GlAlert,
GlFormGroup,
GlFormInput,
GlFormSelect,
GlLink,
GlLoadingIcon,
GlSprintf,
} from '@gitlab/ui';
import Step from 'ee/vue_shared/purchase_flow/components/step.vue';
import EESubscriptionDetails from 'ee/subscriptions/new/components/checkout/subscription_details.vue';
export default {
components: {
GlAlert,
GlFormGroup,
GlFormSelect,
GlFormInput,
GlSprintf,
GlLink,
GlLoadingIcon,
Step,
},
extends: EESubscriptionDetails,
};
</script>
<template>
<step
v-if="isLoading"
:step-id="$options.stepId"
:title="$options.i18n.stepTitle"
:is-valid="false"
>
<template #body>
<div
data-testid="subscription-loading-container"
class="gl-h-200! gl-flex gl-flex-col gl-items-center gl-justify-center"
>
<gl-loading-icon v-if="true" size="lg" />
<span>{{ $options.i18n.loadingText }}</span>
</div>
</template>
</step>
<step
v-else
:step-id="$options.stepId"
:title="$options.i18n.stepTitle"
:is-valid="isValid"
:next-step-button-text="$options.i18n.nextStepButtonText"
@nextStep="trackStepTransition"
@stepEdit="trackStepEdit"
>
<template #body>
<gl-form-group :label="$options.i18n.selectedPlanLabel" label-size="sm" class="mb-3">
<gl-form-select
v-model="selectedPlanModel"
v-auto-focus-on-show
:options="availablePlans"
data-testid="plan-name"
/>
</gl-form-group>
<div class="gl-flex gl-flex-row-reverse">
<gl-link href="https://gitlab.cn/pricing" rel="noopener noreferer" target="_blank">
{{ s__('JH|Checkout|Compare plans') }}
</gl-link>
</div>
<gl-form-group
v-if="isShowingGroupSelector"
data-testid="group-select-form-group"
:label="$options.i18n.selectedGroupLabel"
:description="groupSelectDescription"
label-size="sm"
class="mb-3"
>
<gl-form-select
ref="group-select"
v-model="selectedGroupModel"
:options="groupOptionsWithDefault"
data-testid="group-name"
/>
</gl-form-group>
<gl-form-group
v-if="isShowingNameOfCompanyInput"
:label="$options.i18n.organizationNameLabel"
label-size="sm"
class="mb-3"
>
<gl-form-input ref="organization-name" v-model="organizationNameModel" type="text" />
</gl-form-group>
<div class="combined gl-flex">
<gl-form-group
data-testid="number-of-users-field"
:label="$options.i18n.numberOfUsersLabel"
label-size="sm"
class="gl-mb-5"
:label-description="numberOfUsersLabelDescription"
:invalid-feedback="numberOfSeatsInvalidFeedback"
>
<template v-if="hasMaximumSeatLimit" #label-description>
<div class="gl-mb-3">
<gl-sprintf :message="$options.i18n.maximumSeatLimitMessage" class="">
<template #maximumSeatLimit>{{ maximumSeatLimit }}</template>
<template #maxSeatLink="{ content }">
<gl-link href="" target="_blank">{{ content }}</gl-link>
</template>
</gl-sprintf>
</div>
</template>
<gl-form-input
ref="number-of-users"
v-model.number="numberOfUsersModel"
class="number"
type="number"
:min="billableData.minimumSeats"
:disabled="shouldDisableNumberOfUsers"
:state="hasValidSeatInput"
data-testid="number-of-users"
/>
<template #invalid-feedback>
{{ numberOfSeatsInvalidFeedback }}
</template>
</gl-form-group>
<gl-form-group
v-if="shouldDisableNumberOfUsers"
ref="company-link"
class="label ml-3 align-self-end gl-mb-0"
>
<gl-sprintf :message="$options.i18n.needMoreUsersLink">
<template #company>
<gl-link @click="toggleIsSetupForCompany">{{ $options.i18n.companyOrTeam }}</gl-link>
</template>
</gl-sprintf>
</gl-form-group>
</div>
<gl-alert
v-if="!hasMaximumSeatLimit"
class="gl-mb-5"
:dismissible="false"
variant="info"
data-testid="qsr-overage-message"
>
<gl-sprintf :message="$options.i18n.qsrOverageMessage">
<template #qsrOverageLink="{ content }">
<gl-link :href="$options.qsrReconciliationLink" target="_blank">{{ content }}</gl-link>
</template>
</gl-sprintf>
</gl-alert>
</template>
<template #summary>
<span ref="summary-line-1" class="gl-font-bold">
{{ selectedPlanTextLine }}
</span>
<div v-if="isSetupForCompany" ref="summary-line-2">
{{ $options.i18n.group }}: {{ organizationName || selectedGroupName }}
</div>
<div ref="summary-line-3">{{ $options.i18n.users }}: {{ numberOfUsers }}</div>
</template>
</step>
</template>
......@@ -378,6 +378,9 @@ msgstr ""
msgid "JH|Checking email availability..."
msgstr ""
msgid "JH|Checkout|Compare plans"
msgstr ""
msgid "JH|Checkout|Please select a country"
msgstr "Please select a country/region"
......
......@@ -396,6 +396,9 @@ msgstr ""
msgid "JH|Checking email availability..."
msgstr "检查邮箱是否可用..."
msgid "JH|Checkout|Compare plans"
msgstr "对比不同计划"
msgid "JH|Checkout|Please select a country"
msgstr "请选择一个国家或地区"
......
......@@ -387,6 +387,9 @@ msgstr "您的極狐GitLab 帳戶被鎖定。在執行機器人命令之前請
msgid "JH|Checking email availability..."
msgstr "檢查郵箱是否可用..."
msgid "JH|Checkout|Compare plans"
msgstr "比較不同計劃"
msgid "JH|Checkout|Please select a country"
msgstr "請選擇一個國家或地區"
......
0% 加载中 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册